第1章 色彩搭配基础 2
1.1 色彩入门知识 2
1.1.1 色彩的产生 2
1.1.2 光源色、物体色和固有色 2
1.2 色彩的属性 5
1.2.1 色相 5
1.2.2 明度 6
1.2.3 饱和度 6
1.3 色彩在网页中的应用 6
1.3.1 网页色彩特征 7
1.3.2 网页安全色 7
1.4 色彩的联想作用 8
1.4.1 红色 8
1.4.2 橙色 9
1.4.3 黄色 10
1.4.4 绿色 12
1.4.5 蓝色 13
1.4.6 紫色 14
1.4.7 黑、白、灰色 15
1.5 网页色彩搭配的基础 17
1.5.1 网页配色的注意事项 17
1.5.2 灵活应用配色技巧 18
1.5.3 避免配色的混乱 19
1.6 网页色彩搭配的常见问题 19
1.6.1 培养色彩的敏感度 19
1.6.2 通用配色理论是否适用 20
1.6.3 配色时选择双色和多色组合 21
1.6.4 尽可能使用两至三种色彩搭配 22
1.6.5 如何快速实现完美的配色 22
1.7 培养色彩搭配的感觉 23
1.7.1 基于色相的配色关系 24
1.7.2 基于色调的配色关系 24
1.7.3 渐变配色 26
1.7.4 相反色相、类似色调配色 27
1.7.5 相反色相、相反色调配色 28
1.7.6 同一或类似色相、类似色调配色 30
1.7.7 同一或类似色相、相反色调配色 31
第2章 网页设计配色基础 34
2.1 色彩在网页视觉设计中的作用 34
2.1.1 突出网页主题 34
2.1.2 划分视觉区域 34
2.1.3 吸引浏览者目光 35
2.1.4 增强网页艺术性 35
2.2 色彩的联想作用与心理效果 36
2.2.1 色彩的软硬 36
2.2.2 色彩的冷暖 37
2.2.3 色彩的轻重 37
2.2.4 色彩的前后 38
2.2.5 色彩的大小 39
2.2.6 色彩的活泼和端庄感 40
2.2.7 色彩的兴奋和沉稳感 40
2.2.8 色彩的华丽和朴素感 41
2.3 网页配色的方法 41
2.3.1 背景色 41
2.3.2 主色 42
2.3.3 辅助色 43
2.3.4 点缀色 43
2.4 网页配色技巧 44
2.4.1 配色原则 44
2.4.2 确定网页文本配色 45
2.5 影响网页风格的配色 46
2.5.1 冷暖配色 46
2.5.2 白色的应用 47
2.5.3 饱和度影响配色 47
2.6 影响配色的元素 47
2.6.1 根据行业特征选择网页配色 48
2.6.2 根据色彩联想选择网页配色 49
2.6.3 根据受众色彩偏好选择网页配色 51
2.6.4 根据生命周期选择网页配色 53
2.7 色彩与网站布局 57
2.7.1 布局和配色的分组与整合 57
2.7.2 布局和配色的对称与平衡 58
2.7.3 布局和配色的强调与突出 58
2.7.4 布局和配色的虚实与留白 58
2.8 色彩对网站交互的影响 59
2.8.1 颜色的呈现效果由底色决定 59
2.8.2 字体的可读性由颜色的明度差异影响 60
2.9 移动端网站配色特点 60
2.9.1 色调的统一 60
2.9.2 巧用对比配色 61
2.9.3 巧用色彩类别 61
2.9.4 测试配色方案 62
第3章 色彩搭配的选择标准 64
3.1 合理应用色彩的对比 64
3.1.1 色彩面积大小 64
3.1.2 色彩面积的位置对比 65
3.2 网页主题突出的配色 66
3.2.1 提高色彩纯度 67
3.2.2 增大色彩明度差 68
3.2.3 增强色相型 70
3.2.4 控制点缀色 71
3.2.5 抑制辅助色或背景色 72
3.3 保持页面一致性的配色技巧 74
3.3.1 接近色相 75
3.3.2 统一明度 76
3.3.3 添加类似色或同类色 76
3.3.4 控制稳定感 77
3.3.5 接近色调 78
3.3.6 网页的渐变配色 79
3.4 配出四季的颜色 79
3.4.1 春天 80
3.4.2 夏天 81
3.4.3 秋天 82
3.4.4 冬天 83
3.5 网页元素色彩搭配 84
3.5.1 导航菜单 84
3.5.2 Logo与广告 84
3.5.3 背景与文字 85
3.5.4 链接文字 86
第4章 网页布局配色 89
4.1 网站标志配色 89
4.1.1 游戏网站标志配色 89
4.1.2 新闻网站标志配色 92
4.1.3 电商网站标志配色 96
4.1.4 图书网站标志配色 99
4.1.5 个人网站标志配色 103
4.2 网站导航配色 106
4.2.1 教育网站导航配色 106
4.2.2 家居网站导航配色 109
4.2.3 食品网站导航配色 112
4.2.4 个人网站导航配色 116
4.3 网站图片配色 119
4.3.1 家居网站图片配色 119
4.3.2 企业网站图片配色 122
4.3.3 学校网站图片配色 126
4.3.4 社交网站图片配色 129
4.3.5 旅游网站图片配色 133
4.4 网站整体布局配色 136
4.4.1 美食网站布局配色 136
4.4.2 教育网站布局配色 139
4.4.3 休闲网站布局配色 143
4.4.4 儿童网站布局配色 146
4.4.5 美食网站布局配色 149
第5章 移动端网页配色 154
5.1 移动端图标的色彩搭配 154
5.1.1 天气App图标的色彩搭配 154
5.1.2 医疗App图标的色彩搭配 157
5.1.3 购物App图标的色彩搭配 161
5.1.4 运动App图标的色彩搭配 165
5.2 移动端登录界面色彩搭配 169
5.2.1 美食App登录界面色彩搭配 169
5.2.2 社交App登录界面色彩搭配 173
5.2.3 绘图App登录界面色彩搭配 177
5.2.4 邮箱App登录界面色彩搭配 181
5.3 移动界面广告色彩搭配 184
5.3.1 商场App广告色彩搭配 184
5.3.2 食品App广告色彩搭配 188
5.3.3 外卖App广告色彩搭配 192
5.3.4 品牌App广告色彩搭配 195
5.4 App启动界面色彩搭配 199
5.4.1 修图App启动界面色彩搭配 199
5.4.2 美食App启动界面色彩搭配 203
5.4.3 理财App启动界面色彩搭配 206
5.4.4 交友App启动界面色彩搭配 210
5.5 电商活动页的色彩搭配 214
5.5.1 金融活动App色彩搭配 214
5.5.2 服装活动App色彩搭配 218
5.5.3 电商活动App色彩搭配 221
5.5.4 产品活动App色彩搭配 225