眾妙之門：網(wǎng)頁設(shè)計專業(yè)之道

目　錄

基礎(chǔ)篇

第1章　網(wǎng)頁設(shè)計的現(xiàn)狀　1
1.1　為愉悅而設(shè)計　2
1.2　Keypress導航　6
1.3　傳統(tǒng)印刷設(shè)計的影響　12
1.4　如何與眾不同　13
1.5　平面主義　19
1.6　豐富強大的版式　23
1.7　現(xiàn)實生活中的隱喻和隱藏復雜性　28

第2章　網(wǎng)頁設(shè)計趨勢　39
2.1　微妙的互動　40
2.2　上下文精確導航　46
2.3　快速適應(yīng)CSS3　50
2.4　總結(jié)　62

第3章　響應(yīng)式網(wǎng)站設(shè)計：概念及使用指南　63
3.1　響應(yīng)式網(wǎng)站設(shè)計的概念　64
3.2　調(diào)整屏幕分辨率　65
3.3　彈性圖像　68
3.4　定義布局結(jié)構(gòu)　71
3.5　媒體查詢　74
3.6　顯示或隱藏內(nèi)容　79

第4章　響應(yīng)式網(wǎng)頁設(shè)計解析　83

第5章　網(wǎng)站設(shè)計中的說服力　93
5.1　回饋　95
5.2　承諾　96
5.3　從眾效應(yīng)　97
5.4　權(quán)威效應(yīng)　98
5.5　稀缺原則　100
5.6　組合對比　101
5.7　重點信息突出　101

第6章　為什么要使用CSS3和HTML5　103
6.1　與時俱進　104
6.2　主要的限制因素　110
6.3　總結(jié)　115

第7章　用戶也是網(wǎng)頁設(shè)計師　117
7.1　傳統(tǒng)的角色　118
7.2　角色扮演　120
7.3　先天vs后天　121
7.4　成功的要素　122
7.5　換位　126

第8章　設(shè)計與可用性一樣有深度　127
8.1　漸變、投影、映像、噢，我的天啊　128
8.2　Dribbble　129
8.3　簡約的力量　130
8.4　是什么讓設(shè)計具有可用性？　132
8.5　可用性并不意味著丑陋　135

第9章　怎樣表達你的設(shè)計思想　137
9.1　題外話　138
9.2　信息傳達的重要性　139
9.3　設(shè)計并不是碰巧而已　140
9.4　多學詞匯　142
9.5　提供具有說服力的論據(jù)　143
9.6　展示設(shè)計案例　144
9.7　要點回顧　145

實踐篇

第10章　關(guān)于企業(yè)網(wǎng)站的嚴峻事實　147
10.1　你需要一個獨立的網(wǎng)站部門　148
10.2　管理網(wǎng)站是一項全職的工作　149
10.3　定期重新設(shè)計是不夠的　149
10.4　你的網(wǎng)站不可能滿足所有用戶的需求　150
10.5　不要在社交網(wǎng)絡(luò)上浪費金錢　150
10.6　你的網(wǎng)站并不代表你的全部　151
10.7　你沒有從網(wǎng)站團隊那里獲得價值　152
10.8　七嘴八舌只會讓設(shè)計更糟　153
10.9　“委員會”設(shè)計會導致糟糙的網(wǎng)站設(shè)計　153
10.10　CMS不是一勞永逸的解決方案　154
10.11　你的內(nèi)容太多　155
10.12　總結(jié)　155

第11章　網(wǎng)站設(shè)計模式和最佳實踐　157
11.1　明與暗的設(shè)計　158
11.2　需要幾欄的布局？　159
11.3　介紹信息位于頂端　160
11.4　布局對齊　160
11.5　導航的位置　161
11.6　搜索框設(shè)計　162
11.7　Flash元素　162
11.8　聯(lián)系信息的位置　163
11.9　“關(guān)于我們”頁面　164
11.10　“客戶”頁面　164
11.11　“服務(wù)”頁面　165
11.12　“作品”頁面　165
11.13　“工作流程”頁面　166
11.14　“聯(lián)系”頁面　166
11.15　其他特色有“分享”鏈接　167
11.16　其他發(fā)現(xiàn)　167
11.17　總結(jié)　167

第12章　創(chuàng)建一個成功的作品集網(wǎng)站　169
12.1　陷阱1:混亂　170
12.2　陷阱2:　過多的信息　170
12.3　陷阱3:過度裝飾　171
12.4　陷阱4:不尋常的導航　171
12.5　陷阱5:視覺混亂　171
12.6　行之有效的設(shè)計原則　172

第13章　商業(yè)網(wǎng)站應(yīng)用程序的UI設(shè)計　181
13.1　網(wǎng)站與網(wǎng)絡(luò)應(yīng)用程序　182
13.2　首先要了解用戶　183
13.3　設(shè)計過程　185
13.4　設(shè)計原則　187
13.5　網(wǎng)絡(luò)應(yīng)用程序的重要組成部分　189
13.6　不要忘了用戶界面設(shè)計模板　191
13.7　案例分析：網(wǎng)上銀行應(yīng)用程序　191
13.8　最后的思考　192

第14章　設(shè)計師的色彩理論　193
14.1　暖色　195
14.2　紅色(原色)　195
14.3　橙色(合成色)　199
14.4　黃色(原色)　202
14.5　冷色　205
14.6　綠色(合成色)　205
14.7　藍色(原色)　208
14.8　紫色(合成色)　211
14.9　中性色　214
14.10　黑色　214
14.11　白色　218
14.12　灰色　221
14.13　褐色　224
14.14　米黃色和茶色　227
14.15　奶油色和乳白色　230
14.16　簡要概述　233

第15章　怎樣應(yīng)對強勢客戶，你會敗給他嗎？　235
15.1　解釋為什么你需要錢　236
15.2　用John能夠理解的語言解釋你的建議　236
15.3　讓John參與設(shè)計過程　237
15.4　給John講設(shè)計　237
15.5　定期與John溝通　238
15.6　網(wǎng)站的持續(xù)維護　239
15.7　故事的寓意　239

第16章　如何識別和應(yīng)付不同類型的客戶　241
16.1　消極攻擊型客戶　242
16.2　親戚朋友　243
16.3　價值低估型客戶　244
16.4　吹毛求疵型客戶　245
16.5　輕蔑節(jié)儉型客戶　245
16.6　“我自己也能做”型的客戶　246
16.7　控制狂　247
16.8　理想客戶　248
16.9　總結(jié)　249

第17章　如何有效應(yīng)對設(shè)計批評　251
17.1　正確的態(tài)度　253
17.2　了解目標　253
17.3　注意自己的第一反應(yīng)　254
17.4　去蕪存菁　255
17.5　從中學到東西　256
17.6　尋找新的想法　256
17.7　挖掘更深的信息　257
17.8　感謝批評者　258

第18章　給年輕設(shè)計師的專業(yè)建議　259
18.1　對于有志向投身于設(shè)計的學生而言，你建議他們學點什么　261
18.2　學生如何確定設(shè)計是否適合他們，或者是否該追求另外一種職業(yè)　261
18.3　如何平衡學業(yè)和工作　263
18.4　如何在學業(yè)之外為事業(yè)做準備　263
18.5　學生和年輕設(shè)計師在學業(yè)之外應(yīng)該側(cè)重什么課程以推動其職業(yè)生涯發(fā)展　264
18.6　在開始職業(yè)生涯之前你最想知道的事情　265
18.7　對于應(yīng)屆畢業(yè)生你有什么求職建議嗎　266
18.8　創(chuàng)業(yè)還是打工，年輕設(shè)計師應(yīng)該如何抉擇　267
18.9　學生和年輕設(shè)計師如何讓自身對潛在雇主更有價值　269
18.10　為了成功，創(chuàng)業(yè)初期應(yīng)該做什么　271
18.11　除了設(shè)計和開發(fā)，在運營業(yè)務(wù)方面，自由職業(yè)者應(yīng)該把重點放在哪些方面　273
18.12　對于年輕設(shè)計師而言，尋找客戶的最佳方式是什么　274
18.13　對于年輕設(shè)計師，你有什么關(guān)于人際交往的提示　276