まーーーめんどくさかった・・・サイトのAMP対応(泣)
猫ネタではありません。昨年最終週あたりから取り組んできたサイトのAMP対応。
・・・ってこのサイトを訪問いただいている方にとってはさして興味的な内容でもありませんし、ましてやインターネット上にあるページの表示に関する技術的なことなんて興味ないでしょうね・・・。
AMPというのはスマートフォンなどのモバイルデバイスでページを爆速で表示する技術。
2016年頃からGoogleとTwitter共同で行っているプロジェクトなんです。
必要な要件などは
[contentcards url=”https://amp.dev/”]
に書かれていますが、これに対応させるのが、まーーーーーーーとってもめんどくさい(怒)。
ただGoogle様がやっていこうとしていることなのですから、サイトを作る一人として「できない」とは言えないところなので、発足から3年経って、要件も固まった頃・・と考えて、私が管理するサイトをすべてAMP対応にしました。
当然このサイトも先ほど対応を済ませ、しばらくするとスマホから開いたときの表示速度が爆速になっていきます(だんだん浸透するのでしばらくは今までのものと混在します)。
ちなみにパソコンからでも確認できるので、試しに↓のリンクをクリックして表示してみてください
パソコンで見ると質素かつ結構画像なんかボケた感じになってしまいますが、スマホだときれいに表示されます。
このサイトも含めWordpressというサイト作成&運用ツールを使って基本的には作っていますので、たまたま見ていただいた方でWordpressのAMP対応に興味のある方は、
[contentcards url=”https://www.momosiri.info/tag/amp/”]
で対応方法や苦労話、不具合の対処方法などいろいろ書いてますのでご覧ください。
対応させてみて分かった・・・AMPは中途半端な技術!?
AMPについてはほとんどトーシローではありますが、仕組みについてちょっと触れておくと、「このページはAMPで表示できますよ!」という構造にしたものをGoogle様に伝え、Google様がそのページを保存、Googleの検索結果からタップしてページを表示すると爆速でページが開くというもの。
つまり検索経由で来ない場合には最初の「AMPですよ!」というのを普段のアドレスに追加しないと爆速表示されないんです。
これを回避するためにスマホでアクセスされたものはすべてAMPですよ!のアドレスに転送するのが全うな手法なんですが、それをしてしまうと、何等かの理由でAMPの仕様に対応していないページは表示できなくなってしまうという不都合が発生するんです。
なので、現状の対応としては、AMPですよ!のアドレスでアクセスした方に表示するページから、このサイトの違うページに移動するときのみAMPですよ!のアドレスで表示するようにしています。
そうしておくと、もしもAMPですよ!のページが表示できなかったときに従来のモバイル用ページが開くので、ページが見れない!という不具合は回避することができるんですね。
・・・・なんて書いてもわからないですね、すみません・・・
とにかく超超超めんどくさかったAMP、このお正月で一応対応が完了しました。
あーーーーーー疲れた(泣)。