【後編】売上に大きく影響_ページ表示速度の改善方法5選

EC・Webサイトの改善

【後編】売上を左右する「ページ表示速度」の改善方法5選

SEO対策だけではなく、サイトのCVRを改善するためには、「Webページ表示速度・読み込み速度」の存在を無視できません。前回コラム(計測方法)に続きまして、本コラムではWebページ表示速度・読み込み速度の改善方法について解説します。

【目次】
1.今すぐ実践できる改善方法5選
2.まとめ(前編・後編の総括)

1.今すぐ実践できる改善方法5選

今すぐ実践できる改善方法5選

 

ここでは、前編で紹介した「Google PageSpeed Insights」をベースに解説します。
※コラム:【前編】売上を左右する「ページ表示速度」の計測方法3選 第3章

同ツール内の「改善できる項目」を確認のうえ、参考にしてください。(※下図参照)

「改善できる項目」を確認

Webページの読み込み速度・表示速度を改善する方法として、以下5パターンを紹介します。

1) コンテンツのサイズを縮小化(圧縮)
2) ブラウザ上の描画プロセス(レンダリング)の最適化
3) 使用していないJavaScriptの削減
4) テキスト圧縮の有効化
5) その他の改善方法

1つ1つ確認していきましょう。

 

【改善方法➀:コンテンツのサイズを縮小化(圧縮)】
サイト訪問者の回線および帯域は必ずしも十分ではないケースがあります。
そこで、読み込みサイズを縮小化(圧縮)することで読み込み速度を改善できます。

コンテンツのサイズを縮小化(圧縮)

※補足)
メジャーな「Adobe PhotoShop」以外にも、画像圧縮に役立つ無料ツールがいくつか提供されています。
ex.Optimizilla

 

【改善方法②:ブラウザ上の描画プロセス(レンダリング)の最適化】
HTMLの記述によりブラウザの処理に遅延が生じてしまうケースがあります。

原因の1つとして、CSSファイル、JavaScriptファイルの読み込みなどのレンダリングブロックによる表示の遅延があります。

「Google PageSpeed Insights」の「改善できる項目」より、「レンダリングを妨げるリソースの除外」を押下することで、改善対象として優先度の高い画像を一覧で確認できます。

ブラウザ上の描画プロセス(レンダリング)の最適化

レンダリングのブロックを発生させているファイルの読み込みを最適化させ、ブロックしているファイルを非同期で読み込ませる方法で解決するのが一般的です。

 

【改善方法③:使用していないJavaScriptの削減】
表示対象のWebページに使用していないJavaScriptがHTMLに残っているケースがあります。
表示に不要なJavaScriptを読み込んでいることで、無駄なレンダリング時間が発生してしまいます。

不要なファイルの記述は省くなどの改善が適切です。

「Google PageSpeed Insights」の「改善できる項目」より、「使用していないJavaScriptの削減」を押下することで改善対象の候補となるJavaScriptを確認できます。

使用していないJavaScriptの削減

なお、Wordpressを利用しているサイトではプラグイン「Flying Scripts」を利用することで任意のJavaScriptの読み込みをスキップできます。

また、上記対策後はページの表示に異常がないことを目視確認するようにしましょう。

 

【改善方法④:テキスト圧縮の有効化】
テキストベースのリソースを圧縮することで、通信量を削減できます。

「Google PageSpeed Insights」の「改善できる項目」より、「テキスト圧縮の有効化」を押下することで改善対象の候補となるテキストファイルを確認できます。

テキスト圧縮の有効化

 

【改善方法⑤:その他の改善方法】
その他、細かい改善方法は色々ありますが、技術的な解決方法をもう少しご紹介します。

● ブラウザキャッシュの活用
 ・表示頻度の高いページ、共通で読み込まれることが多いエリア(ヘッダーなど)の一部コンテンツ(画像、CSS、JSなど)をキャッシュするように設定します。

 ・一般的なサーバー環境、ユーザー環境ではキャッシュが有効活用されているのですが、意図的にキャッシュが有効化されていない、もしくはキャッシュ保持期間を短く設定しているケースがあります。

 ・そこで、Webサーバー側で.htaccessが設定可能な場合、ExpiresヘッダーやCache-Control ヘッダーを使って、キャッシュの有効期限を設定するのが望ましいです。

 ・Expiresヘッダーでは有効期限を年月日時で指定します。一方Cache-Controlヘッダーの場合は、日時指定ではなく、サーバーがレスポンスを受け取ってからキャッシュを削除するまでの期間を秒数で指定します。

 ・また、「.htaccess」ファイルで設定せずとも、HTMLソースのhead内にmetaタグとしてcache-controlやexpireを設定することで、有効期限を設定することもできます。

● サーバー・ネットワークの遅延
 ・上記で紹介した問題以外に、インフラがボトルネックになっている場合があります。Webサーバー、ネットワーク回線、アプリケーションなど、ボトルネックの場所は様々です。この問題をきちんと調査し、解決するのはかなり大変です。

 ・社内の担当技術者か専門の対策会社に相談することをおススメします。

 ※なお、共用レンタルサーバーを格安で利用している場合、アクセス数が多い時間帯に同居している他社の影響でトラフィック制限(帯域制限)がかかることがあります。

2.まとめ(前編・後編の総括)

まとめ(前編・後編の総括)

 

いかがでしたか?最後に、ポイントを整理します。

  • 売上に影響するWebページの『読み込み速度』、『表示速度』は改善する。
  • Google提供の「PageSpeed Insights」を利用すれば、パフォーマンス分析と同時に改善のアドバイスがもらえる。
  • アドバイス通りにサイズ圧縮、レンダリングの改善、不要情報の削除を行う。
  • 上記で改善できない場合はインフラの問題を疑う必要があります。専門のエンジニアに相談してみてください。

以上となります。

【毎月5社限定】無料相談 受付中

 

コラムをお読み下さりありがとうございます!

弊社はEC・デジタルマーケティングの支援会社です。
ZOZO様、ドクターシーラボ様、他グローバル企業など、
各業界を牽引する企業を400社以上支援して参りました。

現在、「無料相談」を受付中です。

「売上を拡大させたい」
「Web集客を増やしたい」
「広告運用を見直したい」
「LTV・継続率を向上したい」
「サイトのUI/UXを改善したい」など

EC・Webサイトやデジタルマーケティングに関して
お困りごとがございましたら、お気軽にご相談下さい。

【前編】売上に大きく影響_ページ表示速度の計測方法3選【前編】売上を左右する「ページ表示速度」の計測方法3選前のページ

【無料ツール】GoogleオプティマイズでABテストをする方法次のページGoogleオプティマイズ_無料でABテストをする方法

売上を最大化する広告効果改善サービス『DATAD(データード)』

関連記事

  1. ABテストの事例公開_LPのCVRが2倍_CTAの色のテスト

    EC・Webサイトの改善

    【事例公開】50日間でCVRを2倍に改善したABテスト

    今回紹介する検証テーマは、LPで使用する「CTA(申込・購入ボタン)…

  2. 売れるLPを作る!_ABテストのやり方_LP編

    EC・Webサイトの改善

    【売れるLPをつくる!】ABテストのやり方~LP(ランディングページ)編~

    「誰に」「何を」「どうやって」自社商品・サービスの魅力を伝えるか『訴…

  3. Googleオプティマイズ終了_影響と対策_代替ツール15選
  4. ABテストの事例公開_LPのCVR2.19%up_FVの訴求テスト

    EC・Webサイトの改善

    【成功事例】LPのCVRを「2.19%改善」したABテストの舞台裏

    今回紹介する検証テーマは、LPの「ファーストビュー直下」で使用するパ…

  5. Googleオプティマイズ_無料でABテストをする方法

    EC・Webサイトの改善

    【無料ツール】GoogleオプティマイズでABテストをする方法

    今回ご紹介するABテストツールは『Googleオプティマイズ』です。…

  6. ABテストとは?_今さら聞けない基本のキ

    EC・Webサイトの改善

    ABテストとは?今さら聞けない基本の「キ」

    ネット事業を活用する企業にとって「サイト改善」は永遠のテーマ。中でも…

注目のコラム

  1. 【本数は?投入頻度は?】Meta広告「Advantage+ …
  2. 【なぜ重要?広告疲れとは?】Meta広告「Advantage…
  3. 【非物販サイトにも有効】Meta広告の「Advantage+…
  4. 【Meta広告】コンバージョンAPI(CAPI)とは?「メリ…
  5. EC・広告担当者必見!ステマ規制完全ガイド:要点+具体例+違…

【無料DL】100億円企業のデジマの定石

【無料DL】事業成長に直結する広告投資

【無料DL】LP・CVRを大幅改善する方法

【無料購読】マーケィング情報誌

デジタル人材を育成できる「広告効果改善サービス」

ECサイト総合支援『ECフルサポート』

ECフルサポートの横長バナー

書籍のご案内

書籍のご案内
PAGE TOP