如何讓界面內(nèi)容的優(yōu)化有層次_網(wǎng)頁設(shè)計教程
推薦:活動網(wǎng)站設(shè)計點評之LG顯示器http://www.lg.com.cn/mnt/event/200707/sale0809/廣告制作:博圣云峰http://www.boosen.com廣告背景:國際知名顯示器品牌——LG于06年推出的銳比(DFC)技
所謂產(chǎn)品其實最終展現(xiàn)在用戶面前的只是界面而已,所謂界面絕大多數(shù)時候只包括兩個部分:圖片、文字。
重視界面上的每一個像素和每一個文字是UED的基本素質(zhì),關(guān)于如何設(shè)計好界面上的文字(一般在UED里面我們把這個職位叫做“內(nèi)容優(yōu)化”)我以前寫過創(chuàng)業(yè)團隊的界面文字優(yōu)化和用戶在每個情景中的角色感,這一期的話題中其他伙伴也說到了很多。
這個話題討論到這里,已經(jīng)讓很多人意識到了界面上文字的重要性:界面的文字就似乎一個人的談吐,文字給用戶的感覺不單單只是一個“信息”的傳達,他還關(guān)乎用戶對于產(chǎn)品的情感印象和“產(chǎn)品氣質(zhì)”的理解。
那么,我應(yīng)該說點什么呢?在今天寫這個話題之前我就一直在思考:能否系統(tǒng)化的把“內(nèi)容優(yōu)化”像“體驗”一樣分層次的理解?
首先,界面上的文字應(yīng)該做到:清楚而準(zhǔn)確的向用戶傳達信息。
其實這是內(nèi)容優(yōu)化的最基本要求,本應(yīng)該是所有產(chǎn)品都可以做到的。但往往是越熟練的人越輕易在這里出現(xiàn)問題。常見表現(xiàn):過份的向非專業(yè)用戶展示專業(yè)詞匯、信息提示本身誤導(dǎo)了用戶。
比如,某視頻網(wǎng)站忽然蹦出來一個“bps超出,鏈接失敗。”(查了資料我才明白bps大概是每秒鏈接數(shù)的意思)
比如,有些網(wǎng)站用戶沒有注冊也去登錄的時候反饋提示為“密碼錯誤”。其實直接提示沒有此用戶,然后給個鏈接“注冊此用戶”你會發(fā)現(xiàn)轉(zhuǎn)化率相當(dāng)高,注冊量有了用戶也方便了。
接下來,界面上的文字應(yīng)該便于用戶閱讀并快速理解其含義。
最常見的問題表現(xiàn)是:語言過于羅嗦、信息排列混亂。
比如,某門戶網(wǎng)站在注冊blog的時,“您的登錄名”旁邊這么寫輔助說明:“4-16個字符(包括4、16),英文小寫、漢字、數(shù)字、下劃線,不支持空格,不支持全角英文,不支持純數(shù)字,不能使用下劃線開頭和結(jié)尾�!�。(大致推算了一下,一個IQ小于200的普通用戶假如認(rèn)真讀完并完整理解這句話的意思需要近1分鐘時間)
比如,另一門戶的blog和他旗下的校友錄網(wǎng)站,東邊一個下劃線、西邊一個icon加文字、南邊一個按鈕加文字、北邊一個紅色、中間還有一個紅色加粗。我進去之后真不知道什么地方可以點什么地方不可以點,什么地方能點什么地方不能點…
再比如,某電子郵件服務(wù)在注冊的時候這樣排列:“用戶名:___、密碼:___、密碼強度:[][][]、重復(fù)密碼:___”。嚇的我還以為可以自定義密碼強度。。。
然后,整個產(chǎn)品不同位置的文字應(yīng)該統(tǒng)一。大家都講普通話,不能一會中國話一會外國文。
這是一個最簡單的問題,卻是大部分網(wǎng)站都未能避免的問題。(非凡是在中文網(wǎng)站,大概是因為中文說法太多了)
比如,作一個IM軟件,一開始是“添加好友”,接下來“聯(lián)系人列表”,然后又是“不在線的朋友”;一開始是“注冊用戶名”、然后是“登錄ID”、還有“您的賬戶”、“治理帳號”…
最后,界面上的文字應(yīng)該具備該產(chǎn)品需要傳達給用戶的氣質(zhì)。
這里往往碰到的是怎么做的問題:怎么確定產(chǎn)品要表達什么樣的氣質(zhì)?怎么確定什么樣的語言風(fēng)格才算是表達了這樣的氣質(zhì)?
在稍微大型的企業(yè)我們一般有很多種方法可以做到,比如找很多用戶讓他們說出他們需要的、比如通過情緒板、比如通過顏色分析等等。
但在創(chuàng)業(yè)公司我一般建議大家實用一點:
1、N個很了解產(chǎn)品定位的人坐到一起,每人一個貼紙寫下來一個你認(rèn)為可以描述該產(chǎn)品的句子或者事物;
2、把所有人的描述拿出來大家討論,把每一個用二維分析的方式擺出來,最終得到一個大家都認(rèn)可的結(jié)果就是這個產(chǎn)品應(yīng)該表達的氣質(zhì);
3、每人N個貼紙,根據(jù)剛才得到的結(jié)果,結(jié)合自己產(chǎn)品的環(huán)境寫下來你認(rèn)為要表達這種氣質(zhì)需要什么樣風(fēng)格的語言;
4、用第2點中同樣的方法得到一個統(tǒng)一的結(jié)果,(比如:嚴(yán)厲、簡練、..)
5、安排一個專門的人寫一份簡單的指南,描述這個結(jié)果具體執(zhí)行時一些需要注重的常見問題和原則。(比如:既定事實不再重復(fù)、不用反問語句提問用戶、即時說明文字不得超過20字、…)
還有,文字的視覺設(shè)計應(yīng)該完整的融入整個產(chǎn)品視覺中。
很多視覺設(shè)計師喜歡把文字融入到界面的造型中去,得到非常棒的視覺效果,這個很值得學(xué)習(xí)。
從最基礎(chǔ)來說,我們的文字在界面上和圖形一樣應(yīng)該有主次有深淺,關(guān)于這個部分瀟瀟同學(xué)已經(jīng)有了很好的表述,我只補充一個例子:
圖片網(wǎng)站本身應(yīng)該表現(xiàn)的是“圖”,文字只是其輔助信息。
flickr在個人首頁里每個圖片下面都有四行的文字,但我從未感覺到他礙眼或者多余,因為flickr用的是很柔和的粉紅和幾乎可以讓我第一視覺點忽視掉的灰色;
而yupoo在個人首頁里每個圖片下面只有三行文字,可每一個我都覺得他們扎眼,因為yupoo用了重灰色粗體、綠色粗體、重灰色、綠色四種表現(xiàn)方式,而且字體都還不一樣。
再有,盡量讓文字自身可以起到“推銷”產(chǎn)品的作用,而且”推銷”的不只是產(chǎn)品氣質(zhì)。
文字其實可以像圖形設(shè)計一樣在情感上給用戶以觸動,從而積極的達到對于產(chǎn)品的“推銷”。
比如,很多人已經(jīng)把“注冊”改成了“立即注冊”、“馬上注冊”;
比如,baidu.com的“更多”頁面最上面以前是“推薦使用”后來改成了“試試看”,雖然只是少了一個字,但給用戶的感受和嘗試欲望馬上就很不一樣;
比如,某電子商務(wù)網(wǎng)站會在注冊要完成那里說:“太好了,你還需一步就能成為我們的注冊會員”
比如,…
ps:
關(guān)于內(nèi)容優(yōu)化,《交互設(shè)計》和《Designing web usability》兩本書都簡單的提到了一些類似“準(zhǔn)確傳達信息、不要羅嗦、不要多余、文字要統(tǒng)一、要符合產(chǎn)品風(fēng)格”的話,但說的都很淺,而且言語中能察覺到作者并未想深入表達,或者他們本身也確實沒有很深入的研究。
界面上的文字看似是一個很細(xì)小的東西,實際上他蘊藏著很多的價值并且在潛移默化為產(chǎn)品帶來好的或者不好的利益。中國人說“察言觀色”,我想“言語”的表達對于中國用戶的觸動應(yīng)該會更加的明顯。國外現(xiàn)在也還沒有在內(nèi)容優(yōu)化上非常全面和深入理論知識,可能也是因為他們的語言并沒有中國這樣博大精深(或者說“多變”)。
所以,研究和發(fā)揮好“界面上的文字”對于產(chǎn)品的價值也許更適合也更值得在中國做。這里有不小的空白的空間,值得我們發(fā)揮。
共勉。
分享:如何布局電子商務(wù)網(wǎng)站電子商務(wù)網(wǎng)站的布局類別繁多,按欄位分有兩欄式、三欄式、多欄式,按對齊方式分有居中對齊、左對齊,按照寬度分也有寬屏和非寬屏之分。如此之多的布局,那電子
- 中國互聯(lián)網(wǎng)黑色產(chǎn)業(yè)人數(shù)近10萬 5分鐘1起網(wǎng)絡(luò)入侵
- 馬云最后的發(fā)布會:打假,打出阿里的新未來
- 實踐分享:ACCESS數(shù)據(jù)庫導(dǎo)入mysql數(shù)據(jù)庫
- ACCESS數(shù)據(jù)庫轉(zhuǎn)ORACLE數(shù)據(jù)庫分享
- CDN.net免費CDN申請使用教程:100GB流量香港日本新加坡節(jié)點
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺教程(二) 消息管理與群發(fā)
- 中國IPv4地址今年將告罄 IPv6期待打破政策局
- 移動廣告野蠻成長:75%投放在iOS平臺
- 災(zāi)難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬部iPhone遭蘋果退貨 損失10億元
- 相關(guān)鏈接:
- 教程說明:
網(wǎng)頁設(shè)計教程-如何讓界面內(nèi)容的優(yōu)化有層次
。