Webサイトの表示速度を改善する方法|SEOへの影響度合いも解説

普段、検索をして見つけたサイトを閲覧しようとした際、ページ内容がなかなか表示されないことが時々ありませんか?

 

体感にしてわずか数秒かと思いますが、すぐに表示されないページから離脱した経験はみなさんにもあるのではないでしょうか?

 

大量にある情報の海の中から、ユーザーは簡潔な答えを探す行動傾向が強まっています。そのため、表示から時間がかかるようなサイトは見てもらえません。

 

今回は、Webサイトの運営者が行うべき表示速度の改善方法について説明します。

Webサイトの表示速度はSEOにおいて重要

「表示速度はSEOに影響があるの?」と聞かれることがありますが、
結論から言えば、Webサイトの表示速度はSEOにおいてとても重要です。

 

SEOへの影響度合いは明確にされていませんが、コンテンツやリンクについで大切な「サイト構造」の一部であることを考えれば重要であることに間違いありません。

 

表示速度がSEOに影響を及ぼす理由の一つに、当然ながら検索エンジンのそもそもの目的が大きく関わっています。

 

具体的な表示速度の改善方法を紹介する前に、簡単に検索エンジンの目的について説明します。

 

検索エンジンはユーザーの検索課題を“スピーディー ” に解決したい

検索エンジンは、ユーザーの検索課題を解決するための“アンサーエンジン”です。

 

検索を行うユーザーは、必ず「果たしたい検索を目的(課題)」を持っています。

 

もちろん検索エンジンはそのための情報提供をサイトを通じて行っていますが、ただユーザーに目的を果たしてもらうだけではなく、どれだけ早く課題を解決してあげられるかが大切なのです。

 

検索ユーザーは読み込み時間が5秒以上になると90%離脱するという統計が出ており、Googleによると全世界における検索の割合はモバイルが過半数を占めているとしています。

 

スマートフォンの普及によってスピード感を求められるようになった現代では、サイトの表示がより大切になっているのです。 

Webサイトの表示速度はSEOにおいて重要

「表示速度はSEOに影響があるの?」と聞かれることがありますが、
結論から言えば、Webサイトの表示速度はSEOにおいてとても重要です。

 

SEOへの影響度合いは明確にされていませんが、コンテンツやリンクについで大切な「サイト構造」の一部であることを考えれば重要であることに間違いありません。

 

表示速度がSEOに影響を及ぼす理由の一つに、当然ながら検索エンジンのそもそもの目的が大きく関わっています。

 

具体的な表示速度の改善方法を紹介する前に、簡単に検索エンジンの目的について説明します。

 

検索エンジンはユーザーの検索課題を“スピーディー ” に解決したい

検索エンジンは、ユーザーの検索課題を解決するための“アンサーエンジン”です。

 

検索を行うユーザーは、必ず「果たしたい検索を目的(課題)」を持っています。

 

もちろん検索エンジンはそのための情報提供をサイトを通じて行っていますが、ただユーザーに目的を果たしてもらうだけではなく、どれだけ早く課題を解決してあげられるかが大切なのです。

 

検索ユーザーは読み込み時間が5秒以上になると90%離脱するという統計が出ており、Googleによると全世界における検索の割合はモバイルが過半数を占めているとしています。

 

スマートフォンの普及によってスピード感を求められるようになった現代では、サイトの表示がより大切になっているのです。 

表示速度の改善が必要かどうかの基準

改善が必要かどうかは、現在の表示速度がどの程度かによって決まります。

みなさまのWebサイトの表示が早いか遅いかは、以下の計測ツールを使用す
ることでわかります。

■PageSpeed Insights

https://developers.google.com/speed/pagespeed/insights/?hl=ja

こちらはGoogleが提供している表示速度チェックツールです。

調べたいページのURLを入れると、数分ほどで分析結果が表示されます。

点数に対する評価は以下のようになっています。 

・90～100:速い
・50～89:平均
・0～49:遅い
「遅い」に該当するスコア49以下の場合は、改善が必要になります。

特にスコア30点以下は改善を急いだ方がよいでしょう。

 

Webサイトの表示速度を改善する方法を紹介

表示速度がなぜSEOに影響を及ぼすのか、前提をお話したところで、具体的な表示速度の改善方法の紹介に移ります。

基本的には、以下の4つの方法があります。

<表示速度を改善する主な方法>

画像ファイルを軽量化する
外部ファイルを軽量化する
レンダリングを妨げる原因を排除する
CDN(コンテンツデリバリーネットワーク)を実装する
それぞれ詳しく説明していきます。

 

画像ファイルを軽量化する
Webの表示が遅くなる主な原因は、使用されているファイル容量が重い読み込みに時間がかかることです。

特に容量を重くしやすいのが画像ファイルです。目安として、1ファイルあたり1MB近くなると読み込み時間にかなり影響を与えます。

画像は基本的に圧縮してからアップロードするようにしましょう。

画像の保存形式は、写真系はJPEG、ロゴやイラスト系はPNGなどがファイルのサイズが最適になる傾向があります。

画像の圧縮におすすめのツールはこちらです。

■Tiny PNG

https://tinypng.com/

ドラッグアンドドロップで圧縮したい画像を投げ込むだけで、画像の容量を軽くしてくれるツールです。

事前にTiny PNGで画像を圧縮してから、Webサイトにアップロードしてください。

外部ファイルを軽量化する

外部ファイルとは主に以下の2つを指します。

CSS
Javascript
Webサイトのデザインや動的なコンテンツを作っているファイルになりますが、記述を最適化することでこちらも容量を軽くすることができます。

以下のツールでは、記述をそのままコピペして実行するだけで最適化されたコードが排出されます。

■Syncer(CSS)
https://syncer.jp/css-minifier

■Syncer(Javascript)
https://syncer.jp/js-minifier

WordPressでWebサイトを構築している場合は、以下のプラグインをインストールするだけで簡単に外部ファイルを軽量化することが可能です。

■Autoptimize
https://ja.wordpress.org/plugins/autoptimize/

 

レンダリングを妨げる原因を排除する
レンダリングとは、簡単にまとめるとサイトを構築しているファイルを読み込み、ブラウザに視覚的にコンテンツを表示するためのクローリングのことです。

レンダリングが遅延する原因としては、クローリングを制限するファイルが設置されていたり、外部のJavascriptが妨げているパターンが多いです。

レンダリングの読み込みが妨げられているときの対象法は、Javascriptの読み込みを遅らせるなどです。

CDN(コンテンツデリバリーネットワーク)を実装する

CDN(コンテンツデリバリーネットワーク)とは、Webコンテンツの配信を最適化した配信ネットワークのことです。

簡単に言うと、世界各地に拠点を置き、どの地域でWebサイトが閲覧されても一番近い拠点からコンテンツを配信できる仕組みです。

そうすることによって、コンテンツ配信までの時間を短縮することが可能になります。

例えばあるアパレルメーカーが東京にしか発送拠点を持たないとした場合、北海道や沖縄からの注文に対しても東京から発送しなければならないため時間がかかってしまいます。

対して、全国各地に発送拠点を持っていれば注文があった地域から一番近い拠点で発送することでかかる時間を短縮できるといった具合になります。

CDN(コンテンツデリバリーネットワーク)の具体的な実装方法ですが、クラウドフレアという海外のCDNサービスに登録するのがおススメです。

ここでは登録手順の説明を割愛しますが、そこまで複雑なものではないので利用者も多いサービスとなっています。

ただ注意点があり、経由するサーバーが国内だけではなく海外になるためアクセル解析に影響がある可能性があります。

表示速度の改善が優先ではありますが、ケースバイケースですのでよく検討した上で導入するようにしましょう。

 

まとめ

スピードテストのスコアが悪い場合の多くの原因は、画像提供サイトからダウンロードしたファイルをそのままサイトにアップロードしてしまっているパターンです。

多くの場合、提供サイトからダウンロードした画像はかなり大きなサイズになっています。

画面に表示しきれない大きさの分が無駄に大きな容量となっています。

画像圧縮のおすすめツールを紹介するので、画像ファイルが数十MB以上ある場合は圧縮してからアップロードする癖をつけましょう。