AMP対応すると、恐ろしくデザインが崩れる。どれだけデザインが崩れるか見てください。
どうも。「産前産後の身体パートナ」の馬場佐希子です。
今日は、WordPress(ワードプレス)のブログで、AMP(アンプ)対応したらどうなるのか、について書きます。
AMP(アンプ)については、年末から何度か試行錯誤していて、今日、改めて思うことがあったので記事にしました。
ちなみに、PC音痴の私は、技術的なことは全くダメなので、テーマ頼りでテーマに解決してもらっています。
私の使っているのはこれ、「ストーク」WordPressテーマです↓↓
cssなんか分からなくても、スマホビューで見やすいようにしてくれています。
メニュー表示や、ウィジェットもいろいろあって、使いやすく、STORK様さまです。
でも、そのSTORKさまでも、関係なく、ダッサいブログになってしまうAMPについて書きます。
今日は妊娠とか出産と全く関係ないことです。
ただ、最後に私の想いも書いてあるので、ワードプレスに関係ないあなたは、下にスクロールして、私の思いは、読んでいってください。
AMP(アンプ)って何ですか?
AMP(アンプ)?
えーっと、音が出るやつですか?
AMP(アンプ)?
何それ。
AMP(アンプ)は『AMP(Accelerated Mobile Pages)』のことです。
驚くほど速い速度で、モバイルサイトが表示されるというGoogleの取り組みです。
Accelerated Mobile Pages は、読み込みを高速化しさらに快適なユーザー 体験を追求するため、さまざまな技術的手法を活用してコンテンツをほぼ瞬時に読み込めるようにした HTML ページです。
AMPにすると、どれくらい速いのか?
AMP(アンプ)対応にすると、めっちゃ速いです。
どれくらい速いかっていうと、AMP(アンプ)対応ページは、タップしたら、
ぱっ!
って開きます。
AMP(アンプ)対応してないページは、
ふ〜〜〜〜ん。
くらいです。
全然イメージわかないですか?
そんな人は、このページが参考になります!
BMS(ブログマーケティングスクール)でお世話になっている松原潤一さんのページです。
ブログのAMP対策の為に最低押さえておきたい4つのポイント!アクセスアップチャンスを逃すなっ!
体感的に、めっちゃ速いです。
ただ、代わりに犠牲にしてるものがあります。
AMP対応にするデメリット
1.デザインが崩れる
誰だぁ、こんなことをしたやつは!
見にくいやんけー!
ダサいなって思ったあなた。
こんなサイト見たくないなって思ったあなた。
ち、ち、違うんです。
本当は、こうなんですよ。
AMP表示で、変化している点は下記のようなことです。
- SNSシェアボタンが消えた
- メニュー表示が消えた
- 色まで変わっちゃった
- フォントも変わった
- 画像が元のサイズになっている?!
- 吹き出しがなくなった
- 見出しもないよね?
- デザインが変わりすぎて、リンクボタンがなくなってしまった!
2.表示されなくなるコンテンツがある
この他にも、
- お問い合わせフォームが表示されない
- ウィジェットで追加したコンテンツが表示されない
- 広告などが表示されない
といったことがあるようです。
3.グーグルアナリティクスの解析が除外されている
グーグルアナリティクスを解析できるよう設定すれば良いのですが、私はうまくできませんでした。
助けを求めたら、「いつも心に石上さん」でお馴染みの、石上貴哉さんが下記の記事で優しく教えてくれました。
AMPのプラグインを拡張して、下がったPVとSNSボタンを取り戻せ!
BMS(ブログマーケティングスクール)の松原潤一さんも助けてくれました。
私のようなPC音痴でもできるはずの、たったこれだけのことなのに、なぜかうまく設定できませんでした。
詳しい設定の仕方は、記事に書いてあります↓↓
AMP導入でPVが下がった!?そんな事ないGoogleアナリティクスにカウントされてないだけ!
AMPを導入するメリット
1.モバイルサイトの表示速度が上がるので、ストレスなく見ることができる
表示速度が速いと、離脱が防げますよね。
結果的に、読まれるページになりますね。
読み込みに3秒以上かかると40%の人がサイトの閲覧を諦める、という調査結果も決して大げさな話ではありません。
2.Googleがモバイルファーストを重要視しているーSEOの評価になる?
Googleは下記のように述べています。
そこでユーザーにとってさらに価値ある検索結果を提供するために、Google ではモバイル ファーストのインデックス登録に向けた実験を開始しています。Google 検索のインデックスは、サイトやアプリについての単一のインデックスとして存続しますが、将来的に Google のアルゴリズムはモバイル版のコンテンツを主に使用するようになります。つまり、ページのランキングを決定したり、構造化データを理解したり、検索結果にスニペットを表示する際も、モバイル版のコンテンツが使用されるようになります。
ウェブマスター向け公式ブログ
モバイルファーストインデックスに向けてより
このような発表のため、将来的にAMP対応のページが検索上位に来る可能性があるのではないでしょうか。
3.カルーセル表示される可能性がある
カルーセル表示は、横並びでズラ〜っと出てくるこういうやつです。
ここに、AMP対応って書かれた記事が上がっていますね。
カルーセル表示に上がってくると、読まれやすくなりますよね。
ですが、すべてのAMP対応のものが、カルーセル表示で検索1ページめに来るわけではありません。
私自身の検索上位記事を、スマホで確認してみました。
こんな形で、カルーセル表示にはなっていません。
AMP対応にした理由
私が、AMPを導入しようと思ったのは、検索上位に来て、たくさんの人に見られるブログになったらいいな、と思ったからです。
ブログで発信しているのには、こんな理由があります。
現場で、ネットで迷子になったり、ネットの情報に振り回されたりして、どうしていいか分からなくなっている妊婦さんや子育て中のママに出会うからです。
今の時代は、情報が本当に多くて、何を選択して良いのかわからなくなっていますよね。
特に、妊娠・出産・子育てに、自信がなくて、真剣に悩んでいる方に出会います。
だけど、子育てに正解なんかないと思いませんか?
隣のあの子に当てはまることが、あなたのお子さんに当てはまるとは限りませんよね。
だから、自分の責任で、やってみて、その子に合うかどうか判断したらいいと思うんです。
でも、自信を持って判断することができないから、悩むんですよね。
そこに、自信を持って判断できるように、背中をそっと押してもらっているようなサイトがあったらいいなと思うんです。
「私の子育て、これでいいんだ」って自信が持てたらいいなって。
きっかけや気付きを得られて行動につながるような、そんなサイトでありたいなと思っています。
だから、情報で混乱させるんじゃなくて、検索上位にきて、たくさんの悩める人が、自分で自信を持って判断できるような記事を書きたいなと思っています。
さらに言えば、ネットより、断然リアルがいいです!
実際に会って話して、その場の空気感とか、温度とか、ネットでは伝わらないことが、リアルにはたくさんあります。
何でも効率化とか、速さが求められている昨今ですが、子育てなんて、すぐには結果が出ないことの典型ですよね。
だからこそ、迷ったり、悩んだりすることがたくさんあるんですよね。
私は、ネットをひとつの契機にして、リアルでもどんどん繋がっていきたいと思っています。
妊娠、出産、育児といった命に関することは、断然リアルがいいです!
AMP対応は見送ったほうがいいのかも
上のような理由から、AMP対応にしました。
しかし、デザインが崩れている点や、解析がうまく行えないことで、しばらくAMPの導入は見送ったほうがいいのかも、と迷っています。
下記引用のように、初心者が手を出すものではないかもしれません。
グーグルアナリティクスの解析の対応さえも中途半端なまま、新たにプラグインを入れることにも抵抗があります。
新たな不具合が出た時に、時間をものすごく浪費しそうな気がします。
AMPを導入するには犠牲にするものが多すぎるため、もっと情報が出揃うまでは手を出すべきではないと思います。
*https://www.gamitaka.com/amp-expansion-plugin.html,AMPのプラグインを拡張して、下がったPVとSNSボタンを取り戻せ!より
妊婦さんや子育て中のママの役に立てばいいなという思いで、必死に書いていても、デザインが崩れて、
「なんじゃこりゃ〜」
っていうサイトだと、途中でページを閉じて読んでもらえないこともありますよね。
そして、「なんじゃこりゃ」のサイトでは、私のことを信用してもらえませんよね。
AMPだと、「いい加減にサイト作ったの?」って思われるくらいデザインが崩れちゃってます。
AMPにするとデザインが崩れるのは、
ページの高速化を優先し、JavaScript(ジャバスクリプト)を読み込まないため
*https://www.gamitaka.com/amp-expansion-plugin.html,AMPのプラグインを拡張して、下がったPVとSNSボタンを取り戻せ!より
だそうですが、これじゃダメですよね。
全く別物になっちゃってます。
速く読み込まれた方が、モバイルフレンドリーで、読者さんのために良いのでは、とAMP対応にしましたが、今後の対応を再考します。
おしまい