Adsenseで広告を張ったときに見栄えが悪くなってしまうケースがよくあります。男子ハックの1月のリニューアルでは広告の見栄えについて3つのポイントに注意しました。どれも基本ですが改めて見直してみてはいかがでしょうか。
文字色を合わせる
Adsenseの設定でGoogleが標準で用意している文字色がありますが、自分でカスタマイズすることも可能です。サイトによってテーマカラーがあると思うので、男子ハックでは水色(#1288BA)に色を統一しました。これで広告が浮くことはなくなりますね。
インデントを揃える
記事を読むときにインテンドが発生すると注目してしまいます。人間は変化が気になるものなんですね。なるべくそういったストレスがないように、Adsenseリンクユニットとコンテンツのインテンドを揃えています。
広告ロード時の背景色を目立たなくする
WordPressの配布されてるテーマや環境によってはAdsenseがロードされるまでの間背景色が目立ってしまうケースがあるので、ins要素に背景色を指定するといい感じです。
デザインとの共存
「インデントを揃えたほうがユーザビリティが高い」というのはあくまでも仮説ですので、実際にテストが行えるのがベストですよね。テストする余裕がなければ定石に従うのがいいのではないでしょうか。
デザイナーっぽいデザインは作れなくても、良いUIが作れることを信じて、色々試していこうと思います。