アドセンスの広告サイズを解像度にあわせて変更させる

可変
320+50
レスポンシブ（アドバンス）
追記：2015　現在はこんな面倒なことをしなくてもよいみたい

可変

写真（右）の広告位置とサイズに変更して、収益があがったのはよかったが、ギズモードのサイトは解像度にあわせてアドセンスの広告が可変している。
PCで表示すると広告の幅が長くなっているが、アイポン5など解像度の小さいデバイスで表示すると、広告の幅も解像度に合わせて短くなっていた。
おれもデバイスによって、広告のサイズが変更されるようにしたかったから調べてみた。

<script async src=\"//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js\"></script>
<!-- 320+50 -->
<ins class=\"adsbygoogle\"
     style=\"display:inline-block;width:300px;height:50px\"
     data-ad-client=\"ca-pub-6721409712590583\"
     data-ad-slot=\"9474335353\"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

320+50

↑これがカスタムサイズ（320×50）で作った普通の広告ユニットのコードで

<style>
.my_adslot { width: 320px; height: 50px; }
@media(min-width: 500px) { .my_adslot { width: 468px; height: 60px; } }
@media(min-width: 800px) { .my_adslot { width: 728px; height: 90px; } }
</style>
<script async src=\"//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js\"></script>
<!-- サイズ変更 -->
<ins class=\"adsbygoogle my_adslot\"
     style=\"display:inline-block\"
     data-ad-client=\"ca-pub-6721409712590583\"
     data-ad-slot=\"8790860950\"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

レスポンシブ（アドバンス）

↑こっちがレスポンシブでモードを（アドバンス）にした広告ユニットのコード。
上3行にあきらかにサイズが変更されるような呪文が追加されてた。
このレスポンシブ（アドバンス）は、広告ユニットを作成するときに選択できる。

<style>
.my_adslot { width: 320px; height: 50px; }
@media(min-width: 500px) { .my_adslot { width: 468px; height: 60px; } }
@media(min-width: 800px) { .my_adslot { width: 728px; height: 90px; } }
</style>

<style>
.my_adslot { width: 320px; height: 50px; }　指定がない場合
@media(min-width: 500px) { .my_adslot { width: 468px; height: 60px; } }　解像度500px↑のデバイスの場合
@media(min-width: 800px) { .my_adslot { width: 728px; height: 90px; } }　解像度800px↑のデバイスの場合
</style>

つまり、解像度500px↓の携帯とかだと320×50の広告サイズで表示されて、解像度が500px↑や800px↑タブレットやPCだと、指定している広告サイズで表示されるみたいだ。
ちなみにそのwidthとheightの数字はコード変更が必要って書いてたから、変更しても問題ないんじゃないかな。
おれは変える必要がないのでデフォの常態にした。

クロスブラウザチェックができるサイト
http://mattkersley.com/responsive/