2022-12-15 分類: 網(wǎng)站建設(shè)
設(shè)計(jì)banner的技巧有哪些?用戶去與留,大多是由網(wǎng)站設(shè)計(jì)而決定的,其關(guān)鍵因素在于網(wǎng)頁(yè)中的圖片設(shè)計(jì),或近期很流行且能移動(dòng)的「banner」。banner,又叫圖片滾動(dòng)、滑塊、特色內(nèi)容模塊等等很多類似的叫法,其在網(wǎng)頁(yè)上隨處可見(jiàn),尤其是電商網(wǎng)站的主頁(yè)上,大多電商網(wǎng)站的PC端網(wǎng)站主頁(yè)都會(huì)有banner。
能夠移動(dòng)的banner雖然能吸引用戶眼球,但如果其設(shè)計(jì)和文字內(nèi)容無(wú)關(guān),就會(huì)顯得多此一舉。本文將通過(guò)介紹banner的重要性、特點(diǎn)、設(shè)計(jì)指南等一一介紹,或許各位看官看完后,能理解banner存在的目的,甚至改進(jìn)自己網(wǎng)站的版面設(shè)計(jì)。
banner在企業(yè)網(wǎng)站建設(shè)中起怎樣的作用?
◇ 什么是banner?
banner是企業(yè)在網(wǎng)站主頁(yè)上顯示宣傳內(nèi)容的一種推廣形式。通過(guò)banner,用戶無(wú)需自行滾動(dòng)瀏覽,便可知道信息或活動(dòng)的詳情。banner呈現(xiàn)的形式和大小非常多樣,但大多banner都有如下特征:
特征一:主要出現(xiàn)主頁(yè)靠上位置,占據(jù)頁(yè)面顯眼位置絕大部分的區(qū)域;
特征二:即使每次只能展示一條,通過(guò)滾動(dòng)形式,在同一個(gè)位置能展示多條推廣;
特征三:同一位置的banner中,每條推廣都有自己的主題內(nèi)容,且包含圖像和少許文字。
banner的優(yōu)點(diǎn):
1. 可以在主頁(yè)的同一塊黃金區(qū)域顯示多條推廣內(nèi)容;
2. 越靠近頁(yè)面頂端的信息,越可能獲取更多關(guān)注。
banner的缺點(diǎn):
① 用戶經(jīng)常忽略banner以及banner內(nèi)的內(nèi)容,即使banner可以自動(dòng)滾動(dòng);
② 用戶基本不會(huì)在頁(yè)面的頂端逗留太久,所以基本上他們不能消化掉banner所有訊息;
③ 設(shè)計(jì)師和用戶理解出現(xiàn)偏差,設(shè)計(jì)師視banner為一系列圖片的集合體,但大多數(shù)用戶只會(huì)留意其中一張圖;
④ 用戶未必能通過(guò)banner,可以了解相關(guān)服務(wù)或產(chǎn)品,甚至無(wú)法明白設(shè)計(jì)師想傳達(dá)的訊息。
◇ 主頁(yè)banner對(duì)網(wǎng)站有用嗎?
事實(shí)上,banner是一種實(shí)證效果不好的模式(anti-pattern)。曾有相關(guān)數(shù)據(jù)顯示,只有1%的網(wǎng)站用戶會(huì)點(diǎn)擊并瀏覽banner相關(guān)內(nèi)容,而在這1%的用戶中有84%的用戶僅僅是點(diǎn)擊banner的第一張滾動(dòng)圖片。
既然banner點(diǎn)擊率那么低,為何還要使用banner呢?
雖然banner的效果并不好,但從很多案例分析,我們不難發(fā)現(xiàn),只要堅(jiān)守一些重要的操作細(xì)節(jié),banner不單可以獲得很好的宣傳效果,還對(duì)用戶有很好的幫助。
◇ banner設(shè)計(jì)指南
——如何通過(guò)banner吸引用戶
一、 內(nèi)容第一
「內(nèi)容為王」,很多時(shí)候即使banner的設(shè)計(jì)多精美,交互多簡(jiǎn)單,如果內(nèi)容不相關(guān),這對(duì)用戶來(lái)說(shuō)都是「大災(zāi)難,因?yàn)樗麄儫o(wú)法理解banner所傳達(dá)的信息。想避免這種情況,在設(shè)計(jì)上就要注意以下一些重要規(guī)則:
1. 如果banner內(nèi)容不夠吸引或?qū)τ脩魶](méi)有幫助,那就直接不要用banner,避免分散用戶的注意力;
2. banner是整個(gè)網(wǎng)站的一部分,而不是網(wǎng)頁(yè)強(qiáng)加的廣告,所以banner內(nèi)容不要太像廣告,否則用戶會(huì)選擇直接忽視;
3. 選擇合適的字體和圖像,讓banner和頁(yè)面其他內(nèi)容相匹配;
4. 滾動(dòng)圖片的順序要仔細(xì)斟酌,越靠前的圖片,獲得的曝光機(jī)會(huì)越多,因此第一張圖片非常重要,它是決定用戶停留時(shí)間長(zhǎng)短的關(guān)鍵;
5. 不要把banner當(dāng)作了解網(wǎng)站特色和內(nèi)容的唯一途徑,建議將出現(xiàn)在banner的重要信息放在頁(yè)面的其他部分,方便用戶瀏覽時(shí)能看到。如果你想讓用戶看到網(wǎng)站所有內(nèi)容,建議不要使用banner,因?yàn)榇蠖鄶?shù)用戶并不會(huì)每張banner圖片都瀏覽。
二、 限制滾動(dòng)圖片數(shù)量
盡量控制banner圖片數(shù)量在五張以下,這樣能幫助用戶更好地了解網(wǎng)站內(nèi)容,回過(guò)頭后還能在banner里找到相關(guān)內(nèi)容。若banner圖片數(shù)量太多,用戶可能會(huì)無(wú)那么多耐性等待,繼而放棄繼續(xù)瀏覽。
三、 提供進(jìn)度提醒
讓用戶知道banner總共有多少?gòu)垵L動(dòng)圖片,同時(shí)讓其知道當(dāng)前的「進(jìn)度」是第幾張圖片,讓用戶覺(jué)得一切都盡在掌握之中。
四、 確保滾動(dòng)圖片內(nèi)容在手機(jī)清晰顯示
越來(lái)越多企業(yè)網(wǎng)站采用響應(yīng)式網(wǎng)站設(shè)計(jì),設(shè)計(jì)師在設(shè)計(jì)banner時(shí),不僅需要注意PC端的易讀性;還要確保手機(jī)客戶端中banner文字和圖片清晰,用戶才有興趣了解。
五、 設(shè)計(jì)恰當(dāng)?shù)膶?dǎo)航按鈕
網(wǎng)頁(yè)設(shè)計(jì)技巧:電商網(wǎng)站如何設(shè)計(jì)banner更吸引眼球
導(dǎo)航按鈕能幫助用戶識(shí)別各項(xiàng)選擇,能使用戶在核心滾動(dòng)圖片,看到相關(guān)內(nèi)容時(shí),能回想到這些選擇。因此確保導(dǎo)航按鈕存在并出現(xiàn)在banner內(nèi),而不是其他區(qū)域,這樣可以避免顯示不當(dāng)?shù)膯?wèn)題。
六、 確保自動(dòng)滾動(dòng)運(yùn)行流暢
banner使用自動(dòng)滾動(dòng)能幫助用戶瀏覽相關(guān)信息,但想要自動(dòng)滾動(dòng)運(yùn)行流暢,就需要注意以下幾點(diǎn)細(xì)節(jié):
1. 手機(jī)設(shè)備不要加載自動(dòng)滾動(dòng)功能,避免用戶誤觸不想點(diǎn)開(kāi)的圖片;
2. 確保自動(dòng)滾動(dòng)切換速度不要過(guò)快或快慢;切換過(guò)快,用戶無(wú)法讀取信息;切換過(guò)慢,會(huì)讓用戶厭煩那些滾動(dòng)圖片;
3. 讓用戶保持可控狀態(tài),增加暫停、上一頁(yè)、下一頁(yè)以及頁(yè)數(shù)選項(xiàng),方便用戶能切換到想要點(diǎn)擊的滾動(dòng)圖片。
4. 滾動(dòng)到最后一張圖片后不要停止,而是繼續(xù)循環(huán)播放所有圖片。
七、除了banner之外的好選擇
由于banner缺乏背景鋪墊,因此大多用戶并不愿意去瀏覽或了解當(dāng)中的內(nèi)容,要解決這個(gè)問(wèn)題,同時(shí)又想吸引用戶眼球,除了banner,也可以考慮主圖。
相比banner,主圖有以下優(yōu)點(diǎn):
1. 靜態(tài)主圖能減少分散用戶的注意力,讓用戶可以專注于一張圖片;
2. 靜態(tài)主圖僅有一張,設(shè)計(jì)師能投放更多心思和情感,將相關(guān)服務(wù)或產(chǎn)品呈現(xiàn)給用戶;
3. 有效確定內(nèi)容的優(yōu)先次序,并更好地號(hào)召用戶參與。
如果用戶無(wú)法與banner設(shè)計(jì)產(chǎn)生互動(dòng),這并非全部是banner模式問(wèn)題,可能是你的banner不夠引人入勝,可能是你的內(nèi)容與banner不相關(guān),也有可能是因?yàn)槟愕木W(wǎng)站不適宜添加banner。因此,在設(shè)計(jì)banner時(shí),應(yīng)該考慮這個(gè)設(shè)計(jì)是否對(duì)用戶的體驗(yàn)有幫助,能否更好地傳達(dá)信息給用戶,如果答案是肯定的話,那就大膽地用吧!
網(wǎng)站欄目:banner在企業(yè)網(wǎng)站建設(shè)中起怎樣的作用?
路徑分享:http://jinyejixie.com/news/222842.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站導(dǎo)航、App設(shè)計(jì)、自適應(yīng)網(wǎng)站、網(wǎng)站制作、搜索引擎優(yōu)化、網(wǎng)站設(shè)計(jì)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容