サイト内リンクで全画面広告を表示させない - うざいことは百も承知なんだけど……

一時期はそれなりにアクセスがあった当サイト。ここ数年でアクセス数は激減の一途。「更新頻度の激減」「検索からAIへの移行」「狩猟、渓流釣り、という人口の少ない趣味に邁進」などなど、理由はいくつかあると思う。それでもまあ、書くことはおもしろいし、書きたいと思ったらえっちらおっちら書いている。その文章がいつか誰かのお役に立てばめちゃくちゃうれしい。文章を気に入ってくれたら尚うれしい。極々稀にいる、目的だったであろう記事以外の記事をたくさん読んでくれる人の存在は、めちゃくちゃうれしい。一番うれしい。

次にうれしいのは、アフィリエイトを利用してくれたり、AdSense広告をクリックされた時かもしれない。

とはいえ書いたからには読まれたいし、広告が邪魔になっては本末転倒なので、記事中に自分で広告を挿入している。全画面広告は嫌いだし、どう考えても邪魔なので、ずっと使わなかった。でも、テスト導入してみるとしっかり効果がある。誤クリックが増えただけだろうけど、サイト運営費だって必要だ。というわけで、1年ほど前から全画面広告も表示するようになった。

僕の認識では、全画面広告が表示されるのは外部リンクをクリックしたとき、つまり、自サイトから離脱する時だけだったんだけど、いつからか色んなタイミングで表示されていたらしい。

ということで、まずは管理画面から「追加のトリガー」を無効にした。また、自サイト内の移動、例えば関連記事や記事一覧ページなど、別の記事を読もうと思ってクリックしてくれたのに広告を表示するのは忍びないので、無効にしたい。同じくアフィリエイトのリンクもせっかく紹介している製品に興味を持ってくれたのに全画面広告まで見せるのは心苦しいので、これらのリンクは全画面広告を無効にしたい。

回避方法を調べてみると、aタグに「data-google-vignette=”false”」設定するだけでいいそうなので、こんな感じのJavaScriptで書き足すことにした。

document.addEventListener('DOMContentLoaded', () => {
  document.querySelectorAll('a[href]').forEach(link => {
    if (link.hostname && link.hostname !== location.hostname) {
      link.target = '_blank';
      link.rel = 'noopener noreferrer';
    } else {
      link.dataset.googleVignette = "false";
    }
  });
});

言葉で説明すると、href属性をもつaタグのリンク先が自サイト以外の場合、「data-google-vignette=”false”」を追加している。ちなみに自サイトのリンクは「href=”/hunting/”」みたいにドメインを省略していることがあるので、それにも対応している。これで当サイトから離脱するときのみ、全画面広告が表示されるようになったはず。

しかし最近のウェブサイトは広告だらけで驚く。そりゃみんなAI質問して終わるよなと。特にスマホで見たら記事と広告の境界がわからないし、「閉じる」ボタンを探すのに疲れて記事を読む気にならない。そんなサイトの多くはAIで生成されているのかもしれないけれど。