問題発生
今朝、10:00頃にメールを
チェックしたところ
Google Search Console Team
からメールを頂いていました。
AMP ページのエラーを
修正してくださいとのこと。
“Search Console
AMP ページのエラーを
修正してください



のウェブマスター様
お客様の一部の AMP ページが
弊社のガイドラインに
準拠していないことが判明しました。
そのため、該当するページは
Google 検索のAMP 関連機能の
対象とはなりません。
該当するページの一部は
Accelerated Mobile Pages
レポートでご確認いただけます。”
早速、メールにあった、
“レポートを開く”
をクリックすると、
Google Search Console
が出てきました。
これです。
どうすればいいのか、
ググりました。
でも、他の方のブログでは、
答えは見つかりませんでした。
よって、今、
この問題に直面している方の
参考になれば、と思い、
記事にしました。
ちなみに、はやい段階、
まだ記事が少ない段階で、
アラートして頂いたのは、
不幸中の幸いです。
100記事以上も書いたあとだったら、
どの記事のどこにエラーがあるのか、
障害箇所の一次切り分け作業が、
大変になるところでした。
このエラーの履歴は、
ダウンロードできます。
あとあとのために、
ダウンロードしておいた方が
いいと思います。
csvファイルで
ダウンロードしたところ、
私の環境では、文字化けしました。
よって、Google ドキュメントで
ダウンロードしました。
>
私が修正した手順
この画面の右下にある>>を
クリックします。
すると、この画面が出てきます。
どれでもいいので、
右にある>>をクリックします。
すると、この画面が出てきます。
この画面で1のAMPリファレンスを
クリックすると、AMPについての
解説があります。
いちおう、一通り読みました。
しかし、CSSに詳しくない私には、
レベルが高い内容でした。
AMPについては、なおさら、
なに、それ、おいしいの?
です。
2のページをテストをすると、
この画面が出てきます。
丁寧に、エラーの箇所を
指摘して頂きました。
ただ、私には、ググっても
理解できませんでした。
数時間かかりました。
下にあるAMP URLの右をクリック
すると、この画面が出てきます。
元のURLの末尾に ?amp=1 が
ついているURLです。
AMPに対応したスマホから
このブログを見ると、
こうなっているらしいです。
タイトルから下が、真っ白です。
CSSがエラーだからだそうです。
らしいと書いたのは、
はてなブログのプレビュー画面で、
AMPでも普通に見えているので、
何がエラーなのか、わかりません。
また、私が持っている、
Androidのエクスペリアでも
iOSのiPadでも
普通に見れていますので、
謎は深まるばかりです。
この機会に、CSSとAMPについて、
勉強しようと思いました。
今回は、はしょります。
>
私が思いついたこと
このエラーで思い当たったのは、
AMPの画面で、
アドセンスの広告が表示されないこと。
それと、昨日、はてなブログの
設定からではなく、個別の記事の
HTML画面で、アドセンスの広告
ユニットで作ったAMPのコードを
最初の行に貼り付けていったことです。
これで、アドセンス違反になることで、
AMPでもエラーなのか、
と思いました。
そして、個別の記事ごとに、
また、HTML画面で、
AMPのコードを削除して、
記事の更新をすれば、解決、
と思いました。
ただ、この作業は、
とても時間がかかるので、
何か、他に手はないものか、
と思案しました。
そして、思いついたのが、
これです。
今回の答えが、これです。
はてなブログのAMP対応は、
まだ、試験中なので、
もしかしたら、
スマホ用の設定、一番下にある
詳細設定をクリックした所にある、
AMP用CSSを
いじればいいのかも、と。
そして、貼り付けてあった、
コードを一度全部、
バックアップとして、
メモ帳に貼り付けて保存してあと、
AMP用CSSの欄を全部消去しました。
結論から書くと、このまま保存して
終了でエラーは、出なくなりました。
ページをテスト、
をクリックすると
この画面が出てきました。
せっかく、設定していた
AMPのコードを削除した
結果がこれです。
有効なAMPページです。
皮肉なものです。
AMPのコードがないのに、
有効とは。
私の修行が、
まだまだ足りない
ということです。
このあと、この画面にある、
Google に送信をクリックすると、
この画面が出てきます。
Google にページが
インデックスされる、
予約ができました。
その前に、
貼り付けてあったコードの一部に
コピペのエラーがあったかどうか、
確認する為に、
ひとつずつ貼り付けて検証しました。
その結果、どのコードを
貼り付けても、
エラーになりました。
よって、これは、もしかして、
はてな側の問題なのかも、
と思いました。
ググった結果でも
はてな側の問題を指摘している
ブログもありました。
私がどんなコードを
貼っていたかは、
長くなりますので、
また、別の記事で書こうと思います。
とりあえず、今回の結論は、
バックツーザフューチャー
ではなく、
バックツーザベーシック
ということで、
基本に戻る、白紙に戻す、
デフォルトに戻す、
ということです。
AMP用CSSの欄を
ブランクにしたあと、
AMPのURLをクリックすると、
この画面が出てきました。
正常にブログの画面が出てきました。
ちなみに、
Googleにページが
インデックスされる
予約ができても、
すぐには反映されません。
よって、
Accelerated Mobile Pages >
無効な CSS スタイルシート
(問題の重大性: 致命的)
の画面も、修正したあと、
数日、エラーの状態が、
続くと思います。
サイトマップも2種類
送信してみました。
しかし、このエラー画面は、
そのままです。
次回、クロールされるのを
数日待つしかないようです。
さらに、ちなみに、
スマホ画面の上に設定した
アドセンスのコードは、
このAMPのエラー問題とは、
直接は関係ないようです。
(間接的には、ありそうです。)
よって、各個別記事のHTMLで
貼り付けたアドセンスのコードは、
そのままにしてあります。
もし、アドセンスで注意されたら、
消去する予定です。
では、また。
コメント