Google的AdSense推出響應式廣告格式以後，我一直在使用，去年以來這種格式的廣告用得越來越多，因為可以根據不同的終端、不同的屏幕尺寸自動調整廣告大小，所以投放起來很省力。
今年3月去北京參加AdSense研讨會的時候，Google的人專門說了如何用CSS來調控響應式廣告的尺寸，後來的網絡講座中也說到這個，我有些印象，但并沒有去嘗試實施。
上個月10來号開始，我們下力仔細檢查網站在各自終端情況下的顯示，并根據一些原則來進行網頁布局和廣告調整，到目前為止将近一個月，成效非常明顯，大幅度提高了廣告可見率，廣告點擊和收入也有了相當大的提升。
這其中就遇到需要對各自廣告的尺寸進行精确控制的情況，下面小結一下：
- 傳統的固定尺寸廣告，這個好說，生成新廣告的時候規定是什麼尺寸就是什麼尺寸，無需修改；
- 響應式廣告，用CSS調整，例如下面這樣可以讓該廣告在寬屏顯示100%寬，在窄屏顯示300x250：
<style> .adsense_responsive_3 { width: 300px; height: 250px; } @media(min-width: 600px) { .adsense_responsive_3 { width: 100%; } } </style> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- AdSense 2015 - responsive 3 --> <ins class="adsbygoogle adsense_responsive_3" style="display:block" data-ad-client="ca-pub-909487182760xxxx" data-ad-slot="339425xxxx" data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
- 響應式廣告，用CSS調整，并去掉auto格式，例如上面的廣告，我想讓寬屏下的高度為250 px，如果隻是修改CSS還不行，最後去掉了data-ad-format="auto"才成功，例如：
<style> .adsense_responsive_3 { width: 300px; height: 250px; } @media(min-width: 600px) { .adsense_responsive_3 { width: 100%; height: 250px; } } </style> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- AdSense 2015 - responsive 3 --> <ins class="adsbygoogle adsense_responsive_3" style="display:block" data-ad-client="ca-pub-909487182760xxxx" data-ad-slot="339425xxxx"data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
- 原生廣告，Google以前就推出過原生廣告，也支持響應式，但有時沒有原生廣告的時候就顯示替補的普通展示廣告，如果設置為寬100%高250px的情況，就有時出現一個居中300x250廣告的情況，很不協調，這種方式被我們淘汰替換了，可以用上面的響應式廣告修改辦法或者簡單用兩個300x250并排放着也好一些；
- 最新的信息流廣告，包括Feeds廣告和In-article廣告，我也是剛剛才嘗試，這個後面我再專門寫博客介紹。
最近一段時間的廣告調整心得是不要怕麻煩，多從用戶角度考慮，能想到的布局、格式、尺寸都有辦法去實現的，再多盯着AdSense、Analytics後台數據看，必要的時候做A/B測試，總會有提升空間！
评论