本文へ
ハクソク

世界を動かす技術を、日本語で。

広告ブロッカーが検出されませんでした

元記事: 原文(maurycyz.com)

概要

  • インターネット広告 の問題点と低い報酬について解説
  • uBlock Origin などの推奨アドブロッカーの案内メッセージ実装方法
  • JavaScriptとCSS を使った非侵襲的な通知の仕組み説明
  • 技術的な詳細 とユーザー体験向上の工夫を紹介
  • 寄付による支援 の重要性を強調

インターネット広告とアドブロッカー推奨メッセージの実装

  • インターネット広告 はユーザーの時間を浪費し、ウェブ体験を悪化させる要因
  • 広告収入 は非常に低く、サイト運営者は内容の薄い広告だらけのサイト運営を強いられる現状
  • 作者支援 には広告閲覧よりも直接的な寄付が有効
  • 多くの人が広告をインターネットの一部と捉えているため、 アドブロッカー の利用を促すメッセージを表示
  • uBlock Origin のような信頼できる拡張機能を推奨
    • 商用アドブロッカーは信頼性が低く、場合によっては詐欺的なものも存在
    • 広告で宣伝されるアドブロッカーはユーザーから収益を得る目的が強い

メッセージ表示の技術的仕組み

  • ページ内に div要素 を設置し、 nativeads.js というスクリプトを読み込む構成
    • <script defer src="/nativeads.js"></script>
    • <div id="ad-note-hidden" class="多数の広告風クラス名"> <p id="ad-note-content-wrapper"> </p> </div>
  • nativeads.js の動作概要
    • クッキーでメッセージ表示履歴を管理
    • 初回のみ「アドブロッカー未検出。uBlock Originの利用を推奨」という内容を表示
    • 閉じるボタン （Click here to close）が機能し、クリックで非表示＆クッキー記録
  • CSS によるデザイン調整
    • 画面サイズが十分なときのみ右下に固定表示
    • コンテンツを覆わず、邪魔にならない配置
  • アドブロッカー がdivやスクリプトをブロックした場合、メッセージは表示されない設計
    • uBlock Origin Liteのようなネットワークリクエストのみをブロックするタイプにも対応
  • DNSベースのブロック は検出不可
    • 実際の広告を読み込む以外に検出手段がないため、控えめな通知設計を採用

ユーザー体験への配慮

  • JavaScript非対応ブラウザ ではメッセージ非表示
    • そもそもアドブロッカー不要なケース
  • CSS非対応ブラウザ での動作も考慮
    • ただし、実際にJSのみ対応でCSS非対応なブラウザはほぼ存在しない
  • 通知は一度だけ表示 され、再表示防止のためクッキーを利用
  • 他サイトのアイデア （Stefan Bohacek氏）を参考に、誤検出を減らし、クッキーの作用範囲も明確化

寄付による支援の重要性

  • 広告収入 よりも 直接的な寄付 の方が作者の支援に役立つ
  • 1ドルの寄付 でも広告閲覧より大きな貢献
  • サイト利用者に対し、 寄付という支援方法 を積極的に提案

提供: ハクソク · 要約更新:

AIによる日本語要約です。内容は原文とあわせてご確認ください。

Hacker Newsの議論を読む

Hackerたちの意見

このサイトを訪れる人と、まだ広告ブロッカーを使ってない人の重なりってどのくらいなんだろう？でも、広告が画面にべったり貼られてる開発者も見たことあるし、彼らが意識的にそうしてると信じたいな。

└

広告ブロッカーをインストールしてないから、そういうのはよく見かけるよ。広告ブロッカーの代わりに、ユーザーに優しくないサイトを覚えておいて、そういうサイトは避けるようにしてる。広告が多いサイトは時間の無駄だから、どこにでもある自動再生の動画があると、別のところに行くサインになっちゃうね。

└

考えてみると、プロのYouTuberがブラウザを見せると、広告ブロックしてないことが多いよね。でも、プロのYouTuberなら広告ブロックのことは知ってるはず。彼らは本当に広告を意図的に見てるのかな、プライベートでも？それとも、視聴者にアイデアを与えないために動画のためだけに広告ブロッカーをオフにしてるのかな、広告収入を失わないために。

ブラウザがページのonload後にJavaScriptを無効にする方法を提供してくれたらいいのに。ユーザーが何かをクリックしたときだけJavaScriptが有効になるとか。

└

それに同意だわ。昔はIEのストップボタンがこれをやってると思ってた。

└

古いOpera（Chromiumシェルになった前のやつ）は、メニューに簡単にJSのオンオフを切り替えるトグルがあったけど、読み込み時だけだったか、すぐに効いたかは覚えてない。

└

setTimeout(() => { // 未来の全てのJavaScriptをぶっ壊す setTimeout = setInterval = requestAnimationFrame = () => {}; Element.prototype.appendChild = () => { throw new Error("ブロックされた"); }; document.addEventListener = () => {}; window.addEventListener = () => {}; Object.defineProperty(document, "readyState", { get: () => { throw new Error("JSなし"); } }); document.write = () => {}; // canvasをぶっ壊す if(window.HTMLCanvasElement) HTMLCanvasElement.prototype.getContext=()=>null; // webglをぶっ壊す if(window.WebGLRenderingContext) window.WebGLRenderingContext.prototype.getParameter=function(){e=>{throw new Error("ブロックされた")}}; // webgl2をぶっ壊す if(window.WebGL2RenderingContext) window.WebGL2RenderingContext.prototype.getParameter=function(){e=>{throw new Error("ブロックされた")}}; // websocketsをぶっ壊す window.WebSocket=function(){e=>{throw new Error("ブロックされた")}}; window.EventSource=function(){e=>{throw new Error("ブロックされた")}}; // ポップアップをぶっ壊す window.open=()=>null; // ... }, 500);

└

それか、マウスオーバーね。

└

NoScriptアドオンを使ってしばらくブラウジングしてみたけど、ほとんどページが読み込まれないから、訪れるほぼすべてのページをホワイトリストにしないといけなくて、目的が達成できないんだよね。どこか別のところでJSを実行して、スクリーンショットやレンダリングされたHTMLを送ってくれるようなレンダープロキシがあればいいなって考えてる。もしくは、LLMを活用して、膨れ上がったJSのゴミを探してる実際の情報に変換できるかも。

└

もしかしたら変わったかもしれないけど、広告スクリプトは document.write() を使ってて、これがすぐに実行されるんだよね（onLoadとかの前に）。これが遅い大きな理由の一つ。

でも外部CSSを使うと、リクエストが失敗してスタイルが適用されないページになるのは結構普通だよ。 それ、かなりおかしな発言だね。CSSスタイルシートが読み込まれないことって、どれくらいの頻度で見るの？ほとんどのサイトはスタイルシートがないと全く使えないし、最後にスタイルシートが読み込まれなかったのを見たのはいつだったか思い出せないよ。

└

過去数年で一度だけそんなことがあったけど、簡単にリフレッシュしたら直ったよ。普通だと言うのは大げさだね。

Hacker Newsで議論の続きを見る

同じ出典の記事