網站設計大不易

仔細看完再來註冊

相信很多人都有加入網站會員的經驗，而通常在註冊登記的過程中，網站都會要求註冊者必須先閱讀一份聲明，使用者必須按下同意按鈕之後，才能開始輸入資料。不過我想大部分的人可能不一定會仔細閱讀，而是快快拉到最下面尋找「我同意」的按鈕。不過有些網站可不願意隨便接受太爽快的人，而是當使用者進入「服務條款和聲明」這頁的時候，會先開始計算時間。如果設定的時間還沒到，可沒有「我同意」按鈕可選。

我覺得這樣的設計不錯，既能讓大家多注意一下使用聲明，也提醒大家必須對在網路上提供自己資料這件事更謹慎以對。

案源：台灣smart俱樂部

另類FAQ

一般FAQ都是把常見問題一次列出來，方便使用者選擇。而且問題的類型常圍繞3W與1H(Why, When, What, How)。Smart USA就用這種方式讓使用者自行產生Q與A。一邊讓使用者抓3W與1H中的某一個字（拿掉Why, 改用Where)，另一邊則提供了與汽車有關的其他幾項關鍵字。這些問題不全然是一般FAQ問題的類型，有些只是為了強調設計的理念與產品特性，但用這樣的介面呈現FAQ，倒的確很符合Smart想要達到的品牌效果。

案源：Smart USA http://usa.smart.com/brand/smartUSA.html *

要稱它做鄉土味十足嗎

這是一家小公司，但有個很有趣的網站。其一是在他的網頁上有很多地方寫著「按它」或「請按這裡」。在堆滿文字的網頁中發現到這些超連結，已經會讓人忘記能見度的問題，反而是會產生一些莫名的親切味道。

另外它的公司地點介紹也是一絕。除了有市區地圖以及如何由北二高到他們公司的文字說明之外，還特地拍了一段影片，把從北二高開始沿路的重要指標都拍了下來。由於拍攝技巧不太好、沒有旁白，加上鏡頭中有太多路況與街景等不相甘訊息，因此對於顧客開車找到這間店會有多少幫助，其實還頗讓人懷疑，不過誠意倒是看得見。 真是特別的網站！

案源：上豪Sony DV攝影機專賣店 http://www.d8vcd.com.tw/

神奇的跑馬燈

大概在幾年前，網路上的跑馬燈還隨處可見，因為許多人對於這種「特效」感覺很新奇。不過慢慢地愈來愈多人知道，就跟實體世界中也不是哪裡都適合裝跑馬燈一樣，網站上擺跑馬燈通常是弊多於利。主要原因就是目的性上網的人愈來愈多，沒有人有興趣去注意那種潛意識裡知道是屬於廣告或訊息公告的小塊區域，更不要說要自己的眼睛得去盯著不斷移動與出現的文字，本來就不是一件太愉快的事。

不過愈來愈少不代表就全部消失，我就在一個網路銀行網站上看到這個神奇的跑馬燈。稱他為神奇跑馬燈的第一個原因是這是一個網路銀行的登入區域，也就是使用者必須登入之後才能到這個地方，而使用者之所以會來此登入，自然是想查詢餘額或使用如轉帳之類的服務，但沒想到這家銀行會選擇在這裡擺放擾人的廣告；這個跑馬燈之所以神奇的第二個原因，是因為這個跑馬燈有三行「顯示幕」，每一行的訊息都是各自獨立的。所以如果有人真的認真停下來讀上面內容的話，還得練就「一目三行」的神功才能同時讀完這些訊息，所以我說他是神奇的跑馬燈。

以下三張圖片是螢幕畫面連續捕抓，中間白色逐漸被紅字掩蓋的區域就是神奇的跑馬燈。

案源：國泰世華銀行 個人化網路銀行 http://www.mybank.com.tw

氣象資料的時間性很重要

這兩天由於米勒颱風的實際路徑和預測差距很大，使得中央氣象局備受批評。雖然從氣象局的解釋當中，知道由於海面上觀測資料少，11月發生颱風機率不高等原因，都使得秋颱的路徑較難預測，但民眾在颱風期間對於即時天候資料的渴求，卻是更甚於平常。因此中央氣象局網站的確責任重大。

在讓民眾了解天候資訊這件事情上，中央氣象局的網站絕對有很多地方可以做得更好，不過以滿足民眾對於即時氣象資訊這件事來說，到是有兩件事可以提。一是每當遇到如颱風這樣的重大天候變化時，氣象局網站的首頁就會變成index-typhoon.htm，而不是平常的index.htm，而在畫面最上方也會有類似飛機布條的動態效果，顯示目前有一個颱風正在影響台灣（11/3那天也正好有個地震）。就滿足民眾知的需求來說，這其實是不錯的做法。

第二點則是在許多訊息提供上，氣象局的網站應該設法做到每則資訊旁邊都附帶日期與時間，否則有些民眾就會懷疑該訊息的有效期間。就像一般人在看颱風路徑圖的時候，都會十分注意「現在中心位置」與「24小時後中心位置」一樣。可惜在【颱風記者會】裡，不僅在開啟影音檔的網頁上沒有註明這是何時舉行的記者會，同時從記者會影像轉播中也看不出來，這些都有可能會造成一些民眾的困擾。

案源︰中央氣象局 http://www.cwb.gov.tw

使用Frame壞處多（一）

對設計者來說，採用Frame很方便，但對使用者來說，卻正好相反。螢幕空間變小、使用者無法記錄網頁位址、站內搜尋系統設計困難、不易從搜尋引擎找到等，都是使用Frame的缺點。以上台北市市民交通旅遊網，查詢公車資訊為例，使用Frame設計的缺點就表露無遺。

如圖所示，整個螢幕畫面被切成四塊，其中最上方保留給網站Logo與一些功能選項及單元連結，左側則作為全域導覽區，中間放了一張台北市地圖，右邊則是「大眾運輸轉乘查詢」的各種查詢方式。因使用Frame而造成不易使用的地方包括

1. 由於左側的Frame沒有上下捲軸，因此如果不是採用大螢幕或高解析度的使用者，根本不知道在【停車拖吊資訊】單元下面，還有【加油加氣充電】等其他單元。作為全域導覽選項卻很可能不會被看到，實在不是一個好的設計。

2. 查詢公車資訊放一張地圖，乍看之下好像很有道理，但實用性其實不強。因為如果要使用者先學會操作電子地圖，找出自己現在以及要前往地點的位置，來尋找公車資訊的話，絕對事倍功半（而且這還是在電子地圖沒有設計得很難用的情況下)。反而是各種查詢方式與界面的設計比較重要。所以擺這張地圖在中間，反而是浪費了寶貴的空間與視覺焦點。

3. 右側的Frame裡面提供了一種以上的查詢方式是好的做法。但很可惜的是，一旦選定某一種查詢方式之後，要再選擇另一種查詢方式的指示不是那麼清楚。如果不是採用Frame的設計方式，可用的空間就不會那麼少，整個查詢系統也才有機會做得更直覺與容易使用。

附帶一提的是，很多網站都對電子地圖存有幻想，認為自己一定要有，而且有就是好，卻從未去考慮使用者在找尋資訊的過程中，什麼時候會需要這種視覺上的輔助。以這個例子來說，大家可以去看看【直接圖面點選】這種查詢方式，然後問問你自己會不會需要以輸入X座標與Y座標的方式來查詢公車資訊。又不是在建立火炮陣地說....

案源︰台北市政府 EZGO市民交通旅遊網 http://ezgo.taipei-elife.net/homepage/index.asp

搜尋結果頁的引導

創新很重要，不過也得看時間與環境，尤其是牽涉界面設計的時候。因為人們可能已經長期習慣某種資訊的表示方法，或功能的控制方式，改變不一定就會更好，反而有可能造成使用者的混淆。

以搜尋結果頁的引導為例，大多數網站在經過查詢之後，都會列出一共找到了幾筆資料，而這些資料以每頁X筆的方式分布在幾頁。一般搜尋結果頁的引導項目通常包括：一共幾頁、目前是在第X頁的標示、往前一頁與往後一頁的符號按鈕，或是前X頁或後X頁的選擇（當搜尋結果頁數很多時）。當許多人已經從一些portal或搜尋網站上習慣這些意義的表示方法時，如果不依照這樣的做法就容易造成困擾。像下面這張圖就是。

當使用者看完第一頁的內容，找不到自己要的之後，很可能會按下一頁的標示或按鈕，但他其實到不了下一頁，因為這個按鈕根本不會work。原來是設計者把「下一頁」的意思詮釋成「下面10頁」，因此當整個搜尋結果頁只有9頁的時候，「下一頁」的按鈕自然無法點選。

案源：永慶房屋 http://www.evertrust.com.tw/

別讓他等

許多電信業者的網站上都會有客戶服務的機制，提供包括費率修改、服務設定、帳單查詢，甚至繳款等各種功能。不過一般消費者通常都習慣直接打電話給客服中心要求辦理，如果電信業者希望節省客服的成本支出，讓多一點的顧客上網自行DIY的話，就要做到讓第一次來的人，在提出使用申請之後，馬上就可以使用。

像台哥大的用戶如果第一次提出網路客戶服務的功能，得等上「24-36小時彙整個人資訊」的時間。我想很多人看到之後可能就直接拿起電話，而不會真的在兩三天之後，想到再上來一次。台灣大哥大的網路客服使用率恐怕因此而減低不少。如果要利用網路提供現有客戶服務的話，最好讓顧客在申請之後就能立刻使用，別讓他等！

案源：台灣大哥大 http://www.twngsm.com.tw/