ブログを AMP 対応化してみるテスト

WordPress
この記事は約3分で読めます。
この記事は最終更新日より 1 年以上経過しています。
画像やリンクが無効になっている可能性もあるのでご了承下さい。

 以前よりちょくちょく目にするようになった Google の AMP (Accelerated Mobile Pages) という物。これはスマートフォンなどのデバイスでページを表示する際、極力シンプルで軽量なレンダリングを行う為の物となる。
 本ブログで使用している Simplicity2 というテーマが AMP 対応にも力を入れているようで、現状ではベータ版的実装だそうだが折角なので有効化して対応してみる事とした。

発生しやすい問題

 Simplicity2 で AMP 対応させて 1 日くらい放置しておくと Google の Search Console の Accelerated Mobile Pages の項に AMP ページとしてクロールされた結果が表示され始める。
 正しくインデックスに登録される物もあれば、重大な問題のあるページとして報告される物もある。特に多い問題としては style タグを用いた CSS の定義を用いたページでエラーが報告された。
 その他インライン CSS に関しては Simplicity2 サイドで上手い事よろしくやってくれているような感じだったので今回は対応から除外している。

 この一番上にある 44 の問題のあるページは全て style タグを用いたページだった。

style タグを全て除去する

 WordPress の Plugin には Search Regex という非常に便利なプラグインがあり、本文の置換が一括で楽に行えるのでこれで対応する。

Search Regex
Search Regex adds a powerful set of search and replace functions to WordPress posts, pages, custom p...

 検索する為には正規表現が必要で、次のような表現を書いて取り敢えず検索をした。

/\<style type="text\/css"\>(.*?)\<\/style\>/

 そして出てくる結果がこれ。

 71 もの記事で style タグが使われていた。一時期ヘッディングの装飾を凝った感じにしてみたいなと思っていた時があって、記事中に埋め込んでいたがここに来て仇となった訳。
 現状は殆どテーマで定義されているスタイルをそのまま用いているので、style タグは一括削除しても問題は無い。
 よって、「Replace & Save」をクリックして一括削除してあげた。場合によっては置換される文字列の部分に何かしらコメント化した文字列を埋め込んでおくのも手かと思う。

まだまだあるその他の問題

 WordPress の Plugin を用いて Youtube の動画を記事中に埋め込んでいる場合や、各種アフィリエイトのコードが問題として報告される。
 Youtube の場合は特別なタグを埋め込んで上げないとダメだったりするようなので現状は保留。
 アフィリエイトのコードは ValueCommerce の物が報告されたが、古い記事だったのでコード毎削除して対応。
 そして更に細かい問題も山積み状態。
 ここら辺は Google Search Console でページテストをしながら追々対応していこうかなと思う。
 現状で正しくインデックスに登録されたページの方が多い状況なので安心はしている物の、問題があればアクセス数の多い記事から順に対応していくべきだろう。AMP 対応化によって具体的に何がどうなるかは長期的に見ていかないと分からない。苦労して対応化した結果が良い物と出れば良いのだが。

著者プロフィール
ぶっち

本格的に PC へ触れ始めてたのは 1990 年位から。
興味は PC 全般。OS は Windows と Linux などを嗜む。
プログラマやネットワークエンジニアを経てフリーに活動している 2 児の父な 40 代半ばのおじさんです。

ぶっちをフォローする

コメント

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.