项目 1 走进网页世界 1.1 任务1：制作“念奴娇?赤壁怀古” 网页 1.2 前端修炼手册：网页基础知识 1.3 任务2：制作“苏轼介绍”网页 1.4 前端修炼手册：Dreamweaver 2021的 工作界面和使用技巧 1.5 能力提升：制作“青春颂歌”网页 1.6 能力挑战：制作“速度滑冰”网页目录1.1 任务1：制作“念奴娇?赤壁怀古”网页1.1 任务1：制作“念奴娇?赤壁怀古”网页知识技能目标（1）了解站点、网站、网页之间的关系，初步认识网页布局。（2）初步了解Dreamweaver工作环境及使用方法，能够建立站点及新建网页。（3）了解网页的基本结构，能够区分结构层和表现层。（4）了解CSS在网页制作中的作用，能够对网页进行简单美化。1.2 前端修炼手册：网页基础知识1.2.1 网 站 开 发 流 程后期测试发布中期制作前期准备1.2.1 网 站 开 发 流 程功能分析、目标用户分析、内容分析等前期准备需求分析确定主题确定网站架构收集素材设计页面导出效果图切片1.2.1 网 站 开 发 流 程中期制作创建站点静态页面制作网站程序开发1.2.1 网 站 开 发 流 程视觉效果、布局、内容、亲和力、易操作……页面效果后期测试发布所有链接是否都跳转正常、所有页面是否均可到达……链接有效性在各主流浏览器下均能正常显示浏览器兼容性网站发布本地发布、远程发布测试过程通常也伴随着优化过程，优化是尽可能地减小网页文件的体积及日后发生错误的机率。51.2.2 网页常用术语网页网站主页WWWHTTPURL绝对路径相对路径1234InternetIP地址域名静态网页动态网页1.2.3 网页文件命名规范1．文件名采用小写字母 introduce.html2．使用正确的扩展名 .html3．用短横线分隔单词 nba-rank.html1.3 任务2：制作“苏轼介绍”网页1.3 任务2：制作“苏轼介绍”网页知识技能目标（1）了解Dreamweaver工作界面，熟练掌握创建站点及网页的方法。（2）初识超链接，能够为当前网页添加指向同站点内其它页面的超链接。（3）了解HTML语言和CSS样式基本书写格式。（4）掌握style标签的使用方法，能够使用style标签创建内部样式表。1.4 前端修炼手册： Dreamweaver 2021的工作界面和使用技巧1.4.1 启动Adobe Dreamweaver 20211.4.2 认识Adobe Dreamweaver 2021的工作界面1.4.3 更改Adobe Dreamweaver 2021默认界面和布局更改拆分视图排列方式更改面板位置更改界面颜色1.4.4 使用Adobe Dreamweaver 2021的几个小技巧实时预览快速更改代码（Ctrl+E）同时编辑多行代码1.5 能力提升：制作“青春颂歌”网页1.6 能力挑战：制作“速度滑冰”网页项目2 走近网页架构师——HTML语言基础2.1 任务1：制作“走向远方”网页2.2 前端修炼手册：HTML语言的概念和基本结构2.3 任务2：制作“我的空间”网页2.4 前端修炼手册：HTML标签的分类及常见的HTML标签2.5 能力提升：制作“垃圾分类 从我做起”网页2.6 能力挑战：制作“菜鸟加油”网页目录2.1 任务1：制作“走向远方”网页2.1 任务1：制作“走向远方”网页知识技能目标（1）了解HTML语言的基本概念。（2）掌握HTML语言的基本结构，能够使用HTML语言编写简单网页。（3）认识style属性，能够使用style属性设置行内样式。2.2 前端修炼手册：HTML语言的概念和基本结构一个网页对应于一个HTML文件HTML文件以.html为扩展名2.2.1 HTML语言的概念[!]构成网页文档的主要语言英文全称：Hyper Text Markup Language中文全称：超文本标记语言2.2.2 HTML文档的基本结构 文档基本结构文档 基本结构标签介绍!doctype htmlhtmlheadmeta charset=utf-8title无标题文档/title/headbody/body/html!doctype html文档类型html/html整个文档head/head文档头部meta文档元信息title/title文档标题body/body文档主体2.2.2 HTML文档的基本结构其它可用在head部分的标签base为页面上的所有链接规定默认地址或目标link定义文档与外部资源的关系，如链接样式表script/script定义客户端脚本，如JavaScriptstyle/style为文档定义样式信息2.3 任务2：制作“我的空间”网页2.3 任务2：制作“我的空间”网页