最新Web技術！AMPについて調べてみた

AMPは「Accelerated Mobile Pages」の略です。

google翻訳してみると「加速されたモバイルページ」と略されます。

つまり、AMPとはモバイルページ高速化のことで、googleが取り組んでいるオープンソースのプロジェクトを指します。

近年では徐々にモバイルページへの表示速度が求められ、googleさんの情報によりますと表示速度に3秒以上かかるモバイルサイトでは40%くらいの方が閲覧をあきらめるそうです。

そのため、これらの課題に対応してユーザーエクスペリエンスやサイトへのエンゲージメントを向上させることが目標になり、そのために行う施策としてAMPが必要になってきます。

しかし、AMPはページを高速にロードできるようにするため、ページ数の多いサイトには有効ですがSPAのような1ページで非同期に内容を書き換えるようなサイトには向いておりません。

このようになんでもかんでもAMP対応を行えばよいというわけでなくサイトの特性により向き不向きがあるそうです。

googleさんの情報によりますと下記のURLにモバイルからアクセスして、実際にAMP対応が行われたサイトのデモが確認できるそうです。

また、AMP対応のサイトには f:id:y_saiki:20170929134335p:plain

の表示があります。

※

の画像は以下のサイトから引用させていただいております。

筆者自身まだ試せていないため、資料とわかりやすそうな参考サイトを下記にまとめました。

どうやらAMP HTMLという仕様があるそうで独自タグを使用しなさいや制約があったりします。

例えば<img>タグではなくて<amp-img>タグを使用しなさい。

または<form>タグは使用禁止などがあります。

そこら辺についても今後調査していこうと思います。

サイトをストレスなく見れるのは主にスマホでネットを見るユーザーからしたら、とてもうれしいですね。

しかし、対応する側としてある程度育ったサイトをAMP化するのはとても工数がかかりそうな気がします。

そして対応前と対応後でデザインが崩れる可能性があるだとか。。。

色々一長一短がありますが、今後のECサイト開発には視野に入れるべき内容ではあるかと思います。

以上

Sassyブログ