AMPの致命的エラーに対処「HTML タグの禁止された用法、無効な用法（問題の重大性: 致命的）」

Googleの影響

私のようなブログを構築しようともしかしたら思う人もいるかもしれませんので、私がブログを運営する上で、苦労していることやそれを改善した方法について、残しておこうと思います。後々自分のためでもあるので。

先日、AMP(Accelerated Mobile Pages)、つまりモバイル表示の高速化に対応した件は記事にしました。

モバイル表示の最適化あまりAV機器とは直接関係ないネタですが、本ブログを快適に閲覧いただくために、最近改善を進めています。先日、本ブログを運営するためにお借りしているレンタルサーバを、さくらレンタルサーバからエックスサーバーへ移行しました...

そのAMPの対応について、少し問題が発生しています。

ブログの運営に重要な2つのサービス

ブログを運営していると、無視できない存在に大手検索エンジンがあります。特にGoogleが提供するサービスは本ブログのような検索エンジンからの流入が多いサイトにとっては神様のような存在です。以下の2種類のツールはとても重要なツールとなっています。

Google Analystics

Redirecting...

どのくらいに人が訪れて、どのくらい滞在したかなどのデータを収集するサービス

Search Console

Google Search Console

検索エンジンからどんなキーワードで流入したかなどのデータを収集するサービス

2つのサービスを利用することで、自分のサイトへ流入している流入経路から、どんなページへ遷移していくか、どのくらいの時間で離脱するか、年齢層やその比率など様々な情報を分析することができますが、ブログのページにGoogleの様々な基準に沿わない場合には、エラーとして警告を受けます。

Google様からの警告

以前本ブログをモバイル端末からのアクセスに対して表示の高速化を行うAMP()に対応したことを記事として書きましたが、その後しばらくしてSearch ConsoleからポツポツとGoogle様からエラーの警告を受けるようになっていきました。その数32件。

Accelerated Mobile Pages > HTML タグの禁止された用法、無効な用法（問題の重大性: 致命的）

禁止された HTML タグを削除するか、AMP 標準でサポートされていない属性または値を修正してください。AMP ページに HTML タグの禁止された用法や無効な用法があると、Google 検索結果に AMP 固有の表示機能が表示されないことがあります。

お上から致命的とまで言われてしまっては、そのまま放置するわけにもいきませんが、私にはWEBプログラムの知識はほとんどありませんので、1つ1つ指摘された内容を咀嚼しながら、HTMLソースコードを見ていきました。

分析と修正

まず本当にエラーがあるのか、エラーメッセージの詳細から「AMP ページをテスト」を行います。正常ならいいのですが、異常がある場合は「有効な AMP ページではありません」と表示警告が表示されます。