\明日から本気出すブログ/

AMP HTML タグの属性で指定されたレイアウトが無効です。【対処法まとめ】

ブログ運営
この記事は約5分で読めます。
スポンサーリンク
叫ぶヒヨコ
叫ぶヒヨコ

「AMP HTML タグの属性で指定されたレイアウトが無効です。」
ナニコレ…???

グーグルサーチコンソール(Google Search Console、サチコ)で急に警告が…!

 

なんでも、「AMP HTML タグの属性で指定されたレイアウトが無効です。」とのこと。

 

応援ヒヨコ
応援ヒヨコ

こうした警告をムシすると、Google様にそっぽをむかれてしまう可能性が…

ブログ収益に直結するので、早急に対処しましょう。

今回は、図解付きで対処法をまとめたので参考にしながら、サクッと解決してくださいね!

 

スポンサーリンク

急に現れる「AMP HTML タグの属性で指定されたレイアウトが無効です。」

サチコを色々眺めていると、この警告に気が付きました。

どうやら、7月4日(日)以降、この警告がずっと出たままだったようです。

叫ぶヒヨコ
叫ぶヒヨコ

全く気が付かなかった…!

スポンサーリンク

警告をムシするとどうなるの…?

この警告をムシしたままで、何も対処しないとどうなるのか公式で発表されています。

ぐでヒヨコ
ぐでヒヨコ

(英語…。。。)

そもそもですが、このAMP(アンプ)というのは「Accelerated Mobile Pages」、つまり「高速モバイル用ページ」という意味です。

AMPでは、パソコン用の画面の大きさをスマホ用に小さくして、さらにデータを軽量化したものです。

cuteヒヨコ
cuteヒヨコ

「モバイル通信でも高速で表示されるように工夫したページ」ってこと!

例えば、こんな記事を見たことないでしょうか?

  • 記事の読み込みが遅くて、イライラする
  • 画像の端が見切れていて、違和感がある

こうしたものはすべて、「AMP」が正しく設定されていないために起こります。

応援ヒヨコ
応援ヒヨコ

スマホユーザーのために、このAMP警告が出たときは対処しておこう!

 

対処法

では、早速解決していきましょう。

 

  1. 警告箇所の特定しよう
  2. 警告内容を修正しよう
  3. 警告メッセージを読んで、それ通りに対処!
  4. 最後にもう一度AMPテストしよう

 

まずはアナタのサイトのどの記事が警告になっているのか、調べるところからです。

Google公式のこちらのサイトに、アナタのサイトのURLを入力すれば一発で調べることができます。

入力するURLは、グーグル サーチ コンソールの警告画面からURLを知らべることができます。

例えば、このブログの場合はこのように出てきました。このURLを先ほどの公式サイトにコピペして検索すればOK!

 

  1. 警告箇所の特定しよう
  2. 警告内容を表示しよう
  3. 警告メッセージを読んで、それ通りに対処!
  4. 最後にもう一度AMPテストしよう

 

先ほどのURL検索で無事ヒットすれば、このような画面が出てきます。

この画面が出てきたら、後は書かれている通りに対処しましょう。

例えば今回の場合は、どうやら「heigth」タグが問題のようです。

 

  1. 警告箇所の特定しよう
  2. 警告内容を表示しよう
  3. 警告メッセージを読んで、それ通りに対処!
  4. 最後にもう一度AMPテストしよう

 

「検証の問題」に書かれている行をクリックすると、画面右にHTMLで記述された文章が出てきます。

その箇所が警告になっている原因です。

 

どうやらプロフィールに載せているTwitterへのリンクが悪さをしているようです。

確かに確認してみると、警告に書かれていた「height」についての記述がありませんでした。

 

そこで、別の記事にもTwitterへのリンクを使っているので、コードを変えてみました。

  • 変更前

    • 変更後

cuteヒヨコ
cuteヒヨコ

せっかくだし、Twitterのフォロワー数を自動で表示してくれるコードに変えました!

  1. 警告箇所の特定しよう
  2. 警告内容を表示しよう
  3. 警告メッセージを読んで、それ通りに対処!
  4. 最後にもう一度AMPテストしよう

 

警告通りに対処したら、最後にもう一度AMPテストをやっておきましょう。

グーグル サーチ コンソールの上の画面「修正を検証」をクリックしましょう。

応援ヒヨコ
応援ヒヨコ

無事通れば解決です!
検証が通るまで、何度でも修正できるのでトライしてみましょう。

 

まとめ

今回は、「AMP HTML タグの属性で指定されたレイアウトが無効です。」の対処法を紹介しました。

AMP(アンプ)はスマホユーザーのためにも、大切な設定です。

もし再度AMPの警告が出てしまったら、今回紹介した方法で再チャレンジしてみましょう。

 

ブログ運営
スポンサーリンク
Follow Me!
ポンblog

コメント

タイトルとURLをコピーしました