4月27日にGoogle東京オフィスで開催されたAMP Roadshow Tokyo 2018に参加しました。
AMP Roadshowは世界中の都市を横断しているイベントで、6月にはロサンゼルスとシアトルで、7月にはニューヨークとアースティンでも開催が予定されています。
AMPをご存じない方のために簡単に説明すると、AMPとはAccelerated Mobile Pagesの略で、元々モバイルの表示速度を向上するオープンソースの取り組みです。2016年よりAMPを導入したサイトが増えてきております。
今年2月にオランダのアムステルダムで開催されたAMP Conference 2018 のレポートを見て驚いたことは、AMPの技術はランディングページ最適化やブログやニュース記事の高速化以外にも使われていることです。
例えば「AMP Story」や「AMP for Email」を見ると、高速化のためにAMPは様々な技術的な制約があるにも関わらず、リッチなコンテンツを作ることができるのです。
今回のAMP Roadshow Tokyo 2018では、GoogleのAMPプロジェクトのチームメンバーが来日し、最新のAMP技術についてのお話や、AMPを使ったよりインタラクティブなサイト開発や収益化についてのセッションもあるとのことで、ぜひ参加したいと思って応募しました。
AMP Roadshow Tokyo 2018の概要
AMP Roadshow Tokyo 2018は、世界中から集ったAMPチームのメンバーからのお話がありました。同時通訳のイヤホンがあったので、新しいAMPの機能についてのお話もよく理解できたのです。
一番のトピックは、ECサイトのAMP化での成功例が増えているというお話でした。ECサイトの場合、モバイルページの表示速度が1秒遅くなると、7%のコンバージョンが下がるというデータがあり、ECサイトの高速化は避けて通れない問題なのです。
ECサイトはリッチなコンテンツが必要だし、パーソナライズされたコンテンツの配信がAMPで対応できるのか気になっていたんですよね。
ECサイトのAMP化が進んでいる
ECサイトの場合、写真もたくさんあったりするので、ページのロードに時間がかかることも多くあります。そこで、ウェブページをAMP化することで、ページの読み込み速度の問題を解消することが可能です。
とはいえ、ECサイトの場合、ブログやニュースのようにコンテンツを読ませるだけではありません。技術的な制約の多いAMPページで、商品を魅力的に表示できなければ、そもそもユーザーは商品を購入してくれませんからね。
この問題に対しては、AMPライブラリを使うことで、リッチなコンテンツを提供できるようになったとのこと。
パーソナライズされたコンテンツの配信
ECサイトに不可欠なパーソナライズの問題も解決できる模様です。
AMPページは、AMP CDNにキャッシュされたコンテンツを返すので、ユーザーに応じてパーソナライズしたコンテンツの配信は難しいと言われてきました。が、amp-list を利用することで対応できるようになります。
- amp-list・・・ユーザーにパーソナライズされたコンテンツの配信が可能
AliExpressは商品ページをAMP化したところ、コンバージョンが4.3％上がる
AliExpressは商品ページをAMP化することで、コンバージョンが4.3％上がりました。
実際にAliExpressを訪問して気がついたことは、商品ページはAMP化していますが、それ以外の商品一覧ページはAMP化していません。商品一覧ページは、パーソナライズする必要があるので、まだAMPの実装をしていないんだろうね。amp-listを使えば、パーソナライズされたコンテンツの配信も可能なので、近い将来全てのページでAMP化することは間違いありません。
メルカリも商品ページをAMP化
AMP Roadshow Tokyo 2018ではメルカリの話は出てきませんでしたが、メルカリも商品ページはAMP対応しています。
商品一覧のページはAliExpressと同様にAMP対応されていません。
デスクトップでも商品ページがAMP対応してサクサク動くので、優れたUXを提供できている点が素晴らしい。
今後、PWAに対応するようになったら、モバイルアプリを入れていないユーザーに対してリーチできるようになります。AMPとPWAの組み合わせをメルカリは狙っているんだろうね。
フルAMPのページ
モバイルだけでなく、デスクトップもAMPページを提供しているサイトも登場しています。
AMPには、JSが使えないなどの技術的な制約がありますが、AMPライブラリを使うことで優れたUXを提供できるように進化しているのです。
- TASTY・・・BuzzFeedが提供するレシピサイト。動画の提供もあり。
- SPIEGEL DAILY・・・出版社が発行しているウェブ版のネット新聞。AMP Validatorでエラーが出ているのが気になりました。
AMPの問題点
今までAMPの良い点ばかりを書きましたが、AMPの問題点もあります。
キャッシュされたURLと、実際のURLが異なる
キャッシュされたURLと、実際のURLが異なるところは、AMPの問題点と言ってもいいでしょう。
AMPページからAMPページへの遷移は？
モバイルでAMPページにランディングして、その後内部リンクをたどると、通常のモバイルページに移動するサイトはよくあります。
でもね、AMPページとモバイルページのUIは若干異なるので、あまりいいユーザー体験ではありません。
AMPページからAMPページへ遷移する方法として、自ドメインからAMPコンテンツを配信する方法があるとのことでした。ただしAMP Casheほど高速化はされない模様。
今後、AMPはどうなるのか？
AMPチームの方の発言では、モバイルページの表示速度が早くなれば、AMPの役割は終了してなくなる可能性もありますが、当分の間はないとのこと。フレームワークとして考えると、JSやjqueryのようにずっと残るものと考えているようです。
日本のようにモバイルネットワークの環境が4Gというのは、世界中では珍しい環境です。世界中には2G、3Gのネットワークの国が主流なので、ウェブサイトをAMP化する需要があるというお話でした。
まとめ
AMP Roadshow Tokyo 2018に出席した強く感じたことは、技術的な制約の多いAMPでも、インタラクティブでリッチなコンテンツを配信することができるということです。
AMPの最新技術が様々なウェブサイトに導入されていくことになるだろうね。今後のAMPの展開が楽しみです。
※AMP Roadshow Tokyo 2018のセッションの中であった、AMPとPWAを組み合わせる3つの方法は、下記のページで紹介しておりますので、こちらをご確認ください。
ナレッジ