Luxeritas

2018年2月27日

2018年3月2日
パーマリンクにampという文字列が入っていると記事がうまく表示されない模様。まあ運用でカバーかな。

WordPressのAMP対応にあたり、いくつかAMP対応テーマやAMPプラグインを試してみましたが、いまのところLuxeritasというAMP対応テーマが一番良かったです。

AMPって?

すごく簡単に言うと「細い回線でも読み込みが速いページを実現する仕様」のこと。(一昔前からしたら今のモバイル回線なんてちょっぱやだけどな)

GoogleとTwitterが取り組んでいるプロジェクトで、Accelerated Mobile Pagesの頭文字をとったもの。

読み込みが遅くなる理由はいろいろなスクリプトを実行したり、スタイルシートでいろいろとレンダリングをしたり、細かいところで言うとimgタグに画像サイズを指定していなかったり。。。

そういうのやめれば速くなるねということで、htmlコーディングに制約を設けています。

  • 基本Javascript禁止(非同期読み込みならOK)
  • cssはhtmlのヘッダ部に50kB以内でインライン記述
  • htmlも使えるタグに制限あり(一部専用タグあり)

など。実際の細かい仕様はAMPプロジェクトのサイトを見てください。

このようにして読み込み負荷を低減する仕様に合致したものはWeb上にデータがキャッシュされて、検索結果から一瞬で読み込めてしまうよというもの。

Luxeritasに落ち着く

たとえばあるAMPプラグインを試してみると、Google Search Consoleで無効な構造化データ要素などと警告が出ます。

AMP対応テーマの中にはhtmlタグの置き換え処理がうまくいかないものもあって、Google Search Consoleでhtmlタグの禁止された用法であるとか無効な用法であるとのエラーが出ます。

そんな中、Luxeritasはとてもうまく動作しているので、手持ちのWordPressサイトのテーマをすべてこのテーマに置き換えてしまいました。

これでぼくのサイトもモバイルの検索結果にAMPマークが付いちゃうぞ!

ページによっては画像まで表示されてる。

AMP検索結果