AMP対応でグーグルからエラー修正の警告！対処方法を検証してみた

現在Googleが推し進めているWEBサイトのAMP（Accelerated Mobile Pages）への対応について書いていきます。

AMPについては、以前にも下記の記事でご紹介してきました。

こちらでご紹介する方法は2016年11月当時の古い情報ですので、参考程度にお読みいただければ幸いです。具体的に申し上げますと、想定していたプラグイン「Quick AdSense」と「AdSense Manager」が利用できなくなったためです。代替えとして「Quick AdSense」の後継プラグイン「WP QUADS」について調べましたが、無料版ではAMP非対応となっています。新しい情報が入り次第、あらためてお伝えできればと考えておりますので、何卒ご了承くださいませ。 AMPとは・・・？AMP（Accelerated Mobile Pages）とは、Googleが推し進め...

UBL　Unchained Business Laboratory

AMP対応のアドセンス広告設置！2017年9月現在の最良の方法を解説！

https://watabonslab.com/best_of_amp_201709

トレンドブログをAMP対応にする際の課題のひとつ、アドセンス広告の設置方法についての続報です。これまでの方法でも対応できたものの、PC表示の際に「スポンサーリンク」の文字だけが消え残っていたりして不完全でした。それが今回の方法で解消されましたので、取り急ぎご紹介しておこうと思います。以前、下記の記事ににて、少々ややこしい設定方法をご紹介しました。その際の表示には、かなり納得のできない部分がありつつも、ほかにアイデアが浮かばないので放置しておりました。 ...

WordPressを利用している場合には、プラグイン「AMP」をインストール＆有効化することで対応できます。

しかし、多くの人がGoogleからのエラー修正メッセージを受け、その対処方法に悩んでいるようです。

このメッセージはGoogleアカウントのGmailと、SearchConsole（ウェブマスターツール）内のメッセージとして届きます。

そこで、このメッセージを受け取った際の対処方法について、僕のケースに基づいてお話ししておこうと思います。

SearchConsole内のメッセージから対処する

ある日、GoogleのSearchConsoleを開いてみると、ダッシュボード左上の「メッセージ」のところに、メッセージが届いていることを表す数字が表示されていました。

それが「AMP ページのエラーを修正してください」というものでした。

「詳細を表示」⇒「AMP エラーを確認する」と進むと、次のようなページが開きます。

問題の項目と、それに抵触しているコンテンツ（記事）の数が表示されています。

「重大度」の欄に「致命的」などと表示されていて、さすがにドキッとしますね。

そこで、上から順に右端の「>>」をクリックしてみます。

上図のように、問題のあるコンテンツの一覧が表示されます。

そこで、さらに「>>」をクリックしてみると、下図のようにそのページの何が問題なのかを指摘しています。

『属性「type」はタグ「ul」で使用できません。』と書かれているので、WordPressのエディター（テキスト表示）から問題の記事を確認してみました。

すると、箇条書きのためのタグ内に、表示を指定する「type」タグが仕込まれていることが判りました。

これが禁止されているということなので、下記のように修正します。

<ul type=”disc”>　⇒　<ul>

続いて、上図の「AMP ページをテスト」欄の右にある「ページをテスト」をクリックします。

すると下図のように表示されました。

これでこの記事については問題ない・・・と思ったのですが・・・。

1つの記事内に複数の問題を指摘されている！？

問題の項目を1つずつ確認していくと、1つのコンテンツ内に複数の問題点が指摘されているケースが多いことに気づきました。

その内容には次のように書かれています。

属性「type」はタグ「ul」で使用できません。
タグ「html for top-level html」の親タグは「$root」ですが、「!doctype」のみ使用できます。
タグ「link rel=」の属性「rel」に無効な値「canonical」が設定されています。
タグ「style amp-custom」の親タグは「body」ですが、「head」のみ使用できます。
タグ「link rel=」の属性「rel」に無効な値「stylesheet」が設定されています。
属性「charset」はタグ「meta name= and content=」で使用できません。
タグ「script」は特定の形式以外は許可されていません。

『属性「type」はタグ「ul」で使用できません。」については、先ほど対処したからOKですね。

しかし、それ以外の指摘については、僕の知識では意味も判らず対処のしようがありません。

しかし、問題は指摘されているものの、先ほどの「AMPテスト」では「有効なAMPページです」という結果が出ています。

では、これらの残された問題点については放置して良いものなのか・・・？　という疑問が残ります。

「構造化データ」に関する指摘は無視してもOK？

AMP対応の必要性がささやかれるようになって1年くらいになるでしょうか？

その仕様についても少しづつ変更が生じているようです。

以前チェックした情報によれば、次のようなことが書かれていました。

以前はエラーに抵触していた「構造化データ」については、推奨レベルとなり、必須事項ではなくなりました。

「構造化データ」とは次のようなものを言うそうです。

構造化データとは、HTMLで書かれた情報が何を意味するのかを、検索エンジンやその他のクローラーに理解できるようタグ付けしたものです。
人間ならばWebページを見れば、その文字列が会社の名前であるとか、お問い合わせ電話番号であるとかがわかりますが、ロボットには理解することは困難です。
そこで、あらかじめ決められたフォーマットをもとに、そのような文字データ(data)をロボットにも理解できるよう構造化して(structured)記述したものが構造化データ（structured data）です。
引用元：brain-solution.net

そこで僕は、先ほどの残された問題点について、「構造化データ」に関するエラー表示なのではないか・・・？　と想像しました。

でも、自分で判断ができるほど知識がないので、「Googleウェブマスターヘルプフォーラム」に質問してみることにしたんです。

それが次のような内容です。

「AMP対応についてのSearchConsoleのエラー修正メッセージについて」

SearchConsoleの「Accelerated Mobile Pages」に、AMPの該当する問題を修正するように警告されました。

しかし、AMPテストツールにかけると「有効なAMPページです」との結果が出ます。

以前は必須とされた「構造化データ」が、推奨レベルになったと聞きました。

それによるものでしょうか？

だとすれば、AMPテストツールの結果が「有効」であれば、SearchConsoleで問題とされる修正課題は、当面スルーして大丈夫なのでしょうか？

これに対して有識者の方が回答してくださったのですが、それがおおよそ次のような内容でした。

AMPテストツールの結果が「有効」で、モバイル検索した際にAMPマークが表示されていれば問題なし。

「構造化データ」はカルーセルに表示する時のみ必要。

カルーセルの導入を考えていないのであれば、このエラーに限り無視しても問題無い。

「カルーセル」とは、次のようなものを指します。

カルーセルとは
カルーセル[carousel]とは、メリーゴーランドや空港の回転コンベアーなど、くるくると回るものを指し、WEBデザインにおいては、横に自動でスクロールするスライドギャラリーの様なもののことを指す。単純にスライドショーと表現する事もある。
引用元：design-gallery.biz

このアドバイザーによれば、AMPの本来のパフォーマンスはカルーセルでも発揮されるそうで、現在はニュースサイト以外でも多く用いられているそうです。

なので、サイトによっては「構造化データ」のマークアップも検討してみては？　ということでした。

また、修正を施したコンテンツがチェックツールに反映されるには時間がかかるそうなので、「修正したのにエラー表示する」という場合は、少し時間を空けて確認すると良いそうです。