《网页设计与製作实例教程》是2013年人民邮电出版社出版的图书，作者是刘万辉。
基本介绍
- 书名：网页设计与製作实例教程
- 作者：刘万辉
- ISBN：978-7-115-29373-2
- 类别：网页设计製作
- 页数：259
- 定价：39.80 元
- 出版社：人民邮电出版社
- 出版时间：2013年2月
- 装帧：平装
- 开本：16
- 字数：426000
内容提要
本书以培养职业能力为核心，以工作实践为主线，以实例套用为导向，建立以企业工作流程为框架的现代职业教育课程结构，面向网页设计师岗位设定课程内容。
本书教学内容採用模组化的编写思路，主要有网页设计概述、网站规划与製作流程、网页效果图设计、Dreamweaver创建基本网页、多媒体元素的製作与套用、框架与表格布局页面、HTML语言套用、CSS样式表的套用、模板与库的套用、JavaScript脚本套用、HTML+CSS页面布局、网站的测试与发布、综合教学实例、项目开发综合实训14个主教学模组，构成了系统的课程教学内容体系，所有教学内容符合岗位需求。同时本书以“书法家庄辉个人网站”项目贯穿始终讲解了静态网站的开发过程，同时又以“淮安市专用汽车製造有限公司网站”作为综合实例系统讲解了动态网站的开发过程。初级网页设计师通过本书的学习，辅助项目实训的系统锻鍊必将胜任企业网页设计师的岗位。
本书结构合理，内容丰富，实用性强，可以作为计算机类专业、商务类专业、艺术类专业的教学用书，也可以作为培训教程，还可以作为相关专业从业人员的自学用书。
本书教学内容採用模组化的编写思路，主要有网页设计概述、网站规划与製作流程、网页效果图设计、Dreamweaver创建基本网页、多媒体元素的製作与套用、框架与表格布局页面、HTML语言套用、CSS样式表的套用、模板与库的套用、JavaScript脚本套用、HTML+CSS页面布局、网站的测试与发布、综合教学实例、项目开发综合实训14个主教学模组，构成了系统的课程教学内容体系，所有教学内容符合岗位需求。同时本书以“书法家庄辉个人网站”项目贯穿始终讲解了静态网站的开发过程，同时又以“淮安市专用汽车製造有限公司网站”作为综合实例系统讲解了动态网站的开发过程。初级网页设计师通过本书的学习，辅助项目实训的系统锻鍊必将胜任企业网页设计师的岗位。
本书结构合理，内容丰富，实用性强，可以作为计算机类专业、商务类专业、艺术类专业的教学用书，也可以作为培训教程，还可以作为相关专业从业人员的自学用书。
图书目录
第1章 网页设计概述 1
1.1 网页、网站的概念 1
1.1.1 网页、网站和主页 1
1.1.2 专业术语 1
1.1.3 静态网页和动态网页 3
1.2 Web标準 4
1.2.1 Web标準的概念 4
1.2.2 建立Web标準的目的 4
1.2.3 採用Web标準的优点 4
1.3 常用网页製作软体 5
1.3.1 网页图形图像处理工具 5
1.3.2 网站页面的编辑工具 6
1.3.3 网页动画的製作工具 7
1.3.4 网页CMS系统套用软体 8
1.3.5 网页上传工具 9
1.4 实例1：优秀网站的赏析与蒐集 11
1.4.1 优秀网页实例欣赏 11
1.4.2 实例拓展：网页界面的收集与整理 13
1.5 习题 14
第2章 网站规划与製作流程 15
2.1 网站规划的内容及原则 15
2.1.1 网站策划的一般内容 15
2.1.2 网站形象策划原则 16
2.2 实例1：专业建设网站製作流程 18
2.2.1 前期策划与内容组织 18
2.2.2 收集和整理资料 20
2.2.3 网站效果图的设计製作 20
2.2.4 网站页面的设计製作 21
2.2.5 静态页面的动态化 22
2.2.6 网站测试与发布 23
2.2.7 站点的更新与维护 23
2.3 实例2：书法家庄辉网站项目规划 23
2.3.1 网站策划书的要点 23
2.3.2 书法家庄辉网站策划书 25
2.4 习题 27
第3章 网页效果图设计 28
3.1 网页色彩概述 28
3.1.1 色彩的基本理论 28
3.1.2 颜色的含义 29
3.2 网页配色方案 30
3.2.1 网页配色的原则 30
3.2.2 网页配色的方法 31
3.3 网站版式布局 33
3.3.1 网页版式布局的要点 33
3.3.2 版式构成的类型 34
3.3.3 网页布局类型的确定方法 35
3.4 Photoshop套用基础 38
3.4.1 认识Photoshop CS5界面 38
3.4.2 Photoshop CS5的基本操作 39
3.4.3 图层的相关套用 46
3.4.4 Photoshop CS5专业快捷键的套用 49
3.5 实例1：书法家庄辉主页效果图设计 49
3.5.1 实例製作过程 49
3.5.2 实例拓展1：企业Logo的製作 52
3.5.3 实例拓展2：网页效果图切片 54
3.6 Photoshop高级套用 55
3.6.1 通道的概念与使用技巧 55
3.6.2 蒙板的概念与使用技巧 57
3.6.3 路径的概念与使用技巧 58
3.7 实例2：书法家庄辉模板页效果图设计 61
3.7.1 实例实施过程 61
3.7.2 实例拓展：线的製作与使用技巧 65
3.8 习题 66
第4章 Dreamweaver创建基本网页 67
4.1 Dreamweaver CS5入门 67
4.1.1 Dreamweaver CS5工作环境 67
4.1.2 Dreamweaver CS5的参数设定 71
4.2 製作简单网页 72
4.2.1 创建网站站点 73
4.2.2 新建与保存网页 75
4.2.3 页面属性设定 75
4.2.4 网页的基本排版 77
4.2.5 插入图像 79
4.3 插入表格、超级连结与Flash 80
4.3.1 Dreamweaver插入表格 80
4.3.2 Dreamweaver插入超级连结 81
4.3.3 Dreamweaver插入Flash元素 82
4.4 实例：书法家庄辉个人介绍页面製作 83
4.4.1 实例设计思路 83
4.4.2 实例实施过程 84
4.5 练习 87
第5章 多媒体元素的製作与套用 89
5.1 多媒体对象的基本知识 89
5.1.1 音频媒体的格式 89
5.1.2 视频媒体的格式 90
5.2 多媒体素材的製作 91
5.2.1 FlashPaper电子文档的製作方法 91
5.2.2 萤幕录製视频的方法 92
5.3 常用动画製作软体 93
5.3.1 Photoshop的“动画”面板 93
5.3.2 Photoshop製作过渡动画 94
5.3.3 Flash Swish软体认识 95
5.4 实例：书法家庄辉个人网站动画的设计 96
5.4.1 实例展示 96
5.4.2 实例实施过程 97
5.5 插入多媒体元素 99
5.5.1 插入视频与音频元素 99
5.5.2 插入FlashPaper电子文档 100
5.5.3 插入背景音乐 100
5.6 习题 101
第6章 框架与表格布局页面 102
6.2 框架布局的基本套用 102
6.1.1 框架面板 102
6.1.2 创建框架页 103
6.1.3 框架的选择与保存 104
6.1.4 设定框架的属性 104
6.1.5 设定框架集的属性 105
6.2 实例1：无名山人作品集框架网页 105
6.2.1 实例设计思路 105
6.2.2 实例实施过程 107
6.3 实例2：淮安市维达科技有限公司网站布局 109
6.3.1 实例设计思路 109
6.3.2 实例实施过程 109
6.4 习题 113
6.2 实例1：无名山人作品集框架网页 105
6.2.1 实例设计思路 105
6.2.2 实例实施过程 107
6.3 实例2：淮安市维达科技有限公司网站布局 109
6.3.1 实例设计思路 109
6.3.2 实例实施过程 109
6.4 习题 113
第7章 HTML语言套用 114
7.1 HTML的基本概念 114
7.1.1 HTML简介 114
7.1.2 HTML的结构 114
7.1.3 HTML的标记 115
7.2 <head>与<body>标籤 116
7.2.1 <head>标籤 116
7.2.2 <body>标籤 117
7.3 文栏位落与多媒体元素 117
7.3.1 文栏位落相关标记 117
7.3.2 网页中插入图片标籤<img> 120
7.3.3 播放音频与视频 120
7.4 列表 121
7.4.1 无序列表<ul> 121
7.4.2 有序列表<ol> 121
7.4.3 嵌套列表 122
7.5 表格 122
7.5.1 表格的基本结构 123
7.5.2 表格的尺寸设定 124
7.5.3 表格内文字的对齐与合併 124
7.6 超连结 125
7.6.1 创建内部超连结 125
7.6.2 创建文字超连结 125
7.6.3 创建图片超连结 126
7.7 插入表单 127
7.7.1 表单的定义 127
7.7.2 表单控制项 127
7.8 框架的使用 131
7.8.1 框架集 131
7.8.2 子视窗<frame>标籤的设定 132
7.9 实例1：现代教育技术中心网站HTML编辑 133
7.9.1 实例设计思路 133
7.9.2 实例实施过程 133
7.10 实例2：客户留言信息表单编辑 137
7.11 实例3：无名山人作品集框架页HTML编辑 138
7.12 习题 139
7.1 HTML的基本概念 114
7.1.1 HTML简介 114
7.1.2 HTML的结构 114
7.1.3 HTML的标记 115
7.2 <head>与<body>标籤 116
7.2.1 <head>标籤 116
7.2.2 <body>标籤 117
7.3 文栏位落与多媒体元素 117
7.3.1 文栏位落相关标记 117
7.3.2 网页中插入图片标籤<img> 120
7.3.3 播放音频与视频 120
7.4 列表 121
7.4.1 无序列表<ul> 121
7.4.2 有序列表<ol> 121
7.4.3 嵌套列表 122
7.5 表格 122
7.5.1 表格的基本结构 123
7.5.2 表格的尺寸设定 124
7.5.3 表格内文字的对齐与合併 124
7.6 超连结 125
7.6.1 创建内部超连结 125
7.6.2 创建文字超连结 125
7.6.3 创建图片超连结 126
7.7 插入表单 127
7.7.1 表单的定义 127
7.7.2 表单控制项 127
7.8 框架的使用 131
7.8.1 框架集 131
7.8.2 子视窗<frame>标籤的设定 132
7.9 实例1：现代教育技术中心网站HTML编辑 133
7.9.1 实例设计思路 133
7.9.2 实例实施过程 133
7.10 实例2：客户留言信息表单编辑 137
7.11 实例3：无名山人作品集框架页HTML编辑 138
7.12 习题 139
第8章 CSS样式表的套用 140
8.1 CSS简介 140
8.1.1 CSS的概念 140
8.1.2 CSS的特点 141
8.1.3 样式表的规则 141
8.2 创建新样式表与套用样式表 141
8.2.1 “CSS样式”面板 141
8.2.2 “新建CSS规则”对话框 142
8.2.3 新建与套用CSS样式 143
8.2.4 连结外部CSS样式表 144
8.3 CSS的规则定义 145
8.3.1 定义CSS样式“类型”属性 145
8.3.2 定义CSS样式“背景”属性 146
8.3.3 定义CSS样式“区块”属性 146
8.3.4 定义CSS样式“方框”属性 147
8.3.5 定义CSS样式“框线”属性 148
8.3.6 定义CSS样式“列表”属性 149
8.3.7 定义CSS样式“定位”属性 149
8.3.8 定义CSS样式“扩展”属性 150
8.4 实例：淮安市高校教学资源共建共享平台CSS样式设计 150
8.5 习题 154
8.1 CSS简介 140
8.1.1 CSS的概念 140
8.1.2 CSS的特点 141
8.1.3 样式表的规则 141
8.2 创建新样式表与套用样式表 141
8.2.1 “CSS样式”面板 141
8.2.2 “新建CSS规则”对话框 142
8.2.3 新建与套用CSS样式 143
8.2.4 连结外部CSS样式表 144
8.3 CSS的规则定义 145
8.3.1 定义CSS样式“类型”属性 145
8.3.2 定义CSS样式“背景”属性 146
8.3.3 定义CSS样式“区块”属性 146
8.3.4 定义CSS样式“方框”属性 147
8.3.5 定义CSS样式“框线”属性 148
8.3.6 定义CSS样式“列表”属性 149
8.3.7 定义CSS样式“定位”属性 149
8.3.8 定义CSS样式“扩展”属性 150
8.4 实例：淮安市高校教学资源共建共享平台CSS样式设计 150
8.5 习题 154
第9章 模板与库的套用 155
9.1 模板 155
9.1.1 模板的概念 155
9.1.2 模板的新建 155
9.1.3 定义可编辑区域 157
9.2 模板的套用 158
9.3 库 159
9.3.1 库的概念 159
9.3.2 库项目的创建 160
9.3.3 编辑库项目 161
9.4 实例：书法家庄辉个人网站模板套用 161
9.4.1 模板与库的设计 161
9.4.2 创建库项目 162
9.4.3 网站模板的创建 162
9.4.4 套用模板创建并编辑网页 163
9.5 习题 164
9.1 模板 155
9.1.1 模板的概念 155
9.1.2 模板的新建 155
9.1.3 定义可编辑区域 157
9.2 模板的套用 158
9.3 库 159
9.3.1 库的概念 159
9.3.2 库项目的创建 160
9.3.3 编辑库项目 161
9.4 实例：书法家庄辉个人网站模板套用 161
9.4.1 模板与库的设计 161
9.4.2 创建库项目 162
9.4.3 网站模板的创建 162
9.4.4 套用模板创建并编辑网页 163
9.5 习题 164
第10章 JavaScript脚本套用 165
10.1 JavaScript套用基础 165
10.1.1 JavaScript简介 165
10.1.2 JavaScript的特点 165
10.1.3 网页中套用JavaScript的方法及定义 166
10.2 基于对象的JavaScript脚本语言 166
10.2.1 对象及相关概念 166
10.2.2 DHTML对象模型简介 168
10.2.3 事件介绍 168
10.3 Spry构件套用 169
10.3.1 Spry选单栏构件 169
10.3.2 Spry选项卡式面板构件 170
10.3.3 Spry摺叠构件 171
10.4 常用的JavaScript特效套用实例 172
10.4.1 实例1：日期显示效果 172
10.4.2 实例2：图片展示幻灯片Flash切换效果 172
10.4.3 实例3：图片展示幻灯片切换效果 174
10.4.4 实例4：文本或图像滚动效果 176
10.4.5 实例5：网页飘动广告效果 177
10.5 实例：验证用户登录界面 178
10.6 习题 181
10.1 JavaScript套用基础 165
10.1.1 JavaScript简介 165
10.1.2 JavaScript的特点 165
10.1.3 网页中套用JavaScript的方法及定义 166
10.2 基于对象的JavaScript脚本语言 166
10.2.1 对象及相关概念 166
10.2.2 DHTML对象模型简介 168
10.2.3 事件介绍 168
10.3 Spry构件套用 169
10.3.1 Spry选单栏构件 169
10.3.2 Spry选项卡式面板构件 170
10.3.3 Spry摺叠构件 171
10.4 常用的JavaScript特效套用实例 172
10.4.1 实例1：日期显示效果 172
10.4.2 实例2：图片展示幻灯片Flash切换效果 172
10.4.3 实例3：图片展示幻灯片切换效果 174
10.4.4 实例4：文本或图像滚动效果 176
10.4.5 实例5：网页飘动广告效果 177
10.5 实例：验证用户登录界面 178
10.6 习题 181
第11章 HTML+CSS页面布局 183
11.1 DIV布局基础 183
11.1.1 理解表现和内容的分离 183
11.1.2 选择符的分类 184
11.1.3 类标籤与id标籤的套用 185
11.1.4 元素的继承性与分类 187
11.2 DIV+CSS布局基础 187
11.2.1 CSS盒模型 187
11.2.2 CSS布局基础 189
11.2.3 单行单列结构 190
11.2.4 二列布局结构 191
11.2.5 三列式布局结构 196
11.3 实例：数位化教学资源平台网站布局 199
11.3.1 效果图的分析与切片 199
11.3.2 製作站点的首页头部 200
11.3.3 製作首页的主体部分 204
11.3.4 製作首页的底部 214
11.4 习题 215
11.1 DIV布局基础 183
11.1.1 理解表现和内容的分离 183
11.1.2 选择符的分类 184
11.1.3 类标籤与id标籤的套用 185
11.1.4 元素的继承性与分类 187
11.2 DIV+CSS布局基础 187
11.2.1 CSS盒模型 187
11.2.2 CSS布局基础 189
11.2.3 单行单列结构 190
11.2.4 二列布局结构 191
11.2.5 三列式布局结构 196
11.3 实例：数位化教学资源平台网站布局 199
11.3.1 效果图的分析与切片 199
11.3.2 製作站点的首页头部 200
11.3.3 製作首页的主体部分 204
11.3.4 製作首页的底部 214
11.4 习题 215
第12章 网站的测试与发布 216
12.1 网站的整合 216
12.2 本地站点测试网站 217
12.2.1 网站测试的参数 217
12.2.2 实例：测试书法家庄辉个人网站 217
12.3 网站的发布 220
12.3.1 域名申请 220
12.3.2 申请空间 221
12.3.3 申请免费域名、空间 221
12.3.4 设定远程站点 222
12.3.5 连线伺服器 223
12.3.6 档案的上传和下载 223
12.3.7 测试发布后的网站 224
12.4 习题 224
12.1 网站的整合 216
12.2 本地站点测试网站 217
12.2.1 网站测试的参数 217
12.2.2 实例：测试书法家庄辉个人网站 217
12.3 网站的发布 220
12.3.1 域名申请 220
12.3.2 申请空间 221
12.3.3 申请免费域名、空间 221
12.3.4 设定远程站点 222
12.3.5 连线伺服器 223
12.3.6 档案的上传和下载 223
12.3.7 测试发布后的网站 224
12.4 习题 224
第13章 淮安市专用汽车製造有限公司网站建设 225
13.1 项目目标与项目展示 225
13.1.1 项目展示 225
13.1.2 项目目标 225
13.2 项目资讯 226
13.2.1 网站需求分析 226
13.2.2 网站的风格定位 226
13.2.3 规划草图 227
13.3 项目计画 227
13.4 效果图与静态页面製作 228
13.4.1 效果图设计 228
13.4.2 效果图切片导出网页 231
13.4.3 后期网页编辑 232
13.4.4 动画製作 236
13.4.5 动画的使用 237
13.5 动态网站管理系统与静态页面的融合 237
13.5.1 搜寻网站管理平台 238
13.5.2 静态前台与动态后台的档案整合 239
13.5.3 IIS的安装与配置 239
13.5.4 系统登录与栏目的设定 241
13.5.5 网站内容的添加 242
13.5.6 网站模板的添加 243
13.5.7 前台网站调用后台程式 245
13.5.8 网站测试与后期完善 247
13.6 习题 248
13.1 项目目标与项目展示 225
13.1.1 项目展示 225
13.1.2 项目目标 225
13.2 项目资讯 226
13.2.1 网站需求分析 226
13.2.2 网站的风格定位 226
13.2.3 规划草图 227
13.3 项目计画 227
13.4 效果图与静态页面製作 228
13.4.1 效果图设计 228
13.4.2 效果图切片导出网页 231
13.4.3 后期网页编辑 232
13.4.4 动画製作 236
13.4.5 动画的使用 237
13.5 动态网站管理系统与静态页面的融合 237
13.5.1 搜寻网站管理平台 238
13.5.2 静态前台与动态后台的档案整合 239
13.5.3 IIS的安装与配置 239
13.5.4 系统登录与栏目的设定 241
13.5.5 网站内容的添加 242
13.5.6 网站模板的添加 243
13.5.7 前台网站调用后台程式 245
13.5.8 网站测试与后期完善 247
13.6 习题 248
第14章 项目开发综合实训 249
14.1 网页设计师职业成长规律 249
14.1.1 从初学者到专家 249
14.1.2 网页设计师的现状分析 249
14.1.3 网页设计师的岗位要求与学习重点 250
14.2 网站开发规範 253
14.2.1 组建开发团队 253
14.2.2 开发工具 253
14.2.3 网站开发流程 254
14.2.4 资料夹档案名称命名规範 255
14.2.5 网站首页head区代码规範 255
14.2.6 网站建设尺寸规範 256
14.3 实训任务安排 256
14.4 项目进展计画 257
14.5 实训报告书 258
14.1 网页设计师职业成长规律 249
14.1.1 从初学者到专家 249
14.1.2 网页设计师的现状分析 249
14.1.3 网页设计师的岗位要求与学习重点 250
14.2 网站开发规範 253
14.2.1 组建开发团队 253
14.2.2 开发工具 253
14.2.3 网站开发流程 254
14.2.4 资料夹档案名称命名规範 255
14.2.5 网站首页head区代码规範 255
14.2.6 网站建设尺寸规範 256
14.3 实训任务安排 256
14.4 项目进展计画 257
14.5 实训报告书 258
参考文献 259