DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 設計理論:界面內容優化的層次
設計理論:界面內容優化的層次
編輯:關於網頁技巧     

所謂產品其實最終展現在用戶面前的只是界面而已,所謂界面絕大多數時候只包括兩個部分:圖片、文字。
重視界面上的每一個像素和每一個文字是UED的基本素質,關於如何設計好界面上的文字(一般在UED裡面我們把這個職位叫做“內容優化”)我以前寫過創業團隊的界面文字優化和用戶在每個情景中的角色感,這一期的話題中其他伙伴也說到了很多。

這個話題討論到這裡,已經讓很多人意識到了界面上文字的重要性:界面的文字就好像一個人的談吐,文字給用戶的感覺不單單只是一個“信息”的傳達,他還關乎用戶對於產品的情感印象和“產品氣質”的理解。

那麼,我應該說點什麼呢?在今天寫這個話題之前我就一直在思考:能否系統化的把“內容優化”像“體驗”一樣分層次的理解?

.

1,界面上的文字應該做到:清楚而准確的向用戶傳達信息
其實這是內容優化的最基本要求,本應該是所有產品都可以做到的。但往往是越熟練的人越容易在這裡出現問題。常見表現:過份的向非專業用戶展示專業詞匯、信息提示本身誤導了用戶。

比如,某視頻網站突然蹦出來一個“bps超出,鏈接失敗。”(查了資料我才明白bps大概是每秒鏈接數的意思)
比如,有些網站用戶沒有注冊也去登錄的時候反饋提示為“密碼錯誤”。其實直接提示沒有此用戶,然後給個鏈接“注冊此用戶”,你會發現轉化率相當高,注冊量有了用戶也方便了。

2,界面上的文字應該便於用戶閱讀並快速理解其含義
最常見的問題表現是:語言過於羅嗦、信息排列混亂。

比如,某門戶網站在注冊blog的時,“您的登錄名”旁邊這麼寫輔助說明:“4-16個字符(包括4、16),英文小寫、漢字、數字、下劃線,不支持空格,不支持全角英文,不支持純數字,不能使用下劃線開頭和結尾。”。(大致推算了一下,一個IQ小於200的普通用戶如果認真讀完並完整理解這句話的意思需要近1分鐘時間)
比如,另一門戶的blog和他旗下的校友錄網站,東邊一個下劃線、西邊一個icon加文字、南邊一個按鈕加文字、北邊一個紅色、中間還有一個紅色加粗。我進去之後真不知道什麼地方可以點什麼地方不可以點,什麼地方能點什麼地方不能點…
再比如,某電子郵件服務在注冊的時候這樣排列:“用戶名:___、密碼:___、密碼強度:[][][]、重復密碼:___”。嚇的我還以為可以自定義密碼強度。。。

3,整個產品不同位置的文字應該統一。大家都講普通話,不能一會中國話一會外國文。
這是一個最簡單的問題,卻是大部分網站都未能避免的問題。(特別是在中文網站,大概是因為中文說法太多了)
比如,作一個IM軟件,一開始是“添加好友”,接下來“聯系人列表”,然後又是“不在線的朋友”;一開始是“注冊用戶名”、然後是“登錄ID”、還有“您的賬戶”、“管理帳號”、…

4,界面上的文字應該具備該產品需要傳達給用戶的氣質

這裡往往遇到的是怎麼做的問題:怎麼確定產品要表達什麼樣的氣質?怎麼確定什麼樣的語言風格才算是表達了這樣的氣質?
在稍微大型的企業我們一般有很多種方法可以做到,比如找很多用戶讓他們說出他們需要的、比如通過情緒板、比如通過顏色分析等等。
但在創業公司我一般建議大家實用一點:
1>N個很了解產品定位的人坐到一起,每人一個貼紙寫下來一個你認為可以描述該產品的句子或者事物;
2>把所有人的描述拿出來大家討論,把每一個用二維分析的方式擺出來,最終得到一個大家都認可的結果就是這個產品應該表達的氣質;
3>每人N個貼紙,根據剛才得到的結果,結合自己產品的環境寫下來你認為要表達這種氣質需要什麼樣風格的語言;
4>用第2點中同樣的方法得到一個統一的結果,(比如:嚴肅、簡練、..)
5>安排一個專門的人寫一份簡單的指南,描述這個結果具體執行時一些需要注意的常見問題和原則。(比如:既定事實不再重復、不用反問語句提問用戶、即時說明文字不得超過20字、…)

5,文字的視覺設計應該完整的融入整個產品視覺中。
很多視覺設計師喜歡把文字融入到界面的造型中去,得到非常棒的視覺效果,這個很值得學習。
從最基礎來說,我們的文字在界面上和圖形一樣應該有主次有深淺,關於這個部分潇潇同學已經有了很好的表述,我只補充一個例子:

圖片網站本身應該表現的是“圖”,文字只是其輔助信息。
flickr在個人首頁裡每個圖片下面都有四行的文字,但我從未感覺到他礙眼或者多余,因為flickr用的是很柔和的粉紅和幾乎可以讓我第一視覺點忽視掉的灰色;
而yupoo在個人首頁裡每個圖片下面只有三行文字,可每一個我都覺得他們扎眼,因為yupoo用了重灰色粗體、綠色粗體、重灰色、綠色四種表現方式,而且字體都還不一樣。

6,盡量讓文字自身可以起到“推銷”產品的作用,而且”推銷”的不只是產品氣質
文字其實可以像圖形設計一樣在情感上給用戶以觸動,從而積極的達到對於產品的“推銷”。
比如,很多人已經把“注冊”改成了“立即注冊”、“馬上注冊”;
比如,baidu.com的“更多”頁面最上面以前是“推薦使用”後來改成了“試試看”,雖然只是少了一個字,但給用戶的感受和嘗試欲望馬上就很不一樣;
比如,某電子商務網站會在注冊要完成那裡說:“太好了,你還需一步就能成為我們的注冊會員”
比如,…

.
.

ps:
關於內容優化,《交互設計》和《Designing web usability》兩本書都簡單的提到了一些類似“准確傳達信息、不要羅嗦、不要多余、文字要統一、要符合產品風格”的話,但說的都很淺,而且言

12下一頁
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved