Web設計的設計原則有哪些破婆?

一、保持網(wǎng)頁的樸素

一個好的網(wǎng)站最重要的一點就是界面的簡單胸囱、樸素祷舀。你聽說過“KISS”法則嗎?“KeepItSimpleSilly.”適用于所有的站點烹笔。制作者們很容易掉入這樣一個陷阱裳扯,即把所有可能用到的網(wǎng)頁技巧,例如:框架谤职、表格饰豺、字體、GIF動畫等等都用上允蜈,這當然是好的冤吨,但如果多了的話就會讓你的訪問者眼花繚亂,不知所措饶套,也不會給他們留下很深的印象漩蟆。記住,只是因為你可以創(chuàng)建一個效果妓蛮,但并不意味著你必須創(chuàng)建這個效果怠李。先問一問你自己:我在網(wǎng)頁上加入這個技術(shù)有什么價值?是否能更好的向訪問者表達我的主題?

二捺癞、簡單并不等于乏味

簡單的真正含義并不是遲鈍和乏味夷蚊。許多人會被網(wǎng)站多余的奇特效果所迷惑,而忽視了信息的有效性翘簇。保持簡單的真正含義就是:想一想如何使自己網(wǎng)站的信息與你的訪問者所期待和所需要的一樣撬码。應該把技術(shù)和效果用在適當?shù)牡胤剑迷谟行畔⑸习姹#屧L問者關(guān)注他們想關(guān)注的東西呜笑。清晰的設計+有效的技術(shù)=一個好的站點

三、了解你的讀者

你不是在真空里制作你的網(wǎng)頁彻犁,也不是作給你自己看的叫胁。如果是這樣,你還不如把它放在自己的電腦里汞幢。你發(fā)布你的網(wǎng)站是希望某些人停下來參觀它驼鹅。而這些人就是你的讀者。你越了解你的讀者森篷,你的網(wǎng)站影響力就會越大输钩。你的讀者是否有個慢貓?那你最好應當特別的注意網(wǎng)頁的大兄僦恰买乃;他們希望聽到音樂片斷嗎?你就要想想網(wǎng)頁上的音樂格式钓辆。你的讀者是紡織工人剪验?那么血紅色和黑色最好不要選擇;或者他們是骨灰級游戲玩家前联?你就要避免用柔和的顏色和圖案了功戚。一個好站點的定義:通過典雅的風格設計提供給潛在讀者高質(zhì)量的信息。

四似嗤、五個“手指”

對一個好的網(wǎng)站來說啸臀,清晰的導航也是最起碼的標準。應該讓訪問者知道自己當時在網(wǎng)站中的位置烁落,并且愉快的通過你的指引而遍覽你的網(wǎng)站壳咕。例如,你可以做到的一件事情就是:“下一步”的選擇數(shù)目盡量少顽馋,以便人們不會迷失在長長的選擇項目列表中。你知道嗎?一般人的大腦把五個或更少的項目看作一組幌羞,但是當所面對的項目超過五個寸谜,它就必須把他們劃分成較小的次組來處理,所以說属桦,保持你的選擇項歸類在五組或五組以內(nèi)就變得很有意義了熊痴。你的訪問者能夠快速的找到自己想選擇的項目他爸。

五、三次點擊

對網(wǎng)站制作者來說果善,訪問者就是上帝诊笤,討好上帝的另一個方法就是讓他們在獲取信息時不要超過三次點擊。想想巾陕,當你在訪問一個網(wǎng)站時讨跟,點擊……點擊……點擊……再點擊……再……才找到你想要的信息,或者還沒找到鄙煤,你會怎么想呢晾匠?加之,當你的訪問者深入網(wǎng)站查找需要的信息最后卻摸不著頭腦了梯刚,會怎么辦凉馆?他們肯定不會原地兜圈,他們會離開你的主頁去別的地方繼續(xù)沖浪亡资,可能也就再也不會回來了澜共。

六、三十秒的等待時間

訪問者進入你的站點后锥腻,他應該可以不費力的找到所需要的資料嗦董。有一條不成文的法則:當訪問者在決定下一步該去哪之前,不要讓他現(xiàn)在所看的頁面下載的時間超過30秒鐘旷太。如果超過了這個時間展懈,你就會開始失去你的“上帝”了。保證你的頁面有個適度的大小而不會無限制的下載供璧。如果你的大多數(shù)訪問者使用Modem的話存崖,試著保持總的頁面大小(包括頁面圖像)在45K以下睡毒。確保你的頁面設計規(guī)劃清晰明了来惧,讓訪問者只需快速的掃視就能把握你的網(wǎng)站導航,知道自己“下一步”該選擇的項目演顾。

該學習的供搀,而哪些錯誤是你要避免的。查看原文件钠至。當你看到某些你喜歡的東西葛虐,使用你瀏覽器上的查看原文件的功能,看看這個效果是如何作出來的棉钧。在頁面之后你能發(fā)現(xiàn)令你驚奇的東西屿脐。閱讀和學習,學習你盡可能學到的技術(shù)和設計方法。

七的诵、平衡

平衡是一個好網(wǎng)站設計的重要部分万栅。文本和圖像之間的平衡。除非內(nèi)容決定了這是個完全文本或者完全圖像的網(wǎng)站西疤,你需要用直覺和審美觀來作判斷烦粒,以便其中的一個不會淹沒另外一個。下載時間和頁面內(nèi)容之間的平衡代赁。當然你希望有個漂亮的頁面扰她,但你也必須平衡你的頁面內(nèi)容,因為你的很多訪問者正在通過modem閱讀它管跺。難道你網(wǎng)站的圖片真的值得等待那么久嗎义黎?背景和前景之間的平衡。我們能在白紙上畫出美麗的圖案豁跑,網(wǎng)頁上廉涕,如果能制作出漂亮的結(jié)構(gòu)和背景是很令人激動的。但也容易使你的內(nèi)容淹沒在你的背景里面艇拍。

八狐蜕、適度的幀

適度的的幀對于你的網(wǎng)頁是很好的補充,然而就像所有網(wǎng)站的元素所具有的特性一樣卸夕,你絕對不要濫用他們层释!如果你想創(chuàng)建一個可以看得到的導航結(jié)構(gòu),比如說一個表格目錄快集,幀就是一個很合適的途徑贡羔,例如,這頁有三個幀--你現(xiàn)在所看到的內(nèi)容个初,導航條在右邊乖寒,題目、廣告和說明欄在頂部院溺。但是幀不是“萬金油”楣嘁。比如說,如果你想用行或列來顯示信息的話珍逸,表格會更好逐虚。

九、堅持學習

創(chuàng)建網(wǎng)頁是一個不斷學習的過程谆膳。推出你網(wǎng)站的第一個版本還只是一個開始!技術(shù)和工具在不斷的進步叭爱,而我們對人們?nèi)绾卫镁W(wǎng)上資源的方式的了解也是在不斷的變化,要創(chuàng)建一個好網(wǎng)站你就不能陶醉在過去的成績上漱病,看看其他的網(wǎng)站涤伐。如果你想成為一個出色的小說家的話馒胆,你必須不斷閱讀其他好的作品。如果你想成為一個出色的劇作家的話凝果,你必須多看好的電影。同樣睦尽,如果你想設計一個出色的網(wǎng)站的話器净,你必須多看其他好的網(wǎng)站。但你在看一個網(wǎng)站的時候当凡,你能找到這個網(wǎng)站的優(yōu)缺點山害,注意哪些是你該學習的,而哪些錯誤是你要避免的沿量。查看原文件浪慌。當你看到某些你喜歡的東西,使用你瀏覽器上的查看原文件的功能朴则,看看這個效果是如何作出來的权纤。在頁面之后你能發(fā)現(xiàn)令你驚奇的東西。閱讀和學習乌妒,學習你盡可能學到的技術(shù)和設計方法汹想。

以下為圖文


01 嘗試使用一列的布局替代多列布局


02 給用戶一些小的利益,別看上去那么赤裸裸


03 合并相似的功能


04 嘗試展示來自用戶的贊揚撤蚊,而不是自我表揚


05 重復核心行動點


06 統(tǒng)一視覺規(guī)范古掏,提升可識別性


07嘗試使用推薦的口吻,而不是讓用戶感覺面對一臺冷冰冰的機器


08 給用戶吃「后悔藥」的機會

09 告訴用戶產(chǎn)品適用的人群侦啸,而不是人人都通用


10將文案寫得更加的直接槽唾,而不是一堆廢話


11增強主行動點的視覺沖擊力,提升它在頁面中的可對比性


12讓用戶知道你從哪兒來更易于拉近與用戶的關(guān)系


13將表單做的簡單點光涂,確保用戶在抓狂之前能進入下一步


14盡量將用戶需要選擇的信息展示出來而不是藏起來


15頁面的排版需要考慮用戶是否會漏掉底部信息


16如果頁面的底部有需要關(guān)注的行動點庞萍,別讓文中過多的外鏈帶走了用戶

;

17確保用戶知道自己目前的狀態(tài)


18將利益點融合在行動點中,增強用戶的點擊欲望


19將行動點與當前信息結(jié)合起來


20將簡要的表單合并到頁面中顶捷,減少調(diào)整頁面帶來的用戶流失


21適當?shù)脑黾友舆t動效挂绰,讓用戶感知到頁面的變化<img?

22讓新用戶從嘗試產(chǎn)品入手,而不是一來就面對冷冰冰的注冊表單


23減少使用線框服赎,這會過多的吸引用戶注意力葵蒂,而且會讓頁面看上去透不過氣


24給用戶推銷你能給他帶來的利益,而不是功能


25一定要注意0結(jié)果頁面的設計重虑,這也是引導用戶的好地方


26給用戶選擇退出的權(quán)利践付,特別是郵件訂閱


27注意界面元素的一致性,降低用戶學習成本


28給下拉框增加一些預設值缺厉,降低用戶填寫成本


29延續(xù)用戶日常的使用習慣永高,而不是重新創(chuàng)造


30嘗試告訴用做些事情降低自己的損失隧土,而不是提升收益


31提升頁面的視覺層次,增強可閱讀性


32將同類的操作合并在一起命爬,降低用戶的認知成本

33表單及時校驗曹傀,而不是統(tǒng)一提交后在告訴用戶填錯了


34嘗試將表單輸入變得更加寬容,讓用戶的填寫更加簡單


35通過時間增強緊迫感


36提供用戶可預見性的操作饲宛,降低用戶的心理成本


37盡可能的幫助用戶選擇皆愉,而不是讓用戶想破腦袋


38盡可能將操作區(qū)域放大,降低用戶操作成本


39頁面加載速度很重要艇抠,盡可能讓用戶感受到你的網(wǎng)站速度很快


40如果可以幕庐,增加鍵盤快捷鍵,提升操作效率


41嘗試通過對比來讓用戶感知到性價比


42 嘗試對進度條進行「設計」來降低用戶等待的焦慮


43 根據(jù)用戶選擇逐步展示信息家淤,降低無效信息對用戶的干擾


44 有時候較小的承諾比「夸阂彀口」會更容易讓用戶信服


45 嘗試將提示信息弱化,減少對用戶操作的干擾


46 盡量通過系統(tǒng)的功能來簡化用戶的操作


47 用文本配合圖標來降低用戶的認知成本


48 用更自然的語言代替冷冰冰的機器


49 放出一些摘要信息來幫助用戶識別是否需要進一步了解

50 在關(guān)鍵的頁面增加用戶權(quán)益信息絮重,增強用戶進一步操作的信心


51 將價格進行換算冤寿,讓用戶感覺這很便宜


52 記得在成功頁面感謝用戶


53 將數(shù)字轉(zhuǎn)化成易于用戶閱讀的形式,而不是冷冰冰的機器語言


54 告訴用戶選擇的權(quán)利和自由「誘惑力」55 嘗試讓語言更具「誘惑力」


55 嘗試讓語言更具「誘惑力」


56 通過設計引導用戶的注意力


57 通過友好的對比來展示產(chǎn)品绿鸣,為用戶做決定提供幫助


58 通過任務機制來提升用戶的滿足感


59 讓用戶了解接下來將要發(fā)生什么事情


60 嘗試用更幽默一些的語言文案


61 任何操作之后都要給出反饋疚沐,讓用戶知道操作已經(jīng)生效


62 注意動效的真實使用情況(Amazon 的類目菜單就是一個很好的例子)


63 注意排版的,不要讓信息過于擁擠


64 嘗試用講故事的方式來傳遞信息潮模,增強用戶的代入感


65 盡量給用戶展示真實的信息亮蛔,不要欺騙


66 隨著用戶的不斷熟悉簡化界面


67 試著用用戶的口吻展示信息


68 在表單中增加一些提示信息,減少錯誤的幾率


69 最后擎厢,用簡單的文案傳遞核心關(guān)注的信息究流,少一些廢話


以上是我在知乎整理到的

供大家參考和學習

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌蚣常,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件偷仿,死亡現(xiàn)場離奇詭異,居然都是意外死亡宵蕉,警方通過查閱死者的電腦和手機酝静,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來羡玛,“玉大人别智,你說我怎么就攤上這事〖诟澹” “怎么了薄榛?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵讳窟,是天一觀的道長。 經(jīng)常有香客問我敞恋,道長丽啡,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任耳舅,我火速辦了婚禮碌上,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘浦徊。我一直安慰自己,他們只是感情好天梧,可當我...
    茶點故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布盔性。 她就那樣靜靜地躺著,像睡著了一般呢岗。 火紅的嫁衣襯著肌膚如雪冕香。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天后豫,我揣著相機與錄音悉尾,去河邊找鬼。 笑死挫酿,一個胖子當著我的面吹牛构眯,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播早龟,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼惫霸,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了葱弟?” 一聲冷哼從身側(cè)響起壹店,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎芝加,沒想到半個月后硅卢,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡藏杖,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年将塑,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片制市。...
    茶點故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡抬旺,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出祥楣,到底是詐尸還是另有隱情开财,我是刑警寧澤汉柒,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站责鳍,受9級特大地震影響碾褂,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜历葛,卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一正塌、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧恤溶,春花似錦乓诽、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至帐姻,卻和暖如春稠集,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背饥瓷。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工剥纷, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人呢铆。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓晦鞋,卻偏偏與公主長得像,于是被迫代替她去往敵國和親刺洒。 傳聞我的和親對象是個殘疾皇子鳖宾,可洞房花燭夜當晚...
    茶點故事閱讀 43,514評論 2 348

推薦閱讀更多精彩內(nèi)容