アダムテクノロジーズ運営チーム

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

高速化

サイトの読み込みが遅くなる要因とは?改善方法についてご紹介!のサムネイル

webサイトを閲覧する時に、「時間がかかる」「重い」と感じたことはないでしょうか?

個人によって体感は様々ですが、webサイトの読み込みが遅いと利用者にストレスを与えてしまい、サイト運営者としても良い状態とは言えません。

本記事では、サイトの読み込みが遅いことによるデメリットやその原因、改善方法を紹介します。

目次 プラスマーク 表示 プラスマーク 閉じる

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サイト表示診断サービス」をご用意しています。まずは、下記のページから無料で資料をダウンロードしてみてはいかがでしょうか。

この記事の執筆者

田中雄太

twitterアイコン Facebookアイコン

アダムテクノロジーズ執行役員 SEOコンサルタント

株式会社アダムテクノロジーズ 執行役員。
ユーザーニーズと最も近いSEO対策で、あらゆるビジネスを加速させ、より良い社会の実現を目指す。
入社から5年間で100社以上のSEO対策に従事し、様々なジャンル・キーワードでの上位表示を実現。顧客目線での目標達成にコミットしたSEOコンサルティングが強み。

DOWNLOAD

資料ダウンロード

資料のイメージ画像

当社でご提供しているサービスの資料ダウンロードはこちらから。
SEOに課題を感じている方は、ぜひご覧になってください。

SEO診断の資料はこちら WEBサイト高速化の資料はこちら

CONTACT

お問い合わせ

大規模サイトにおけるSEO対策上の問題点を解消し、
集客の最大化を実現する相談役として
ぜひお気軽にご連絡ください。
経験豊富な技術者がSEO診断を行います。