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测试，总会有提升空间！
评论