网站设计与网页制作项目教程

子项目1 网站建设基础知识与整体流程 /1

项目任务1．1 了解网站建设的基础知识 /1

1．1．1 认识网页和网站 /2

1．1．2 了解网页制作技术 /3

1．1．3 了解网页制作常用工具 /4

项目任务1．2 熟悉网站建设的整体流程 /11

1．2．1 网站前期策划 /12

1．2．2 制作裁切网站设计稿 /16

1．2．3 规划与建立站点 /17

1．2．4 实现网页结构 /17

1．2．5 使用CSS样式美化首页 /18

1．2．6 创建并应用网页模板 /18

1．2．7 测试与发布网站 /18

1．2．8 更新与维护网站 /19

1．2．9 网站项目总结 /19

1．3 小结 /19

子项目2 “我的E站”前期策划 /20

项目任务2．1 “我的E站”项目立项 /20

2．1．1 分析“我的E站”需求说明书 /21

2．1．2 组建项目团队 /22

项目任务2．2 撰写“我的E站”项目策划书 /22

2．2．1 分析确定网站逻辑结构图 /23

2．2．2 设计网站界面原型 /24

2．2．3 撰写项目策划书 /28

2．3 小结 /30

子项目3 “我的E站”的前期准备 /31

项目任务3．1 设计网站LOGO /31

3．1．1 分析LOGO设计思想与设计原则 /32

3．1．2 介绍网站常用图片格式 /33

3．1．3 新建文档 /34

3．1．4 制作LOGO /35

3．1．5 保存文档 /37

项目任务3．2 美化图像素材 /38

3．2．1 批量处理图像 /41

3．2．2 调整图像属性 /43

3．2．3 美化加工图像 /46

3．2．4 应用特殊文字 /49

项目任务3．3 设计制作网站界面 /51

3．3．1 设置页面大小 /53

3．3．2 规划首页内容 /53

3．3．3 设计首页版式 /54

3．3．4 确定配色方案 /54

3．3．5 制作网站首页效果图 /56

3．3．6 制作网站子页效果图 /70

项目任务3．4 裁切网站设计稿 /73

3．4．1 分析切片的原则 /75

3．4．2 创建首页切片 /75

3．4．3 编辑首页切片 /78

3．4．4 命名首页切片 /79

3．4．5 导出首页切片 /79

3．4．6 裁切子页设计稿 /81

项目任务3．5 制作网站中的动画 /83

3．5．1 了解Flash基本概念 /83

3．5．2 熟悉Flash中的基本操作 /87

3．5．3 掌握Flash中的基本动画形式 /89

3．5．4 制作网站首页banner /95

3．6 小结 /101

3．7 技能训练 /101

3．7．1 制作和优化页面图像 /101

3．7．2 Flash动画设计 /102

3．7．3 Flash交互界面开发 /108

子项目4 实现网页结构 /114

项目任务4．1 创建本地站点 /114

4．1．1 规划目录结构 /115

4．1．2 熟悉Dreamweaver工作区 /116

4．1．3 新建本地站点 /116

4．1．4 管理本地站点 /118

项目任务4．2 设置首页文字段落与图片 /120

4．2．1 掌握HTML基本概念 /121

4．2．2 熟悉HTML基本结构 /123

4．2．3 插入文本与段落 /125

4．2．4 添加图像 /126

4．2．5 插入特殊符号 /128

项目任务4．3 创建首页中列表 /128

4．3．1 创建序列表 /129

4．3．2 创建有序列表 /130

4．3．3 创建自定义列表 /130

项目任务4．4 插入首页表格 /131

4．4．1 创建表格 /132

4．4．2 编辑表格 /133

4．4．3 了解嵌套表格 /136

4．4．4 熟悉表格标签 /136

项目任务4．5 插入首页表单 /139

4．5．1 认识表单 /139

4．5．2 创建表单 /142

4．5．3 添加表单对象 /143

项目任务4．6 设置网站的超链接 /144

4．6．1 熟悉文档位置和路径 /145

4．6．2 设置文本和图像超链接 /145

4．6．3 设置图像映射链接 /147

4．6．4 设置锚记链接 /147

4．6．5 设置特殊链接 /148

4．7 小结 /149

4．8 技能训练 /150

4．8．1 建立站点 /150

4．8．2 编写HTML代码结构 /150

子项目5 使用CSS样式美化首页 /151

项目任务5．1 引用CSS样式表 /151

5．1．1 初识CSS /152

5．1．2 熟悉样式表种类和CSS选择器 /152

5．1．3 在页面中引入CSS样式表 /155

5．1．4 熟悉CSS样式代码编写规则 /156

项目任务5．2 设置页面元素的样式 /160

5．2．1 设置字体颜色样式 /161

5．2．2 设置背景效果 /166

5．2．3 设置链接样式 /169

5．2．4 设置列表样式 /170

5．2．5 设置数据表格样式 /171

5．2．6 设置表单样式 /172

项目任务5．3 使用DIV+CSS布局首页 /175

5．3．1 插入DIV /176

5．3．2 熟悉盒模型 /178

5．3．3 CSS布局网页 /179

5．4 小结 /189

5．5 技能训练 /190

5．5．1 使用CSS布局技术完成网页 /190

5．5．2 使用列表和CSS制作菜单 /190

子项目6 创建并应用网页模块 /192

项目任务6．1 创建并应用网页模板 /192

6．1．1 创建模板 /193

6．1．2 制作模板页面 /194

6．1．3 插入可编辑区域 /199

6．1．4 应用模板 /200

项目任务6．2 添加多媒体元素 /204

6．2．1 插入多媒体元素 /205

6．2．2 应用行为 /209

6．2．3 运用JavaScript实现banner效果 /211

6．3 小结 /213

6．4 技能训练 /213

子项目7 “我的E站”测试与发布 /215

项目任务7．1 常见IE中BUG及其修复方法 /215

7．1．1　div的垂直居中问题 /215

7．1．2　margin加倍的问题 /217

7．1．3　浮动IE产生的双倍距离 /219

7．1．4　IE与最大最小宽度和高度的问题 /220

7．1．5 页面的最小宽度 /221

7．1．6 DIV浮动IE文本产生3像素的BUG /221

7．1．7 float清除浮动 /222

7．1．8 高度不适应 /226

项目任务7．2 站点的测试与调试 /228

7．2．1 检查站点范围的链接 /228

7．2．2 改变站点范围的链接 /230

7．2．3 清理HTML /230

7．2．4 清理Word生成的HTML /231

7．2．5 同步 /231

7．2．6 生成辅助功能报告 /232

7．2．7 站点测试指南 /233

项目任务7．3 网站的发布 /233

7．3．1 站点的上传 /234

7．3．2 申请空间 /237

7．4 小结 /237

7．5 技能训练 /237

子项目8 网站宣传推广与维护 /238

项目任务8．1 网站宣传推广 /238

8．1．1 网站宣传推广方式 /239

8．1．2 网站宣传推广计划 /242

8．1．3 提出合理的网站推广建议 /243

项目任务8．2 网站维护 /245

8．2．1 网站维护的重要性 /245

8．2．2 网站维护的基本内容 /246

8．2．3 网站维护基本流程 /248

8．3 小结 /248

子项目9 “我的E站”项目总结 /249

项目任务9．1 文档的书写与整理 /249

项目任务9．2 网站展示、交流与评价 /250

9．3 小结 /252

子项目10 将页面移植到移动设备 /253

项目任务10．1 将“我的E站”页面转为响应式设计 /253

10．1．1 理解响应式设计 /255

10．1．2 移动化“关于我们”页面 /258

10．2 小结 /260

附录A 常用工具、插件及用户手册 /261

附录B “我的E站”项目策划书 /263

附录C “我的E站”网站说明书 /268

附录D 网站制作规范 /277

参考文献 /280