接受偽按鈕(2)_網頁設計教程
推薦:網頁按鈕的功能與表現作者:http://www.chouyu.com.cn/目前在網頁中普遍出現的按鈕可以分為兩類:一種是有提交功能的按鈕---真正意義上的按鈕;另一類是僅僅表示鏈接的按鈕,在
嘗試著區分真、偽按鈕
“設計兩類不同樣式的按鈕”---這似乎是個好辦法。然而,卻并不輕易做到。首先,需要設計出兩個樣子不同的圖像,讓用戶知道這些東西是可點擊的,是按鈕。它們應該是有立體感的,上面還要能足夠清楚的顯示文字。
除了看上去像是能點擊的,他們兩個還要表達出文字鏈接與按鈕的區別:文字鏈接指向另外一個界面,點擊后不會出現什么嚴重的后果,假如您后悔了,那就點擊一下瀏覽器上的“后退”按鈕。而按鈕就比較恐怖了,點擊后,郵件將發送到對方的郵箱中,文章將被成千上萬的人看到……兩個這么抽象的概念,要想通過兩個方寸大小的圖像表達出來是很困難的,yahoo進行了償試:
在鼠標經過“My Yahoo!”的時候,會出現下劃線,與這個頁面上的其他文字鏈接的樣式一樣。看上去是一個按鈕,但是不失時機的告訴用戶這個“按鈕”和頁面上的其他文字鏈接有某些相似的地方。而“Web Search”這個真按鈕就沒有類似文字鏈接的表現。設計者用這個下劃線來區別真按鈕與偽按鈕。
另外一種相似的做法是,按鈕的文字上始終顯示下劃線。雖然具體的形式上有些不同,但是思路是一樣的:讓偽按鈕既有文字鏈接的樣子又有按鈕的樣子。
然而這樣的設計恐怕還不足夠好,多數用戶首先會看到那是一個按鈕,假如有耐心仔細研究一下,恐怕也只會覺得那是個有點兒希奇的按鈕,即便確實分辨出了這個“My Yahoo!”與“Web Search”有所不同,又有幾個人能明白這樣的區別意味著什么呢。
這樣的償試目前為止并不成功。
還有一個辦法!
“不區分真按鈕與偽按鈕,把他們都做成一樣的按鈕。”這是amazon.com給我們提供的解決辦法。
既然那些重要的文字鏈接需要看上去象個按鈕,我們又很難讓用戶理解一個頁面上有兩種不同性質的按鈕。那么,就不要區分了。給用戶看到的只是文字鏈接和按鈕兩種元素。而點擊按鈕將出現的后果由按鈕上的文字來說明。
這樣做雖然不符合widow圖形用戶界面的設計原則,但是在很大程度上卻是符合用戶使專心理的。我們不可能幻想著用戶在瀏覽一個網頁的時候知道什么叫<form>,用戶也不會去判定一個按鈕是否會把一些數據寫入數據庫。用戶面對一個頁面的時候,會被頁面上的按鈕吸引,閱讀上面的文字,確定那個按鈕是自己想要做的事后,就點擊了。那么,不管是“進入結算流程”還是“登錄到我們的安全服務”只要在點擊前清楚的交代了點擊后的效果就夠了。樣子并非一定要不同,也并非一定要相同。而相同的好處在于減小了用戶的學習成本。不同的網站上的按鈕樣子往往是不一樣的。用戶面對一個頁面的時候先要學習,認清什么樣子的東西是按鈕。假如整個網站上的按鈕全是一個樣子,顯然會更輕易學習。(amazon.com上實際有不止一種的按鈕,為的是區別重要性,與是否提交表單無關。)
使用這種設計方法,不用再強迫圖形設計師畫出兩種幾乎不可能畫出來的按鈕樣式了,更重要的是,用戶看到的頁面更簡單了。
不區分真、偽按鈕的做法需要我們花更多的心思判定哪些文字鏈接是可以被“升級”為按鈕的。因為把文字鏈接“升級”為按鈕意味著他很重要,而一個頁面上不應該有很多重要的內容。同時,按鈕上的文字表述也是需要花很大精力的,尤其是對于我們。我相信,在中國多數的網頁設計師,象我一樣,并不具備很強的文字表達能力。在按鈕上顯然又不可以長篇大論,要用幾個字描述清楚點擊后的效果并不簡單。但是,卻很必要。
需要強調的是,這整潔劃一的一個按鈕樣式不應該是系統標準按鈕,因為系統按鈕是“真按鈕”的標準造型。想象一下,把“了解更多”弄成一個系統標準按鈕的樣子,絕對會比阿扁現在的言行更可笑。
總結一下
要解決真、偽按鈕的問題有兩個辦法,方法一.是象google那樣,文字鏈接就是文字鏈接,再重要的文字鏈接最多也就是顯示的稍微大一點兒。這種方法通常不會通過評審的,那么,可以試試第二種方法,不區分真、偽按鈕,只使用一種按鈕樣式,斟酌適用范圍,確保頁面上重點突出,而不是重點泛濫。推敲文字表述,確保清楚的描述點擊的后果。
我不得不承認,這種辦法是與《誰》一文中相悖的。但是,我仍然認為,對于目前的大多數網站,這種不區分真、偽按鈕的方法是最好的。
分享:按鈕上的內容作者:http://www.esunweb.com/最近UCDChina以“注重界面上的文字”為主題寫了一系列的文章,使我在界面文字上的使用受益匪淺。之后,我對按鈕上的內容的
- 相關鏈接:
- 教程說明:
網頁設計教程-接受偽按鈕(2)
。

