092-791-2108
インターネット上で何かを調べようとした時、たまに表示に時間がかかることはありませんか?
ほんの0.1秒あるかないかの違いなのに、その差をユーザーは「表示速度が遅い」と思い離れてしまいます。
その結果、SEO的にも評価が下がってしまいます。
ユーザーが離れていってしまうということは、それだけ価値のないサイトだと思われていることを示していることになるでしょう。できるだけホームページの表示速度を高速化することが必要なことだと思います。
この記事では、ホームページ表示速度の高速化をするにはどうしたらいいのか、その理由から具体的な改善点までまとめてみましたので、参考になれば幸いです。
ホームページ表示速度が速い方が良い理由
次の5つの要素を考えたときにホームページの表示速度を早くする必要性がわかります。
- サイトの離脱率への影響
- SEO評価への影響
- PV・CVRの向上
- サーバーの費用削減
- 品質スコアを上げることができる
では、一つずつ紹介していきます。
サイトの離脱率に影響
インターネットで検索をしてみると想像してみて下さい。その瞬間、ユーザーにとって想定していたサイト、満足するサイトが表示されました。
そのサイトが、ユーザーが満足するとGoogleクローラーがいいサイトだと認識し、サイトを回っていきインデックスをします。結果、サイトを上位に上げていくのです。
では、逆に時間がかかる場合はどうでしょうか。
ほんの0.1秒の差を人は見わけ、時間がかかった時には検索をした次のサイトにいってしまうのではないでしょうか。
このようにサイトの離脱率は、サイトの表示に時間がかかればかかるほど高くなります。すなわち、ユーザーが離れていきGoogleクローラーが回ってきてもインデックスされないことが多いのです。
よってまずは表示速度を高める必要があります。
SEO評価に影響
では、SEO評価にはどのように影響を与えるのでしょうか。
以前はSEO対策がはっきりしていて、文章量をできるだけ多く書く事が良いと言われていました。またタイトルにキーワードを入れるなど、他にも対策項目がありましたが、今はその考えもあるもののユーザーファーストな記事が求められます。
「どれほどユーザーに良い情報を与えているのか」がSEO対策なのではないかと変わってきているようです。
良い記事を書けばユーザーはそのサイトに留まります。そのサイトに留まった時間が、SEO評価に関わってくるのです。
しかし実際にそう明記されているものがないため断言することはできませんが、できるだけ良い情報を与える記事を発信するというのが良い評価を受けるのは、当然のことではないでしょうか。
参照：リクトで実施しているSEO対策
PV･CVRの向上
次にPVとCVRに関して 解説します。
「PV」とはどれだけユーザーがそのページを開いたのか、見に来た数を指しています。
またCVRは「コンバージョン率」といい、どれだけサイトに来てくれたユーザーがホームページ制作した目的にそって成果がでているのかどうかということを測る数値です。
例えば、何かを売ることが目的のサイトに商品があるとします。そのサイトの商品をユーザーが購入してくれる。
このようにサイトにある商品を買ってくれるという成果がどれだけ出ているのかという事を示すのがCVRといいます。
ユーザーがどれほどサイトに来て、作り手の意図する行動をとってくれたかということがポイントとなるのです。
ホームページ表示が遅ければそれだけユーザーは訪れず、コンバージョンにもつながらないため、表示速度を高速させる必要があります。
サーバーでの処理を軽減できる
ホームページ作成をしてそのサイトをユーザーが読むとき、サーバーの方であらゆる処理が行われ、その処理する数が多ければ表示速度が落ちてしまいます。
言い換えるならば処理速度が速いということは、サーバーへの負担が少ないということです。
品質スコアを上げることができる
ホームページの表示速度が速いことによって、広告の品質スコアを上げることができます。
「品質スコア」とは、Google広告のキーワードごとに設定される評価指標で、スコアが高いほど広告が掲載されやすくなります。
品質スコアを上げるための施策はいくつかありますが、その中に「ページの読み込み速度を上げる」という内容があります。読み込み速度が速いことによって品質スコアを上げることができて、広告が掲載されやすくなるなるのです。
ホームページ表示速度を決める3つの要因
ホームページの表示速度は様々な要因によって変わります。
その中で大きく関わってくるのが「フロントエンド側」「サーバ―サイド側」の2つです。
検索をするといろいろなページが出て来ると思います。その中の一番始めに見るページを「フロントエンド」 というのです。
バックエンドにあるソフトウエアに対して直接やり取りをする所も「フロントエンド」 といいます。
次に、「バックエンド」ですが、ユーザーには見えない部分です。ユーザーが検索をしてみた「フロントエンド」の裏で、データの処理をし、保存をしてくれる部分となります。
この「フロントエンド」と「バックエンド」がホームページの表示速度に関わってくる大きな要因になるのです。
フロントエンドでは「ネットワーク処理」と「レンダリング処理」、バックエンドでは「サーバー処理」がホームページ表示速度を決める要因になります
では、それぞれを詳しくお伝えしましょう。
ネットワーク処理とは
通信回数や通信量でホームページに影響を与える処理のことを言います。通信回数や通信量が多ければ多いほど、バックエンドでの処理能力が必要になり、自然とホームページの表示速度が下がってしまうのです。
このように、ネットワーク処理で表示速度が決められていきます。
レンダリング処理とは
レンダリングとは、サーバーからデータが届き、画面に表示する処理のことを指します。画面に表示をし、処理するまでにはバックエンドが必要で大変な作業が行われているのです。
サーバーはHTMLが見つかるまで情報を探しに行きます。このHTMLの中には、プログラミング言語である「CSS」や「JavaScript」等が入っていて、これをサーバーは全て読み取るまで探し続けるのです。
そうして画面に表示されるため、「CSS」や「JavaScript」が多いと表示速度も遅くなってしまいます。
このことは少し後で詳しく書きますので、今すぐ分からなくても大丈夫です。
サーバー処理とは
サーバー処理とは、Webページに載せるために必要なものを集め、データを生成することを言います。
こちらはかなり専門的な知識が必要となるのですが、ホームページを作る際、必要となる「レンタルサーバー」がこのサーバー処理をしてくれる所がほとんどです。しかし、もしそうでないレンタルサーバーを契約してしまうと自分で作業をしなければいけなくなるため、レンタルサーバー契約前に確認をしておきましょう。
フロントエンドを高速化する方法
フロントエンドの高速化には大きく分けて3つの方法があります。
- サーバーへの通信回数を減らす方法
- 通信量を減らす方法
- レンダリングの速度を低下させない方法
以上3つを詳しく見ていきたいと思います。
サーバーへの通信回数を減らす
インターネット上で検索をかけると瞬時に答えがたくさん返ってきますよね。
検索をかけ、答えを出すこの瞬間にサーバーへのアクセスは何度も行われているのです。
では、なぜこのように何度もアクセスをするのか解説をします。
サーバーは「HTML」を確認するまで何度もアクセスを繰り返します。その理由は、HTMLの中にある「CSS」や「JavaScript」、その全てを読むためです。
よってCSSとJavaScriptの数でサーバーへのアクセスは変わってきます。
その通信回数を減らすためには「CSS」「JavaScript」をできるだけ少なくすることで、サーバーへの通信回数を減らすことになるのです。
サーバーへの通信量を減らす
では、サーバーへの通信量を減らすにはどうしたらいいでしょうか。
これはわかりやすく、容量の多い「画像」や「動画」などのファイルを減らすことでサーバーへの通信量を減らすことができます。
ファイル数を減らすことが難しいと感じる場合は、どのようにしたらいいのでしょうか。その場合は、ファイルサイズを小さくすることでサーバーの通信量を減らす事が可能です。
その際、画像の画質は落としたくないと思いますので「画像の最適化」をしてくれるソフトを使って画像データ量を減らしてみてはいかがでしょうか。
参考：画像を圧縮する方法を解説
またはCDNといわれるサービスの導入をおススメします。
弊社では導入しやすいCDNサービスを提供しています。
レンダリングの速度を低下させない
レンタリングとは、コンピュータプログラムを使って、基となる数値データの表示をしてくれるのです。
例えば、あるサイトの情報を見たい時、私たちにわかりやすく表示してくれるのをレンダリングというのです。
レンダリングの速度を低下させないことで表示速度を低下させないようにしています。
サーバサイド（バックエンド）を高速化する方法
サーバーサイドを高速化するには、様々な状況によりそれに対応した方法をとらなければなりません。
例えば、プログラミング言語の「Rudy」「PHP」等でも変化しますし、BtoCなウェブアプリケーションのようなターゲットの違いでも対応がかわるのです。この１つ１つにより様々な方法をとるため、大変難しい作業となります。
しかし最も大事なことはただ1つ、「高速化する」ということにつきるのではないでしょうか。
もし速度が遅くなったと感じたらサーバーサイトのプログラミング言語やアプリを見てみると、その理由がわかってきます。
では、もう少し詳しく見ていきましょう。
DB（データベース）
WEBアプリケーションは何かしらのDBを使っていると思いますが、このDBは決まった形でデータを整理しています。すなわち、整理されたデータの集まりのことをDBと言います。 速度の低下にかなり大きくかかわることになります。
そのため、使い方を間違えるとどんどんと速度が落ちてしまうので気をつけて使わねばなりません。
その中でも最も気をつけなければならないのが、「セッションデータ」です。これは、ユーザーがアクセスするたびに更新したり取得したりするデータのことを言います。
ここで、1人1人の情報をDBにいれてしまうと次第に処理がおいつかなくなるため、セッションデータをDBにいれることはやらない方がいいででしょう。
画像の最適化
画像も多くの情報が入っているため、画像が増えるたびに速度は低下していきます。
それを防ぐのが「画像の最適化」です。
サイズの大きい画像はそのままにするのでなく、荒くならないよう画像の処理をしながらサイズをちょうどいいようにリサイズをして使うようにしたほうが良いかと思います。
キャッシュを活用する
キャッシュとは、閲覧したページを一時的に保存し、次にデータをできるだけ早く表示することを言います。
一度開いたページはデータとして残り、次に同じページを開く時にHTMLを簡単に読み取り素早くホームページを表示してくれるのです。
また、CDNを活用することで表示速度を上げることが可能です。CDNとはWeb上のコンテンツを効率よく安定的に配信できるように構成されたネットワークのことで、数多くのキャッシュサーバーによって構成され、利用することによってユーザーに効率よくコンテンツを配信できることが特徴です。
高速なサーバーに切り替える
今使っているサーバーは素早く動きますか?
速度が落ちてきたなと思ったときに「サーバー」を切り替えるのもまた一つの方法になります。
大きなレンタルサーバーの方が速度が速いのではないかと思いますが、一度気になるサイトを見て自分が求めているもの、表示速度を高速化しやすいサーバーを使うといいでしょう。移行は簡単にできるものではないのかもしれませんが、サーバーを変えることで劇的に変化することもあります。
今、国内で最も評判のいいサーバーは「ConoHa WING」と言われていますが、いろいろ試して効果がなければ思い切ってサーバーを変えるのも一つの案ではないでしょうか。
ページの読み込み速度がわかるツール
様々な方法でホームページ表示速度の高速化について書いてきましたが、では実際に表示速度が速いのか遅いのか、気になってきたのではないでしょうか。
ここでは、実際に表示速度を測ることができるツールを5つ紹介します。気になったツールを是非見つけてください。
Chromeユーザーエクスペリエンスレポート
ユーザーが実際にサイトを見に行ったとき、どれほどの速度で表示されているのかということがわかるツールです。
Chromeブラウザの閲覧できるデータを収集し計測されるのではありません。
ただこのChromeユーザーエクスペリエンスレポートは大規模で利用者が多い場合に役に立つツールとなりますので、個人で使うのであれば他のツールをおすすめします。
Lighthonese（ライトハウス）
LighthoneseはPWA（プログレッシブウェブアプリ）モバイル向けのWebサイトをアプリのように使うことができます。
更に、このツールは自分でできる具体的な修正点などを教えてくれます。
他のツールと比べると少し時間がかかるものの、正確であるため、使うといいツールではないかと思います。
Page Speed Insights（ページスピード・インサイツ）
Page Speed Insightsは、URLを指定すればそのサイトを確認し、フィードバック読み込み速度を「0〜100」で採点してフィードバックしてくれるツールです。
パソコンだけでなく、モバイルにも対応しています。
Test My Site（テストマイサイト）
Test My Siteは無料で提供しているツールとなります。
モバイルサイトの速度も測定してくれるのです。
また活用次第ではSEO対策もできる優れもの。モバイルサイトの速度が低いままでいると検索上位にあがりにくくなりますが、Test My Siteを利用し、問題があるところを解決していきましょう。
まとめ
今回はホームページ表示速度が高速化するのがなぜ必要なのかをまとめてみました。
ユーザーにいかに負荷をかけることなくホームページを見てもらうのか、それが最も大事なことではないでしょうか。
そのため、様々な方法で高速化できる方法もお伝えしました。今後、自分のホームページの表示速度が気になった方はツールを利用し確認するのがいいのではないかと思います。
常にユーザー目線でホームページ制作をしていきたいですね。
弊社では導入しやすいCDNサービスを提供しています。
合わせてお読みください。
