ブロガーはiphone6に備えてadsence配置を最適化したほうが良いかも

全然対した話じゃないんだけど、今日なんとなーく気分で渋谷のapple storeにいってきたんですね。

そこで噂のiphone6+とやらを触ってきました。

感想こんな感じ。

 

 

うん、めっちゃ欲しくなった!

 

デカスマフォは巷じゃ賛否両論みたいですが、個人的にはスマフォは「電話機」じゃなくて「web閲覧端末」だと思ってる人なので、これくらいのサイズが一番しっくりきましたね。

はい。

 

そんで、そのウキウキ気分のままiphone6+で自分のサイトを見てみたんですけど……

 

f:id:noabooon:20141001205739j:plain

 

当たり前のことなんだけど、画面サイズが大きくなってるので、横幅も広くなってるんですね。

そのせいで、ヘッダーに入れてある320x100のadsence広告が「左に寄ってる」状態になってました。

利用規約の関係でadsenceがうつってるところは写真とってません)

これまでのiphoneだったら、横幅320のバナー貼っておけばピッタリサイズだったんですけど、これからiphone6iphone6+みたいな大型端末が主流になっていくなら、これも徐々に見直していかないといけないんだろうなーと思いました。

 

ただ、じゃあどのサイズにすればいいのかと言われると……

iphone6は横幅375px

iphone6+は横幅414px

らしいので、これに合うサイズがあるかadsence管理ページで探してみたんですが……

無い!笑

468x60だとちょっとはみ出るし……

 

ああ、そうだ。センタリングすればいいんだ。

というわけでどうしたらいいか考えてみたんだけど、新型iphoneにピッタリなバナーサイズは今のところ無さそうなので、そしたら320x50や320x100をそのまま使って、そのうえでセンタリングするしか無さそうです。

 

adsenceのコードをdivで囲って、そこにクラスを指定して、あとはそのクラスにcss

margin:0 auto;

みたいなのを貼付けましょう。

 

うん、これしかない。

てか今ここまで書いて気付いたけど、僕は自分がiphoneユーザーだったからあんまり気になってなかっただけで、これまでもandroidの大画面スマフォを使ってるユーザーには、うちのサイトの広告は左に寄ってるように見えてたんだろうなぁー。

 

HTMLの最適化は大変でござる。