網頁設計 是一門很深的學問，因為你不但要去分析目標訪客、針對目標訪客做設計優化，還要考量到訪客在瀏覽時的方便度，就是用戶介面(UI)的設計要好。但是常常看 到很多網頁的設計是充滿著不良的地方，慢慢的才會發現訪客默默的流失掉，因為你的網頁不夠親民、夠擾民。設計常犯的錯誤就是自以為設計的很便利操作，會這 麼說的原因是因為你專業，那訪客呢？有你專業？
這次Yuxin就直接切入正題，一一舉例。另外，整個大綱來自這裡，經過大篇幅的翻譯與改寫。另外這些要點有些是常識，有些頗富爭議也歡迎討論。
25.簡單的導航結構
訪客拜訪網站的目的不是了解你的網站複雜的結構，而是要取得它想要的資訊，這一點一再強調，結構一定要化繁為簡，使用最簡單的方法讓訪客看到你的網頁核心價值，越簡單，越好。
26.避免多餘的操作
不要讓訪客看你的網頁真正內容前先讓它看其他東西，例如彈出視窗，請求按讚、廣告等等，都容易讓訪客產生厭煩，請盡量避免前置動作，放訪客直接看到他要的內容，看玩了放一個讚鈕在旁邊也不遲。
27.拒絕使用「FrontPage」等即見即所得網頁編輯器
FrontPage常常是學校老師在教學時第一個用到的軟體，但是這個軟體真的不好，因為使用滑鼠拖拖拉拉出來的東西我保證不會比手動撰寫程式碼還 好，而且它會產生許多沒有用處的程式碼，也不是使用DIV+CSS的結構，而是使用style=””來代替，更可怕的是在產生瀏覽器不相容的問題時，你要 修改可是會累死人，因為你會看到一堆莫名其妙的程式碼。
28.保持網頁多瀏覽器兼容性
與第六點同樣的概念，既然要做網頁，就盡量讓顯示效果在每一個網頁中都相同，不要出現太大的錯誤情形，不管你想不想，這是要做的，檢查網頁不同瀏覽器的相容性。
29.在連結上要有有意義的說明文字
我們常常看到很多的網路作者在寫作時都用「點這裡」來取代一切的說明，並不是這樣不好，而是有改進空間，你應該讓訪客知道這個連結是何去何從，會連結到哪裡，保持有意義的連結，同時也能帶來一點點的SEO效果。
這篇發完後，TechOrange也出現了這一篇：為什麼你的連結最好不要寫「按這裡」？ （媽呀，我以前好多文章都這樣寫，慢慢來改…
30.不要在瀏覽器狀態欄隱藏連結網址
這個目前已經比較少看到了，幾年前還會看到使用Javascript來隱藏當滑鼠移到連結上面在瀏覽器的狀態欄網址顯示，這會讓訪客迷惑這個連結，到底要不要點？這是什麼網站？有沒有毒？
31.讓訪客一眼就知道哪個文字是連結
訪客沒有時間去注意你在哪些文字上加了超連結，你要讓他們一眼看見哪個是連結，可以點，看到更多的內容。通常連結都使用藍色，比瀏覽器預設藍再淡一 點（用預設藍感覺就沒那麼專業），如#06c看起來很舒服，適合當作連結的顏色，通常我們都會把底線去除，等訪客滑鼠移到上方時再顯示底線。
32.盡量不要給一般文字加上顏色，重點使用粗體代替之
這點在撰寫文章時要注意一下，盡量不要在文字上面加上顏色，當加多了，整個文章就會變得非常難以閱讀，也會很刺眼。如果是要註明文章的重點，請使用粗體字，不要使用顏色，別以為七彩繽紛很好看。
33.訪客點擊連結後，連結需換色
這點就是單純的網頁便利度的問題，當訪客點過的連結變色，能夠馬上知道這個連結有點過了，通常用在重複的連結會比較明顯，我想，除非記憶很差不然應該不會忘記吧。
34.不要使用GIF動畫圖片檔
當你使用了動畫圖片GIF檔，訪客一半以上的注意力都會被分散，所以不要在網頁中有會動的圖片，除非你就是要他點那個圖片，才會這樣做。而且，這會讓你的網站顯的非常不專業，有很多新手都喜歡讓網頁動來動去的，但那很不好。
35.圖片盡量都要有ALT和TITLE標籤
就如大家所知，ALT和TITLE標籤都有正確設定在圖片上對於SEO一定會有幫助，它可以幫助搜尋引擎蜘蛛了解圖片的內容。ALT標籤則是會在圖片失連時顯示出所設定的文字，也有幫助。
36.網頁請溫和，不要使用強大對比刺眼色彩
網頁如果有一些刺眼的圖片是真的會讓人想關掉網頁，寧可不看文章也不要讓眼睛不舒服。特別是在網頁背景圖片，不要使用紅白點格、藍白點格等等非常非 常刺眼的顏色。如果你發現有這種情形發生，請你馬上把顏色換掉，換成溫和的顏色，要選好的顏色就是參考他人的網站，自己再變化一下。
37.不要使用POPUP彈出視窗
現在許多瀏覽器都已經有防跳窗的功能了，因為惡意網站總是利用跳窗來載入不正常的東西，而且會妨礙訪客瀏覽網頁。使用POPUP彈出視窗是一個很爛的決定。
38.避免過度的Javascript、jQuery使用
Javascript是最邪惡的程式語言，因為他的標準非常不統一，常常會造成不同瀏覽器的兼容問題，也非常容易和其他Javascript產生相 衝的問題，jQuery的版本也非常難搞，因為某些功能是在舊版開發的，所以與新版程式碼常常會有很大的問題，DEBUG是非常邪惡的英文字。
39.在網頁底部提供更多資訊
不知道大家有沒有這個習慣，就是看網頁一定會拉卷軸到最底部，確認過沒有其他內容後才離開。透過這點，許多國外企業網站常常在頁底放連絡資料、更多介紹文、粉絲團嵌入、首頁等等功能，這些都有可能讓訪客有更多的資訊，讓訪客停留於網站的時間更長，黏著度更高。
40.文章別一直換行，請善用標點符號
有時候會看到某些部落格的文章，打一行字後就馬上換行，這樣的排版方式我都一直質疑他到底會不會寫作文，會這樣寫嗎？文章應該善用標點浮號，讓網頁不會看起來那麼長，要一直往下拉很麻煩。
41.網頁不要橫式拓展
目前滑鼠的滾輪也只能讓網頁繼續往下拉，並沒有往左往右拉的功能，所以網頁的橫式寬度請不要過大，盡量橫向1000px就夠了，就現狀還是滿多人使用1024*768解析度。
42.避免語法打錯字、邏輯錯誤
某些標籤你打錯字或沒有正常關閉或許不會察覺到，但是這終究是不好的習慣，當你在修改網頁時有可能因此出現錯誤，影響網頁整體的品質。別以為你不會犯這個錯誤，當你網頁一寫多的時候就會產生錯誤了。
43.避免驗證題目太難、驗證碼不易辨識
之前曾經看過驗證問答還有乘法、除法的，或是驗證碼整個給他歪到一個不像樣的地步，這都是很不好的，也許還需要動員全家才能解出這個驗證碼…所以，驗證碼別太難，適中就好，不是所有人都很會看驗證碼。
44.不要變更已經公開網頁的網址
更改已經公開的網頁的網址如大家所知對SEO不好，同時也對有把網址加入到書籤、我的最愛的讀者帶來不便。
45.(WordPress)盡量不要使用過多的外掛
這點WordPress架熟的讀者應該都知道，雖然外掛真的很方便對於新增功能，但WordPress外掛安裝太多是真的會拖慢網頁載入速度，而且會有更多的安全性風險，除了不方便寫在佈景的功能以外，其他能不裝就不裝。
46.除了內文，其他區塊盡量減少圖片
網頁內文要圖文並茂這點我非常同意，也有利於SEO。但是其他地方，如側邊欄的地方，就盡量不要使用圖片做出效果，應該要使用CSS，並做到最簡化，「簡單風」是未來的趨勢，千萬別把網頁製作的太複雜、用太多圖片。用太多圖片會拖慢載入速度。
47.勿使用太複雜的導航文字
導航的文字真的不需要複雜，不需要像是一個成語一樣，只需要最簡單的幾個字就好。如「關於我們」、「連絡我們」、「訂閱我們」，其實這個還可以更簡單，把我們去掉也可以。
48.不要放太多的廣告
這點沒做到的人大概都是被金錢給迷惑，因為他們寫部落格的目的為金錢的成分很重。重點是，廣告太多不僅容易讓訪客對你的網站印像差、還會佔掉取多網頁版面。不過適量的廣告是非常ＯＫ的，畢竟能夠多買杯珍奶嘛～XD。
以上列出４８點比較重要的，在網頁設計中易犯的錯誤，就同開頭所說，不是完全正確，當然也沒有標準答案，只有最好的方法。所以，歡迎留言討論。以上可能有許多點你都已經知道了，也別介意，不妨再複習一下。另外，再註明一次內容大綱來自這裡，再經過大篇幅的翻譯與改寫。
(摘自： 網站設計 討論區)
參考文獻：
1.約瑟夫‧派恩（B. Joseph Pine II）& 詹姆斯‧吉爾摩（James H. Gilmore）、夏業良譯（2003）。體驗經濟時代。台北：經濟新潮社。
2.賴逸婷（2007）。網站體驗品質評估之研究。國立雲林科技大學視覺傳達設計研究所碩士論文，未出版。
3.張婷玥（2006）。顧客體驗與體驗品質之概念性研究。國立政治大學企業管理研究所碩士論文，未出版。
資料來源：fundesigner
留言列表
