サイトの読み込みが遅くなる要因とは？改善方法についてご紹介！

webサイトの読み込みが遅いデメリット

webサイトの読み込みが遅いことにより出る影響は様々な企業から報告がされています。

・サイト表示が0.1秒遅くなると、売り上げが1%減少し、1秒高速化すると10%の売上が向上する。（Amazon）

・表示速度が1秒から3秒に落ちると、直帰率は32%上昇する。 表示速度が1秒から5秒に落ちると、直帰率は90%上昇する。

表示速度が1秒から6秒に落ちると、直帰率は106%上昇する。 表示速度が1秒から10秒に落ちると、直帰率は123%上昇する。（Google）

・操作開始時間が1秒のサイトと3秒のサイトを比較しても、3秒のサイトは1秒のサイトに比べ、ページビューが22％低下、コンバージョン率は38％低下、直帰率は50％上昇。（ Web担当者Forum）

・1秒高速化するごとに、コンバージョンが最大2%増加した。（ウォルマート）

また、サイトの表示速度はSEO順位と密接に関係しており、2021年6⽉に「ページエクスペリエンスアップデート」が実装され、正式にUI/UXがGoogleのランキング指標に組み込まれるようになりました。

Googleが設定している基準値に満たない場合、突然SEO順位が下がる可能性があります。

サイト高速化サービスの資料はコチラ

読み込み速度の確認方法

Googleはwebサイトの表示スピードを確認するツールをいくつかリリースしています。

詳しく見ていきましょう。

PageSpeed Insights

モバイル表示、PC表示とそれぞれの表示スピードを計測することができます。

計測方法は非常に簡単で、PageSpeed Insightsにアクセスし、調査したいホームページのURLを入力して分析をクリックします。

表示された数値結果から判定が可能です。

PageSpeed Insightsは結果だけでなく、原因とそれに対する解消方法が専門的ではあるものの記載されているのも特徴です。

しかし、テスト環境におけるシュミレーションの結果を表示するデータであるため、本来のユーザーが取得したデータの結果と異なる数字が表示される可能性があるので注意が必要です。

Light House

Light houseはGoogle Chromeの拡張機能で、インストールすることで使用が可能です。Google Chromeを起動して、こちらのURLからLight houseを拡張機能として追加できます。

測定したいページを開き、Generate reportと書かれている箇所をクリックすると、主にサイト内のスピードに関する評価が表示されるParfomaceが表示されます。

Test My Site

Test My Siteは、Googleが提供するモバイルサイトの速度を簡単にチェックできるテストツールです。

こちらのURLにアクセスし、測定したいページのURLを入力後にEnterキーを押すとページが表示されるまでの秒数を測定することができます。

また、メールアドレスを入力することで簡易的なレポートも貰うことができます。

サイト高速化サービスの資料はコチラ

読み込み速度が遅い原因

webサイトの読み込み速度が遅くなる原因には様々な要素があります。

ここでは、代表的な要素をいくつか紹介します。

画像

webサイトの読み込み遅くなる原因の要素として、最も多いのが画像です。

次世代フォーマットに対応していない、サイズの容量が多すぎる、widthとhegihtが指定されてない、遅延読み込みが設定されていないといった様々な原因があります。

HTML/CSS/JavaScript

webサイトの読み込みが遅くなる原因の要素として、画像に次いで多いのがHTMLやCSS、JavaScriptです。

HTMLやCSS、JavaScriptが最小化されていない、不要なJSを読み込んでいる、メインスレッド処理に時間がかかっているなど、こちらも様々な原因があります。

フォント

webサイトの読み込みが遅くなる原因の要素として、見落とされがちな要素がフォントです。

webフォントが使用されていないなどの原因があります。

その他

これまであげた要素の他にも、webサイトの読み込みが遅い原因の要素は沢山あります。

埋め込まれている動画のサイズが大きい、サーバーの応答時間が長い、キャッシュの設定が適切でないなど、様々な原因があるので、PageSpeed Insightsなどのツールを解消して原因を可能な限り解消しましょう。

サイト高速化サービスの資料はコチラ

読み込み速度の改善方法

webサイトの読み込み速度が遅くなる原因には様々な要素があることを紹介しました。

では、それぞれの要素にはどのような解決方法があるのでしょうか。

代表的な原因に対しての改善方法を、いくつか紹介していきます。

画像の改善方法

画像が原因に要素の場合、CMSがWordPressである場合は、「EWWW」をインストールすることにより何点か解消されます。

「EWWW」は次世代フォーマットへの対応、サイズの最適化といった項目を解消することができます。

「EWWW」の導入、設定方法は下記の通りです。

1. WordPress管理画面のプラグイン【新規追加】で「EWWW Image Optimizer」をインストール
2. プラグイン「EWWW Image Optimizer」を有効化
3. 設定で「サイトの高速化」と「無料モードを続ける」を選択
4. 次に「メタデータを削除」「遅延読み込み」「Webp変換」を選択し保存
5. WordPress管理画面のメディアにて【一括最適化】を実行
6. 実行したのち、.htaccessファイルにWebpコードを記載

HTML/CSS/JavaScriptの改善方法

こちらもCMSがWordPressである場合、HTMLやCSS、JavaScriptの最小化はプラグインである「Autoptimize」で解消することができます。

「Autoptimize」の導入、設定方法は下記の通りです。

1. WordPress管理画面のプラグイン【新規追加】で「Autoptimize」をインストール
2. プラグイン「Autoptimize」を有効化
3. HTMLオプションの「HTMLコードを最適化」にチェック
4. CSSオプションの「CSSコードを最適化」にチェック
5. CSSオプションの「CSSファイルを連結する」のチェックを外す
6. JavaScriptオプションの「JavaScriptコードの最適化」
7. JavaScriptオプションの「JavaScriptファイルを連結する」のチェックを外す
8. JavaScriptオプションの「連結しないで遅延」にチェック

フォント

フォントが原因の場合、WEBフォントを使用することで解消されます。

Webフォントとは、あらかじめWebサーバー上に置かれているフォントデータです。インターネット上で配布されているフォントデータ自体を読み込んで利用します。

ユーザー側の閲覧環境に影響されず、サイトの製作者が意図したとおりのデザインで閲覧してもらえるというメリットがあります。

サイト高速化サービスの資料はコチラ

まとめ

今回は、サイトの読み込みが遅いことによるデメリットやその原因、改善方法ついて解説してきました。

遅くなった原因を一つ一つ改善することで、ユーザーにとってさらに使いやすいWebサイトとなり、結果検索順位が上昇することにも期待ができます。

また、うまくページ速度が遅くなっている原因を分析し、改善を加えるのが難しいと考えるご担当者様もいらっしゃるかと思います。

弊社では、Webサイトの表示スピードを改善する「WEBサイト表示スピード高速化サービス」をご用意しています。まずは、下記のページから無料で資料をダウンロードしてみてはいかがでしょうか。

WordPressのサイト表示スピード改善をするなら「HP爆速くん for WP」

WordPressは世界で40%以上のWEBサイトで導⼊されている無料CMSで、エンジニアでなくても簡単にWEBサイトの構築が可能です。

しかし、⾼度なカスタマイズや表⽰スピードの⾼速化においては、WEBだけでなくWordPressに関する専⾨的な知識が必要で、⼀般的なWEB制作会社やSEO対策会社では対応できない可能性もあります。

WordPressサイトの表⽰スピードに悩む企業の課題を解決するため、SEO技術者集団の「ADAMTECHNOLOGIES 」と、WordPress専⾨家チーム「株式会社e2e」と技術共同開発し、WordPressサイトに特化した表⽰スピード⾼速化サービス『HP爆速くん for WP』をご提供しています。

「HP爆速くん for WP」は、Page Speed Insightsのスコアが上がらなければ一切料金をいただかない、完全成果報酬型のWordPressサイトの表示スピードの高速化サービスです。

「HP爆速くん for WP」の詳細が知りたい方は、下記リンクからご確認ください。