1. 程式人生 > >四川智匯藍圖-你應該知道的網頁設計中的規則

四川智匯藍圖-你應該知道的網頁設計中的規則

網頁設計是一個棘手的話題。當你建立網站時你需要考慮很多事情。為了簡化這個任務,四川智匯藍圖這裡準備了一個列表,每個網頁設計師在設計網頁時都應該考慮這些注意事項。好訊息是,這都是一些簡單的設計原則。     應該做什麼   1.四川智匯藍圖-不管裝置如何,都應該提供相同的使用者體驗   使用者會使用不同的裝置來訪問你的網站:他們可通過臺式電腦或膝上型電腦,平板電腦,手機,音樂播放器甚至手錶上訪問您的網站。UX設計很關鍵的一部分是要確保使用者應該具有類似的使用者體驗,不論他們是通過什麼來訪問你的網站,不論他們是使用什麼樣的裝置。   如果使用者是通過手機訪問你的網站,他們應該能毫不費勁的找到他們需要的所有東西,就像他們在家裡通過桌面端檢視你的網站一樣。   2.四川智匯藍圖-設計一個簡潔,易用的導航   導航是可用性的基石。請記住,這不關乎於一個網站設計的有多好,但必須確保使用者可通過自己的方式進行瀏覽。這就是為什麼你的網站上的導航應該設計成這樣。   •簡單(每個站點都應該有最簡單的結構)   •簡潔(導航選項對訪客而言必須清楚易懂)   •一致(主頁的導航系統應該在每個頁面上都一樣)   設計導航方式,儘可能減少點選次數而幫助使用者到達他們想去的網頁。同時,應易於瀏覽並能輕易找到他們想去的地方。   3.四川智匯藍圖-更改已訪問連結的顏色   連結是導航過程中的關鍵因素。當已訪問的連結沒有改變顏色時,使用者可能會無意中重複訪問相同的頁面。    在這裡插入圖片描述

瞭解使用者已訪問過哪些頁面可以避免讓他無意中重複訪問相同的頁面。   4.四川智匯藍圖-輕鬆瀏覽你的頁面   當用戶訪問你的網站時,他們更有可能快速掃描螢幕,而不是閱讀頁面的所有內容。因此,如果訪問者想要查詢內容或完成某項任務,他們將一直瀏覽直到找到他們需要的內容。而作為設計師,你可以通過設計好的視覺層次結構來幫助他們。視覺層次結構是指以暗示重要性的方式安排或呈現元素(例如,他們的眼睛應該集中在拿了? 第一、第二等)   將螢幕標題,登入表單,導航專案或其他重要內容等重要內容標記重點,以便訪問者可立即檢視。    在這裡插入圖片描述

Basecamp使用的Z掃描模式   5.四川智匯藍圖-仔細檢查所有連結   當用戶點選站點上的連結並收到提示404錯誤頁面時,使用者可能很容易變得沮喪。當訪問者正在搜尋內容時,他們希望每個連結都可以將它們帶向所指的地方,而不是出現404錯誤的提示或者其他一些他們不想去的地方。    在這裡插入圖片描述

6.四川智匯藍圖-確保可點選的元素對使用者顯而易見   一個物體的外觀可告知使用者如何使用它。視覺元素看起來像是連結或按鈕,但不可點選(即,有下劃線的單詞沒有連結,具有文字動作的元素,但不是超連結)這樣很有可能會使使用者混淆。使用者需要知道頁面的哪些區域是純靜態內容,哪些區域是可點選的。   應讓使用者明白哪些是可點選的元素    在這裡插入圖片描述

橙色的盒子是一個按鈕嗎?答案是:不。形狀和標籤使其看起來像一個按鈕,但它不是。