[Wordpress] The site that could handle AMP without problems suddenly failed because of the "⚡" mark

【WordPress】問題なくAMP対応できてたサイトが突然ダメになるのは「⚡」マークが原因だった

公開日:2019年12月30日 AMP

今回は完全にハマりました(笑)。まさかそんなことが原因だったとは・・・。

自力でAMP対応させるためのファイルなどを作り、数サイトで順調にAMP対応が進んでいました。

Google Search Consoleでも徐々にAMPページのインデックスが進んでいっており順調順調♪♪と思っていた矢先に事件は発生しました。

問題なくAMP対応できていた複数のサイトのうち、ある1つのサイトだけAMPにならない。そして、AMPチェックで

AMPページではありません

このURLはAMPページではありません。AMPページへのリンクも設定されていません。

・・・なんで???

私の場合、独自テーマで動くようにある程度パッケージ化していて、テーマ内へそれらをアップロードすることと、適用するためのいくつかの記述を追加するだけにしてあって、どのサイトも基本的な構造は一緒。それなのにそのサイトだけがノーなんです・・・。

うーーん、このサイトだけ何かやったかなぁ??ひょっとして元のテーマがおかしいの??いろいろと見ていき、AMPにするためのパッケージもサイド上書きしたりして原因を特定しようとするも全然ダメ。ただでさえ面倒なことに取り組んでいるのにこんなイレギュラーが出たら・・・頭真っ白、煙が出てきそうになりました。

やっぱりAMPは難しい・・・そのサイトはまだほぼインデックスされていないから解除しちゃおうかなぁとあきらめかけたとき、ふと先頭の方のコードに目が行きました。そこに書かれていたのは・・・

< html  ? > 

?(はてな)ってなんだ~~~(怒)

問題があるのはこのサイトだけだし、テキストエディタの文字コードも問題ないので文字化けなんて全く気にしてませんでした(笑)。

ここには⚡の絵文字みたいなのがあるはずで、他のサイトではきちんと⚡になっています。ここからは想像ですけどこれが何かの拍子(テーマ更新やテキストの更新)で化けたようです。

こんなことで毎回不具合がおきたらたまりませんから何とかならないの??こういうときは巷の噂よりも公式サイト!!ということで

のスタートページに載っているソースコードを見てみたら・・・
<!doctype html>
< html  amp  lang = "en" >
  < head >
    < meta  charset = "utf-8" >
    < script  async  src = "https://cdn.ampproject.org/v0.js" > </ スクリプト>
    < title >こんにちは、AMP </ title > 

⚡マークじゃないじゃん!!もちろん⚡マークでもいいようなのですが、日本だったら

<html amp lang="ja" > 
と「amp」という文字と言語コードを入れればいいようです。

そもそも何で⚡マークになったのか?⚡マークはどんな特殊文字なのか?はこの際どうでもいいことですから、私のように突然AMPが蹴られたときにはまず真っ先に確認された方がいいと思います。


今回は解決できたから笑い話で済みますけど、AMP対応ってプラグインを使うにせよ、自力で対応するにせよ、通常のようにプラグイン有効化すればOK、どこかのコードを参考に設定すればOKってもんでもなく、どちらの方法でもサイトの状況によって調整が必要。有料テーマなんかで「AMP対応済」なんてしてる方はいろいろと不具合をフィードバックされてさぞかし大変でしょうね。普通の人は当たり前だと思ってるんですから・・・ご苦労さまです。プラグインについてもあり得るケースをどんどん取り入れてアップデートの繰り返し・・・無料でやってるんだから本当に頭が下がります。

特にフロントエンドで特殊な表現をするプラグインを使っている方、AMP対応は甘くないですよ~~。

今回のことを踏まえ、配布させていただいているha-Basicテーマ用のAMPパッケージ、そのうち配布しようと思っています。もちろん自己責任で使用してもらうつもりなので無料にする予定です。他のテーマでも使えるものになると思いますから、今から自力で!と思っている方はリリースを待っていただくといいかも知れません。

・・・って⚡マークが?になってるのも気づけない位トーシローに近いですから過度な期待はしないでくださいね(笑)。

後述

2020年1月4日 このサイトもAMP化しました。一番ごちゃごちゃやってるのでいろいろ対応が必要でしたが、あらかた完了。⚡マークでなくてもGoogleのモバイル検索結果にはちゃんと⚡マークが表示されていましたので、この対応は思わぬところでのエラーを回避するためには有効だと思います。

しかし・・・Search Consoleでエラーが表示されて実際に確認するとエラーでない・・・そんなケースが散見され少々戸惑い気味・・。

今の懸念事項としては、過去記事のサイズの小さい画像(アイキャッチ画像)をどうするか?とGoogle Analyticsのアクセス解析がなんだか重複(偶数ではないので単純に重複ではなく、非AMPとAMP、Googleにキャッシュされたページのどれか)で別々のセッションと認識され、同じページが2つ結果に表示されること。あまり気にしてないけどうまく統合していく必要があろうかと思います。


AMP対応プラグインを使うとプラグインの不具合なのか?サイトの不具合なのか?どうすればいいのか?で悩むと思いますが、自力でやると「ああ、あそこね!」とかいろいろ分かって対応しやすいのでいいですね。

ひまあーと(管理人)
  • 記事の作者: ひまあーと(管理人)

  • ☆最後までお読みいただきありがとうございました。記事作者のひまあーとです。
    ☆Wordpressでサイトをカスタマイズしていく上で有用な情報を配信しつつ、「ココナラ」でサイトカスタマイズのお手伝い、不具合の修復、サイト引っ越し代行などをさせていただいております。
    ☆Wordpressネタが多いですが、趣味の「園芸」「卓球」などの情報や日々の出来事などもどんどん増やしていきますのでよろしくお願いいたします。


【スポンサーリンク】


記事の拡散にご協力をお願いします

閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします

関連情報