Scrapblog
你可以看到使用相對于周邊元素的鮮明的色彩、足夠的空間、以及型號的一些用戶注意的效果。簡單的語言傳遞一種很容易的感覺,生存你可以通過點(diǎn)擊立馬“開始(start)”。
13 Creative
這個(gè)行動召喚按鈕顯示如何通過使用一個(gè)非傳統(tǒng)的設(shè)計(jì),你依然可以在周圍元素比較大的情況下吸引用戶的注意。
Kalculator
這個(gè)行動召喚按鈕明確的高速用戶:通過點(diǎn)擊這個(gè)行動召喚按鈕,他們可以只付$3.99。使用單詞”only”提示這是個(gè)相當(dāng)不錯(cuò)的交易,這顯然有利于銷售。
Web Design Beach
下面是一組使用兩種不同顏色的行動召喚按鈕。更醒目的那個(gè),”get a quote” 暗示它就是主要期待行動。
The Highland Fling
該行動召喚按鈕設(shè)法通過大量的空白、顯眼的位置和使用一個(gè)圖標(biāo)以使自己顯眼以吸引注意力。通過使用單詞”now”,它傳遞了一種緊迫感和立馬行動的需求。
Commercial IQ
這個(gè)行動召喚按鈕的型號和項(xiàng)目位置吸引了用戶的注意。放大鏡圖標(biāo)給行動添加了語境。添加“Free for search”文字消除了用戶關(guān)于行動的費(fèi)用的顧慮。
dashboard
這里,你可以看到使用高對比色彩的以使行動召喚按鈕脫穎而出的做法,盡管是在明顯較大的頁面元素中間。
行動召喚按鈕的附加資源
如果你想了解更多的關(guān)于行動召喚按鈕的信息,這里是一些其它網(wǎng)站上的相關(guān)資源和文章:
如何在Photoshop中制作一個(gè)光滑而簡潔的按鈕
這個(gè)教程是在Six Revision,由我(Jacob Gube)編寫,將一步步向你展示如何制作大號的和能引起注意的行動召喚按鈕。
網(wǎng)頁設(shè)計(jì)中的靈感按鈕
如果你需要一些優(yōu)秀按鈕設(shè)計(jì)的靈感,看一下這個(gè)Pattern Tap的收集吧。
有效的行動召喚按鈕的10種技術(shù)
Paul Boag討論一些關(guān)于制作良好的行動召喚按鈕的技術(shù)
良好的行動召喚按鈕
UX Booth關(guān)于“好的行動召喚按鈕的組成”方面有一篇好文章
Firefox展示一個(gè)強(qiáng)大的行動召喚按鈕是如何提升入口頁面的性能的
閱讀一下一個(gè)好的行動召喚按鈕如何提高轉(zhuǎn)換。你將發(fā)現(xiàn)一個(gè)Firefox、Opera和IE使用的行動召喚按鈕之間的對比。
網(wǎng)站設(shè)計(jì)趨勢:行動召喚按鈕(中文翻譯)
Lee Munroe將一系列的行動召喚按鈕放到一起,并附加了一個(gè)在當(dāng)前設(shè)計(jì)趨勢方面的討論。
關(guān)于原作者
Jacob Gube是Six Revisions的創(chuàng)立者和主編。他同時(shí)也是一個(gè)專注于遠(yuǎn)程教育、前端開發(fā)和網(wǎng)站可用性的網(wǎng)頁開發(fā)者/設(shè)計(jì)師,如果你想聯(lián)系他,可以follow他的Twitter: @sixrevisions。
譯文原文: http://www.qianduan.net/call-to-action-buttons-examples-and-best-practices.html
本文鏈接:http://www.95time.cn/design/doc/2009/7166.asp
出處:藍(lán)色理想
責(zé)任編輯:bluehearts
上一頁 行動召喚按鈕在網(wǎng)頁中的實(shí)例與實(shí)踐 [8] 下一頁
|