AdSenseにページの表示を妨げない非同期型コードが登場

2013/7/16 23:31

Google AdSense に新たに「非同期型」のコードが追加されてます。非同期型のコードを使うとサイト上の他の部分の読み込みを妨げなくなるため、ページの表示速度が遅くならないという利点があるとのことです。現時点ではベータ版となっています。

非同期型のコードを使うには、広告コードの貼り替えが必要となります。

既存のコードであれば AdSense の管理画面から「コードの取得」をクリックして、コードタイプのプルダウンで「非同期(ベータ版)」を選択し、表示されるコードをコピペすればOKです。

同期型と非同期型の違いについて

基本的にブラウザは script タグで指定されている外部 JavaScript ファイルの読み込みが完了しコードの内容を実行するまでページの表示処理をストップします。

なので、スマートフォンなど回線が遅い環境でページを表示すると読み込み時間が長くなり、広告やソーシャルボタンなどのコードの影響でページの表示が遅くなるということがよくあります。

一方で、今回新たに提供された非同期型のコードであれば、ブラウザはその外部 JavaScript ファイルの読み込みの完了を待つことなく次の表示処理に移ります。なので、ページ自体の表示は同期型のコードの場合より速くなるかもしれません。

しかし、広告の表示自体が後回しになるため、広告コンテンツが表示される前にページがスクロールされ、広告自体が訪問者の目に入らなくなるという可能性はあります。

実際、画像の読み込みの多いサイトに非同期型のコードを貼り付けてみると、ページ自体の表示は速くなりましたが、他の画像コンテンツ等の読み込み待ちによって広告コンテンツ自体の表示は遅くなるという状態になりました。

何を重視するかはサイトによって様々だと思うので、重視するポイントを決めてから実際に検証し、最終的にどちらのコードを使うか決めることをおすすめします。

(追記 2013-07-19) 一般的な script タグの async 属性について分かりやすい解説がありましたのでこちらもどうぞ。 → ユーザの体感速度を高めるためのJavaScriptチューニング（前編） | HTML5Experts.jp

Webエンジニアやってます。最近はドットインストールの開発がお仕事です。その傍ら、個人で Meity や電車遅延なう、梅酒.in、 #グラドル自画撮り部の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。