好文: 43點設計網站時應避免的錯誤

善心人士翻譯的一篇好文, 裡面寫的內容, 只要常在網路遊走, 應該都會感同身受, 譯者將此做整理、翻譯的動作. (感謝 MUKI 的翻譯)

這篇文章讓不懂網站的業者看過, (他們有看的話)應該可以省點口水~

43點設計網站時應避免的錯誤

下述摘錄大標題:

  1. 你必須要讓讀者在第一時間瞭解你的blog在幹麻
  2. 讓文章容易閱讀
  3. 不要用一些不容易閱讀的花俏字型
  4. 不要使用過小的迷你字體
  5. 不要設定開新視窗
  6. 不要改變讀者視窗的大小
  7. 除非需要且必要,否則不要強制讀者註冊
  8. 請勿未經過他人同意發送訂閱給他
  9. Flash不要使用過度
  10. 不要自動播放音樂
  11. 如果你必須要放影音,請預設關閉,讓讀者選擇要不要播放
  12. 不要因為部落格掛件而干擾你的主頁面
  13. 不要用個只有「enter」的首頁,直接進入你真正的網站
  14. 確定blog有包含聯絡我的細節
  15. 確定你的網站能使用「上一頁」按鈕
  16. 不要使用閃爍的文字
  17. 避免複雜的網址結構
  18. 使用css取代html的table語法
  19. 確定讀者可以搜尋到你整個網站(blog)
  20. 避免使用下拉式選單
  21. 選單儘量使用文字
  22. 如果你有連接PDF檔案,請顯示他們
  23. 不要讓讀者干擾了你製作網站的版本
  24. 不要把廣告跟你的文章內容參雜在一起
  25. 使用簡單的導覽結構
  26. 避免「向內發展」
  27. 不要使用FrontPage
  28. 確定你的blog兼容於每種瀏覽器
  29. 確定包含錨文本連結
  30. 不要把連結藏起來
  31. 讓讀者可以清楚看到連結
  32. 不要對文字作底線及顏色的標記
  33. 已經拜訪過的連結設定其他顏色
  34. 不要使用動畫圖檔
  35. 在圖片的設置多使用alt以及title的屬性
  36. 不要用刺眼的顏色搭配
  37. 不要用跳出視窗
  38. 避免java script的連結
  39. 在blog的頁尾放上網站的訊息
  40. 避免過長的頁面
  41. 不要出現水平捲軸
  42. 不要有拼字和文法的錯誤(muki註:對國人而言,就是不要有錯字以及注音文)
  43. 如果你有使用圖片驗證機制,請確保這張圖片可以讓讀者很清楚的閱讀

裡面並不是所有都該遵守, 還是有不少例外, 依環境狀況而定, 例如:

  • 不要設定開新視窗: 我的習慣是外連的網站會開新視窗, 感覺對他們比較尊重 (不過這是見人見智, 這點我跟譯者的看法倒是非常一致. :P)
  • Flash不要使用過度: 如果強調的只是展示 Flash功力 和 動畫特效的效果, 就盡量用吧~
  • 不要因為部落格掛件而干擾你的主頁面: 個人覺得純花俏不實用的就別擺, 有用的還是擺上去.
  • 不要使用FrontPage: 如果只會 FrontPage, 就用吧, 做完後建議測試過所有瀏覽器, 然後找個懂的人幫你做做程式碼的精簡化. 😛
  • 在圖片的設置多使用alt以及title的屬性: 圖片要用 alt 和 longdesc (詳見: Objects, Images, and Applets in HTML documents), 連結用 title (詳見: Links in HTML documents).

下面幾點是我在瀏覽時, 絕對不想遇到的狀況, 如果沒有特殊需求, 盡量避免吧. Orz.

  • 不要改變讀者視窗的大小: 除非有特殊要求, 不然請注意, 瀏覽器的畫面現在不會只有你網頁, 會影響到很多頁面.
  • 不要自動播放音、如果你必須要放影音,請預設關閉,讓讀者選擇要不要播放: 當你平常在聽音樂, 又聽到網頁來的聲音, 就需要找出是哪個網頁發出來的, 去關掉它.

關於 Tsung

對新奇的事物都很有興趣, 喜歡簡單的東西, 過簡單的生活.
本篇發表於 My-Favorite-Site。將永久鏈結加入書籤。

好文: 43點設計網站時應避免的錯誤 有 6 則回應

  1. Xnet 說道:

    好文!
    特別是:不要使用 FrontPage

  2. Tsung 說道:

    我是覺得 FrontPage 只要特別處理過, 也是個工具啦.(雖然我是習慣手工業)) XD

  3. Xnet 說道:

    不要使用FrontPage: 如果只會 FrontPage, 就用吧, 做完後建議測試過所有瀏覽器, 然後找個懂的人幫你做做程式碼的精簡化. 😛
    ------
    呵 🙂
    趕著出門沒有說清楚,不過和您一樣的意思。有些人用 FrontPage,把程式碼弄的像天書,接手維護的人很辛苦。
    以前 Word 剛出來的時候,大家還是以使用 PE2 的觀念來使用 Word。現在面對 HTML,大家用 Word 的想法,只要前端效果,卻不管後端 HTML 碼的整潔。
    請問:26.避免「向內發展」是什麼意思?

  4. Tsung 說道:

    嗯嗯, 現在大多數的人都只會管前端效果.. :~~~
    向內發展: 在讀者還沒看到想要的東西時,不要強迫他看其他文章,只要你提供的文章是獨一無二的,他就會繼續看下去.

  5. THREE M 說道:

    RE: 圖片要用 alt 和 longdesc
    不過 longdesc 無法通過 W3C 的 XHTML 1.0 Strict 標準
    這要怎麼解決= =?

  6. Tsung 說道:

    事實上, 我推薦使用 HTML 4.01 說, XHTML 沒有使用它的實際好處~ 😛

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料