ホームページの表示速度は、SEOの一つの要素として検索エンジンからの評価の一要因として扱われ、特にモバイル検索においては検索順位結果に影響を与えるものとして重要視されています。
このように、サイトの高速表示化・軽量化もホームページのSEOのひとつとして重要な要素ですが、ページの応答速度は、検索結果の順位への影響だけでなく、実際ホームページに訪れるユーザーの閲覧性向上、ページ離脱回避のためにも、なるべくページの表示速度を向上させる必要があります。
現在では、ページ速度に関する指標としてCore Web Vitals（コアウェブバイタル）という指標があり、検索順位のランキングの際の指標の一つになっています。その中には、主にLCP（Largest Contetful Paint）、CLS（Cumulative Layout Shift ）、INP（Interaction to Next Paint。コアウェブバイタル導入当時はFID（First Input Delay））という3つの指標があります。
ホームページ制作 京都 ファンフェアファンファーレでは、ホームページのSEOカスタマイズ・高速表示化にあたり、HTML、CSS、JavaScriptの統合・軽量化やキャッシュ利用、CDN利用、画像の軽量化・CMSテーマのソース軽量化といった様々なWeb技術を用いてホームページを高速表示化いたします。
ページの高速表示化でユーザーのホームページ閲覧性向上
ホームページの軽量化・高速表示化は、SEO内部対策としての側面を持っていますが、ページの応答速度・表示速度の向上は、「ユーザーのホームページ閲覧性」に直結するため、SEOとしてだけでなく、ホームページのマーケティング活用におけるコンバージョンにも影響を与えます。
「ホームページにアクセスしてみたが、応答速度が遅くなかなか表示されない」
「ページをスクロールするとブラウザ表示が固まる」
このような事象が起こると、ユーザーのページ離脱率が高まります。
Webユーザーにとっては、アクセスしてなかなか表示されないページにストレスを感じるため、そのサイトそのものから離脱してしまう可能性が高まります。
すぐに離脱されるページは、「良いページではない」ということを示す一つの指針となります。
検索エンジンも、ユーザーの求めるページを検索結果に反映するためにアルゴリズムの改良を加えています。
ページ離脱の要因の一つとして、ページの表示速度が原因となっていることから、検索エンジンにおいても、この表示速度を検索順位決定の要素として採用していると考えることができます。Google提供のアクセス解析であるGoogle Analyticsではページごとの表示速度、そしてサーチコンソールでは、「ページのダウンロード時間 (ミリ秒)」を確認することができます。
一般的には、ページ応答時間がページリクエストから2秒以内であることが理想的であるとされています。
ページ離脱の回避
検索ユーザーが求めているページをリスト化することが検索エンジンの機能であることから、離脱される要因があるページのSEO評価を下げることは必然として考えることができます。
ページ離脱の原因は、表示速度以外にも様々な要因がありますが、ホームページ全体のSEOを考える上で、サイト全体の表示速度向上は、そのページ離脱の要因の一つを改善することに繋がります。
このページ応答速度の向上は、検索順位だけでなくユーザーの離脱率を下げる要因として考えることができるため、必ずプラスとなる「SEO内部対策」として考えることができます。
そのページの離脱率低下にも関係し、同時にサイト全体のPV数にも影響します。こうしたことから、ホームページを利用したWebマーケティングを考える上でも、SEO以外の目的としても施策の必要がある項目のひとつです。
モバイル検索時は特に重要
モバイル端末からのホームページへのアクセスの際には、光回線などの高速データ通信ではなく、モバイルデータ通信を行っているケースが考えられるため、データ転送に時間がかかります。
近年ではモバイルデータ通信も高速化してきていますが、「同じ内容の情報を転送するのならば、データ通信は軽いほうが良い」ということは、どれほど技術が進歩しても変わることのない事実です。
データ転送量の制限などもあるため、モバイル端末からのアクセスの際には、ホームページの軽量化は必ずプラスに働きます。
モバイル検索時には、ホームページの表示速度、ページの転送速度が検索ランキングに影響を与えるため、顧客層にモバイルユーザーが多い場合は、全体的なホームページのモバイルフレンドリーに加えて、表示速度の向上を検討する必要があります。
フロントエンド側とバックエンド側の高速化
ホームページの高速表示化にあたり、基本的にはフロントエンド側の高速化作業とバックエンド側の高速化作業に大分類されます。このフロントエンド側とは、一般的なホームページ制作の分野での処理であり、バックエンド側とはサーバーサイドでの工夫になります。
ホームページの応答速度は、ホームページの表示に関する動的処理の関係から、サーバー側での設定などたくさんの要因によって決定します。バックエンド側であるサーバーサイドの高速化に関しては、現在利用しているサーバーのスペックや設定の制限などによって範囲が限られることもありますが、よほどの大規模サイトでない限り、SEOを考える上での高速表示に関してはフロントエンド側の工夫でも十分に対応可能です。
ホームページの軽量化
ホームページ制作 京都 ファンフェアファンファーレでは、SEO内部対策としてのホームページの表示速度向上のために、SEOカスタマイズとしてホームページを構成する各ファイルの軽量化などを行います。
ホームページの高速表示化には様々な方法がありますが、根本的な構成ファイルの軽量化や処理手順の簡略化、リクエスト回数の削減など、基本的な軽量化や単純化がもっともオーソドックスな表示速度向上の方法です。
SEOとしてホームページの応答速度向上、つまり高速表示家のためには、基本的なHTMLやPHPのソースの軽量化をはじめ、処理手順・リクエスト回数の低減やキャッシュ・CDN利用といった方法があります。
ホームページの軽量化に関しては、概ね以下の様なカスタマイズを行います。
HTMLやCSSの軽量化
HTMLやCSSは、ホームページの基本的なファイル群です。これらファイルの無駄なソースや分散したファイルを統合することで、ホームページの表示速度を向上させます。
結果的に表示されるページの内容が同じでも、その裏側に記述されているソースは様々です。無駄なHTMLソースやインラインに記述されたスタイルをCSSへと移動させて圧縮するなどの軽量化の方法があります。
ページ内にインラインで記述されたものや分散するCSSファイルをまとめて軽量化することで、リクエスト回数の削減による表示速度の向上を行います。
ページのHTMLのムダを省くことで、ページの応答速度も向上し、同時に、ページの中身の中で重要な部分が際立つようになりますので、SEOを考える上では、まずHTMLソースの見直しを行ってみても良いかもしれません。
JavaScriptの軽量化
また、ホームページのJavaScriptもCSSと同じように圧縮して軽量化することができます。読み込み順序などの配慮によって、必要なファイルを優先的に読み込むことで、実際の表示速度も向上します。様々な配布ファイルに組み込まれ、複数のjQueryが設置されている場合に、一つだけ残すといったケースもあります。
ページ読み込み時に同じような内容の複数のJavaScriptが存在すると、そのファイルの数だけリスエスト回数が増えますので、その回数分だけページの表示速度は低下します。
javaScriptのファイルサイズだけでなく、リクエスト回数の低下もページの表示速度向上に影響しますので、よりSEOなどを検討する場合には、ローカル編集用のファイルと、実際に使用するファイルを区別して、ホームページ上には統合・圧縮軽量化したJavaScriptファイルを使用しましょう。
CMSテーマのソース軽量化
WordPressなどのCMSのテーマファイルなど、phpで動的生成されるファイル群のソースを軽量化したり、プログラム実行の手順を最適化することで、動的生成の速度を向上させることができます。
停止させている機能に関するソースの記述を省いたり、数段階に分かれて動的生成されているものを一度で生成させるというような方法があります。
ページキャッシュの利用をしていればある程度平均応答速度は低下しますが、それでもキャッシュ期間経過後の動的生成時にはページ生成にかかる手順の数だけ負荷がかかりますので、なるべくリクエスト回数を減らすなどの工夫でテーマソースの軽量化と合理化をしておいたほうが良いでしょう。
画像の軽量化
ホームページに設置している画像は、一般的な印刷物とは異なり、ウェブブラウザで表示し、PCモニタで描画するため、それほど高解像度のものである必要はありません。
ホームページ制作において、最適な画像のファイルにロスレス圧縮することで、画質を落とすことなくサイズを縮小することができます。
画像はテキストファイルと比較してファイルサイズがかなり大きいため、画像の最適化、軽量化でページ自体のファイルサイズを縮小します。
jpegファイルなどをロスレス圧縮することで、ホームページの見栄えはほとんど変わらず、ページのトータルファイルサイズを少なくすることができるため、通信負荷低減につながり、結果としてホームページの表示速度が向上します。サーバーの通信負荷も低下できるため、SEOとしての目的に限らず画像の軽量化は検討したほうが良いかもしれません。
WebPへの変換
また近年ではWebPなどの次世代フォーマット画像の利用が進んでいます。ホームページ中の画像をWebPに変換することで、画像ファイルが圧縮・軽量化されるため、ページのファイルサイスが縮小されます。
ホームページの高速表示に関する技術
ホームページ制作 京都 ファンフェアファンファーレでは、ホームページの表示速度向上のために、SEOカスタマイズとして、サーバーキャッシュ、ブラウザキャッシュなどのキャッシュの利用やCDN利用など、ホームページの高速表示に関する技術を利用します。
高速表示の基本は軽量化ですが、その他にも様々なWebの仕組みを使って根本的なファイル量は一定でも表示速度に影響を与えるWeb通信に関する仕組みを最適化します。
サーバーサイドの工夫として、ホームページの高速表示化を考える上では、サーバーへの通信量を減らしたり、サーバーへの通信の回数を減らしたり、レンダリングの速度を低下を防ぐための工夫が必要になります。こうした事柄は先ほどのファイルの軽量化に加え、複数ファイルを統合するといったことでもある程度の高速化が可能です。
それ以外にも動的生成されるページをキャッシュ保存したり、ブラウザに画像をキャッシュさせる事によって、平均応答速度を向上させる工夫などがあります。
キャッシュ利用
キャッシュとは、ファイルの転送効率を向上させるために、ブラウザやサーバーにファイルを保存する仕組みです。
ファイル保存の方式として、ブラウザ内部に一時保存するものをブラウザキャッシュ、ウェブサーバーに保存するものをサーバーキャッシュと表現します。
WordPressなどのCMSで、ページを動的生成している場合は、基本的にそれぞれのページにおいて、ページを構成するファイル群を呼び出してその場で生成しています。
この構造の場合は、リクエストがあった段階でページを生成しはじめるため、生成のプロセスにおいて、サーバーへの負荷や応答速度の低下を招きます。
キャッシュの仕組みを利用することで、動的生成されたページを保存し静的に一時保存するため、ページの応答速度が向上します。
毎回ページ表示のリクエストに応じて内部システムを動かすのではなく、一度リクエストに応じて動的生成した「完成形」のページを静的ファイルのように保存して、次回からのリクエスト時にはわざわざ動的生成せずにキャッシュ保存されたファイルを送り返すという仕組みです。
ただしページを編集した際には、残存しているキャッシュファイルの影響で更新内容が反映されない場合もあります。ページを更新したときにはキャッシュの削除が必要になります。
CDN利用
CDN（コンテンツデリバリネットワーク）とは、ホームページを構成する静的ファイルを別サーバーに保存し、ページ表示の際に呼び出す方法で、メインサーバーの負荷が減るため、ページの表示速度を向上させることができます。
弊社制作のホームページでも、一般的なホームページであれば、CDNの利用しておりませんが、画像コンテンツが多いサイトなどでは、表示速度改善のために利用することがあります。
MySQLなどのデータベースの最適化
また、MySQLなどのデータベースに不要なデータが複数残存じていると、データベースへのアクセスの度に通信に負荷がかかります。不要なデータを削除するなど、データベースの中身を軽量化して最適化することで、ページの動的生成時の応答速度を向上させることができます。
上記以外にも様々な方法で、ホームページの高速表示化に関するSEOカスタマイズを手がけております。
ホームページの表示速度でお困りの場合は、ぜひ一度ご相談ください。SEO対策のひとつとしてホームページの軽量化・高速表示化をご検討いただければ幸いです。
