43個你應當避免的WEB設計錯誤

千燁Chiaki

43個你應當避免的Web設計錯誤


這是一篇關於網站易用性的文章，作者以親身體會講述了43條網站設計中常犯的錯誤，而無疑這些錯誤會大大影響網站的可用性。如今網站易用性已成為一種趨勢，但縱觀國內的各大網站，似乎易用性並未成為設計者們廣泛理解的概念， 因此希望這篇文章對大家能有作用。

1. 用戶必須在幾秒鐘知道網站是做什麼的。注意力是網際網路上最有價值的貨幣。 如果訪問者無法在幾秒鐘之內得知你的網站的方向，他很有可能轉而訪問其他網站。 你必須迅速地告訴訪問者為什麼要在你的網站上花費時間。

2. 讓網站易於速讀。網際網路不是書，因此沒必要使用大段的文字。 也許我訪問你的網站時我正在忙於其他工作，我不得不迅速讀完所有內容。 專案符號、標題、副標題、列表，這些都能幫助讀者迅速找到他想要的內容。

3. 不要使用難於閱讀的花哨字體。當然，某些字體可以讓網站精彩紛呈。 不過它們容易閱讀嗎？如果你的主要目的是傳遞資訊並讓讀者閱讀， 你應該讓閱讀過程舒服些。

4. 不要用小字體。如上一條所述，你得讓讀者閱讀時感到舒服。 雖然我的Firefox有放大功能，但如果必須放大才能看清一個網站的話， 我就再也不會去訪問它了。

5. 不要打開新流覽器視窗。我的第一個網站曾經經常這麼做。 原因很簡單，在新視窗中打開外部鏈結，用戶就不必離開我的網站。 錯！讓用戶決定如何打開鏈結，否則流覽器上大大的後退按鈕就沒必要存在了。 不用擔心用戶離開你的網站，在必要的時候他們會回來的。

6. 不要改變用戶的流覽器視窗大小。用戶有權控制自己的流覽器。 如果你改變視窗大小，你會在他們面前失去信用。

7. 不必要時不要讓用戶註冊。直白地講，我上網是為了獲取資訊，不是為了別的。 不要強迫我註冊並留下我的電子郵件以及其他資訊，除非特別必要（比如你 能提供的消息非常有價值）。

8. 不要在未經訪問者同意的情況下為他們訂閱電子雜誌。 不要在訪問者註冊時自動給他們訂閱電子雜誌。 不請自來的郵件可不是個交朋友的好辦法。

9. 不要過多使用Flash。Flash不僅會增加網站的讀取時間， 過度使用甚至會讓訪問者感到不快。只有當靜態頁面無法表達你的意圖時 才使用Flash。

10. 不要播放音樂。早些年Web開發者都喜歡在網站中集成音樂，結果他們失敗了。 記住，永遠不要使用音樂。

11. 當你必須使用聲音時，讓用戶啟動它。有時你必須使用音效檔案， 比如你要給用戶發送一份演講，或者你的教程包含聲音。這沒問題，但要讓用戶來控制， 讓用戶點擊"播放"按鈕，別在打開網頁的瞬間播放聲音。

12. 不要讓標誌弄亂你的網站。社交網路和社區的標誌會讓你的網站看起來十分不專業。 就算是獎章和榮譽等標誌也應當放到"關於我們"頁面上。

13. 不要使用"點擊進入"頁面。用戶訪問到內容的步驟越少越好。

14. 注意要留下聯繫方式。最差的莫過於網站沒有留下聯繫方式的了。 不僅對訪問者不友好，而且對你也沒好處，你會錯過珍貴的反饋資訊。

15. 不要影響"後退"按鈕的動作。這是網站可用性的最基本的理念。 在任何情況下都不能影響"後退"按鈕的動作。比如，打開新視窗會破壞它， 某些Javascript鏈結也會破壞它。

16. 不要用閃爍的文字。除非你的訪問者來自1996年，否則別用閃爍文字。

17. 避免複雜的URL結構。一個簡單的基於關鍵字的URL結構不僅能提高你的搜索引擎排名， 還能讓訪問者在訪問之前瞭解網頁內容。

18. 用CSS佈局，不要使用表格。HTML表格曾經被用於頁面佈局， 但沒有必要拘泥於此，尤其是在CSS誕生之後。CSS更快、更穩定， 並能提供更多的特性。

19. 保證用戶可以搜索整個網站。搜索引擎帶來網際網路革命的原因，就是 它使得資訊查找變得十分容易。別在你的網站上唱反調。

20. 避免使用下拉功能表。用戶應當直觀地看到所有導航選項。 下拉功能表會造成混亂，並且會隱藏訪問者真正要找的資訊。

21. 使用文字做導航欄。文字導航不僅速度快，而且更穩定。 例如，有些用戶上網時會關閉圖片。

22. 如果需要鏈結到PDF文檔，一定要注明。你一定有過點擊鏈結之後， 流覽器就像死掉一樣等待Acrobat Reader啟動，只為了打開一個（你不想看的）PDF？ 這是個不小的麻煩，因此一定要在指向PDF的鏈結旁特別說明，使用戶可以採取相應措施。

23. 不要用多種版本讓訪問者迷惑。你想用哪種帶寬？56Kbps？128Kbps？Flash版還是HTML版？ 嗨，我只想快點看到內容！

24. 不要在內容中混合廣告。在內容中混合廣告（如Adsense）也許會增加短期內的廣告點擊率， 但從長遠角度來看，這會減少網站的人氣。憤怒的用戶會離開的。

25. 使用簡單的導航結構。過猶不及。這個規則通常適用於人和選擇上。 確保你的網站的導航結構單純簡潔。你不想讓用戶在查找資訊時遇到麻煩吧？

26. 避免內容介紹。別強迫用戶在訪問到真正內容之前看某些東西。 這很令人憤怒，除非你提供的資訊是用戶必須的，否則他不會等下去。

27. 不要使用FrontPage。這一點也適用於其他廉價的HTML編輯器。 它們讓頁面設計變得更方便，但其輸出結果將會非常低級，不相容不同的流覽器， 並且會包含錯誤。

28. 保證你的網站相容大部分流覽器。流覽器並不完全相同，在解釋CSS和其他 語言的方法也相差甚遠。不管你是否願意，你應當讓網站相容市面上的常用流覽器， 否則你會永遠地失去部分讀者。

29. 保證在鏈結上添加有意義的文字。以前我經常犯這個錯誤。告訴人們"點擊這裏"很容易， 但這沒有效果。要保證鏈結文字有意義。它使得訪問者知道點擊鏈結之後將出現什麼， 也能為鏈結指向的外部站點帶來SEO效果。

30. 不要在狀態欄中隱藏鏈結。用戶還必須能在狀態欄中看到鏈結指向哪里。 如果你隱藏了鏈結（即使是由於其他原因），那麼你也會喪失信譽。

31. 使鏈結可見。訪問者應能輕易識別出哪些能點擊，哪些不能。 確保鏈結的顏色有強烈的對比（標準的藍色通常是最好的）。可能的話， 最好加上下劃線。

32. 不要在普通文本上添加下劃線或者顏色。除非特別需要，否則不要為普通文字添加下劃線。 就像用戶需要識別哪些能點擊一樣，他們不應當將本不能點擊的文字誤認為能夠點擊。

33. 改變訪問過的鏈結的顏色。這一點對於提高網站可用性非常重要。 改變訪問過的鏈結顏色有助於用戶在網站中定位，確保他們不會不經意地 訪問同一頁面兩次。

34. 不要使用動態GIF。除非你有需要動畫的廣告條，否則避免使用動態GIF。 它會使網站看上去很業餘，並且會分散訪問者的注意力。

35. 給圖像添加ALT和TITLE屬性。ALT和TITLE不僅會帶來SEO效果，而且 對盲人有很大幫助。

36. 不要用令人不快的顏色。如果用戶連續閱讀10分鐘後覺得頭疼， 那麼你最好選擇別的配色方案。根據你的目的決定設計（例如，創造一種氛圍 使得用戶將注意力放在網站內容上，等等）。

37. 不要彈出窗口。這一點涉及任何種類的彈出窗口。即使用戶要求使用， 彈出視窗也不宜使用，因為它會被彈出視窗攔截功能阻攔。

38. 不要使用Javascript做鏈結。遠離那些點擊之後執行一小段Javascript的鏈結， 它們經常給用戶帶來麻煩。

39. 在頁面底部放置有意義的鏈結。訪問者在找不到所需資訊時通常會滾動到頁面最底端。 作為最後的手段，你應當在頁面底部放一個"聯繫我們"頁面的鏈結。

40. 避免網頁過長。如果用戶老是需要滾動才能看到內容，他通常會採取的做法是 跳過它們。如果你的網站正好如此，那麼應當縮短內容並優化導航結構。

41. 禁止使用水平捲軸。雖然垂直捲軸可以接受，但水平捲軸卻遠非如此。 現在的流行解析度是1024×768，要確保網站能容納在其中。

42. 禁止出現拼寫或語法錯誤。這不是網站設計的錯，但卻是影響網站整體質量的重要因素。 確保鏈結和文字中沒有拼寫或語法錯誤。

43. 如果你使用圖片認證，要保證能看清其字元。有些網站將圖片認證作為對抗垃圾評論的方法， 或是在註冊表單上使用。其中有個問題就是，用戶經常需要叫上全家人來討論圖片上到底是什麼字母。

原文出處：
http://www.dailyblogtips.com/43-web-design-mistakes-you-should-avoid/
由Live1y's Blog翻譯
http://www.livelyidea.com/blogview.asp?logID=198

guojiahao

這43條是針對什麼類型的網站壓@@???
比如說:公司網站嗎
還是連個人網頁也必須注意@ˇ@???

leeker

這種四十多條的東西太多了，一般沒啥人有耐心看完的，到不如從中挑著重點說說。

笨笨滴小悠

謝謝分享@@

不過就像樓上大大說的

大多了  很少人會仔細看完!!

不過辛苦樓主了  打的很辛苦吧XD"

凱布球

雖然是繁雜了一點，但是我覺得挺中肯的
總而言之是為使用者著想，適當控制網頁的元素和內容
過多的裝飾及未整理好的資料反而是本末倒置了
當然...如果是不需要在意其他人眼光，也對你無利害關係的，大可以不必理會

有好幾條在國外網站已經不常見了，在台灣還是蠻多人會犯
比如說為了自己在製作時用大量的圖片跟表格排版，這不只是自己放棄了網站內容讓搜尋引擎爬到的機會，更影響網頁結構的可讀性，往後的調整和修正也不方便

現在更有一個奇怪的趨勢，由於flash易學然後普及，而且可以做到許多炫麗的效果
許多老闆就愛上這個了，要求網頁設計者必需做成那樣，這個東西飛過去那個飛過來、換頁要淡入之類的
那也就算了，出錢的人要怎樣就怎樣。
比較糟的是，開始很多人會一點flash就開始接案子做網站，導致這種無腦單頁SWF的網站越來越多=___=
我就有些同學是這樣的還自鳴得意，結果卻為了一個SWF置中的問題想破頭腦，還開DW畫了一堆亂七八糟的表格....