PageSpeed Insightsで高得点を獲得してWEBサイトを改善する

PageSpeed Insightsとは

Googleが提供する計測ツールです。モバイルやPCページの実際のパフォーマンスを測定して改善方法を確認できます。特に名前の通り、WEBページ読み込み速度が得点方式で確認できます。

PageSpeed Insightsとは

PageSpeed Insights測定ツール

まずクリアしなければならないのは画像の圧縮です。当然ですが、ホームページには可能な限りきれいな画像をアップすします。ファインモード(圧縮率が低いため画質を優先するモードです。)で写真を撮り、ブログやコンテンツでそのまま使用するとページの開きは遅くなります。

次世代フォーマットWebP画像フォーマットに画像を返還する

WebP画像フォーマットはGoogleが提案する画像圧縮フォーマットで画像の視覚的質を落とさずにサイトへのアクセス負荷を軽減できます。問題は、jpegやpng画像をどうやってWebPフォーマットに変換するかです。ソフトを使って一つ一つ画像を変換してからWEBサイトにアップするのはかなり面倒です。

ニアメディアではプラグインImagifyを使用してすべて自動で行っています。下記は画像アップr-度フォルダー内です。アップしたjpegやpng画像に対応するWebPフォーマット画像が作成されているのがわかります。

webp3

Imagifyの設定

Optimization WEBP Format (WebPフォーマットの最適化)欄でチェックを入れます。これだけです。

imaagify

 

また、一括圧縮で画像自体をすべて圧縮します。これでGoogle Pagespeed Insightsの画像フォーマットはほぼクリアできます。

imaagify2

WP-ROCKETプラグインを導入する

子のプラグインは有料ですが、ニアメディでは2018年より導入して検証してきました。初期の段階ではいろいろ問題がありましたが、バージョンアップで改善され、安定した結果を得られるようになりまいた。Flatsomeテーマとの互換性もよく、Flatsome自体このプラグインは推奨しています。

ImagifiとWP=ROCKET、それにFlatsomeテーマの導入で、ニアメディアサイトの検証結果は下記の通り高得点を得ています。

PageSpeed Insghtsのモバイル検証結果

smart

 

PageSpeed InsghtsのPC検証結果

pc

関連投稿

当サイトではCookieを使用します。Cookieの使用に関する詳細は プライバシーポリシーをご覧ください。