第1章 色彩达人必学知识 1
1.1 认识色彩 2
1.1.1 色彩是什么 2
1.1.2 色彩能够做什么 2
1.1.3 色彩的属性 4
1.2 主色、辅助色、点缀色的关系 8
1.2.1 主色 8
1.2.2 辅助色 8
1.2.3 点缀色 9
1.2.4 设计师谈——画龙点睛的点缀色 9
1.2.5 动手练习——视觉中心的主色秘诀 10
1.3 色彩的对比 11
1.3.1 明度对比 12
1.3.2 纯度对比 12
1.3.3 色相对比 13
1.3.4 面积对比 15
1.3.5 冷暖对比 16
第2章 网页设计的基础知识 17
2.1 什么是网页 18
2.2 网页的构成 18
2.2.1 网页简介 18
2.2.2 网页标题 19
2.2.3 网站的LOGO 20
2.2.4 网页页眉 20
2.2.5 网页页脚 21
2.2.6 网页导航 21
2.2.7 网页的主体内容 21
2.3 网页的尺寸 22
2.4 网页的色彩 23
2.4.1 RGB色彩模式 23
2.4.2 HTML语言对色彩的描述 24
2.4.3 网络安全色 25
第3章 了解基础色 27
3.1 红 29
3.1.1 浅谈红色 29
3.1.2 应用实例 30
3.1.3 常见色分析 30
3.1.4 猜你喜欢 31
3.2 橙 32
3.2.1 浅谈橙色 32
3.2.2 应用实例 33
3.2.3 常见色分析 33
3.2.4 猜你喜欢 34
3.3 黄 35
3.3.1 浅谈黄色 35
3.3.2 应用实例 36
3.3.3 常见色分析 36
3.3.4 猜你喜欢 37
3.4 绿 38
3.4.1 浅谈绿色 38
3.4.2 应用实例 39
3.4.3 常见色分析 39
3.4.4 猜你喜欢 40
3.5 青 41
3.5.1 浅谈青色 41
3.5.2 应用实例 42
3.5.3 常见色分析 42
3.5.4 猜你喜欢 43
3.6 蓝 44
3.6.1 浅谈蓝色 44
3.6.2 应用实例 45
3.6.3 常见色分析 45
3.6.4 猜你喜欢 46
3.7 紫 47
3.7.1 浅谈紫色 47
3.7.2 应用实例 48
3.7.3 常见色分析 48
3.7.4 猜你喜欢 49
3.8 黑 50
3.8.1 浅谈黑色 50
3.8.2 应用实例 50
3.8.3 猜你喜欢 51
3.9 白 52
3.9.1 浅谈白色 52
3.9.2 应用实例 52
3.9.3 猜你喜欢 53
3.10 灰 54
3.10.1 浅谈灰色 54
3.10.2 应用实例 54
3.10.3 猜你喜欢 55
第4章 网页布局技巧与色彩 57
4.1 网页布局的基础知识 58
4.2 黄金分割式布局与左右对齐式布局 59
4.2.1 黄金分割式布局 60
4.2.2 左右对齐式布局 60
4.2.3 动手练习——修改背景颜色 61
4.2.4 设计师谈——黑色配色方案 61
4.2.5 配色实战 61
4.2.6 常见色彩搭配 62
4.2.7 猜你喜欢 62
4.3 全景式布局与卫星式布局 63
4.3.1 全景式布局 64
4.3.2 卫星式布局 64
4.3.3 动手练习——使用点缀色 65
4.3.4 设计师谈——按钮的设计 65
4.3.5 配色实战 65
4.3.6 常见色彩搭配 66
4.3.7 猜你喜欢 66
4.4 照片组合式布局与包围式布局 67
4.4.1 照片组合式布局 68
4.4.2 包围式布局 68
4.4.3 动手练习——LOGO的设计 69
4.4.4 设计师谈——扁平化 69
4.4.5 配色实战 69
4.4.6 常见色彩搭配 70
4.4.7 猜你喜欢 70
4.5 散开式布局与对称式布局 71
4.5.1 敞开式布局 72
4.5.2 对称式布局 72
4.5.3 动手练习——提高颜色的纯度 73
4.5.4 设计师谈——留白 73
4.5.5 配色实战 73
4.5.6 常见色彩搭配 74
4.5.7 猜你喜欢 74
第5章 网页色彩的视觉印象 75
5.1 女性 76
5.1.1 甜美 76
5.1.2 时尚 76
5.2 男性 77
5.2.1 理智 77
5.2.2 坚韧 77
5.3 儿童 78
5.3.1 可爱 78
5.3.2 活力 78
5.4 老人 79
5.4.1 温暖 79
5.4.2 踏实 79
5.5 华丽 80
5.5.1 优雅 80
5.5.2 华美 80
5.6 质朴 81
5.6.1 淳朴 81
5.6.2 干净 81
5.7 活泼 82
5.7.1 天真 82
5.7.2 活力 82
5.8 庄重 83
5.8.1 庄严 83
5.8.2 稳重 83
5.9 兴奋 84
5.9.1 亢奋 84
5.9.2 刺激 84
5.10 沉静 85
5.10.1 安静 85
5.10.2 沉寂 85
5.11 温暖 86
5.11.1 温馨 86
5.11.2 和煦 86
5.12 凉爽 87
5.12.1 劲爽 87
5.12.2 冰凉 87
5.13 专业 88
5.13.1 品质 88
5.13.2 专注 88
5.14 时尚 89
5.14.1 新潮 89
5.14.2 前卫 89
5.15 雅致 90
5.15.1 精致 90
5.15.2 优雅 90
5.16 环保 91
5.16.1 放心 91
5.16.2 健康 91
5.17 安全 92
5.17.1 安稳 92
5.17.2 安然 92
5.18 信誉 93
5.18.1 大气 93
5.18.2 信任 93
5.19 荣耀 94
5.19.1 华丽 94
5.19.2 光辉 94
5.20 美味 95
5.20.1 香甜 95
5.20.2 浓香 95
5.21 神秘 96
5.21.1 奇幻 96
5.21.2 深邃 96
5.22 梦幻 97
5.22.1 绚丽 97
5.22.2 迷幻 97
5.23 自然 98
5.23.1 绿色 98
5.23.2 清新 98
5.24 严肃 99
5.24.1 典范 99
5.24.2 规范 99
第6章 不同网站的网页色彩搭配 101
6.1 门户网页 102
6.1.1 什么是门户网站 102
6.1.2 案例分析 103
6.1.3 动手练习——降低文字的饱和度 104
6.1.4 设计师谈——别忽视网页中的搜索框 104
6.1.5 配色实战——扁平化网页的配色方案 104
6.1.6 常见色彩搭配 104
6.1.7 猜你喜欢 105
6.2 企业网站 106
6.2.1 什么是企业网站 106
6.2.2 案例分析 107
6.2.3 动手练习——增加页面空间感，集中用户视线 108
6.2.4 设计师谈——企业网站的形象塑造 108
6.2.5 配色实战——网页中点缀色配色方案 109
6.2.6 常见色彩搭配 109
6.2.7 猜你喜欢 109
6.3 产品展示 110
6.3.1 什么是产品展示网页 110
6.3.2 案例分析 111
6.3.3 动手练习——减少画面颜色 112
6.3.4 设计师谈——各国家的颜色内涵 112
6.3.5 配色实战——网页配色方案 113
6.3.6 常见色彩搭配 113
6.3.7 猜你喜欢 113
6.4 购物网站 114
6.4.1 什么是购物网站 114
6.4.2 案例分析 115
6.4.3 动手练习——为留白空间添加装饰 116
6.4.4 设计师谈——色彩激发你的购买欲 116
6.4.5 配色实战——网页色彩搭配 117
6.4.6 常见色彩搭配 117
6.4.7 猜你喜欢 117
6.5 社交网页 118
6.5.1 什么是社交网站 118
6.5.2 案例分析 119
6.5.3 动手练习——网站色调应该与产品相呼应 120
6.5.4 设计师谈——网站设计中字体粗细的选择 120
6.5.5 配色实战——不同配色方案的视觉效果 121
6.5.6 常见色彩搭配 121
6.5.7 猜你喜欢 121
6.6 个人网页 122
6.6.1 什么是个人网页 122
6.6.2 案例分析 123
6.6.3 动手练习——为画面添加合适素材 124
6.6.4 设计师谈——网页设计中的三个小细节 124
6.6.5 配色实战——舞蹈网站的色彩搭配 124
6.6.6 常见色彩搭配 125
6.6.7 猜你喜欢 125
6.7 社区论坛 126
6.7.1 什么是社区论坛 126
6.7.2 案例分析 127
6.7.3 动手练习——别把选项藏起来 128
6.7.4 设计师谈——单色网页设计 128
6.7.5 配色实战——网页色彩搭配 128
6.7.6 常见色彩搭配 129
6.7.7 猜你喜欢 129
6.8 活动网站 130
6.8.1 什么是活动网站 130
6.8.2 案例分析 131
6.8.3 动手练习——尽量减少表单问题 132
6.8.4 设计师谈——选用两种色彩进行色彩搭配 132
6.8.5 配色实战——同一网站的配色方案 132
6.8.6 常见色彩搭配 133
6.8.7 猜你喜欢 133
第7章 不同行业的网页色彩搭配 135
7.1 车品类 136
7.1.1 现代风格车品网页 136
7.1.2 粗犷风格车品网页 136
7.1.3 动手练习——打造豪华质感的车品网页 137
7.1.4 设计师谈——为网页制作一个漂亮的等待页面 137
7.1.5 常见色彩搭配 137
7.2 服饰类 138
7.2.1 品牌时装网页 138
7.2.2 年轻服装网页 138
7.2.3 动手练习——将商品突显出来 139
7.2.4 设计师谈——使用菱形进行页面的分割 139
7.2.5 常见色彩搭配 139
7.3 珠宝类 140
7.3.1 珠宝类购物网页 140
7.3.2 品牌珠宝网站 140
7.3.3 动手练习——浅色与深色背景对珠宝产品的影响 141
7.3.4 设计师谈——色块拼贴法 141
7.3.5 常见色彩搭配 141
7.4 建筑装潢 142
7.4.1 室内设计装饰公司网页 142
7.4.2 景观事务所网页 142
7.4.3 动手练习——为导航栏添加图标增加其识别性 143
7.4.4 设计师谈——简洁明快的网页设计风格 143
7.4.5 常见色彩搭配 143
7.5 媒体、音乐类 144
7.5.1 音乐类网页 144
7.5.2 电视剧网页 144
7.5.3 动手练习——为界面换一个合适的点缀色 145
7.5.4 设计师谈——利用视差滚动，打造全新感官享受 145
7.5.5 常见色彩搭配 145
7.6 IT科技 146
7.6.1 软件研发公司网页 146
7.6.2 电脑制造商网页 146
7.6.3 动手练习——卫星式布局方式的妙用 147
7.6.4 设计师谈——为界面添加一个合适的字体 147
7.6.5 常见色彩搭配 147
7.7 教育类 148
7.7.1 知名大学网页 148
7.7.2 私立学校网页 148
7.7.3 动手练习——为页面填写一个显眼的辅助色 149
7.7.4 设计师谈——为网站设计一个漂亮的404界面 149
7.7.5 常见色彩搭配 149
第8章 不同风格的网页设计 151
8.1 简约至上主义风格 152
8.1.1 简洁 153
8.1.2 整齐 153
8.1.3 动手练习——使网页看起来唯美、整洁 154
8.1.4 设计师谈——简约是一种特殊的表达 154
8.1.5 常见色彩搭配 154
8.2 绚丽的欧美风格 155
8.2.1 突出 156
8.2.2 细腻 156
8.2.3 动手练习——将页面改为中纯度色彩基调 157
8.2.4 设计师谈——欧美风网站的色彩搭配 157
8.2.5 常见色彩搭配 157
8.3 淡雅的韩式风格 158
8.3.1 淡雅 159
8.3.2 醇厚 159
8.3.3 动手练习——使网页看起来清新淡雅 160
8.3.4 设计师谈——韩式的淡雅清新 160
8.3.5 常见色彩搭配 160
8.4 悠远的日式风格 161
8.4.1 细腻 162
8.4.2 民族 162
8.4.3 动手练习——使网页看起来更富意境 163
8.4.4 设计师谈——日式风格 163
8.4.5 常见色彩搭配 163
8.5 空间感网页设计 164
8.5.1 层次 165
8.5.2 立体 165
8.5.3 动手练习——使网页层次更加清晰 166
8.5.4 设计师谈——“立体感”的产生 166
8.5.5 常见色彩搭配 166
8.6 扁平化设计 167
8.6.1 整洁 168
8.6.2 简约 168
8.6.3 动手练习——为页面选择一个合适的颜色 169
8.6.4 设计师谈——力求简约的扁平化设计 169
8.6.5 常见色彩搭配 169
8.7 趣味的手绘风格 170
8.7.1 趣味 171
8.7.2 鲜活 171
8.7.3 动手练习——添加插画，活跃页面气氛 172
8.7.4 设计师谈——富有亲和力的手绘风 172
8.7.5 常见色彩搭配 172
8.8 抽象的网页设计 173
8.8.1 精炼 174
8.8.2 情绪 174
8.8.3 动手练习——使网页风格更加简约 175
8.8.4 设计师谈——抽象风是情绪的精炼 175
8.8.5 常见色彩搭配 175
8.9 怀旧的复古风格 176
8.9.1 回忆 177
8.9.2 浓厚 177
8.9.3 动手练习——使网页视觉重点突出 178
8.9.4 设计师谈——复古风的融情 178
8.9.5 常见色彩搭配 178
第9章 综合版式配色 179
9.1 儿童主题网页 180
9.1.1 项目分析 180
9.1.2 案例分析 180
9.1.3 版式分析 181
9.1.4 配色方案 182
9.1.5 佳作欣赏 183
9.2 自然主题网页 184
9.2.1 项目分析 184
9.2.2 案例分析 184
9.2.3 版式分析 185
9.2.4 配色方案 186
9.2.5 佳作欣赏 187
9.3 科技类网页 188
9.3.1 项目分析 188
9.3.2 案例分析 188
9.3.3 版式分析 189
9.3.4 配色方案 190
9.3.5 佳作欣赏 191
9.4 商务风格网页 192
9.4.1 项目分析 192
9.4.2 案例分析 192
9.4.3 版式分析 193
9.4.4 配色方案 194
9.4.5 佳作欣赏 195