次の DEMO を見に行く
WordPress

【Google PageSpeed Insights】点数を改善する方法

zakki
この記事の信頼性


【ブログ筆者の経験値】
2006年~現在 Webマーケティング担当
(クライアントへPageSpeed Insightsを使ってのアドバイス経験多数)

サイトに情報が増えてくると、サイトの表示スピードが遅いと感じることが増えてきます。
原因を見つけて改善するには、Googleの提供している、
サイトの表示を分析する PageSpeed Insightsを使います。

サイトスピードを改善するとSEOでも有利です。
点数を改善して検索順位を上げましょう。

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9535535275872412" crossorigin="anonymous"></script> <!-- レスポンシブ --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9535535275872412" data-ad-slot="4221415101" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>

Google PageSpeed Insightsとは

Google社が無料で提供している、正規のサイト速度計測ツールです。
Googleは、日本のメイン検索エンジン(Yahoo!、Google)にて検索順位を決定しています。
検索順位を決定するのに、サイト表示速度を加味すると正式に公表しています。
よって、このツールを使ってサイト表示速度を上げていくことは、自分のサイトをよりよくするために必須です。

実際のサイトを使って数値が改善するかをチェック

私の管理しているサイトでのPageSpeed Insightsの結果です。
パソコン、スマホそれぞれの速度チェックができます。

スマホ

パソコン

googleが、パソコンの評価は検索結果に影響しないと発表しているので、パソコンは気にしなくてOKです。

モバイル ファースト インデックスを開始します

モバイルのヘッダー写真設定

まず設定したのが、モバイル専用のヘッダー写真を設定することです。
パソコン用のヘッダー写真と同じものを使っていると、スマホで読み込むときに遅くなります。

これを設定したただけで、19だったのが22に上がりました。

EWWW Image Optimizerで画像を圧縮

a3 Lazy Loadでオフスクリーン画像の遅延読み込みを改善

PageSpeed Insightsとは別に、test my site(モバイルのみ)という、こちらもGoogle提供の速度分析サービスがあり、スマホの分析が可能です。

レンダリングを妨げるJavaScriptの除外

ジャバスクリプトについては以下の別記事で詳細をまとめています。

【ワードプレス高速化】JavaScriptの除外したらサイトが軽くなった「レンダリングを妨げるJavaScriptの除外」これで2.1秒でした。 jqueryっていうのが、JavaScriptだそうです...
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9535535275872412" crossorigin="anonymous"></script> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-9535535275872412" data-ad-slot="1399963264"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
ABOUT ME
zakki
zakki
記事URLをコピーしました