コンテンツの表示速度を劇的に（通常の約4倍）早くする為、Googleとtwitterが共同開発したAMPプロジェクト。基本的にAMP表示のコンテンツにはCSSは入れない方が良いのだが、それではあまりにも殺風景なコンテンツしか表示されないので視覚的にツマラナイ。
最近はAMP記事にCSSを設定して多少のカスタマイズを施すブログもチラホラ見えてきた。
▶︎ブログのAMPコンテンツにアドセンス広告を表示させるHTMLと効率の良い導入方法 - interest blog
当ブログでも少しだけ見栄えを良くしようと多少いくつかのCSSを設定している。だが、ここで注意しておきたい事がある。AMPコンテンツには使用できない、無効なCSS・HTMLコードが存在するという事。
AMPで使えない（無効な）コードを書くとPV減！
使えないCSSコードを入れてしまうと「少し遅くなって、順位が落ちるだけだろ…」とか安易な考えでは済まない。
まぁ、安心してください。結論から言うと。
全く表示されません！検索ランク外です！
インデックスすらされません！
…！
どこが安心なんだよ！！
そんなツッコミは各自心の中でお願いします。
実は当ブログで数日前にPVの減少があり調べてみると、"AMPで使用できない無効なCSS"がコンテンツに存在する事が発覚。ワタシトシタコトガ
サーチコンソールでAccelerated Mobile Pagesをチェック
▼サーチコンソールの画像
画像では92ですが、元は150あまりのエラーページが発生していました。赤いグラフの頂点部分です。しかも問題の重大性は致命的。
直ぐに修正を掛けて、エラー数は下がり始めています。なんとかPVも戻ってきました。
先ほども述べた通り、エラーが発生したAMPコンテンツ（重大性：致命的）は検索結果に表示されなくなります。検索経由で結構な数の流入を得ていたのに、150ページもAMPページが消えてしまっては、そりゃ〜PV下がりますよね。
AMP用CSSを設定されている方は定期的にサーチコンソール［検索での見え方］>［Accelerated Mobile Pages］をチェックする事をオススメします。
AMP用CSSはどこに入れる？
因みに"無効なCSSを入れる"と言うのをはてなブログで言うと、デザイン編集から[スマホ編集]＞[詳細設定]＞[AMP用CSS設定]に入れるという事。
コンテンツ自体に入っているのはAMPで見たときに表示されないので（強制的に排除）大丈夫。
あと、はてなブログ有料版じゃないと"AMP用CSS設定"は使えない。
AMPで使えない無効なCSS
今回私が無効と判断されたCSSは《！important》だったが、使用できないものは結構あるので全てを記すことは出来ない。
とりあえず、エラーとなるコードはサーチコンソール内（上記画像のページ）で表示してくれるのでエラー表示があればその都度削除・訂正していけばいいだろう。
本来得られるはずだったPVを無駄にしない為に、サーチコンソールのチェックはこまめにしよう。
