Photoshop网页风格与配色设计全程揭秘PDF电子书下载

第1章 网页配色基础知识 1

1.1 色彩基础知识 1

1.1.1 色彩学 1

1.1.2 色彩传达的意义 1

1.1.3 色彩的属性 2

1.1.4 色彩的联想 4

1.1.5 RGB和HSB 5

1.1.6 网页安全色 6

1.2 色彩的搭配 6

1.2.1 色彩搭配的基础 6

1.2.2 色彩搭配的原则 8

1.3 网页色彩的选择标准 10

1.3.1 根据行业选择配色方案 10

1.3.2 根据浏览者的差异选择配色方案 11

1.3.3 根据色彩个性选择配色方案 13

1.3.4 根据星座选择配色方案 14

1.3.5 根据季节选择配色方案 16

1.4 网页中色彩的应用 20

1.4.1 网页中的色彩比例 20

1.4.2 网页中的留白艺术 22

1.4.3 色彩的层次 23

1.5 本章小结 23

第2章 配色与网页风格 24

2.1 网页背景颜色 24

2.1.1 使用颜色作为背景 24

实例01＋视频：使用纯色作为背景 25

实例02＋视频：使用渐变色作为背景 27

2.1.2 使用图片作为背景 29

实例03＋视频：使用图片作为背景 29

2.2 网页文本颜色 32

2.2.1 文字的排版规则 32

2.2.2 文本配色之“黄金分割法” 32

实例04＋视频：制作时尚网站首页 33

2.3 网站图片的色系 35

2.3.1 网站焦点图 35

实例05＋视频：制作时尚图片网页 36

2.3.2 网页配图 39

实例06＋视频：制作清爽服装网页 40

2.4 网页中的线条与图形 43

2.4.1 在网页中使用线条 43

实例07＋视频：制作典雅的个人主页 43

2.4.2 在网页中使用形状 46

实例08＋视频：制作有趣的设计网站 47

2.5 常见网站风格分析 50

2.5.1 中式风格网站分析 50

2.5.2 日韩风格网站分析 51

2.5.3 欧美风格网站分析 52

2.6 本章小结 54

第3章 网站配色设计应用——红色系 55

3.1 正红 55

3.1.1 配色分析 55

3.1.2 配色实例 56

实例09＋视频：设计家居类网站 56

3.1.3 配色原理分析 59

3.1.4 扩展方案 59

3.2 深红色 60

3.2.1 配色分析 60

3.2.2 配色实例 61

实例10＋视频：设计快餐类网站 61

3.2.3 配色原理分析 64

3.2.4 扩展方案 64

3.3 朱红色 64

3.3.1 配色分析 64

3.3.2 配色实例 65

实例11＋视频：设计书籍类网站 66

3.3.3 配色原理分析 69

3.3.4 扩展方案 69

3.4 玫瑰红 70

3.4.1 配色分析 70

3.4.2 配色实例 71

实例12＋视频：设计女性时尚生活类网站 71

3.4.3 配色原理分析 74

3.4.4 扩展方案 74

3.5 紫红色 75

3.5.1 配色分析 75

3.5.2 配色实例 76

实例13＋视频：设计美容护肤类网站 76

3.5.3 配色原理分析 79

3.5.4 扩展方案 79

3.6 宝石红 79

3.6.1 配色分析 79

3.6.2 配色实例 80

实例14＋视频：设计餐饮类网站 81

3.6.3 配色原理分析 83

3.6.4 扩展方案 83

3.7 本章小结 84

第4章 网站配色设计应用——橙色系 85

4.1 正橙色 85

4.1.1 配色分析 85

4.1.2 配色实例 86

实例15＋视频：制作活跃的美食网页 86

4.1.3 配色原理分析 89

4.1.4 扩展方案 89

4.2 太阳橙 90

4.2.1 配色分析 90

4.2.2 配色实例 91

实例16＋视频：制作亲切的产品宣传网页 91

4.2.3 配色原理分析 94

4.2.4 扩展方案 94

4.3 杏黄色 94

4.3.1 配色分析 94

4.3.2 配色实例 95

实例17＋视频：制作质朴的网络花店网页 96

4.3.3 配色原理分析 98

4.3.4 扩展方案 99

4.4 浅土色 99

4.4.1 配色分析 99

4.4.2 配色实例 100

实例18＋视频：制作温馨的电影动画网页 101

4.4.3 配色原理分析 103

4.4.4 扩展方案 104

4.5 咖啡色 104

4.5.1 配色分析 104

4.5.2 配色实例 105

实例19＋视频：制作高贵的西餐网页 105

4.5.3 配色原理分析 108

4.5.4 扩展方案 109

4.6 棕色 109

4.6.1 配色分析 109

4.6.2 配色实例 110

实例20＋视频：制作漂亮的卡通甜点网页 110

4.6.3 配色原理分析 113

4.6.4 扩展方案 114

4.7 本章小结 114

第5章 网站配色设计应用——黄色系 115

5.1 鲜黄色 115

5.1.1 配色分析 115

5.1.2 配色实例 116

实例21＋视频：制作明艳的商务网站 116

5.1.3 配色原理分析 119

5.1.4 扩展方案 119

5.2 含羞草 119

5.2.1 配色分析 119

5.2.2 配色实例 120

实例22＋视频：制作活跃的旅游度假网站 121

5.2.3 配色原理分析 124

5.2.4 扩展方案 124

5.3 铬黄 125

5.3.1 配色分析 125

5.3.2 配色实例 126

实例23＋视频：制作个性的艺术网站 126

5.3.3 配色原理分析 130

5.3.4 扩展方案 130

5.4 香槟黄 130

5.4.1 配色分析 130

5.4.2 配色实例 131

实例24＋视频：制作精致的美食网站 132

5.4.3 配色原理分析 135

5.4.4 扩展方案 135

5.5 淡黄色 135

5.5.1 配色分析 135

5.5.2 配色实例 137

实例25＋视频：制作悠闲的韩食网站 137

5.5.3 配色原理分析 139

5.5.4 扩展方案 140

5.6 本章小结 140

第6章 网站配色设计应用——绿色系 141

6.1 苹果绿 141

6.1.1 配色分析 141

6.1.2 配色实例 142

实例26＋视频：制作工作室网站 142

6.1.3 配色原理分析 145

6.1.4 扩展方案 145

6.2 翡翠绿 145

6.2.1 配色分析 145

6.2.2 配色实例 146

实例27＋视频：制作游戏类网站 147

6.2.3 配色原理分析 149

6.2.4 扩展方案 150

6.3 黄绿色 150

6.3.1 配色分析 150

6.3.2 配色实例 151

实例28＋视频：制作广告类网站 151

6.3.3 配色原理分析 154

6.3.4 扩展方案 154

6.4 浓绿色 155

6.4.1 配色分析 155

6.4.2 配色实例 156

实例29＋视频：制作保险类网站 156

6.4.3 配色原理分析 158

6.4.4 扩展方案 159

6.5 浅绿色 159

6.5.1 配色分析 159

6.5.2 配色实例 160

实例30＋视频：制作家居类网站 160

6.5.3 配色原理分析 163

6.5.4 扩展方案 163

6.6 孔雀绿 164

6.6.1 配色分析 164

6.6.2 配色实例 165

实例31＋视频：制作饮品类网站 165

6.6.3 配色原理分析 167

6.6.4 扩展方案 168

6.7 本章小结 168

第7章 网站配色设计应用——蓝色系 169

7.1 天蓝色 169

7.1.1 配色分析 169

7.1.2 配色实例 170

实例32＋视频：制作工作室网站 170

7.1.3 配色原理分析 173

7.1.4 扩展方案 174

7.2 水蓝色 174

7.2.1 配色分析 174

7.2.2 配色实例 175

实例33＋视频：制作体育类网站 175

7.2.3 配色原理分析 178

7.2.4 扩展方案 178

7.3 深蓝色 178

7.3.1 配色分析 178

7.3.2 配色实例 179

实例34＋视频：制作广告类网站 179

7.3.3 配色原理分析 182

7.3.4 扩展方案 182

7.4 浅蓝色 183

7.4.1 配色分析 183

7.4.2 配色实例 184

实例35＋视频：设计饮食类网站 184

7.4.3 配色原理分析 187

7.4.4 扩展方案 187

7.5 蔚蓝色 187

7.5.1 配色分析 187

7.5.2 配色实例 188

实例36＋视频：设计滑雪网站 188

7.5.3 配色原理分析 192

7.5.4 扩展方案 192

7.6 深青色 192

7.6.1 配色分析 192

7.6.2 配色实例 193

实例37＋视频：设计游戏类网站 193

7.6.3 配色原理分析 196

7.6.4 扩展方案 196

7.7 本章小结 196

第8章 网站配色设计应用——紫色系 197

8.1 丁香紫 197

8.1.1 颜色分析 197

8.1.2 配色实例 198

实例38＋视频：制作清爽的甜点页面 198

8.1.3 配色原理分析 201

8.1.4 扩展方案 202

8.2 紫色 202

8.2.1 颜色分析 202

8.2.2 配色实例 203

实例39＋视频：制作搜索引擎页面 203

8.2.3 配色原理分析 207

8.2.4 扩展方案 207

8.3 深紫色 207

8.3.1 颜色分析 207

8.3.2 配色实例 208

实例40＋视频：制作优雅的手机页面 209

8.3.3 配色原理分析 213

8.3.4 扩展方案 213

8.4 菖蒲色 213

8.4.1 颜色分析 213

8.4.2 配色实例 214

实例41＋视频：制作电子产品页面 215

8.4.3 配色原理分析 218

8.4.4 扩展方案 218

8.5 浅莲灰 218

8.5.1 颜色分析 218

8.5.2 配色实例 219

实例42＋视频：制作清爽漂亮的页面 220

8.5.3 配色原理分析 224

8.5.4 扩展方案 224

8.6 本章小结 224

第9章 网站配色设计应用——无彩色系 225

9.1 白色 225

9.1.1 配色分析 225

9.1.2 配色实例 226

实例43＋视频：制作时尚的时装网页 226

9.1.3 配色原理分析 228

9.1.4 扩展方案 228

9.2 蓝灰色 229

9.2.1 配色分析 229

9.2.2 配色实例 230

实例44＋视频：制作精致的饮料网页 230

9.2.3 配色原理分析 233

9.2.4 扩展方案 233

9.3 中灰色 234

9.3.1 配色分析 234

9.3.2 配色实例 235

实例45＋视频：制作豪华的汽车网页 235

9.3.3 配色原理分析 238

9.3.4 扩展方案 238

9.4 浅灰色 239

9.4.1 配色分析 239

9.4.2 配色实例 240

实例46＋视频：制作清凉的绿色食品网页 240

9.4.3 配色原理分析 243

9.4.4 扩展方案 243

9.5 黑色 244

9.5.1 配色分析 244

9.5.2 配色实例 245

实例47＋视频：制作华丽的电子产品网页 245

9.5.3 配色原理分析 248

9.5.4 扩展方案 248

9.6 本章小结 249

第10章 辅助配色软件 250

10.1 使用配色软件ColorKey Xp 250

10.1.1 软件简介 250

10.1.2 软件基本功能 251

10.1.3 配色实例 254

实例48＋视频：制作化妆品网站 254

10.2 使用配色软件Adobe Kuler 257

10.2.1 软件简介 257

10.2.2 软件基本功能 257

10.2.3 配色实例 259

实例49＋视频：制作娱乐休闲网站 259

10.2.4 配色实例 263

实例50＋视频：制作食品类网站 263

10.3 本章小结 267