黒子の観察者スマートフォン用の表示で見る黒子の観察者テクノロジーやビジネス、音楽について書くブログです。モバイルシェアするTwitterGoogle+PocketGoogleが進めているモバイル高速化プロジェクトAMPに、新たに広告を表示する機能が追加されました。ads、略称"A4A"と呼ばれるこの広告は、従来のネット広告に比べて高速に表示される仕組みです。ユーザーがAMPの記事を閲覧する際に、邪魔にならない快適さが追求されています。Projectの公式ブログにて公開されています。以下のアニメーションの、左が通常のネット広告で、右がA4Aです。ページ上部に青いデモ用の広告が表示されます。その早さを体感してみてください。A4Aを高速表示する仕組みA4Aを高速表示する仕組みは、いくつかの技術によって支えられています。「海外SEO情報ブログ」からご紹介します。リクエストとレンダリングの分離A4Aは、広告のリクエストとレンダリングを完全に分離しています。ページに広告を表示する際に、サーバー側では、オークションなどの処理が発生し、レスポンスに時間がかかることがあります。ページを表示するクライアント側では、受け取った広告のレンダリングのために、CPUやメモリなどのリソースを消費します。結果、ページのメインコンテンツのレンダリングを遅らせる原因になります。A4Aでは、両者を分離することで、ページのレンダリングが遅くなることを防いでいます。AMPのフォーマットに沿った広告A4AはAMPの仕様に従って構成されるため、表示が遅くなる要素がかなり省かれています。A4Aの場合、AMPの仕様に従っているかの有効性を検証するので、バリデーションチェックの時間が短縮されます。その他、今まで広告が自由にできていたことが、仕様により制限がかかっています。AMP用の解析ツール広告は、それぞれの広告専用の解析ツールを実装することが珍しくありません。1つのページに3つの広告を表示した場合、3つの解析ツール(JavaScript)が稼働することがあります。これが表示を遅らせる原因になります。A4Aでは、amp-analyticsを利用して計測するので、1つのコードで複数の解析が可能となっています。ユーザーの閲覧タイミングで表示A4Aはスクリーンの見える範囲にある場合にのみ表示される仕組みです。ページの下部にある広告は、スクロールして下部に到達してはじめて掲載のための処理が始まります。状況に応じてアニメーションのフレームレートを抑えるなど、ユーザーの閲覧体験を極力阻害しない配慮がなされています。AMPはオープンソースなのでどの広告ベンダーも使えるAMPはオープンソースです。そのため、どの広告ベンダーもこれを利用してA4Aに対応した広告を配信することが可能です。A4Aの技術的な詳細は、Githubに載っているので参考にしてみてください。12:06関連記事2016-08-10【Google】ローカルパックの広告をスタート。日本ではついにレストラン予約もGoogleがローカルパックの広告を新たにスタートしました。(1)はてなブログをはじめよう!blackwatcherさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。