開発

自分で使ったら、ツールの入力のすぐ下に広告。AdSenseの自動広告をやめて、広告を「手で置く」ことにした

約5分で読めます

無料のWebツール集「YAKARON Tools」には、Googleアドセンスの広告を入れています。最初は、ページの中の広告の位置をGoogleが自動で決めてくれる「自動広告」を使っていました。コードを1行入れるだけで、あとは何もしなくていいので楽です。

ところが、自分でツールを使ってみたら、使いにくい。原因は、広告の位置でした。

広告

計算の手順のすぐ下に、広告が入っていた

スマホで、糸巻き量を計算するツールを使っていたときのことです。計算は「1 スプールの糸巻き量」「2 巻きたいメインライン」「3 下巻きに使う糸」と、上から順に入力していく作りになっています。

その「1」の、「リールを選ぶ/糸巻き量を入力する」を選ぶボタンのすぐ下に、広告が入っていました。

計算の手順の「リールを選ぶ/糸巻き量を入力する」のすぐ下に、広告が入っていた位置(赤い枠。実際の広告ではなく、位置を示した図です)

入力の途中で広告が割り込むので、続きの欄が下に押し出されて、手順が分かりにくくなります。ボタンのすぐ近くの広告は、押し間違いも招きます。AdSenseのポリシーでも、ボタンなどの近くに置いて誤ってクリックされやすい配置は避けるよう案内されています(広告のプレースメントに関するポリシー)。

自動広告は、思ったところに出るとは限らない

自動広告のうち、本文の中に入る「ページ内の広告」は、文章のすき間に自動で入ります。ブログの記事ならそれで困りませんが、ツールのページでは、入力の手順と手順のあいだも「すき間」として扱われてしまうようです。

自動広告は、どこに出すかをGoogleが決めます。手間がかからない代わりに、自分が「ここには出してほしくない」と思う場所にも出ることがあります。

まずは設定で何とかしようとした

広告を手で置く前に、AdSenseの設定だけで直せないか試しました。

  • 除外エリア(プレビューの画面で、広告を入れない場所を選ぶ): ページごとに選ぶので、ページがたくさんあるサイトでは現実的ではありませんでした
  • ページの除外(URLを指定して自動広告を止める): 止まるのは、そのページの自動広告ぜんぶ。「ページの中の広告だけ止める」はできません(サイトの特定のページを自動広告の表示対象から除外する)
  • 広告の種類ごとのオン・オフ: サイト全体でしか切り替えられません。しかも、tools.yakaron.comのようなサブドメインは、親のyakaron.comと同じ設定になります。ブログにも同じ設定がかかります

結局、自動広告のうち、本文の中に入る種類(バナー広告とMultiplex広告)をオフにしました。画面の上に固定されるアンカー広告は、本文の中には入らないので、オンのまま残しています。

もう1つ、検索語のような形で文章の中に出る「広告インテント」という種類は、Googleが用意している google-anno-skip という目印を、入力欄やボタンのある枠に付けて、そこには出ないようにしました(広告インテント フォーマットについて)。

つまずいたこと:設定を変えたのに、まだ出る

設定を変えたのに、いつも使っているブラウザでは、同じ場所に広告が出続けました。

ところが、別のブラウザで開くと、入力の下の広告は出ません。設定は効いていて、いつものブラウザに前の表示が残っていた可能性があります。また、設定の反映には1時間ほどかかることもあります(AdSenseのヘルプ)。

設定を変えたあとは、少し時間をおいて、シークレットウィンドウや別のブラウザで確かめるのがおすすめです。

広告を「手で置く」ことにした

本文の中の自動広告をやめると、本文の中に広告が出る機会がなくなります。そこで、AdSenseで「広告ユニット」を作り、置く場所を自分で決めることにしました。

ツールのページでは、次の3か所に置いています。入力や計算の枠の中には置きません。

  • タイトルの下(計算の手順より前)
  • よくある質問の前
  • ページの最後

今の広告の位置。タイトルの下に広告を置き、計算の手順はその下から始まる(確認用の画面で、広告の場所を点線の枠で示しています)

つまずいたこと:横長にしたのに、正方形の広告が出た

タイトルの下は、計算の手順を下に押し出さないよう、高さの低い横長の広告にしたいところです。ところが、横長を指定したのに、スマホでは正方形の広告が出てしまいました。

AdSenseの画面で選んだ形は、コードにはそのまま反映されていませんでした。はっきりした原因は分かりませんでしたが、AdSenseのヘルプにある「レスポンシブ広告の大きさをCSSで指定する」書き方(レスポンシブ広告コードを修正する方法)に変えたところ、横長に収まりました。広告のコードから、形を自動で決める指定(data-ad-format)と、スマホで幅いっぱいに広げる指定(data-full-width-responsive)を外し、枠の大きさをCSSで決めています。

広告の形も、実際に出してみるまで分からない、というのが正直なところです。

ブログも同じ考え方で

このブログ(www.yakaron.com)も、同じ設定になっているので、広告を手で置いています。記事では、書き出しのあと(目次の前)、本文の最後、記事の下の3か所です。記事を読む流れを止めないよう、見出しと見出しのあいだには置いていません。

まとめ

  • 自動広告は手間がかからない。でも、思ったところに出るとは限らない
  • ツールのように「操作する画面」では、操作の途中に広告が入ることがある
  • 設定でできることには限りがある。種類ごとのオン・オフは、サイト全体(サブドメインも共通)
  • 設定を変えたら、別のブラウザで確かめる
  • 確実なのは、広告ユニットを手で置くこと。ただし、形は出してみるまで分からない

きっかけは、自分で使ってみて、使いにくいと感じたことでした。広告は大事な収入源ですが、ツールが使いにくくなっては本末転倒です。作った人こそ、自分のサイトをスマホで使ってみるのが大事だと思いました。

広告

コメント

コメントを送る
運営者が確認してから掲載します(数日かかることがあります)。

YAKARON ToolsFREE WEB TOOLS釣り・子育て・暮らしに使える無料のWebツール集 →

広告