網(wǎng)站設(shè)計之橫幅設(shè)計技巧?

2013-05-11    分類: 網(wǎng)站設(shè)計

設(shè)計橫幅的技巧有哪些?用戶去與留,大多是由網(wǎng)站設(shè)計而決定的,其關(guān)鍵因素在于網(wǎng)頁中的圖片設(shè)計,或近期很流行且能移動的「橫幅」。橫幅,又叫圖片滾動、滑塊、特色內(nèi)容模塊等等很多類似的叫法,其在網(wǎng)頁上隨處可見,尤其是電商網(wǎng)站的主頁上,大多電商網(wǎng)站的PC端網(wǎng)站主頁都會有橫幅。

網(wǎng)站設(shè)計之橫幅設(shè)計技巧?

網(wǎng)站設(shè)計

能夠移動的橫幅雖然能吸引用戶眼球,但如果其設(shè)計和文字內(nèi)容無關(guān),就會顯得多此一舉。本文將通過介紹橫幅的重要性、特點、設(shè)計指南等一一介紹,或許各位看官看完后,能理解橫幅存在的目的,甚至改進自己網(wǎng)站的版面設(shè)計。

◇ 什么是橫幅?

橫幅是企業(yè)在網(wǎng)站主頁上顯示宣傳內(nèi)容的一種推廣形式。通過橫幅,用戶無需自行滾動瀏覽,便可知道信息或活動的詳情。橫幅呈現(xiàn)的形式和大小非常多樣,但大多橫幅都有如下特征:

特征一:主要出現(xiàn)主頁靠上位置,占據(jù)頁面顯眼位置絕大部分的區(qū)域;

特征二:即使每次只能展示一條,通過滾動形式,在同一個位置能展示多條推廣;

特征三:同一位置的橫幅中,每條推廣都有自己的主題內(nèi)容,且包含圖像和少許文字。

橫幅的優(yōu)點:

1. 可以在主頁的同一塊黃金區(qū)域顯示多條推廣內(nèi)容;

2. 越靠近頁面頂端的信息,越可能獲取更多關(guān)注。

橫幅的缺點:

① 用戶經(jīng)常忽略橫幅以及橫幅內(nèi)的內(nèi)容,即使橫幅可以自動滾動;

② 用戶基本不會在頁面的頂端逗留太久,所以基本上他們不能消化掉橫幅所有訊息;

③ 設(shè)計師和用戶理解出現(xiàn)偏差,設(shè)計師視橫幅為一系列圖片的集合體,但大多數(shù)用戶只會留意其中一張圖;

④ 用戶未必能通過橫幅,可以了解相關(guān)服務(wù)或產(chǎn)品,甚至無法明白設(shè)計師想傳達的訊息。

◇ 主頁橫幅對網(wǎng)站有用嗎?

事實上,橫幅是一種實證效果不好的模式(anti-pattern)。曾有相關(guān)數(shù)據(jù)顯示,只有1%的網(wǎng)站用戶會點擊并瀏覽橫幅相關(guān)內(nèi)容,而在這1%的用戶中有84%的用戶僅僅是點擊橫幅的第一張滾動圖片。

既然橫幅點擊率那么低,為何還要使用橫幅呢?

雖然橫幅的效果并不好,但從很多案例分析,我們不難發(fā)現(xiàn),只要堅守一些重要的操作細節(jié),橫幅不單可以獲得很好的宣傳效果,還對用戶有很好的幫助。

◇ 橫幅設(shè)計指南

——如何通過橫幅吸引用戶

一、 內(nèi)容第一

「內(nèi)容為王」,很多時候即使橫幅的設(shè)計多精美,交互多簡單,如果內(nèi)容不相關(guān),這對用戶來說都是「大災(zāi)難,因為他們無法理解橫幅所傳達的信息。想避免這種情況,在設(shè)計上就要注意以下一些重要規(guī)則:

1. 如果橫幅內(nèi)容不夠吸引或?qū)τ脩魶]有幫助,那就直接不要用橫幅,避免分散用戶的注意力;

2. 橫幅是整個網(wǎng)站的一部分,而不是網(wǎng)頁強加的廣告,所以橫幅內(nèi)容不要太像廣告,否則用戶會選擇直接忽視;

3. 選擇合適的字體和圖像,讓橫幅和頁面其他內(nèi)容相匹配;

4. 滾動圖片的順序要仔細斟酌,越靠前的圖片,獲得的曝光機會越多,因此第一張圖片非常重要,它是決定用戶停留時間長短的關(guān)鍵;

5. 不要把橫幅當(dāng)作了解網(wǎng)站特色和內(nèi)容的唯一途徑,建議將出現(xiàn)在橫幅的重要信息放在頁面的其他部分,方便用戶瀏覽時能看到。如果你想讓用戶看到網(wǎng)站所有內(nèi)容,建議不要使用橫幅,因為大多數(shù)用戶并不會每張橫幅圖片都瀏覽。

二、 限制滾動圖片數(shù)量

盡量控制橫幅圖片數(shù)量在五張以下,這樣能幫助用戶更好地了解網(wǎng)站內(nèi)容,回過頭后還能在橫幅里找到相關(guān)內(nèi)容。若橫幅圖片數(shù)量太多,用戶可能會無那么多耐性等待,繼而放棄繼續(xù)瀏覽。

三、 提供進度提醒

讓用戶知道橫幅總共有多少張滾動圖片,同時讓其知道當(dāng)前的「進度」是第幾張圖片,讓用戶覺得一切都盡在掌握之中。

四、 確保滾動圖片內(nèi)容在手機清晰顯示

越來越多企業(yè)網(wǎng)站采用響應(yīng)式網(wǎng)站設(shè)計,設(shè)計師在設(shè)計橫幅時,不僅需要注意PC端的易讀性;還要確保手機客戶端中橫幅文字和圖片清晰,用戶才有興趣了解。

五、 設(shè)計恰當(dāng)?shù)膶?dǎo)航按鈕

導(dǎo)航按鈕能幫助用戶識別各項選擇,能使用戶在核心滾動圖片,看到相關(guān)內(nèi)容時,能回想到這些選擇。因此確保導(dǎo)航按鈕存在并出現(xiàn)在橫幅內(nèi),而不是其他區(qū)域,這樣可以避免顯示不當(dāng)?shù)膯栴}。

六、 確保自動滾動運行流暢

橫幅使用自動滾動能幫助用戶瀏覽相關(guān)信息,但想要自動滾動運行流暢,就需要注意以下幾點細節(jié):

1. 手機設(shè)備不要加載自動滾動功能,避免用戶誤觸不想點開的圖片;

2. 確保自動滾動切換速度不要過快或快慢;切換過快,用戶無法讀取信息;切換過慢,會讓用戶厭煩那些滾動圖片;

3. 讓用戶保持可控狀態(tài),增加暫停、上一頁、下一頁以及頁數(shù)選項,方便用戶能切換到想要點擊的滾動圖片。

4. 滾動到最后一張圖片后不要停止,而是繼續(xù)循環(huán)播放所有圖片。

七、除了橫幅之外的好選擇

由于橫幅缺乏背景鋪墊,因此大多用戶并不愿意去瀏覽或了解當(dāng)中的內(nèi)容,要解決這個問題,同時又想吸引用戶眼球,除了橫幅,也可以考慮主圖。

相比橫幅,主圖有以下優(yōu)點:

1. 靜態(tài)主圖能減少分散用戶的注意力,讓用戶可以專注于一張圖片;

2. 靜態(tài)主圖僅有一張,設(shè)計師能投放更多心思和情感,將相關(guān)服務(wù)或產(chǎn)品呈現(xiàn)給用戶;

3. 有效確定內(nèi)容的優(yōu)先次序,并更好地號召用戶參與。

如果用戶無法與橫幅設(shè)計產(chǎn)生互動,這并非全部是橫幅模式問題,可能是你的橫幅不夠引人入勝,可能是你的內(nèi)容與橫幅不相關(guān),也有可能是因為你的網(wǎng)站不適宜添加橫幅。因此,在設(shè)計橫幅時,應(yīng)該考慮這個設(shè)計是否對用戶的體驗有幫助,能否更好地傳達信息給用戶,如果答案是肯定的話,那就大膽地用吧!

當(dāng)前名稱:網(wǎng)站設(shè)計之橫幅設(shè)計技巧?
標(biāo)題來源:http://www.muchs.cn/news29/7329.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有網(wǎng)站設(shè)計

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

手機網(wǎng)站建設(shè)