網站布局與網頁配色設計

網站布局與網頁配色設計

《網站布局與網頁配色設計》是2019年8月人民郵電出版社出版的圖書,作者是張曉景。

基本介紹

  • 中文名:網站布局與網頁配色設計
  • 作者:張曉景
  • ISBN:9787115479372
  • 定價:79.8元
  • 出版社:人民郵電出版社
  • 出版時間:2019年8月
  • 裝幀:平裝
  • 開本:16開
內容簡介,圖書目錄,

內容簡介

本書全面解析了網站頁面布局與配色設計的相關知識,完全拋開了網頁設計必須遵循的限制條件及有關設計軟體的內容,而是運用可以激發創意、擴展設計思路的方法對網站頁面布局與配色設計進行講解,並對具體的案例進行分析。全書共分為9章,涵蓋了網站設計的方方面面。

圖書目錄

第 1章 網站設計基礎
1.1 了解網站設計 2
1.1.1 什麼是網站設計 2
1.1.2 網站設計的特點 2
1.2 網站設計構成元素 6
1.2.1 文字 6
1.2.2 圖形符號 6
1.2.3 圖像 7
1.2.4 多媒體 7
1.2.5 色彩 7
1.3 網站設計原則 8
1.3.1 以用戶為中心 8
1.3.2 主題明確 9
1.3.3 視覺美觀 11
1.3.4 內容與形式統一 11
1.3.5 有機的整體 12
1.4 色彩在網站設計中的作用 13
1.4.1 突出網頁主題 13
1.4.2 劃分視覺區域 14
1.4.3 吸引瀏覽者的目光 14
1.4.4 增強網站頁面的藝術性 14
1.5 如何設計出好的網站 15
1.5.1 不要主動降低自己的眼光 15
1.5.2 多嘗試新技術、新方法 15
1.6 如何提升網站的用戶體驗 16
1.6.1 用戶體驗包含的內容 16
1.6.2 用戶體驗對於網站的重要性 18
1.6.3 網站如何尋求突破 19
1.6.4 提升網站用戶體驗 20
第 2章 網站頁面規劃與元素設計
2.1 網站欄目結構與頁面策劃 22
2.1.1 網站欄目結構 22
2.1.2 網站欄目規劃 24
2.1.3 網站頁面策劃 24
2.2 網站 Logo設計 25
2.2.1 網站 Logo的特點 25
2.2.2 網站 Logo的設計規範 26
2.2.3 網站 Logo的表現形式 28
2.2.4 實戰分析:設計影視 網站 Logo 29
2.3 網站圖示設計 31
2.3.1 了解網站圖示 31
2.3.2 網站圖示設計原則 31
2.3.3 網站圖示套用 33
2.3.4 實戰分析:設計簡約實用的 網站圖示 34
2.4 網站按鈕設計 36
2.4.1 網站按鈕的功能 36
2.4.2 如何設計出色的網站按鈕 38
2.4.3 實戰分析:設計遊戲 網站按鈕 42
2.5 網站導航設計 43
2.5.1 了解網站導航 43
2.5.2 導航在網站頁面中的布局位置 45
2.5.3 網站導航設計的基本原則 49
2.5.4 實戰分析:設計汽車網站 導航選單 50
2.6 網站廣告設計 53
2.6.1 網站廣告的常見類型 53
2.6.2 如何設計出色的網站廣告 55
2.6.3 實戰分析:設計家電網站 宣傳廣告 56
第3 章 網站中的圖形與文字排版設計
3.1 網站頁面中的文字 59
3.1.1 關於字型 59
3.1.2 網頁中常用的中文字型 59
3.1.3 字型大小 60
3.1.4 網頁文字使用技巧 63
3.2 網頁文字的排版 65
3.2.1 文字排版的易讀性規則 65
3.2.2 文字排版設計常用手法 67
3.2.3 實戰分析:設計手機宣傳網站頁面 70
3.3 圖形在網站設計中的作用 73
3.4 網站圖形設計類型 75
3.4.1 插圖 75
3.4.2 圖形符號 75
3.4.3 照片 76
3.4.4 頁面分割 77
3.4.5 立體圖形 77
3.5 網站圖片的排列布局形式 78
3.5.1 傳統矩陣展示 78
3.5.2 大小不一的矩陣展示 79
3.5.3 瀑布流展示 79
3.5.4 下一張圖片預覽 79
3.5.5 實戰分析:設計產品促銷活動頁面 80
第4 章 網站頁面布局與視覺風格
4.1 了解網站頁面布局 85
4.1.1 網站頁面布局的目的 85
4.1.2 網站頁面布局的操作順序 86
4.2 網頁布局的基本方法 86
4.2.1 網頁布局的設計 87
4.2.2 網頁布局的構成原則 87
4.2.3 實戰分析:設計手機宣傳網站頁面 88
4.3 根據整體內容位置決定的網頁視覺布局 91
4.3.1 滿屏式頁面布局 91
4.3.2 兩欄式頁面布局 92
4.3.3 三欄式頁面布局 95
4.3.4 水平和垂直居中的頁面布局 96
4.4 頁面分割方向的布局方式 97
4.4.1 縱向分割 97
4.4.2 橫向分割 98
4.4.3 縱向與橫向複合型 98
4.4.4 運用固定區域的設計 99
4.4.5 實戰分析:設計類網站頁面 100
4.5 初始頁面的網頁布局類型 102
4.6 網頁布局的要點 104
第5 章 網站頁面視覺布局形態
5.1 網頁功能與網頁形態哪個更重要 107
5.2 網頁布局形態的含義及情感 108
5.2.1 點 108
5.2.2 圓 109
5.2.3 三角形 110
5.2.4 矩形 111
5.2.5 菱形 112
5.2.6 直線 113
5.2.7 斜線 114
5.2.8 曲線 115
5.2.9 自由曲線 116
5.2.10 實戰分析:設計產品促銷頁面 117
5.3 大眾化網頁布局形態 120
5.4 個性化網頁布局形態 122
5.5 常見網頁視覺風格解析 123
5.5.1 簡潔風格 123
5.5.2 極簡風格 124
5.5.3 扁平化風格 124
5.5.4 插畫風格 125
5.5.5 懷舊風格 126
5.5.6 照片風格 127
5.5.7 立體風格 128
5.5.8 大字型風格 129
5.5.9 實戰分析:設計企業網站頁面 130
第6 章 網頁配色基礎
6.1 色彩基礎 134
6.1.1 色彩的產生 134
6.1.2 光源色與物體色 135
6.2 RGB 顏色與CMYK 顏色的區別 135
6.2.1 RGB 顏色 136
6.2.2 CMYK 顏色 137
6.3 色彩的屬性 137
6.3.1 色相 137
6.3.2 明度 138
6.3.3 飽和度 138
6.3.4 色調 139
6.3.5 無彩色與有彩色 139
6.4 網頁配色的聯想作用 140
6.4.1 色彩聯想和心理效果 140
6.4.2 紅色 141
6.4.3 粉色 141
6.4.4 橙色 141
6.4.5 黃色 142
6.4.6 棕色 142
6.4.7 綠色 142
6.4.8 藍色 143
6.4.9 紫色 143
6.4.10 黑色 144
6.4.11 白色 144
6.4.12 灰色 144
6.4.13 實戰分析:設計珠寶首飾網站頁面 145
6.5 網頁配色常見問題 147
6.5.1 如何培養色彩的敏感度 147
6.5.2 通用配色理論是否適用 148
6.5.3 配色時應該選擇雙色還是多色組合 148
6.5.4 儘可能使用兩至三種顏色進行搭配 149
6.5.5 如何快速實現完美的配色 149
6.5.6 實戰分析:設計汽車宣傳網站頁面 150
第7 章 網頁元素的基本配色
7.1 網頁配色的基本方法 154
7.1.1 主題色 154
7.1.2 背景色 155
7.1.3 輔助色 156
7.1.4 點綴色 157
7.2 網頁文本配色 158
7.2.1 網頁與文本的配色關係 158
7.2.2 良好的網頁文本配色 159
7.3 網頁元素色彩搭配160
7.3.1 Logo 與網頁廣告 160
7.3.2 導航選單 161
7.3.3 背景與文字 161
7.3.4 連結文字 162
7.3.5 實戰分析:設計咖啡館宣傳網站頁面 162
7.4 根據客群群體選擇網頁配色 165
7.4.1 不同性別的色彩偏好 165
7.4.2 不同年齡的色彩偏好 166
7.5 根據商品銷售階段選擇網頁配色 168
7.5.1 新產品上市期的網頁配色 168
7.5.2 產品拓展期的網頁配色 168
7.5.3 產品穩定銷售期的網頁配色 169
7.5.4 產品衰退期的網頁配色 169
7.5.5 實戰分析:設計酒類產品宣傳網站頁面 170
7.6 如何打造成功的網頁配色 172
7.6.1 遵循色彩的基本原理 172
7.6.2 考慮網頁的特點 173
7.6.3 靈活套用配色技巧 174
7.6.4 避免配色混亂 175
7.6.5 實戰分析:設計產品宣傳網站頁面 176
第8 章 網頁配色的方法
8.1 基於色相進行配色 180
8.1.1 基於色相的配色關係 180
8.1.2 相反色相、類似色調配色 181
8.1.3 相反色相、相反色調配色 181
8.1.4 漸變配色 182
8.1.5 無彩色和彩色 183
8.2 基於色調進行配色 183
8.2.1 基於色調的配色關係 184
8.2.2 同一色相或類似色相、類似色調配色 184
8.2.3 同一色相或類似色相、相反色調配色 185
8.3 色彩感覺在網頁配色中的套用 186
8.3.1 冷暖感 186
8.3.2 輕重感 188
8.3.3 軟硬感 189
8.3.4 前後感 189
8.3.5 大小感 190
8.3.6 華麗感與樸實感 191
8.3.7 寧靜感與興奮感 192
8.3.8 活力感與莊重感 193
8.3.9 實戰分析:設計計算機產品促銷廣告頁面 193
8.4 色彩對比的配色 196
8.4.1 冷暖對比 196
8.4.2 面積對比 198
8.4.3 色相對比 200
8.4.4 同時對比 204
8.4.5 連續對比 204
8.4.6 實戰分析:設計運動鞋宣傳網站頁面 205
第9 章 網頁配色的技巧
9.1 突出主題的配色技巧 209
9.1.1 明確主題焦點 209
9.1.2 提高飽和度 209
9.1.3 增大明度差 210
9.1.4 增強色相 211
9.1.5 增強點綴色 212
9.1.6 抑制輔助色或背景 213
9.2 整體融合的配色技巧 214
9.2.1 接近色相 215
9.2.2 統一明度 216
9.2.3 接近色調 216
9.2.4 添加類似色或同類色 217
9.2.5 網頁產生穩定感 217
9.2.6 實戰分析:設計房地產宣傳網站頁面 218
9.3 網頁配色印象 221
9.3.1 女性化的網站配色 221
9.3.2 男性化的網站配色 222
9.3.3 穩定安靜的網站配色 223
9.3.4 興奮激昂的網站配色 224
9.3.5 輕快律動的網站配色 225
9.3.6 清爽和風的網站配色 226
9.3.7 浪漫甜美的網站配色 227
9.3.8 傳統穩重的網站配色 229
9.3.9 雍容華貴的網站配色 230
9.3.10 實戰分析:設計清新自然的環保網站頁面 231
9.4 使用配色軟體進行配色 233
9.4.1 ColorKey XP 軟體 233
9.4.2 Color Scheme Designer 235
9.4.3 Check My Colours 236
9.4.4 ColorJack 236

相關詞條

熱門詞條

聯絡我們