2016年。
Web界は核の炎に包まれた。
速さを求めるネットの神（Google）が民草に与えた制約。
それは、モバイルウェブ環境を改良する新たなテクノロジー。
AMP––––Accelerated Mobile Pagesの誕生であった。
ここでは、AMP登場以後のWebサイト/ブログにおける記事の書き方を考察していく。
「AMP」とは？
概要
そもそもAMPとは何なのか？
どれだけアメリカ人は英語3文字の略称が好きなのだとか思ってはいけない。
一言で言うと、AMPとは「モバイル端末でWebページを高速表示するための機能」である。
それだけだ。
もうほんとに乱暴に言っちゃうと、それだけだ。
技術的な話はとりあえず置いといてOK。
AMPのメリット
- モバイルページの表示が高速化
- SEO的に超有利
言うまでもなく、モバイル端末でのページ表示速度が速くなる。
これだけでも巨大なメリットだ。
一般に、Webページの表示に3秒以上かかると40%のユーザーが離脱することが知られている。
表示速度の高速化は、それだけでサイトのPVを増加させる効果がある。
また、「AMPを使用すること自体がSEO上有利」という事実も見逃せない。
AMPを使用したページは、カルーセル枠掲載など検索ランキングで優待措置を受ける。
サイトへの訪問者数を増加させたい運営者にとっては何よりも嬉しいポイントだ。
AMPのデメリット
- 導入の難易度が高い（場合が多い）
AMPの問題点はここに集約される。
既存のサイトをすぐにAMP化できるかといったら、必ずしもそうではないのだ。
AMPは、文章や画像といった静的コンテンツをキャッシュし、「最低限の表示」に不要なJavaScriptファイルは根こそぎシャットアウトする。
この、「AMPでは原則的にJavaScriptを使えない」というのは致命的だ。
それまでサイトやブログの記事内で、「特定のプラグインやJavaScriptがなければ表示できない要素」を大量に使っていた場合、AMPに移行すると大幅に表示が崩れる。
最悪、表示されない。
というかAMPエラーが出まくって、きちんとしたAMPページとして認識されなくなる。
ページをAMPに対応しようとしたら、外部ファイルに頼るビジュアル的な要素を極限まで排除したページ––––具体的には文章と画像とCSSのみで構成されている––––ページにするのが最も確実だ。
だが、できるか？
最近よくある「吹き出しによる会話プラグイン」とか使っちゃってねーか？
崩れるぞ、そのページ。
そうでなくとも、たとえばこのブログでは数式を表示するために「MathJax-LaTeX」というプラグインを使っているんだが、デフォルトのAMPはこのブラグインを読み込んでくれないため、AMPページでは数式が表示されない。
無理やりにでもAMPで「MathJax-LaTeX」プラグインを読み込ませようとすると、エラーになる。
基本的に、プラグインに頼った表示がメインとなるページをAMPに対応させるのは困難。
そう思ってくれて構わない。
AMP対応のページ作り
シンプルな記事を目指せ
さて、AMPの登場により我々は岐路に立たされた。
サイトの訪問者を増やすには、AMP対応できるようなページを増やすべきだ。
「文章と画像だけで構成されるページ」
しかし、これだけでは味気ないのでは？
もっとプラグインをゴリゴリ使って見た目を鮮やかにすべきでは？
OKはっきりと言おう。
ユーザーはあなたのサイトのデザインを重視しない。
彼らが求めているのは情報である。
そしてWebページで提供できる情報はテキストと画像だけでその9割以上を占める。
つまり、何かのプラグインに依存しなければページとして成立しないようなページ作りは避けるべきだ。
あ。ちなみにファイルやリンクとしてのアニメーションや動画は挿入してもいいぜ。
それは外部読み込みのJavaScriptファイルではないからな。
それでもJavaScriptが必要だ
そうは言っても、どうしてもページ作りにJavaScriptプラグインが欠かせない場合もあるだろう。
このブログでいうと
数学クイズ「帽子を忘れた少女」
の記事とかな。
この記事は、「MathJax-LaTeX」プラグインによる数式表示がメイン要素となっている。
どうしてもプラグインは外せない。
どう対処したか？
このページのみAMP対応ページから外した。
それだけだ。
もうこのページはAMP化による恩恵を受けることはできない。
代わりに、美しい数式が表示されるページを保つことができた。
それでいいのか？
問題ない。
AMP対応しなかったとしても、それがマイナスに働くことはないからだ。
すべてのページをAMP対応する必要はない
記事修正や必須プラグインの関係から、どうしてもAMP対応に書き換えることが難しいページが出てくるだろう。
その時は、あきらめろ。
それ以外のページをAMP対応すればいい。
AMP対応は、やらなくてもいいことなんだ。
やれば有利になるというだけで。
だから、もしAMP対応するためのコストが将来享受するリターンに比べて著しく高く困難な場合、AMP対応をあきらめるのも手だ。
AMPの導入方法
WordPressならプラグインを入れるだけでAMP対応がいちおう可能になる。
「いちおう」と言ったのは、それが既にAMP即応できるくらいシンプルなページになっていてAMPチェックしてもエラーが出ない場合に限られるからだ。
まあとりあえず、AMP対応するためにどこがダメなのか、エラーを見つけて修正するためにもとりあえずプラグインを入れてみよう。
代表的なプラグインは
「AMP」
「AMP for WP – Accelerated Mobile Pages for WordPress」
の2つ。
個人的には「AMP for WP – Accelerated Mobile Pages for WordPress」の方をおすすめする。
より細かいところまでデザイン・各種設定ができるスマートなプラグインなんだぜ。
Analytics/Webmasterの設定からページ内要素の編集・特定部分にウィジェット追加など、本当に細かいところに手がとどく驚異的な完成度だ。
「特定の記事だけAMPを適用しない」といった設定ももちろん可能。
スマートなページ制作を目指そう
良いページとは、保守性の高いページ
将来、AMPのように新たな機能がWebに登場するだろう。
その時のために、「どんな新機能が現れても即座に対応できる（いちいち修正しなくてもいい）ページ作り」というものが重要になってくる。
そのためには、どのようなページが好ましいか？
「保守性が高いページ」だ。
「何かに依存しないページ」と言った方が具体的かな。
特定のプラグインに依存しない
「特定のプラグインがないと表示できない」ページというのは、きわめて不安定な存在だ。
そのプラグインの開発者が開発を辞めてしまったり、AMPのような「プラグインを使わせない」機能の登場によりプラグイン自体が使えなくなる状況が起こりうる。
実際、ここ数年という短いスパンでさえ
「このプラグインがおすすめ！」
と圧倒的高評価を受けてきたプラグインが開発中止により使用不可になった例は腐敗して土に還って新たに育った木の葉を掃いて捨てるほど見てきた。
プラグインに依存するページは、可能な限り避けるべきだ。
「JavaScriptやPHPファイルに依存するページ」だぞ？
WordPressで、何かを表示するためのプラグインや、使用テーマが提供している、
[shortcode]みたいな記述を大量に使いまくってる人がいたら、今すぐそれを使わずに代替できる手段を探そう。
じゃないと将来、修正がめっちゃ面倒だぞ。
特定のHTMLタグに依存しない
「何かデザイン変えたいなー」
「そうだ、CSS用のHTMLタグを作って本文を装飾しよう！」
と考える諸君、ちょっと待ってほしい。
基本的に、HTMLに追加する独自のデザイン用タグは最小限にすべきだ。
なぜかって？
修正がクソ面倒だからさ。
たとえばあるテーマでは
<div class="list-box-3">
<ul>
<li></li>
<li></li>
</ul>
</div>
という独自のタグを追加してすべてのリストを装飾していたが、「ものすごく最強のテーマを見つけたが以前のページのHTMLタグが競合してどうにもならなくなり、結局これまでのページすべてのタグを修正しなければならない」みたいな事態が起こりうる。
一般的に、HTMLソースやコードは肥大化させてはならない。
修正がウルトラ面倒だからな。
本当に面倒だからな！
何かデザインしようと思ったら、「記事内にHTMLタグを追加せずにそれを実現できないか」を第一に考えてほしい。
「今後10年はこのタグが必要だ」と思うものがあったら、遠慮なく使うといい。
ちなみにこのブログで独自に追加しているデザイン用HTMLタグは太線と太赤線とでかい太線くらいだ。
正直これ3つがあれば事足りる。
あ、ごめんもう少しあったわ。
シンプルな囲み枠
と
関連表示
な。
うん。
正直これ5つがあれば事足りる。
シンプルな囲み枠は超便利。
特定のテーマ・サービスに依存しない
WordPressのテーマ独自の機能や外部サービスにものすごく頼りきったページは、変更時や移行時にものすごくめんどうだ。
それはそれは筆舌に尽くし難くダルい。
下手すると移行時や移行先でJavaScriptやPHPプログラムを自作しなきゃいけなくなる。
外注するのも手間だしコストがかかる。
「そうそう移行する機会なんてない」と思うかもしれないが、実際はこの雑記ブログでも大きな移行を3回経験している。
WordPressの利点は、より良い環境にすぐ移行できる点だ。
最新技術に対応したテーマにしろ、HTTPSやAMPといった新機能にしろ。
より良い環境に移行するたびに思ったのは、「もっとシンプルにしておけばよかった」ということだ。
記事がシンプルでさえあれば、ほとんどの問題は起こらない。
テキストと、画像と、gif/アニメーションと、Youtubeの動画埋め込みと、GoogleMapの地図埋め込みと、それくらい。
独自のタグは最小限に。
ショートコードも必要最低限に。
「これがないと記事内の要素を表示できない」プラグインもなるべく使わずに。
「何かに依存しないページ」というのは、それだけで最強の存在なんだ。
まとめ
プラグインを使ってはいけないわけじゃない。
そのプラグインが使えなくなった時、記事を大幅に修正しなければならないようなプラグインの使用をできるだけ避けるべきなんだ。
なぜか？
多くのサイト運営者やブロガーにとって、作成するページは数百〜数千に及ぶ。
気まぐれな針のひと刺しでその大部分が「不完全」になった時、そしてそれが一括処理による変更が効かない実際に目で見て逐一修正を加えなければいけないものだった場合、最悪だ。
何十時間も貴重な時間が盗まれる。
そして、シンプルなページを作っていない場合において、この事態の発生は珍しい話ではない。
外部プログラムないと表示できない要素があるページは、作らないようにしよう。
その表現は、ユーザーにとって本当に必要か？
