2015-09-28

こんにちは広告事業部の芳賀（@func09）です。

iOS9からの新機能である Content Blocking Safari Extensions を利用して広告の表示をブロックするアプリがリリースされて、ネットでも結構話題になっていました。

広告コンテンツをブロックするツールということで、普及の仕方によってはメディアの収益に影響を与えうるものです。実際に広告ブロッカーアプリをインストールして、Safariを利用すると一部の広告はブロックされるようになりました。現時点では英語圏のネットワーク広告などは消えるが、日本語圏の広告にはまだ対応されていないことが多いようです。

収益にどのくらい影響を与えるのか？ということを調査するにも、まずどのくらいの利用者が広告ブロッカーを使っていて、どのくらいのインプレッションに影響があるのかを、定量的に計測することが必要だと考え、その仕組みを導入しています。

広告ブロッカーの仕組み

広告ブロッカーを検知する仕組みを作るには、まず Content Blocking Safari Extensions でできることを理解しておく必要があります。

Content Blocking Safari Extensions は以下のようなJSONで定義したルール群を持ちます。

[
    {
        "action": {
            "type": "block"
        },
        "trigger": {
            "url-filter": "webkit.org/images/icon-gold.png"
        }
    },
    {
        "action": {
            "selector": "a[href^=\"http://nightly.webkit.org/\"]",
            "type": "css-display-none"
        },
        "trigger": {
            "url-filter": ".*"
        }
    }
]

ルールは、trigger と action に分かれていて、コンテンツが trigger に指定されている条件にマッチすれば、action を実行します。

trigger は url-filter や resource-type など URLやファイル名、リソースのタイプでフックすることができます。

evil_ads.js というファイルをロードしないようにするには以下のようになります。

[
    {
        "action": {
            "type": "block"
        },
        "trigger": {
          "url-filter": "evil_ads.js"
        }
    }
]

.evil_ads_box というDOMを表示したくなければ

[
    {
        "action": {
            "type": "css-display-none",
            "selector": ".evil_ads_box"
        },
        "trigger": {
          "url-filter": ".*"
        }
    }
]

こんな感じになります。

実際のコードは OSSになっている BlockParty の実装が参考になります。

広告ブロッカー検知の方法

広告ブロッカーを検知するためには、上記のような挙動のどれかひとつを検知できれば良いので、一番簡単な「特定の要素を非表示にする」挙動を検知するようにしています。

OSSでは BlockAdBlock というPCブラウザ用の広告ブロッカーアドオンを含めて検知できる便利なライブラリがあったのですが、ごく単純な実装にするために参考するにとどめました。

<div id='ad_blocker_bait' class = 'pub_300x250 pub_300x250m pub_728x90 text-ad textAd text_ad text_ads text-ads text-ad-links'></div>

<script type='text/javascript'>
  function checkBait(){
    var bait = $('#ad_blocker_bait');
    return bait.css('display') === 'none' || bait.css('visibility') === 'hidden';
  }

  setTimeout(function(){
    if(checkBait()) {
      // 広告ブロッカーが有効になっている
    } else {
      // 広告ブロッカーが有効になっていない
    }
  }, 1000);
</script>

非常に簡単なスクリプトですが、餌となるセレクターを持った空の要素を作っておき、1秒後に消えていないかチェックするだけです。

検知ロジックについて

このロジックは、この記事を書いている2015年9月28日の時点で、主要な広告ブロッカーアプリに対して有効であるとは考えていますが、今後も有効であるかは保証しかねます。

非常に簡単なものなので、広告ブロッカーの精度に合わせて改変していく必要があると思います。

計測について

計測すべきか否かという点については、仮に他社の利用率などが公表されたとしても、メディアによってユーザー特性は変わるため、当然インストールしているアプリも違うはずなので、きちんと自社で計測していくのが良いと考えています。

何をどのくらい測るべきか？もメディア次第なのですが、広告視点で考えて在庫に対してどのくらいの割合が広告ブロックされたものなのか？それによる収益への影響はいくらなのか？ということがわかるように、特定のページにおいてサンプリングした上で利用・非利用の数をとっています。

まとめ

今回は、Content Blocking Safari Extensions を利用した広告ブロッカーについてとその検知の仕方について書いてみました。対応の仕方はメディアによって様々ではありますが、定性的な話題や周囲の対応に流されず冷静な判断をするために、まずは計測をして、収益インパクトを推測してみるといいのではないでしょうか。

最後に、広告事業部ではメンバーを大募集しております。とりあえず話だけでも・・という方でも良いので是非気軽にご連絡ください！

クックパッド開発者ブログ

広告ブロッカーの検知と計測について

広告ブロッカーの仕組み

広告ブロッカー検知の方法

検知ロジックについて

計測について

まとめ