Google AdSenseのスマートサイズは、場所に合わせて適当に広告を提供してくれて良いのだけど、CTRはかなり下がった。画像広告のCTRは下がっていないので、テキスト広告で限界まで埋めようとするのがよく出るのがダメな感じなので、画像広告が多く出る300x250や728x90のサイズをメインに使うように制限をかけてみている。

もちろんアドバンスで制限かけても良いのだけど、300x250や728x90が使われるようにAdSenseを置く場所の幅と高さに制限をかける方がCSSがきれいに書け、かつ広告の位置調整がしやすい。

HTMLはdata-ad-format属性をデフォルトのautoからrectangle, horizontalに変更する必要がある。autoのままだと、例えば領域を300x250に制限しても、300x600などのサイズでテキスト広告がいっぱい表示されたりする。

<div class="adsense">
  <ins class="adsbygoogle"
       style="display:block"
       data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
       data-ad-slot="xxxxxxxxxx"
       data-ad-format="rectangle, horizontal"></ins>
  <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  <script>
  (adsbygoogle = window.adsbygoogle || []).push({});
  </script>
</div>

data-ad-format属性をちゃんと設定してやれば、CSS側では効果的な広告サイズに合わせてサイズを制限するだけで良い。縦長の160x600をメインに使いたい場合はverticalにすると良い。

.adsense {
  max-width: 300px;
  max-height: 250px;
  overflow: hidden;
  text-align: center;

  @media (min-width: 1024px) {
    max-width: 728px;
    max-height: 90px;
  }
}

先述の通り、CTRの低下は幅いっぱいいっぱいにテキスト広告で埋める奴が出やすいのが原因な気がするので、もう少し経ってスマートサイズ向けの画像広告が数多く揃えば改善しそうな気はする。それまでは上記のような形で300x250や728x90をメインに据え、CSSの更新のみでスマートサイズにすぐ切り替えられるようにしておくのが良いかなと。