第1章 网页设计概述 1
1.1 网页界面设计 1
1.1.1 界面设计的相关术语 1
1.1.2 网页空间与页面尺寸 2
1.1.3 现代网站界面设计的特点 3
1.2 网页设计中的用色 5
1.2.1 色彩的三要素 5
1.2.2 色彩的情感象征 6
1.2.3 网页色彩的搭配 10
1.2.4 色彩采集 12
1.3 网站的风格形式 12
1.3.1 企业网站 12
1.3.2 商业网站 13
1.3.3 个人网站 13
1.4 网页的版式结构 13
1.4.1 方向型 14
1.4.2 格型 14
1.4.3 曲线型 15
1.4.4 栏型 16
1.4.5 框架型 16
1.4.6 焦点型 17
1.5 网页设计的构成要素 17
第2章 网页设计快速起跑 20
2.1 初识中文版Photoshop CS2 20
2.2 文本和图层的应用 23
2.2.1 创建与编辑文本 23
2.2.2 创建变形文字与路径文字 24
2.2.3 文字编排的常见形式 26
2.2.4 图层的基本操作 27
2.2.5 图层样式的运用 29
2.2.6 综合实例——文字标志 33
2.3 常用工具简介 35
2.3.1 选框工具——制作水平线 35
2.3.2 移动工具——移动图像 37
2.3.3 切片工具——切割图片 38
2.3.4 钢笔工具——绘制动感的线条 39
2.3.5 渐变工具——制作渐变效果 40
2.3.6 形状工具——绘制图形框架 41
2.4 图像优化和输出 42
2.4.1 图像的优化 43
2.4.2 输出图像 43
2.5 辅助工具 43
2.5.1 标尺 43
2.5.2 参考线 44
2.5.3 网格 45
第3章 网页中按钮的设计及应用 47
3.1 静态按钮的制作 47
3.1.1 普通按钮 47
3.1.2 发光按钮 49
3.1.3 水晶按钮 51
3.1.4 纹理按钮 53
3.1.5 图形按钮 55
3.2 动态按钮的制作 58
3.2.1 GIF动态按钮 58
3.2.2 翻转按钮 62
第4章 Logo、网页背景与导航条的设计 64
4.1 Logo的制作 64
4.1.1 Logo设计的基本要求 64
4.1.2 企业网站Logo 64
4.1.3 个人网站Logo 68
4.2 网页背景的制作 71
4.2.1 网格背景 71
4.2.2 相框背景 73
4.3 导航条的制作 76
4.3.1 一般导航条 76
4.3.2 随意导航条 78
第5章 商业网站设计 81
5.1 科技网站——博文科技 81
5.1.1 网站效果欣赏 81
5.1.2 网站知识点睛 81
5.1.3 网站布局浅析 82
5.1.4 网站制作实战 82
5.2 房地产网站——雅怡花苑 91
5.2.1 网站效果欣赏 91
5.2.2 网站知识点睛 92
5.2.3 网站布局浅析 92
5.2.4 网站制作实战 92
第6章 个人网站设计 102
6.1 个人博客网站——蝶恋花 102
6.1.1 网站效果欣赏 102
6.1.2 网站知识点睛 102
6.1.3 网站布局浅析 103
6.1.4 网站制作实战 103
6.2 个人相册网站——快乐时光 112
6.2.1 网站效果欣赏 112
6.2.2 网站知识点睛 113
6.2.3 网站布局浅析 113
6.2.4 网站制作实战 114
第7章 女性网站设计 125
7.1 美容网站——紫蝴蝶 125
7.1.1 网站效果欣赏 125
7.1.2 网站知识点睛 125
7.1.3 网站布局浅析 126
7.1.4 网站制作实战 126
7.2 服饰网站——柔诗婷 136
7.2.1 网站效果欣赏 136
7.2.2 网站知识点睛 137
7.2.3 网站布局浅析 137
7.2.4 网站制作实战 138
第8章 教育网站设计 149
8.1 少儿网站——乖乖宝贝 149
8.1.1 网站效果欣赏 149
8.1.2 网站知识点睛 149
8.1.3 网站布局浅析 150
8.1.4 网站制作实战 150
8.2 校园网站——长沙鹰达校园网 159
8.2.1 网站效果欣赏 159
8.2.2 网站知识点睛 160
8.2.3 网站布局浅析 160
8.2.4 网站制作实战 160
第9章 娱乐网站设计 171
9.1 游戏网站——ROHAN 171
9.1.1 网站效果欣赏 171
9.1.2 网站知识点睛 171
9.1.3 网站布局浅析 172
9.1.4 网站制作实战 172
9.2 电影网站——影视在线 180
9.2.1 网站效果欣赏 180
9.2.2 网站知识点睛 180
9.2.3 网站布局浅析 181
9.2.4 网站制作实战 181
第10章 ImageReady CS2的应用 190
10.1 初识中文版ImageReady CS2 190
10.1.1 启动ImageReady CS2 190
10.1.2 ImageReady CS2的操作界面 190
10.2 使用ImageReady CS2制作动画 192
10.2.1 网站资讯动画——金融热讯主题网站 192
10.2.2 网络产品动画——酷曼娅手机 200
第11章 最佳组合：Photoshop CS2与Dreamweaver 8 208
11.1 初识中文版Dreamweaver8 208
11.1.1 Dreamweaver 8的操作界面 208
11.1.2 创建站点 211
11.1.3 文档的创建及保存 214
11.1.4 插入文本和图像 215
11.1.5 使用表格、层和框架 218
11.2 综合实例——曼蝶娅服饰网站设计 224
11.2.1 使用Photoshop CS2制作网站 224
11.2.2 使用Dreamweaver 8新建站点 229
11.2.3 使用ImageReady切片输出网站 229
11.2.4 使用Dreamweaver 8编辑网站 231
第12章 珠联璧合：Photoshop CS2与Flash 8 234
12.1 初识中文版Flash 8 234
12.1.1 Flash 8的操作界面 234
12.1.2 新建文档和设置场景 238
12.1.3 元件的创建与编辑 239
12.2 制作动态广告——心随音乐动 244
12.2.1 使用Photoshop CS2制作广告背景 244
12.2.2 使用Photoshop CS2抠取素材图像 246
12.2.3 使用Flash 8制作动画效果 247
第13章 双剑合一：Photoshop CS2与Fireworks 8 254
13.1 初识中文版Fireworks 8 254
13.1.1 Fireworks 8的操作界面 254
13.1.2 新建文档 259
13.1.3 编辑图层 259
13.1.4 按钮和帧的使用 261
13.2 制作帧动画——网上淘宝 265
13.2.1 使用Photoshop CS2制作帧动画背景 265
13.2.2 使用Photoshop CS2抠取素材图像 266
13.2.3 使用Fireworks 8制作动画效果 268