グーグルはモバイル表示ファーストを掲げ、コンテンツの高速表示が可能なシステム、AMPの導入を推奨している。
AMPは"Accelerated Mobile Pegesの略。AMPを導入するとコンテンツの表示速度が通常の4倍にまで速くなる。ただ、表示スピードを追求するシステムのため、限定された最低限のHTML・CSSしか対応していない。その為、これまでブログやウェブサイトを彩っていたお気に入りのデザインは勿論、アドセンス広告も表示されない。
AMP対応コンテンツは通常の同じコンテンツよりも検索結果上位に表示される確率が高く、そこから検索ユーザーが流入する事も多い。私のブログでも月間にして数万ものPVが"ａｍｐ＝1"URLから発生している。しかしAMP表示ではアドセンス広告は見れない。広告収入を得ているブロガー・アフィリエイターにとっては収益的にチャンスロスが発生しているのが現状だ。
そこで、AMPコンテンツでもアドセンス広告を表示させる事が出来るので、HTMLと方法、それに纏わるTIPSを紹介する。※注意点もあるので最後まで読んで頂きたい
AMPにアドセンス広告を表示させるhtml
ネット上には検索すれば「AMP記事にアドセンス広告表示する方法」系の記事が多数出てくるが、グーグル側でもAMP用のアドセンスコードを用意している。私はグーグルが提供するコードを使用した。
上のアドセンスヘルプを見ていただければ分かると思うが、ネット上にあふれている＜ａｍｐーａｄ＞を使用する点は一緒だが、グーグル側では広告を2種類用意している。
- スクロールせずに見える範囲
- スクロールしなければ見えない位置
上記2種類の広告コードだ。グーグルがこの2種類を用意しているということはユーザービリティーの観点からAMP上の広告も、そのサイズに配慮する必要があるということだ。現在ネット上にある「AMPコンテンツにアドセンス広告表示させる方法」ではそこまでは語られていない。ペナルティの有無までは現在記されていないがここまで配慮していた方が無難だろう。
さて、コードを導入する為には必要な情報がある。
AMPにアドセンスを入れる為に調べておく情報
アドセンス広告のクライアントナンバーとスロットナンバーの2つだ。クライアントナンバーは"ca-pub-"に続く数字でアカウント毎に振られたもの、スロットナンバーは広告毎に振られた数字である。
- client="ca-pub〇〇〇〇〇〇〇〇の数字
- slot＝"〇〇〇〇〇〇の数字
これらはアドセンス広告のコード内に記されているので、自身のアドセンス広告ユニットのコードを見て調べて欲しい。
これら2つの数字をコードに入れ込む必要がある。
直接記事内にペースト
次に、実装するのだがAMPではヘッダーやフッター、記事上や記事下という区別が無い。なので記事に直接コードをペーストする方法を用いる。はてなブログでは[記事編集画面]>[HTML編集]で広告を表示させたい箇所に直接ペースト。そのあと先程調べておいた数字部分をコピペしてはめ込めばいい。
- コードを実装出来る場所は直接記事内
全記事に実装するのは難しいので効率よく厳選する
AMP表示アドセンス広告は一つ一つを直接記事内に入れるので全記事に実装となると相当な時間、手間がかかってしまう。それよりは"必要なコンテンツにだけ効率よくAMPアドセンス広告を実装する"事が私オススメの実装法だ。
AMPコンテンツでよく読まれる記事だけアドセンス広告を実装
よく読まれる記事を調べるにはグーグルアナリティクスから[行動]>[サイトコンテンツ]>[すべてのページ]でページビューの多い記事のランキングを表示させる。その中からURLの末尾が"amp=1"のコンテンツでPVの高いものを調べる方法がある。
アナリティクスのこの機能を活用して、ある程度記事を厳選しておく作業が必要となる。
その際コツとして、データを抽出する期間を1週間程度の期間ではなく1ヶ月単位にし、ある程度ボリュームを出して調べる必要がある。ブログやウェブサイトには「先週（1週間）は多く見られたが1月通して見るとそんなに読まれていない」記事が存在するからだ。
AdSenseプログラムポリシー
ここまで読んだら実装出来るだろう。ここで注意しなければならないのがアドセンスプログラムポリシーだ。
AMP広告ユニットが含まれるページにもAdSenseプログラムポリシーが適用されることを忘れないようにしてください。
AMPアドセンス設置者が忘れがちになるのが「スポンサードリンク」や「広告」の表示だ。通常のアドセンス広告同様にポリシーが適用されるので当然、上記の文言が必要になる。
ただ、この文字を入れると通常の閲覧ページではAMPアドセンスは表示されないのだが、「スポンサードリンク」という文言は表示されるので広告のない空間に文字だけが浮かぶ形になる。
最後に
どなたかがこの問題を解決出来る画期的なコードを作成してくれるだろう。その時はまた追記することとする。
また、コードを弄ったり削除したりはご自身の責任で。
