AMPエラー内容いろいろ。Google先生に怒られっぱなし

スポンサーリンク
AMP(Accelerated Mobile Pages)とは
Googleが主導。モバイルページを高速で表示させるためのプロジェクトのこと

AMPが有効になっているか確認・修正する3つの方法

「amp-ad」で必要なタグ「amp-ad extension .js script」がないか、正しくありません。これはまもなくエラーとなります

新しく送られてきたエラー通知ですが、意味が分からないので放置です。。

 

属性「action」はタグ「FORM [method=POST]」で使用できません

AMPではフォームは使えません。よって、コメント欄は表示されませんし、パスワードをフォームに入力して閲覧する記事もアウト。

どうにもできませんので該当の記事はAMPから外しました。

 

タグ「amp-iframe」のレイアウト「width」に含まれる属性の値が無効

タグ「amp-iframe」の属性「width」に無効な値「100%」が設定されています。

The attribute ‘width’ in tag ‘amp-iframe’ is set to the invalid value ‘100%’.

 

初期の頃、「Googleマップは幅を100%にしたら見栄えが良い」的なことをどこかのブログで拝見して、その通りにしたらエラーだらけになりました。

 

タグ「FORM [method=GET]」の HTML 属性「action」の URL プロトコルが無効

いまだに不明。どこが悪いのかさっぱりです↓

赤坂 炭火焼肉 金星でランチ

※いつの間にか直った模様

 

タグ「a」の HTML 属性「href」の URL プロトコルが無効

なんで"が入っているんだ…

<a href=”&quot;https://www.google.com/maps/d/embed?mid=15FI3ILJ931uKyqpWJwUDUqIE_qM”>地図</a>

 

スポンサーリンク

許可されていない属性が HTML タグ「a」にあります①

プラグイン「Lazy Load for Videos」が原因でした。

遅延ロードプラグイン「Lazy Load for Videos」はAMPでは使わない方が良い。WordPress

 

許可されていない属性が HTML タグ「a」にあります②

属性「shape」はタグ「a」で使用できません。

The attribute ‘shape’ may not appear in tag ‘a’.

どーしてこの場面で「shape属性」が入るのかなあ。

 

許可されていない属性が HTML タグ「a」にあります③

属性「height」はタグ「a」で使用できません。

The attribute ‘height’ may not appear in tag ‘a’.

属性「width」はタグ「a」で使用できません。

The attribute ‘width’ may not appear in tag ‘a’.

 

タグ「div」の属性「style」のプロパティ「zoom」は許可されていません

babylinkが原因でした。こういうの。

自動的に「zoom: 1」が挿入される場合があるようです(marginだけで良いのに)。

<div class=”babylink-box” style=”overflow: hidden; font-size: small; zoom: 1; margin: 15px 0; text-align: left;”>

babylinkはもう公開されていませんので、該当部分を削除するしかありません。

 

タグ「amp-iframe」の HTML 属性「style」の値が無効。許可されていない属性が HTML タグ「td」にあります

なんでscopeが入っているのか。他の部分には入っていないのにー

<td style=”width: 50%; text-align: center; background-color: #ededdd; height: 60px; border-style: groove;” scope=”row”><strong>1か月あたり</strong></td>

表は気をつけないとダメみたいですね。

表の枠線を太くした箇所もエラーでした。

table border=”2″

The attribute ‘border’ in tag ‘table’ is set to the invalid value ‘2’. Debug.

「表のborder属性「2」を取り除く」

 

許可されていない属性が HTML タグ「FORM [method=POST]」にあります。タグ「input」の HTML 属性「type」の値が無効

アンケートのプラグイン「WP-Polls」が原因でした(:_;)

せっかくご回答1件いただいたのですが、プラグイン削除です。

AMPって制限ありすぎ

 

必須属性「target」がタグ「FORM [method=GET]」にありません

いつの間にか「合格」していましたので詳細は不明です。

https://zbnr-hp.com/chrome/?amp=1 他多数。

 

タグ「amp-iframe」には拡張機能 JavaScript の「amp-iframe」が含まれている必要があります

「ampを付けろ」ということでしょうかね。

他の修正をしているうちにいつの間にか直っていました。

 

タグ「img」はタグ「noscript」の子孫としてのみ使用できます。「amp-img」ではありませんか?

・・・

知らんがなー

 

スポンサーリンク

どうしてもエラーを改善できない場合

 

「width」と「height」を入れたらエラーになったのですが、これ説明文なんですよね。

直しようがない。

 

こういった場合は、投稿画面にあるAMP設定で「AMPを生成しない」にチェックを入れて、AMP除去(AMPに反映させない)するしかないと思います(テーマはCocoon)。

 

ついでにモバイル ユーザビリティエラー

クリック可能な要素同士が近すぎます

見直しましたが良く分かりませんでした。

コンテンツの幅が画面の幅を超えています

放置していたらいつの間にかOKになっていました

 

後書き

 

AMPサイトを目指す場合は、目新しいことにはあまり挑戦しない方が良いと思います。

「こんなプラグインがあるのか!こんなこともできるのか♪」と挑戦した事柄はことごとくエラーになりました。

AMP。時々イヤになる

まだまだ修正箇所が多数あり、適当に記事を書いてきた私にとっては本当に大変。

しかし、AMPを攻略すると、内容はともかく構築的には100点満点のサイトを作ることが可能になるかと。もう少しがんばりたいと思います。

AMPが有効になっているか確認・修正する3つの方法