本书基于Dreamweaver+Photoshop工具组合，系统详细地介绍了8个不同特色的网站的设计和制作过程。每一实例又分为实例背景分析、使用Photoshop软件设计版面效果、使用Dreamweaver软件制作成HTML页面3个过程进行讨论。

本书采用了全新的图文结合方式，全面展现了网页设计与制作过程中的细节，尤其通过大量注释详尽的图解为读者化解了阅读和学习上的障碍，使得读者可以更加快速和高效地提升自己的网页制作技能。

本书首先全面讲述了网页配色与网页布局的基本知识，然后基于Dreamweaver+Photoshop的工具组合，详细地介绍了手机增值业务网站、旅游休闲网站、家电家居网站、手机和数码产品网站、音乐网站、艺术设计网站、企业网站和时尚社区网站8个典型实例的设计和制作过程。在介绍各个网站实例的制作过程中，不仅分析了各个网站的配色方案和布局结构，而且还细致地讲解了从设计版面效果到实现最终HTML页面的操作步骤，以及一些实际网页设计和制作中常用的方法和技巧。

本书面向实用，提供了大量网页设计与制作的细节图解，采用由浅入深的讲解方式，即使是初学者也可以轻松掌握Dreamweaver+Photoshop工具，制作出精美的网页并搭建功能强大的网站。随书光盘提供了本书所有的实例素材及网站源文件(PSD、HTML、Flash)，以帮助读者进行操作练习。

本书适用于网页设计、网站制作的初学者，也适用于相关从业人员进阶，还可以作为大中专院校相关专业的教学辅导和参考用书，或作为相关培训机构的培训教材。

第1章　网页配色　1

 1.1　关于网页的配色　2

1.1.1　网页安全色　2

1.1.2　基本配色的方法　3

1.1.3　基本色相、色调的配色方案　7

 1.2　色彩和感觉的神秘关系　12

1.2.1　色彩的温度感　12

1.2.2　色彩的重量感　13

1.2.3　色彩和声音　13

1.2.4　色彩和味觉、香味　14

1.2.5　色彩与光　14

1.2.6　色彩的心理感觉　15

第2章　网页布局　19

 2.1　网页布局类型的确定方法　20

2.1.1　把内容放入自己喜欢的网页类型中　20

2.1.2　草绘出两三个不同网页类型的模板　21

 2.2　网页布局的连贯性和多样性　21

 2.3　网页布局结构　22

2.3.1　网页布局结构的标准——信息架构　23

2.3.2　单一结构　23

2.3.3　复合结构　27

 2.4　网页布局形态　31

2.4.1　功能优先还是形态优先　31

2.4.2　网页布局形态表达的含义及传递的情感　32

2.4.3　普通形态　35

2.4.4　独特形态　37

2.4.5　实验形态　39

第3章　手机增值业务网站　40

 3.1　背景概述　41

 3.2　实例分析　42

3.2.1　色彩分析　42

3.2.2　布局分析　43

 3.3　使用Photoshop软件设计版面效果　43

3.3.1　新建文件并设置参考线　43

3.3.2　设计Logo和导航　45

3.3.3　设计主要内容区　47

3.3.4　设计版权信息部分　50

3.3.5　切割网页图像并存储为Web所用格式　51

 3.4　使用Dreamweaver软件制作成HTML页面　53

3.4.1　定义本地站点　53

3.4.2　使用表格布局页面　54

3.4.3　制作Logo和菜单栏　57

3.4.4　使用CSS样式定义背景和文本域属性　59

3.4.5　制作主要内容区　61

3.4.6　制作版权信息部分　65

 3.5　将网页发布到因特网上　66

3.5.1　使用Dreamweaver自带的上传功能上传　66

3.5.2　使用CuteFTP软件上传　70

第4章　旅游网站　72

 4.1　背景概述　73

 4.2　实例分析　75

4.2.1　色彩分析　76

4.2.2　布局分析　76

 4.3　使用Photoshop软件设计版面效果　77

4.3.1　设计头部区域　77

4.3.2　设计内容区域　80

4.3.3　设计尾部区域　84

4.3.4　切割网页图像　84

 4.4　将效果图制作成HTML页面　86

4.4.1　定义站点与表格布局　87

4.4.2　制作会员登录入口　88

4.4.3　插入Flash菜单和顶部导航　90

4.4.4　利用CSS样式设置边框效果　92

4.4.5　编排内容区域各元素　94

4.4.6　制作尾部区域　97

4.4.7　利用时间轴和层制作漂浮广告　98

第5章　家电家居网站　101

 5.1　背景概述　102

 5.2　实例分析　103

5.2.1　色彩分析　103

5.2.2　布局分析　104

 5.3　使用Photoshop软件设计版面效果　104

5.3.1　设计主内容区域　104

5.3.2　设计尾部区域　108

5.3.3　切割网页图像　109

 5.4　将效果图制作成HTML页面　110

5.4.1　定义站点与表格布局　111

5.4.2　制作导航条　112

5.4.3　制作下拉菜单　114

5.4.4　编排其他内容　116

5.4.5　制作尾部区域　120

 5.5　利用模板制作网页　122

5.5.1　认识模板　122

5.5.2　创建模板　123

5.5.3　应用模板制作内页　125

第6章　手机和数码产品网站　129

 6.1　背景概述　130

 6.2　实例分析　131

6.2.1　色彩分析　131

6.2.2　布局分析　132

 6.3　使用Photoshop软件设计版面效果　132

6.3.1　规划整体版面　132

6.3.2　使用钢笔工具绘制不规则圆角粗边框　132

6.3.3　设计Banner区域　135

6.3.4　制作Logo和导航区域　136

6.3.5　设计内容区域边框　137

6.3.6　设计内容区域各元素　139

6.3.7　切割网页图像　140

 6.4　使用Dreamweaver软件制作HTML页面　142

6.4.1　定义站点与设置页面属性　142

6.4.2　利用表格和【CSS样式】面板布局　143

6.4.3　利用【行为】面板制作交换图像效果菜单　144

6.4.4　制作Banner区域　145

6.4.5　利用CSS样式设置内容区域边框　147

6.4.6　编排内容区域各元素　148

6.4.7　利用【行为】面板制作弹出页面　151

第7章　音乐网站　153

 7.1　背景概述　154

 7.2　实例分析　155

7.2.1　色彩分析　155

7.2.2　布局分析　156

 7.3　使用Photoshop软件设计版面效果　156

7.3.1　设计斜形纹理背景图像　157

7.3.2　规划整体版面　158

7.3.3　设计头部区域　160

7.3.4　设计导航区域　161

7.3.5　设计动画播放窗口　163

7.3.6　设计内容区域　165

7.3.7　设计尾部区域　166

 7.4　使用Dreamweaver软件制作HTML页面　167

7.4.1　设置背景图像　167

7.4.2　利用表格初步布局　168

7.4.3　插入Flash文件　169

7.4.4　编辑其他内容区域　171

7.4.5　制作内页　174

7.4.6　在页面中插入视频文件　175

7.4.7　在页面中插入背景音乐　178

第8章　艺术设计网站　180

 8.1　背景概述　181

 8.2　实例分析　183

8.2.1　色彩分析　183

8.2.2　布局分析　184

 8.3　使用Photoshop软件设计版面效果　184

8.3.1　规划整体版面　184

8.3.2　设计Logo　185

8.3.3　设计导航栏　187

8.3.4　设计左边区域和Banner区域　189

8.3.5　设计其他区域　190

8.3.6　切割网页图像　194

 8.4　使用Dreamweaver软件制作HTML页面　196

8.4.1　利用表格布局　196

8.4.2　制作“鼠标经过图像”效果　197

8.4.3　制作左边区域的内容　199

8.4.4　使用【显示-隐藏层】行为制作Banner　201

8.4.5　制作其他内容部分　206

8.4.6　设置状态栏文本　209

8.4.7　设置滚动条颜色和隐藏滚动条　210

8.4.8　加入防止网页被COPY的代码　211

第9章　企业网站　213

 9.1　背景概述　214

 9.2　实例分析　215

9.2.1　色彩分析　216

9.2.2　布局分析　216

 9.3　使用Photoshop软件设计版面效果　217

9.3.1　规划整体版面　217

9.3.2　设计头部区域　220

9.3.3　设计导航区域　222

9.3.4　设计内容区域　222

9.3.5　设计尾部区域　227

9.3.6　切割网页图像　228

 9.4　使用Dreamweaver软件制作HTML页面　230

9.4.1　初步编辑网页　230

9.4.2　制作头部区域和导航区域　232

9.4.3　制作内容区域　234

9.4.4　制作尾部区域　239

第10章　时尚社区网站　240

 10.1　背景概述　241

 10.2　实例分析　242

10.2.1　色彩分析　242

10.2.2　布局分析　243

 10.3　使用Photoshop软件设计版面效果　243

10.3.1　设计头部区域　244

10.3.2　设计导航和Banner区域　245

10.3.3　设计内容区域　246

10.3.4　设计尾部区域　250

10.3.5　切割网页图像　252

 10.4　使用Dreamweaver软件制作HTML页面　253

10.4.1　新建站点与设置页面属性　254

10.4.2　利用表格布局　254

10.4.3　制作导航和Banner区域　256

10.4.4　制作会员登录部分　258

10.4.5　制作内容区域其他部分　261

10.4.6　制作尾部区域　265