网页布局与配色完全学习手册PDF电子书下载

第1篇 网页设计与布局 1

第1章 网页设计入门基础 1

1.1 网页设计的原则 2

1.1.1 了解用户需要 2

1.1.2 内容与形式的统一 2

1.1.3 主题鲜明 3

1.1.4 易用性 4

1.1.5 整体统一 5

1.1.6 对比性 6

1.2 网页设计的定位 6

1.2.1 什么才是好的网页设计 7

1.2.2 怎样做好网页设计 7

1.3 色彩在网页设计中的重要性 9

第2章 网站策划与网页布局 10

2.1 网站栏目和页面设计策划 11

2.1.1 为什么要进行策划 11

2.1.2 网站的栏目策划 11

2.1.3 网站的页面策划 12

2.2 网站布局的基本元素 13

2.2.1 网站Logo 13

2.2.2 网站Banner 14

2.2.3 导航栏 14

2.2.4 主体内容 14

2.2.5 文本 15

2.2.6 图像 15

2.2.7 Flash动画 16

2.2.8 页脚 16

2.2.9 广告区 16

2.3 版面布局设计 16

2.3.1 版面布局原则 17

2.3.2 纸上布局 18

2.3.3 软件布局 18

2.4 常见的版面布局形式 19

2.4.1 “国”字形布局 19

2.4.2 “厂”字形布局 19

2.4.3 “框架”型布局 19

2.4.4 “封面”型布局 20

2.4.5 Flash型布局 20

2.5 页面排版布局趋势 20

第3章 网站页面的视觉元素设计 22

3.1 网页构成 23

3.1.1 点的应用 23

3.1.2 线的应用 23

3.1.3 面的应用 24

3.2 页面中的文字设计 24

3.2.1 文字的字体、字号、行距 24

3.2.2 文字的颜色 25

3.2.3 文字的图形化 25

3.2.4 让文字易读 26

3.3 页面中的图像应用 26

3.3.1 常见的网页图像格式 26

3.3.2 网页中应用图像的注意要点 27

3.3.3 让图片更合理 28

3.4 网站导航设计 29

3.4.1 导航设计的基本要求 29

3.4.2 全局导航的基础要素 30

3.4.3 导航设计注意要点 30

3.4.4 让按钮更易点击 31

第4章 网站页面创意方法与技巧 32

4.1 页面设计创意思维 33

4.1.1 什么是创意 33

4.1.2 创意思维的原则 33

4.1.3 创意过程 34

4.2 创意的方法 34

4.2.1 富于联想 34

4.2.2 巧用对比 35

4.2.3 大胆夸张 35

4.2.4 趣味幽默 35

4.2.5 善用比喻 36

4.2.6 以小见大 36

4.2.7 偶像崇拜 36

4.2.8 古典传统 36

4.2.9 流行时尚 37

4.2.10 设置悬念 37

4.2.11 突出人物 37

4.2.12 神奇梦幻 38

4.2.13 综合创意 38

4.3 网站页面风格 38

4.3.1 金属风格 38

4.3.2 大幅配图 39

4.3.3 面板风格 39

4.3.4 像素风格 39

4.3.5 三维风格 39

4.3.6 书报风格 40

4.4 网页的创意视觉表现 40

第2篇 网页设计与配色 42

第5章 网页色彩搭配基础 42

5.2 色彩的分类 43

5.2.1 无彩色 43

5.2.2 有彩色 44

5.3 色彩的三要素 44

5.3.1 明度 44

5.3.2 色相 45

5.3.3 纯度 45

5.4 色彩模式 46

5.4.1 RGB模式 46

5.4.2 CMYK模式 46

5.4.3 Lab模式 47

5.5 色调分析 47

5.5.1 纯色调 47

5.5.2 中纯调 47

5.5.3 低纯调 48

5.5.4 明灰调 48

5.5.5 中灰调 48

5.5.6 暗灰调 48

5.5.7 中暗调 49

5.5.8 深暗调 49

第6章 网页色彩原理与色调基础 50

6.1 色彩对比 51

6.1.1 色相对比 51

6.1.2 明度对比 55

6.1.3纯度对比 56

6.1.4 色彩的面积对比 57

6.1.5 色彩的冷暖对比 58

6.2 色彩的调和 60

6.2.1 色彩调和的原则 60

6.2.2 色彩调和的基本方法 61

6.3 色彩调和的类型 62

6.3.1 同类色调和 62

6.3.2 渐变色调和 62

6.3.3 对比调和 63

6.3.4 同一调和 63

6.3.5 面积调和 64

第7章 网页配色方法与技巧 65

7.1 网页配色安全 66

7.1.1 216网页安全色 66

7.1.2 网页安全色配色辞典 66

7.1.3 使用各种不同的安全色调色板 67

7.2 网页配色技巧 68

7.2.1 背景与文字颜色搭配 68

7.2.2 使用一种色彩 69

7.2.3 两色搭配是用色的基础 69

7.2.4 色彩的数量 70

7.3 使用配色软件 70

7.3.1 ColorKey Xp 71

7.3.2 Color Scheme Designer 71

7.3.3 Check My Colours 71

7.3.4 ColorJack 72

7.3.5 Color Schemer Online v2 72

第8章 网页配色中主色、辅色及点缀色的作用 73

8.1 主色的魅力 74

8.1.1 主色可以决定整个作品风格 74

8.1.2 主色的面积原理 74

8.1.3 区别主色的关键 75

8.2 辅助色的秘密 76

8.2.1 辅助色的功能 76

8.2.2 背景色是特殊的辅助色 77

8.2.3 选择辅助色的诀窍 77

8.3 点缀色的应用 77

8.3.1 点缀色也会影响页面风格 78

8.3.2 点缀色能让页面放光彩 78

第9章 网页设计配色搭配方案剖析 79

9.1 配色色标 80

9.2 强烈 82

9.2.1 推荐配色方案 82

9.2.2 配色解析 82

9.3 丰富 83

9.3.1 推荐配色方案 83

9.3.2 配色解析 83

9.4 浪漫 84

9.4.1 推荐配色方案 84

9.4.2 配色解析 84

9.5 奔放 85

9.5.1 推荐配色方案 85

9.5.2 配色解析 85

9.6 柔和 86

9.6.1 推荐配色方案 86

9.6.2 配色解析 86

9.7 热情 87

9.7.2 配色解析 87

9.7.1 推荐配色方案 87

9.8 动感 87

9.8.1 推荐配色方案 87

9.8.2 配色解析 88

9.9 高雅 88

9.9.1 推荐配色方案 88

9.9.2 配色解析 89

9.10 流行 89

9.10.1 推荐配色方案 89

9.10.2 配色解析 90

9.11 清新 90

9.11.1 推荐配色方案 90

9.11.2 配色解析 91

9.12 古典 91

9.12.1 推荐配色方案 91

9.12.2 配色解析 92

9.13 堂皇 92

9.13.1 推荐配色方案 92

9.13.2 配色解析 93

9.14 神奇 93

9.14.1 推荐配色方案 93

9.14.2 配色解析 94

9.15 职业 94

9.15.1 推荐配色方案 94

9.15.2 配色解析 95

第10章 网页配色中色相的应用 96

10.1 红色系的配色 97

10.1.1 红色系的分类 97

10.1.2 红色适合的配色方案 98

10.1.3 适用红色系的网站 100

10.2 橙色系的配色 101

10.2.1 橙色系的分类 101

10.2.2 橙色适合的配色方案 102

10.2.3 适用橙色系的网站 103

10.3 黄色系的配色 104

10.3.1 黄色系的分类 104

10.3.2 黄色适合的配色方案 105

10.3.3 适用黄色系的网站 107

10.4 紫色系的配色 108

10.4.1 紫色系的分类 108

10.4.2 紫色适合的配色方案 109

10.4.3 适用紫色系的网站 110

10.5 绿色系的配色 112

10.5.1 绿色系的分类 112

10.5.2 绿色适合的配色方案 113

10.5.3 适用绿色系的网站 114

10.6 蓝色系的配色 116

10.6.1 蓝色系的分类 116

10.6.2 蓝色适合的配色方案 117

10.6.3 适用蓝色系的网站 118

10.7 无彩色的配色 119

10.7.1 白色的网站 119

10.7.2 灰色系的网站 120

10.7.3 黑色系的网站 120

第3篇 综合案例解析 121

第11章 各类网站设计与配色案例解析 121

11.1 个人网站 122

11.1.1 个人网站特点 122

11.1.2 页面分析 122

11.1.3 网站配色讲解 123

11.2 政府网站 123

11.2.1 政府网站的特点 123

11.2.2 页面分析 124

11.2.3 网站配色讲解 125

11.3 艺术网站 125

11.3.1 艺术网站的特点 125

11.3.2 页面分析 125

11.3.3 网站配色讲解 126

11.4 在线视频网站 126

11.4.1 在线视频网站的特点 127

11.4.2 页面分析 127

11.4.3 网站配色讲解 127

11.5 音乐网站 128

11.5.1 音乐网站的特点 128

11.5.2 页面分析 128

11.5.3 网站配色讲解 128

11.6 游戏网站 129

11.6.1 游戏网站的特点 129

11.6.2 页面分析 130

11.6.3 网站配色讲解 131

11.7 婚恋交友网站 131

11.7.1 婚恋交友网站的特点 131

11.7.2 页面分析 132

11.7.3 网站配色讲解 132

11.8 旅游网站 132

11.8.1 旅游网站的特点 133

11.8.2 页面分析 134

11.8.3 网站配色讲解 134

11.9 医疗保健网站 135

11.9.1 医疗保健网站的特点 135

11.9.2 页面分析 136

11.9.3 网站配色讲解 136

11.10 设计装饰类网站 137

11.10.1 设计装饰类网站的特点 137

11.10.2 页面分析 137

11.10.3 网站配色讲解 137

11.11 房地产网站 138

11.11.1 房地产网站的特点 138

11.11.2 页面分析 138

11.11.3 网站配色讲解 138

11.12 餐饮酒店网站 139

11.12.1 餐饮酒店网站的特点 139

11.12.2 页面分析 139

11.12.3 网站配色讲解 140

11.13 新闻网站 140

11.13.1 新闻网站的特点 140

11.13.2 页面分析 141

11.13.3 网站配色讲解 142

11.14 教育网站 143

11.14.1 教育网站的特点 143

11.14.2 页面分析 144

11.14.3 网站配色讲解 144

11.15 综合门户网站 145

11.15.1门户网站的特点 145

11.15.2 页面分析 145

11.15.3 网站配色讲解 146

11.16 女装网站 146

11.16.1 女装网站的特点 146

11.16.2 页面分析 146

11.16.3 网站配色讲解 147

11.17 美容化妆网站 147

11.17.1 美容化妆网站的特点 148

11.17.2 页面分析 148

11.17.3 网站配色讲解 149

11.18 IT数码网站 149

11.18.1 IT数码网站的特点 149

11.18.2 页面分析 150

11.18.3 网站配色讲解 150

11.19 家居日用品网站 151

11.19.1 家居用品网站的特点 151

11.19.2 页面分析 151

11.19.3 网站配色讲解 151

11.20 男性商品类网站 152

11.20.1 男性商品类网站的特点 152

11.20.2 页面分析 152

11.20.3 网站配色讲解 153

11.21 鞋类网站 153

11.21.1 鞋类网站的特点 153

11.21.2 页面分析 153

11.21.3 网站配色讲解 154

11.22 童装网站 154

11.22.1 童装网站的特点 154

11.22.2 页面分析 154

11.22.3 网站配色讲解 155

11.23 珠宝饰品网站 155

11.23.1 珠宝饰品网站的特点 155

11.23.2 页面分析 155

11.23.3 网站配色讲解 156

11.24 食品网站 156

11.24.1 食品网站的特点 156

11.24.2 页面分析 156

11.24.3 网站配色讲解 157

附录1 各行业网站色彩搭配 158

附录2 配色形容词色卡 164

附录3 页面安全色 169

附录4 160种配色方案 173