AMP導入はあきらめた。というか保留

WordPressのプラグイン

先日、このブログで投稿したAMPの話。
[ AMPで4倍速、モバイルページの今 ]

そのうち試したいなぁ、なんて考えていたのですが中々腰が重くて放置になっていました。
調べてみたところ便利なWordpressのプラグインが出てきているようなので、どんなものかと試してみました。
サクッとできたら最高なんだけど。
モバイル表示のスピードが約4倍というのだからやらない手はないかなぁ、と。

試したプラグイン

公式Webサイト
今回、試したのはコレです。

実装した結果

結論から言うと簡単にはできませんでした。

崩れるCSS

AMPを利用すると、使用できるCSS(スタイルシート)に制限があるらしく、今回試したWordpressプラグインだと推奨される状態に変更されてしまうようです。
これが原因で余白が空きすぎている箇所があります。崩れてるほどではないのですが違和感があります。

動かないJS

CSS同様、JavaScriptにも問題があります。簡単にいうと基本使用できません。
メニューの開閉部分や、スライドショー、プリローダーなどサイト内で使われているJavaScriptが使えなくなっています。
こりゃあ、参ったですね。

解決策がないわけではなさそう

とはいっても解決策がないわけではなさそうです。
ググッたら色々と出てきましたので備忘録を兼ねて貼り付けます。

AMPページを判断する条件分岐の関数

WordPressでAMPページと通常ページを条件分岐する関数「is_amp_endpoint()」の使い方
[WordPressのための便利帳]

これを使えばAMP表示のときに不要な外部リンクをキャンセルできますし、カスタマイズはかなり楽チンになりそうです。

スタイルシートについて

サポートされる CSSサポートされる CSS
[AMP公式サイト]

• 許可されないスタイル
• 制約のあるスタイル
• カスタム フォント

<link rel=”stylesheet”>が使えないんですね。(※カスタム フォントには使えるみたいです)

amp-scriptが一般公開

任意のJavaScriptをAMPで動かせる！amp-scriptが一般公開される
[海外SEO情報ブログ]

読んでみると『<amp-script> を利用すれば任意の JavaScript を AMP ドキュメントで実行することが可能になります。』とあります。

とりあえず保留です

高速でWebページが表示されるのはとても魅力的なのですが、UIに関わる部分にまで大きな制限があるのであれば、サイト自体をそれなりに設計する必要がありそうです。
比較的最近のサイトはJQueryやCSS3を使った視覚的な仕掛けのあるサイトが多くなってきています。
AMPを導入するのであればそれなりの準備が必要かもしれません。

とはいっても、もうちょっと試してみたい気もしますので時間のあるときにゴニョゴニョしたいと思います。
とりあえず保留。
では。