LuxeritasでAMP対応
WordPressのAMP対応にあたり、いくつかAMP対応テーマやAMPプラグインを試してみましたが、いまのところLuxeritasというAMP対応テーマが一番良かったです。
Contents
AMPって？
すごく簡単に言うと「細い回線でも読み込みが速いページを実現する仕様」のこと。（一昔前からしたら今のモバイル回線なんてちょっぱやだけどな）
GoogleとTwitterが取り組んでいるプロジェクトで、Accelerated Mobile Pagesの頭文字をとったもの。
読み込みが遅くなる理由はいろいろなスクリプトを実行したり、スタイルシートでいろいろとレンダリングをしたり、細かいところで言うとimgタグに画像サイズを指定していなかったり。。。
そういうのやめれば速くなるねということで、htmlコーディングに制約を設けています。
- 基本Javascript禁止（非同期読み込みならＯＫ）
- cssはhtmlのヘッダ部に50kB以内でインライン記述
- htmlも使えるタグに制限あり（一部専用タグあり）
など。実際の細かい仕様はAMPプロジェクトのサイトを見てください。
このようにして読み込み負荷を低減する仕様に合致したものはWeb上にデータがキャッシュされて、検索結果から一瞬で読み込めてしまうよというもの。
Luxeritasに落ち着く
たとえばあるAMPプラグインを試してみると、Google Search Consoleで無効な構造化データ要素などと警告が出ます。
AMP対応テーマの中にはhtmlタグの置き換え処理がうまくいかないものもあって、Google Search Consoleでhtmlタグの禁止された用法であるとか無効な用法であるとのエラーが出ます。
そんな中、Luxeritasはとてもうまく動作しているので、手持ちのWordPressサイトのテーマをすべてこのテーマに置き換えてしまいました。
これでぼくのサイトもモバイルの検索結果にAMPマークが付いちゃうぞ！
ページによっては画像まで表示されてる。
