不可否認，廣告是網站收入的重要組成部分，而且廣告在互聯網中的地位也很重要。到了 2011 年，美國的互聯網廣告覆蓋率已經超過了電視，價值 365.7億美元。

雖然很多以利益為導向的網站過度依賴于廣告收入，但是，如果一個網站廣告太多或者廣告運用的不恰當，會直接導致糟糕的用戶體驗，那么用戶可能再也不回訪了，廣告太多，看見就心煩。

就說國內現在的那些視頻網站的廣告吧，一個幾分鐘的視頻，開場近一分鐘的游戲廣告。不得不逼著很多同學去裝“廣告終結者”等插件來屏蔽。

如何為用戶提供舒適的瀏覽體驗，又能賺取廣告收益，這需要從中尋取一個平衡點。本文，將著墨于此，探討一下該如何在網頁設計中實現廣告與用戶體驗的平衡。

理解廣告

這必然是設計的第一步，首先要理解廣告，盡量選擇那些設計誘人的廣告，而不要選擇那種低俗、很 Low 的廣告。

廣告商之所以會購買你的廣告位，其實主要是為了提高自身的曝光率。你的站點訪問量越高，廣告的曝光率自然也越高，賺的錢也越多。所以首頁的廣告肯定比子頁面的貴，頁頂的廣告也要比頁底的貴。

The New York Times 網站的 Banner 式廣告

使廣告的曝光率變為轉化率，有的時候不單取決于多少人看到，還取決于有多少人點擊。如果你將要設計的網站是為廣告而生，利益導向，那么設計的時候心中就要有個小九九了：如何設計，如何布局，才能實現更好的展現效果。

對于那些賴以廣告謀生的網站來說，廣告至關重要，用戶就是他們牟利的根本，過度飽和的廣告會讓用戶離開，廣告過少，又難以維持。所以設計要有技巧，爭取既能讓廣告商高興，又能讓用戶滿意。

廣告的尺寸

廣告的尺寸不盡相同，沒有嚴格的規定說你應該用多大的尺寸，但是你應該了解一些比較通用的尺寸，這樣在進行廣告投放時，你省心，廣告商也省心——不用重新修改尺寸了。

極力推薦上面這套尺寸標準，從公告牌，到排行榜，到下拉條，均有明確的尺寸。

當然，還有其它元素也需要考慮。

廣告不宜太大，從而干擾或影響到網站的正常使用，更不要遮擋住用戶需要瀏覽的網站內容。

而且廣告的尺寸要適度，和網頁元素之間的對比關系相協調，以免有突兀感和侵入感。

比如各大門戶網站中的 Banner

的設計均很到位，用戶也能夠習慣，各位不妨學習一下。個人特別喜歡背景式的廣告位。優雅得體的廣告，也不妨礙網站信息的汲取，甚至一定程度上點綴了網站，更有觀賞性了。

廣告的位置

方向比速度更重要，位置比尺寸更重要。有的時候，頁首一小塊地方就要比頁底一大片區域貴。同樣的，用戶一般也就看看頁首的內容，頁底的內容不會太關心。

如何讓廣告和內容同樣具有高辨識度，又不打擾用戶閱讀呢?

Twitter 前幾年推出的廣告(Promoted Tweets)就很不錯，以最小的閱讀干擾展現廣告。

同樣的，谷歌會在搜索結果頁面的右端展示廣告，盡量做到不打擾用戶。至于如何分配廣告的位置，建議多研究研究版式理論，比如下面提到的F式布局以及Z式布局，就是根據用戶一版會沿著Z線或者F線瀏覽內容的習慣而總結出來的。

Z式布局：廣告盡量避開Z線，避免干擾用戶閱讀。

F式布局：注意廣告的位置

如果你的網站被投放了好幾家廣告商的廣告，可以嘗試選擇在頁面的某一區域集中展現，當然，這樣廣告的效果就不是那么好了，廣告之間也很難彼此區分，所以怎么做，看你的談判手腕以及設計技巧了。個人還是推薦以用戶為主的。

至于谷歌廣告，不屬于設計范疇，請自行查閱相關內容。

廣告的頻率

什么地方廣告要少，什么地方廣告要多，也是有技巧的。

在主頁或者搜索列表頁，廣告要少，因為用戶急切的想要搜索信息，閱覽內容。當用戶找到了確切的內容后，可以在子頁面稍微多放一點廣告，但是同樣不要干擾閱讀。a

bit more advertising.

Times 的主頁，基本無廣告，信息查找很方便。

盡管主頁的廣告更有沖擊力，但是用戶體驗會變差，用戶會感到不大舒服。

Time 網站的主頁只有一個廣告，剩下的要么是信息內容，要么是導航。但是在內容頁面，廣告卻很多。

優酷：”追英趕美劇好看”這里的折疊蠻有創意，拓展了頁面空間。

同樣的，像優酷這樣的視頻大站，主頁廣告也很少，但是視頻內容的廣告卻很長，(額，小編我要帶個人立場吐糟視頻中內嵌的廣告 15s 已經變成 60s

了。)再看看 Youtube 的主頁也沒什么廣告，廣告也是在視頻頁面。

總結

我們又面臨了平衡問題，一邊是給你發錢的廣告商，一邊是幫你賺錢的用戶。談判手腕、人情味和對用戶的重視這幾個先決條件全都不能丟。因此，做決定一定要審慎，深思熟慮，合理考慮廣告的尺寸、位置、出現頻率等，優化廣告和內容的關系，千萬不要做那種廣告肆虐的網站，那樣不長久，這就是”跪著，把錢掙了。”所以我們即要合理的設計，也要為用戶著想，爭取”站著，還把錢掙了。”

原創文章如轉載，請注明：轉載自 http://siw.pw/
本文鏈接：http://siw.pw/article/16.html

Tags：網站推廣，網站廣告，用戶體驗