按鈕上的內(nèi)容_網(wǎng)頁設(shè)計(jì)教程
推薦:60種分頁案例和好的實(shí)踐作者:http://dancewithnet.com/結(jié)構(gòu)和層次降低了復(fù)雜性并提高了可讀性。你的文章或站點(diǎn)組織的越深入,用戶就越輕易理解你觀點(diǎn)和得到你想傳達(dá)的信息。在網(wǎng)頁
最近UCDChina 以“注重界面上的文字”為主題寫了一系列的文章,使我在界面文字上的使用受益匪淺。之后,我對(duì)按鈕上的內(nèi)容的表現(xiàn)也做了一些總結(jié)與分析,與大家分享并希望得到指正。
1. 不必區(qū)分按鈕還是鏈接。(這里列舉的不是對(duì)他人觀點(diǎn)進(jìn)行攻擊,而只是得以借鑒。)
很多人主張區(qū)別鏈接與按鈕。這里,思域有一篇“關(guān)于鼠標(biāo)點(diǎn)擊對(duì)象:哪些應(yīng)該是按鈕,哪些應(yīng)該是鏈接的說明。” 臭魚的“網(wǎng)頁按鈕的功能與表現(xiàn)”,將按鈕分成真正的按鈕和偽按鈕兩類。
而事實(shí)上,不管是按鈕還是鏈接,按照用戶目標(biāo)向?qū)硗瓿扇蝿?wù),鏈接也完全可以做成按鈕來實(shí)現(xiàn)用戶目標(biāo)的突出。而且并非一定能定義按鈕和鏈接的功能,假如說按鈕是為了發(fā)生“功能性的事件”而設(shè)計(jì)的話,那么鏈接打開一個(gè)新的頁面是否也是一個(gè)功能性的事件?所以,為了突出讓用戶完成當(dāng)前頁面重要的功能,哪怕只是個(gè)鏈接,都可以從視覺和表意上,通過按鈕來實(shí)現(xiàn)。當(dāng)然,不主張?jiān)谝粋(gè)頁面使用非常之多的按鈕。
如淘寶的商品頁上,為了讓用戶方便的找到當(dāng)前商品的來源等與店主的相關(guān)信息,他們將以前的鏈接改成了按鈕:
2. 我點(diǎn)擊會(huì)“發(fā)生什么”
目前,各網(wǎng)站上的按鈕上的文字內(nèi)容沒有一個(gè)主觀的思想,想到什么就是什么,沒有在文字上的太多推敲。
前面說到鏈接可以當(dāng)按鈕,但有時(shí)一串很長的文字為鏈接,如一篇文章標(biāo)題。而按鈕上的文字是需要講究精短易懂的,能快速理解其含義。
先看幾個(gè)例子的比較:
A:這是NOD32防毒軟件在碰到病毒時(shí)的窗口,當(dāng)用戶碰到病毒時(shí),會(huì)有些懼怕與謹(jǐn)慎,他們想快速的病毒拒之門外,而又不確定是否對(duì)系統(tǒng)本身會(huì)不會(huì)受到威脅。當(dāng)彈出這個(gè)窗口時(shí),會(huì)對(duì)這個(gè)“停止”按鈕產(chǎn)生有兩種疑問,點(diǎn)擊了這個(gè)按鈕是停止軟件的阻止?還是停止病毒的威脅?
B:仔細(xì)看這兩個(gè)按鈕上的文字,“寫日志”是從QQ空間里截來的,有謂語和賓語的,當(dāng)然主語就是用戶自己“我”,組合起來就是“我寫日志”;“購買”是從淘寶的商品頁面上截的,卻只有一個(gè)謂語(動(dòng)作),可以完成的組合是“我購買商品”。但他們都恰到好處的在自己的崗位上完成自己的職責(zé)。為什么呢?后面再總結(jié)。
C:“點(diǎn)擊進(jìn)入”完全多余,只是增加了用戶在按鈕上停留的時(shí)間。
所以,通常情況下:一個(gè)按鈕,結(jié)合頁面上的其它交互和信息組織,要能恰到好處的組合成一個(gè)完整的句子“我點(diǎn)擊會(huì)發(fā)生什么”,而“我點(diǎn)擊”三個(gè)字是在我和鼠標(biāo)之間的事,而不必要在網(wǎng)頁上出現(xiàn)。所以例子C中按鈕上的“點(diǎn)擊進(jìn)入”是多余的。至于什么是恰到好處,為什么淘寶上那個(gè)“購買”就只有謂語動(dòng)詞也能恰到好處,這就與頁面交互有關(guān)了。我的分析是,當(dāng)用戶與頁面在完成某個(gè)任務(wù)時(shí)而產(chǎn)生一系列的交互事件,而這個(gè)賓語便隨著這一系列事件附帶而來,而假如這里再加賓語的話,反而會(huì)產(chǎn)生回到這個(gè)系列的開始的歧義;反之,假如一個(gè)頁面包含著多個(gè)系列交互事件的話,側(cè)必須在按鈕上加上賓語,以明確用戶點(diǎn)擊發(fā)生的是哪一個(gè)事件。
一個(gè)系列事件
一個(gè)頁面多個(gè)事件
3. 以形表意
中國甲骨文便以形繪意,后來對(duì)大量文字達(dá)成共識(shí)后,也就沒有太多在意文字的實(shí)際來源了。按鈕也如此
達(dá)成共識(shí)的按鈕
不用共識(shí)的按鈕反而起不到要起作用
4. 再看一些按鈕
分享:建立用戶體驗(yàn)過程的實(shí)用指南也許你剛剛來到一家公司,他們希望進(jìn)行一些“可用性”工作。你可能是一名UI設(shè)計(jì)師,業(yè)務(wù)分析師,或前端開發(fā)人員,一名產(chǎn)品經(jīng)理,或者負(fù)責(zé)用戶體驗(yàn)部門的經(jīng)理或
- 中國互聯(lián)網(wǎng)黑色產(chǎn)業(yè)人數(shù)近10萬 5分鐘1起網(wǎng)絡(luò)入侵
- 馬云最后的發(fā)布會(huì):打假,打出阿里的新未來
- 實(shí)踐分享:ACCESS數(shù)據(jù)庫導(dǎo)入mysql數(shù)據(jù)庫
- ACCESS數(shù)據(jù)庫轉(zhuǎn)ORACLE數(shù)據(jù)庫分享
- CDN.net免費(fèi)CDN申請(qǐng)使用教程:100GB流量香港日本新加坡節(jié)點(diǎn)
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺(tái)教程(二) 消息管理與群發(fā)
- 中國IPv4地址今年將告罄 IPv6期待打破政策局
- 移動(dòng)廣告野蠻成長:75%投放在iOS平臺(tái)
- 災(zāi)難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬部iPhone遭蘋果退貨 損失10億元
網(wǎng)頁設(shè)計(jì)教程Rss訂閱網(wǎng)站制作教程搜索
網(wǎng)頁設(shè)計(jì)教程推薦
- 2012年十二月web設(shè)計(jì)與開發(fā)熱點(diǎn)
- 2007流行網(wǎng)站導(dǎo)航設(shè)計(jì)欣賞
- 5天學(xué)會(huì)一種 web 開發(fā)框架
- 豆瓣的去中心化(一)
- 超棒的微軟Metro風(fēng)格Logo設(shè)計(jì)
- 經(jīng)典網(wǎng)站設(shè)計(jì):10個(gè)獨(dú)具創(chuàng)意的網(wǎng)站頭部設(shè)計(jì)示例
- 行的長度對(duì)閱讀網(wǎng)上新聞的影響
- 別具一格的網(wǎng)站評(píng)論
- 關(guān)于下拉箭頭
- 適合閱讀的頁面文字寬度(字?jǐn)?shù))
- 相關(guān)鏈接:
- 教程說明:
網(wǎng)頁設(shè)計(jì)教程-按鈕上的內(nèi)容。