9個小細節 網頁設計要多留心
要設計出一個使用者體驗絕佳的網站，除了視覺美觀、功能完整之外，細節也是不可或缺。甚至我們可以說，兩個功能相近的網站，決定使用者體驗差異的關鍵，正是細節。
這篇文章提供了九個 網站設計 者可以思考的細節。
1. 訪客點過的超連結
不論是新聞、Google 搜尋結果、部落格文章或是 Facebook 上的內容，一般來說都會有很多連結。以 Google 搜尋為例，如果我們點過的搜尋結果其連結沒有「上色」，那我們很可能會忘記哪些搜尋結果是已經點開來查看過的。如果點過的連結顏色會與沒點過的不同，便能 讓使用者一眼分出哪些是已經點過的。
我們熟悉的 Google、CNN、BBC、紐約時報等都有這樣的設計，不過像是華爾街日報、聯合新聞網等則沒有。其中 Google、Yahoo 與紐約時報都是用紫色做為區隔。
2. 點擊網頁 Modal Window 以外的地方應該要能關閉
有時候網站會出現一個浮出視窗（modal window），例如我們要分享 Facebook 上的貼文時跳出來的那種，不過比較討厭的是當我們要關閉那個視窗時，點擊視窗以外的地方並不能直接關閉視窗，只能點右上角的「X」，這樣樣一來我們還得精 準地移動滑鼠，顯得不是那麼方便。
這個部分 Twitter 就做得不錯，在使用者發表推文的浮出視窗外點一下，就可以關閉視窗了。即便是編輯推文的中途不小心關閉視窗，再打開一次就可以了，編輯到一半的內容會在那邊等待使用者去完成。
3. 網頁載入後，讓游標出現在第一個輸入框
當使用者看見網頁上出現待填的表單（例如常見的網站登入介面或報名表），這個時候如果游標可以直接出現在第一個待填的欄位，不必勞駕使用者移動滑鼠，那麼體驗自然會比較好。
另外一個例子是 Yahoo 字典，他們的游標會自動出現在查找單字的欄位，而不是上方的網頁搜尋——畢竟使用者都點進來字典了，要找的當然是單字而非網頁。
4. 按下 Enter/Return 就可以送出表單
不知道大家有沒有這樣的經驗——填完表單（或是登入網站時要填帳號密碼）按下 Enter 鍵之後卻什麼也沒發生？原來是要移動游標點擊「送出」按鈕。在台灣，登入露天拍賣網站時輸入完帳號密碼後，一定要以點擊「登入」按鈕的方式登入，要是輸入 完畢直接按 Enter，系統會堅持：請用滑鼠點選登入按鈕 XD
這樣的設計有好有壞，例如可以避免因為誤觸而送出未完成的表單，但相對而言麻煩許多，畢竟有很多情況只是我要登入一個網站，而不是要轉帳或是送出大 學聯考的志願序。當然，最好的情況是針對表單的特性設計避免使用者意外送出表單，例如在送出重要表單前再跳出一個確認對話框避免誤觸情形。（需要選字的輸 入法有時候會遇到不小心多按了一次 Enter 的情形）
5. 當游標移到圖示的時候，給點功能提示吧
我們知道在網站上使用圖示代替文字描述是個優雅的方式，例如垃圾桶代表刪除、購物車代表，呃，購物車。但是並非每個人都這麼熟悉這些你我覺得很常見的圖示背後所代表的含意，例如比較少接觸電腦或網路的使用者，此時文字上的描述就顯得很重要。
6. 記得在部落格放上連回網站的連結
現在絕大多數的網路服務都會放上部落格連結，但是別忘了要在部落格上加入連回網站的連結。這只是個小細節，也許使用者可以按一次（或是很多次）「上 一頁」回去部落格，或是簡單移往旁邊的分頁即可，但是別忘了，我們常說好的介面設計是讓使用者無法察覺的設計，萬一使用者「發現」自己找不到回去網站的 路，豈不就糗了？
例如「Castro」這個最近剛推出的 podcast app，網站跟 app 本身都設計得不錯，可是點了部落格連結，讀完他們發表的宣言或是產品更新資訊後卻會發現：回不去產品頁面了。
7. 單獨展示圖片或照片時，尺寸要比縮圖還大
相信大家都看過部落格文章或是購物網站的商品介紹，這些頁面上往往會有「燈箱」設計，目的是放大文章裡的縮圖，單獨展示圖片或照片，可是有時候會遇 到一種很瞎的狀況——展示出來的尺寸根本沒有比較大，甚至還會有變小的情形。請記得使用者單獨點擊照片的時候，是希望可以看到更大尺寸的圖片，而不是欣賞 燈箱本身的效果。
8. 讓使用者可以編輯已發送的訊息或貼文
一般而言，像是部落格或網路相簿等等，都會讓使用者編輯已經發送出去的內容（文章或是照片的文字描述），然而有些情況並不適合讓使用者「反悔」，例如 ID、留言等等，因為那容易造成混淆或是誤會。
不過近年一些大型的網站例如 Facebook，已經開放讓使用者編輯已發出的狀態或是留言，只是依舊會留下編輯前的版本供他人檢視。最近 Twitter 也傳出在實驗讓使用者「編輯」已發出的 tweet。
9. 不要同時使用「Sign In」與「Sign up」
如果網站的語言是英文，那麼「Sign In（登入）」與「Sign Up（註冊）」儘量不要同時使用，假如選擇「Sign In」，那麼代表註冊的詞最好改用「create account」，假如註冊要用「Sign Up」，那登入就可以用「Log In」。當然，中文網站大概比較不需要擔心這種情形。
以上九點都是網站設計上的小細節，但若不注意，卻有可能導致乏善可陳的使用者經驗，反之，如果想要做到讓使用者完全沒有察覺，順暢而愉快地使用網站，那麼這些細節便是不可忽視的。
參考文獻：
1.李俊宏（1995）。 網頁設計 原則的研究一以大專院校首頁設計為例。雲林技術學院 程式設計 研究所碩士論文，未出版，雲林。
2.王育民、王怡舜 (1999), 行銷策略導向之旅館業網際網路服務內容規劃與設計, 第五屆服務管理研討會, 台北市, .
3.林隆儀、林岳民 (2005), 廣告比較策略與廣告訴求方式對購買意願的影響-產品涉入之干擾效果, 企業管理學報, 65(), 1-30.
資料來源：inside
最新文章
HVACKer：入侵隔離網絡的新型攻擊技術還有什麼不會被入侵？路由器 LED 燈已成為攻擊入口美 5 家獨角獸同天申請 IPO 掛牌，最狂的是一家估值 124 億美的數據分析新創！【台灣「智慧產業」開始佈局】緯創集團領投跨國 AI 新創 iKala，下一步拓展東南亞市場快可以用手機遠端遙控你的所有家電了
