ホームページの表示スピードを劇的に改善した3つの施策

更新日: 2018年06月28日

ferret編集部：2015年5月27日に公開された記事を再編集しています。

Web担当者の皆様は、日々自社ホームページの効果を上げるための施策を行っていますが、ページの表示スピードは意識していますか？

リンクをクリックしてからページが表示されるまでの時間がかかりすぎる場合、ユーザーは待たずにすぐに離脱してしまうものです。ホームページのコンテンツとは全く関係のないところでの離脱は非常にもったいないことです。ページスピード自体は簡単な作業で改善できる部分が多々あります。

今回は、弊社で運営しているモバイルサイトにおいて、表示スピードが劇的に改善できた事例をご紹介します。

課題

弊社運営の比較サイトのモバイル版において、表示スピードが遅いということが課題としてあげられました。
ある調査で、表示スピードの0.1秒の差が売上の1%に影響する、というデータが出ています。Googleからも2012年にページの表示スピードが検索順位に影響すると発表されており、大きく影響する要素ではないものの、ランキングを決める判断基準であることには変わりません。

参考

0.1秒の遅れが、1%の売上に影響する!? ページ表示速度の影響力と改善法まとめ

ページ表示速度はSEOにどの程度関係するのでしょうか？ | SEO対策Q＆A [SEO HACKS]

たったの0.1秒の差が売上に響くということであれば、出来る限り表示スピードを上げる必要があります。

仮説

今回、表示スピードの改善にGoogleが提供するPage Speed Insights（ページスピードインサイト）を利用しました。

Google- Page Speed Insights

https://developers.google.com/speed/pagespeed/insights/
Google- Page Speed Insights

ホームページの表示速度を100点満点で診断し、具体的な修正ポイントも提示されます。
今回施策対象となったモバイルサイトは改善前の点数は32点という結果が出ました。修正ポイントとして以下の項目が上げられました。

1.画像を最適化する
2.ブラウザのキャッシュを活用する
3.スクロールせずに見えるコンテンツのレンダリングをブロックしているJavaScript/CSSを削除する

今回は、こちらに記載されているポイントのみを修正し、どれだけ点数が改善されるかを検証してみました。

実際に行った施策

修正ポイントとして提示された3つの項目に対して、下記の施策実施。

1.画像を最適化する

施策内容

画像1枚1枚の容量を圧縮。（サイズ変更や画素数、容量を下げた）

2. ブラウザのキャッシュを活用する

施策内容

.htaccessを利用して記述を変更。

3.スクロールせずに見えるコンテンツのレンダリングをブロックしているJavaScript/CSSを削除する

施策内容

コンテンツのレンダリングをブロックしているJavaScript/CSSを削除。

基本的にはエンジニア寄りの作業となります。
弊社の場合、1人のエンジニアの5時間程度の作業で完了しました。

結果

上記施策を完了後、再びPage Speed Insightsで計測してみると、点数は32点→73点にアップしました。
表示スピードが改善されたことにより、コンバージョン数にどれだけの影響が出ているかは現在計測中ですが好転傾向にあります。
表示スピードのスコアは、GoogleAnalyticsの「行動」カテゴリ内の「サイトの速度」→「速度の提案」でも確認することができます。

GoogleAnalyticsを確認する際に、表示スピードも見てみるようにしましょう。