どちらかをクリックしてください

お疲れ様です!

日々、自分のサイトの高速化に奮闘してる

なまけものブロガーのっちです!

 

自分のブログのページの読み込み速度、気にしてますか?

 

2018年3月27日

モバイルファーストインデックス”の導入が発表されてはや1年が経ちますが、

検索上位のサイトなんかはほぼ、モバイルフレンドリーになってきてますよね。

 

さらに同年の7月、ページの読み込み速度が極端に遅いサイトは表示順位を下げる事を発表し、

モバイルファーストの動きは更に加速してきてます。

 

そこで今回、ページの読み込み速度を劇的に改善できるAMPについてご紹介したいと思います!

 

このページを最後まで読めば、

「画像が多くて読み込み速度クッソ遅いし。もう俺のブログ終わったわ。」

ってなってる貴方でも、サクッとマルっと解決出来ちゃいますよ!

“AMP”とは...?

AMPとは、Accelerated Mobile Pagesの略で、

GoogleとTwitterが共同で開発をしたページを高速で表示するためのプロジェクトです。

 

主にモバイル端末向けのために開発されたもので、

このことからも「モバイルファースト」の動きが活発になってきてるのが分かりますね。

 

また、検索ワードによっては1ページ目に出ている上位10サイト全てがAMP対応になってきてるなど、

対応しているページが増えてきていることも事実です。

なぜAMPで高速表示される...?

AMP対応のページは

  • AMP Cache
  • AMP JS
  • AMP HTML

の3要素から構成されてます。

 

AMPの仕様はかなり限定されていて、Javascriptを非同期のもののみ許容してたり、

とにかく読み込みに時間をかけさせないという方針で仕様が組まれています。

 

更に、インターネット上にキャッシュを生成して、

そこから表示を読み込むことによって一々ページを読み込まなくても良いようにされてます。

 

プログラマーではいし、細かいことは分からないし省きますが、

とにかく「ページを高速表示することに特化した仕様」だってことが言える訳ですね。

 

その“証拠”ってわけでは無いのですが、このページの上部にあるAMP表示でこの記事を読む

をクリックすると、最上部のアイキャッチ画像が少しぼやけるんですよね。

これもAMPの特徴の一つです。

メリットとデメリット...!

メリットはなんといっても、“本来の重たいページでも高速表示でされる”といった1点に尽きます。

 

画像を入れ込み過ぎて重くなてしまったサイトや、アート効果を多用してるLP、

リダイレクトを挟んでるページなんかはどうしても重くなりがちで、読み込み速度も遅くなってしまうんですよね。

 

AMP対応させればその心配はほぼ無くなると言えます。

 

逆に、デメリットはというと...

・AMP化前のレイアウトと変わってしまい、見づらくなる。
・導線の悪化で直帰率が上がるといった報告もある。
・Googleもまだ試用段階(ブログなどのコンテンツ重視のページのためのもので、それ以外のページのことは考慮されてません)
・アドセンス広告が表示されない。

 

などなど、問題は多くあります。

高速化のためだけに直帰率が上がってしまっては元も子もないので、AMP対応をやめた方もいるようです。

 

特に読み込み速度が物凄く遅い場合を除いて、導入は待っても良さそうですね。

実際どのくらい改善されるの...?

AMP対応させたページは実際にどのくらい早くなるのか、

googleの公式ツール「PageSpeed Insights」を使用して計測してみました。

 

上が、AMP対応させたページで、下は非対応のものになります。

...下のページなんかビックリするほど遅いですね...(笑)

お恥ずかしい限りです...


AMP対応させたページの読み込み速度スコア

 


AMP対応させてないページの読み込み速度スコア

 

AMP対応させたことによって、

対応させたページの読み込み速度が劇的に改善されてるのがお判りいただけるかと思います。

ブログのAMP対応の方法...!

大きく分けて3つあります。

  • WordPressのHTMLの中身をいじくる
  • Google推奨プラグイン『AMP』をインストールし、有効化させる
  • AMP対応したWordpressテーマを使う

 

HTMLに詳しい方なら、ブログファイルをいじくるのもありなのではないかと思うのですが

初心者や、あまりHTMLに詳しくない人は正直お勧めしません。

最悪、ブログ全体が壊れてしまい、2度と開けなくなるなんてこともありえますからね。

 

『AMP対応したWordpressテーマを使う』のが最も手っ取り早いのですが、まだ対応してないテーマが多いのも事実です。

 

プラグイン『AMP』であれば、インストールして有効化するだけで自分のブログ全体を自動的にAMP対応にしてくれるので、

どなたでも手軽に使うことが出来ますよ。

AMP対応させたほうが良い...?

冒頭で、「AMP対応がモバイルファーストの動きを加速させてる」といったことを書きましたが、プロジェクト自体は全く別物です。

現時点では“AMP対応できてなければ順位が下がる”といったことは無いのでご安心ください。

 

とはいえ、ユーザビリティが悪かったり、あまりにも読み込み速度が遅いページは順位が下がる傾向にありますので、

一概に無関係とはいえないんですよね。

 

プラグインであればそんなに手間はかからないですし、徐々に、対応していけばいいのではないかなと思います。

おすすめの記事