项目一　赏析和规划电子商务网站——了解电子商务网站　1
1.1　知识链接　2
1.1.1　网页的构成元素　2
1.1.2　电子商务网站的概念和特点　5
1.1.3　电子商务网站的分类　6
1.1.4　电子商务网站的视觉营销　6
1.1.5　电子商务网站的开发流程　8
1.2　任务一　赏析电子商务网站　11
1.2.1　任务描述——分析电子商务网站首页　11
1.2.2　技术引进——分析页面结构与色彩　12
1.2.3　任务实施——提高用户体验的要素　14
1.2.4　新手试练——赏析电子商务网站页面　17
1.3　任务二　规划“学设计”电子商务网站　19
1.3.1　任务描述——分析电子商务网站的结构　19
1.3.2　技术引进——完成电子商务网站线框图　20
1.3.3　任务实施——设计电子商务网站　22
1.3.4　新手试练——电子商务网站会员页面设计　24
1.4　总结扩展　25
1.4.1　项目小结　25
1.4.2　举一反三　25
1.5　课后习题　25
项目二　创建并管理电子商务网站站点——掌握网站搭建基础　27
2.1　知识链接　27
2.1.1　电子商务网站制作相关术语　28
2.1.2　远程站点和本地站点　30
2.1.3　URL　30
2.1.4　站点规划　32
2.2　任务一　创建网站文件结构　32
2.2.1　任务描述——创建本地静态站点　32
2.2.2　技术引进——了解“站点设置对象”对话框　32
2.2.3　任务实施——站点文件的优化与管理　35
2.2.4　新手试练——创建小型电子商务网站站点　37
2.3　任务二　设置远程服务器信息　37
2.3.1　任务描述——上传站点文件到远程服务器　38
2.3.2　技术引进——设置“站点设置对象”对话框　38
2.3.3　任务实施——设置远程服务器　40
2.3.4　新手试练——站点中的操作　42
2.4　总结扩展　42
2.4.1　项目小结　42
2.4.2　举一反三　43
2.5　课后习题　43
项目三　使用HTML编写页面——搭建页面底层的基础　44
3.1　知识链接　44
3.1.1　电子商务网站建设原则　45
3.1.2　电子商务网站页面布局原则　46
3.1.3　了解HTML 5　47
3.1.4　HTML的基本结构　47
3.1.5　掌握HTML的标签　48
3.2　任务一　布局 学设计 网站的 关于我们 页面　51
3.2.1　任务描述——了解页面的基本结构　51
3.2.2　技术引进——在Dreamweaver CC中编写HTML代码　51
3.2.3　任务实施——制作 关于我们 页面结构　54
3.2.4　新手试练——制作社区生活页面　57
3.3　任务二　制作 学设计 网站的 关于我们 页面　57
3.3.1　任务描述——了解 关于我们 页面结构　58
3.3.2　技术引进——Div+CSS盒模型　58
3.3.3　任务实施——完成 关于我们 页面制作　61
3.3.4　新手试练——制作蓝色企业网站　63
3.4　总结扩展　63
3.4.1　项目小结　63
3.4.2　举一反三　63
3.5　课后习题　64
项目四　使用CSS美化页面——简单、快捷、规范地制作页面　65
4.1　知识链接　65
4.1.1　电子商务网站设计常用术语　66
4.1.2　CSS基础　68
4.1.3　CSS的基本语法　70
4.1.4　CSS的使用方法　70
4.2　任务一　美化 关于我们 页面导航　73
4.2.1　任务描述——了解页面导航的结构　73
4.2.2　技术引进——了解id选择符　73
4.2.3　任务实施——美化“关于我们”页面导航　75
4.2.4　新手试练——制作个人作品网站页面　77
4.3　任务二　美化 关于我们 页面文本内容　77
4.3.1　任务描述——分析“关于我们”页面结构　78
4.3.2　技术引进——使用CSS控制字体　78
4.3.3　任务实施——美化页面文本　81
4.3.4　新手试练——制作网站公告　83
4.4　总结扩展　84
4.4.1　项目小结　84
4.4.2　举一反三　84
4.5　课后习题　84
项目五　使用CSS控制列表样式——制作商品列表页面　86
5.1　知识链接　86
5.1.1　电子商务网站常用的商品列表页面布局　87
5.1.2　商品列表页面的设计要点　88
5.1.3　网页中的列表控制　91
5.1.4　列表的类型及使用　92
5.2　任务一　制作商品列表索引导航　94
5.2.1　任务描述——商品列表索引导航结构分析　95
5.2.2　技术引进——有序列表和无序列表　95
5.2.3　任务实施——制作商品列表索引导航　98
5.2.4　新手试练——制作方块列表效果　100
5.3　任务二　美化商品列表页面　101
5.3.1　任务描述——商品列表页面结构分析　101
5.3.2　技术引进——使用定义列表　101
5.3.3　任务实施——制作页面中的商品列表　103
5.3.4　新手试练——制作纵向导航菜单　105
5.4　总结扩展　105
5.4.1　项目小结　105
5.4.2　举一反三　105
5.5　课后习题　106
项目六　使用CSS控制页面文本样式——制作商品详情页面　107
6.1　知识链接　107
6.1.1　商品详情页面的设计原则　108
6.1.2　如何做好商品详情页面　111
6.1.3　通过CSS控制字体与大小　112
6.1.4　通过CSS控制颜色和粗细　114
6.2　任务一　制作商品详情页面顶部　116
6.2.1　任务描述——了解文本标签　116
6.2.2　技术引进——掌握文本装饰标签　116
6.2.3　任务实施——制作商品详情页面顶部　118
6.2.4　新手试练——网页文本修饰　121
6.3　任务二　制作商品详情页面文本介绍　121
6.3.1　任务描述——了解分区标签的使用　122
6.3.2　技术引进——使用CSS控制段落　122
6.3.3　任务实施——制作商品详情页面底部　125
6.3.4　新手试练——应用多个类样式　126
6.4　总结扩展　127
6.4.1　项目小结　127
6.4.2　举一反三　127
6.5　课后习题　128
项目七　在页面中使用多媒体——制作视频播放页面　129
7.1　知识链接　130
7.1.1　打造具有说服力的商品页面　130
7.1.2　电子商务网站中多媒体视频的使用　132
7.1.3　使用 embed 标签嵌入音频和视频文件　132
7.1.4　HTML 5中多媒体的应用　133
7.2　任务一　制作视频播放页面　134
7.2.1　任务描述——视频播放页面结构　134
7.2.2　技术引进——在页面中嵌入音频或视频文件　135
7.2.3　任务实施——制作视频播放页面　137
7.2.4　新手试练——在网页中嵌入视频文件　140
7.3　任务二　制作视频播放页面详情部分　140
7.3.1　任务描述——使用 source 标签　141
7.3.2　技术引进—— audio与 video 标签的属性　141
7.3.3　任务实施——制作视频详情页面底部　144
7.3.4　新手试练——实现网页中视频的播放与暂停　146
7.4　总结扩展　146
7.4.1　项目小结　146
7.4.2　举一反三　147
7.5　课后习题　147
项目八　使用CSS控制表单——制作会员注册页面　148
8.1　知识链接　149
8.1.1　注册页面的设计要求　149
8.1.2　登录页面的设计要求　150
8.1.3　设计人性化的登录页面　151
8.1.4　表单与表单属性　153
8.1.5　表单中的其他元素　153
8.2　任务一　制作会员注册页面　157
8.2.1　任务描述——会员注册页面结构分析　158
8.2.2　技术引进——在Dreamweaver CC中使用表单元素　158
8.2.3　任务实施——制作网站会员注册页面　162
8.2.4　新手试练——制作多彩下拉列表　164
8.3　任务二　制作会员信息完善页面　165
8.3.1　任务描述——会员信息完善页面结构分析　165
8.3.2　技术引进—— input 与 textarea 标签的属性　165
8.3.3　任务实施——制作会员信息完善页面　167
8.3.4　新手试练——制作舞动会员登录界面　170
8.4　总结扩展　171
8.4.1　项目小结　171
8.4.2　举一反三　171
8.5　课后习题　171
项目九　使用CSS控制超链接——制作电子商务网站首页　173
9.1　知识链接　173
9.1.1　电子商务网站导航设计技巧　174
9.1.2　电子商务网站首屏的设计要点　177
9.1.3　认识超链接　180
9.1.4　了解超链接路径　181
9.2　任务一　制作电子商务网站首屏　183
9.2.1　任务描述——分析电子商务网站首页结构　183
9.2.2　技术引进——了解超链接的属性控制　183
9.2.3　任务实施——制作电子商务网站首屏　187
9.2.4　新手试练——制作活动公告　189
9.3　任务二　制作电子商务网站版底信息　190
9.3.1　任务描述——分析电子商务网站版底结构　191
9.3.2　技术引进——使用CSS控制鼠标指针效果　191
9.3.3　任务实施——制作电子商务网站首页版底　193
9.3.4　新手试练——制作图像式超链接　195
9.4　总结扩展　195
9.4.1　项目小结　195
9.4.2　举一反三　195
9.5　课后习题　196
项目十　使用JavaScript脚本丰富页面——制作页面交互动画　197
10.1　知识链接　198
10.1.1　电子商务网站的交互设计技巧　198
10.1.2　交互设计需要考虑的内容　200
10.1.3　JavaScript的应用范围　202
10.1.4　jQuery　203
10.2　任务一　制作电子商务网站轮播图动画　205
10.2.1　任务描述——分析网页轮播图的作用　205
10.2.2　技术引进——了解在HTML文档中使用JavaScript的方法　206
10.2.3　任务实施——制作电子商务网站首页轮播图　207
10.2.4　新手试练——使用JavaScript实现图像滑动切换　209
10.3　任务二　制作电子商务网站弹出页面　210
10.3.1　任务描述——分析网站弹出页面布局结构　210
10.3.2　技术引进——jQuery UI和jQuery Mobile　210
10.3.3　任务实施——使用JavaScript实现弹出页面　213
10.3.4　新手试练——使用JavaScript制作动态网站相册　214
10.4　总结扩展　215
10.4.1　项目小结　215
10.4.2　举一反三　215
10.5　课后习题　215
项目十一　电子商务网站综合实例——睿欧电子商务网站的搭建　217
11.1　知识链接　218
11.1.1　电子商务网站的发展趋势　218
11.1.2　电子商务网站的产品原型　220
11.1.3　电子商务网站浏览器兼容性测试　221
11.1.4　电子商务网站的上传与管理　225
11.2　任务一　设计睿欧电子商务网站的原型　227
11.2.1　任务描述——睿欧电子商务网站结构和层级　228
11.2.2　技术引进——了解产品原型软件Axure RP　228
11.2.3　任务实施——制作睿欧电子商务网站原型　233
11.2.4　新手试练——根据电子商务网站原型设计页面　235
11.3　任务二　睿欧电子商务网站的设计与制作　236
11.3.1　任务描述——电子商务网站页面设计与制作　236
11.3.2　技术引进——掌握CSS页面布局方式　236
11.3.3　任务实施——设计睿欧电子商务网站　242
11.3.4　新手试练——使用FTP维护电子商务网站　246
11.4　总结扩展　247
11.4.1　项目小结　247
11.4.2　举一反三　247
11.5　课后习题　248