您在這裡

自由控制Google AdSense廣告尺寸

James Qi 在 2017年7月11日 - 15:56 發表

  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測試,總會有提升空間!

自由标簽:

發表新回應

Plain text

  • 不允許使用 HTML 標籤。
  • 自動將網址與電子郵件地址轉變為連結。
  • 自動斷行和分段。