【コピペでOK】ダブルレクタングルのやりかた!記事下にレクタングルを横並びにする方法をCSSなしで実現する

こんにちは、きゃぷてんです。

ダブルレクタングルという広告配置をご存知でしょうか？

数値的なデータでもクリック率の高さが実証させれている配置方法であり、様々なサービス(Yahoo,Qiita・・・挙げたらキリがありません)で実装されているテクニックです。

1円でも多くの利益を追求する各種サービスで実装されているということで、クリック率の高さは折り紙つきというわけです。

本当は、ABテストをして広告配置の実験をするのが良いのですが、そんな時間はない！とか、めんどくせー！という場合は、良いものをパクってしまうのが手っ取り早く成果を出せます。

ダブルレクタングルとは

きゃぷてんさん、ダブルレクタングルって最近流行ってますよね！僕のブログでも実装してみたいのです。ただ、プログラミングがわからないので、WordPressをいじるのが怖いんですよね・・・

ダブルレクタングルを実装しようとして失敗した、なんて話はよく聞きますからね。この記事では初心者でもできるように一番簡単な方法をお伝えします！

そもそも、ダブルレクタングルとはなんぞや！？という人も多いと思います。

ダブルレクタングルってなんだかかっこいい名前ですし、難しい技術のようなイメージがあるかもしれません。ただ、このように説明するとしっくりくると思います。

ダブルレクタングルとは、正方形に近い形状の広告を横に２つ並べること

百聞は一見にしかずということで、下の画像を見てください。

普段からネットサーフィンをするのであれば、必ず見たことがある広告の配置だと思います。

これがダブルレクタングルです。

この配置（ダブルレクタングル）を実装するサービスがどんどん増えているので、クリック率の高さを証明していると考えていいでしょう。

ただ実際のところは、記事の内容やサイトの雰囲気等で広告のクリック率は左右されるので、一概に「この配置（ダブルレクタングル）が最強！」と断言することはできません。

しかしながら、多くのサービスで実装され結果も残している広告配置なので、あなたのサイトやブログにも実装する価値はあります。

広告のABテストとか、実験とかめんどくせーよ！

そのように感じるのであれば、とりあえずダブルレクタングルをパクってみて、クリック率がよければそのまま残せばいいし、クリック率が悪ければ以前の広告配置に戻せばいいですね。

CSSをいじらなくても実装は可能

さてさて、ダブルレクタングルを実装しようと調べていると、大体はプログラマーの技術系ブログにたどり着くと思います。

そうなると、「いかに綺麗に」とか「いかにかっこよく」というプログラマーどうしの対決でもしているかのように、凝った設定方法が記事になっています。

しかしながら、求めていることってそこじゃないですよね。

ブログ初心者という目線で考えた場合に重要になるのは以下の点ではないでしょか？

• とにかく設定が簡単なこと
• とりあえず見た目がちゃんとしていること

だとすれば、CSSを編集したり凝ったものを作る必要はありません。

HTMLのテーブルタグに広告のコード記載し、それをブログの表示させたい場所に貼り付ければいいのです。

するとこんな感じでダブルレクタングルが完成します。

最後に

ダブルレクタングルは非常にクリック率が高い広告の配置と言われていますが、それは検索ユーザーがPCだった場合です。

スマホ相手にダブルレクタングルをやった場合、画面が広告で埋め尽くされるので、ユーザビリティとしては最悪です。嫌悪感を抱く人もいるでしょう。

ちなみに、スマホ画面を広告で埋め尽くす行為ですが、以前はアドセンス規約違反となっていましたが、今は規約の改定によりセーフとなっています。

やること自体はセーフなのですが、ユーザーのことを考えると「PCはダブルレクタングル」で「スマホはレクタングル１つ」というように表示を分けるのがいいと思います。（僕の運営しているアドセンスブログはそうしてます）

すると、結局CSSが必要になってしまうのが悩ましいところですね。

ただ、最近のテンプレート（有料・無料問わず）では、スマホとPCで広告の表示を分ける機能が実装されているものが多いので、そこまで悩む必要はありませんが。