うえの(@uenoyou111)です。今日はサラッと対処だけの日です。
アドセンスの自動広告を設定してみたら、クリック率が倍上昇したという記事でもまとめていますが、以前からスマホ表示だとページがズレちゃってたんですよね。
画面の上下に配置されるアンカー広告によって画面が押し下げられたり、なぜか画面が左にズレるようになったり。
特に横ズレに関しては、スマートフォンを左手で操作する方にとって時にものすごくストレスになります。
今回その対処法をまとめたので、自動広告を導入されている方で同じ悩みを持つ方は参考にされてください( ˘ω˘)
キッカケ
つい先日、とむ (id:tominaga0213)さんがこんな記事を書いていて。
下の方に、左手で操作するとブログの記事がズレると書かれていてめちゃくちゃ分かる。と思いました。
わたくしもほとんど左手を使うのですが、ベースは右利きなのでクロスドミナンスという部類のようです。
両利きとは違うんだよ！利き手が変わるクロスドミナンスについてにて詳細をまとめています。
ページのズレは無理やり納得させてたけど、そうだ直さねば…(´・ω・`)と思い立ったところから情報収集開始です！
ズレってどんな？
まずは状況把握から行いましょう。
画面上部に固定されるタイプの広告だと、画面全体が下に押し下げられて隙間が出来ます。
(都合によりデザインを変更する前になります)
せっかく真っ白なヘッダー画像にしてても、これじゃ残念な結果に…
という事で調べていたら、Neos21 (id:neos21) さんが書かれているこちらの記事が参考になりました。
こちらで書かれているコードをデザインCSSに貼り付け。すると…
ズレてない！(ﾟ∀ﾟ)
ちょっとモヤッとしてたのでスッキリです。ありがとうございました！
横ずれへの対応
続いて横にズレる場合を見ていきましょう。
見て分かるように、右側に少しのすき間が出来てしまい、左側は文字が切れてしまっています。
これ、左手でスワイプするとすぐズレちゃうんですよね。正確にまっすぐ上にスワイプ出来れば問題ないですが。
今度はあすもち(id:asuro_life)さんが書かれたこちらの記事を参照。
こちらも指定の場所へコードを入れます。デザインCSSでは無いので要注意。
おかげでバッチリずれなくなりました！ありがとうございます(｀･ω･´)ゞ
まとめ
細かい部分だけど、そういう部分こそ常に付きまとうので大きな影響になると思っています( ˘ω˘)
これでスッキリしたので、今度はアドセンスでリンク広告とABテスト導入でクリック率＆収益が増えたという記事を参考にリンクユニットを導入してみましょう。
ではでは(｀･ω･´)ゞ
