【2020年度版】 ホームページ制作 でページの読み込み速度を上げる方法

SEO対策の基本として、ホームページの読み込み速度もGoogleの検索順位の要因となっています。

ページの読み込み速度は、サーバーの性能、ホームページ（ウェブサイト）のコード、画像、CMSの設定などの要素が速度に影響します。

ページ速度が遅いとGoogleからの評価も下がってしまうので、  ホームページ制作 する上でページのスピードを調整する事が重要なポイントとなっています。

ページの読み込み速度を計測する方法

PageSpeed Insights

Googleがページスピードを計測するツール PageSpeed Insights を用意しています。

このサイトはモバイルが96点、PCが100点です。

Googleがページスピードを重要視している理由は「ホームページはより高速に表示する事をGoogleが求めている」の記事でも紹介しているので興味があればご確認ください。

Google Search Console

Google Search Console（旧ウェブマスターツール）の新バージョンでは試験運用版ではありますが、全ページ速度の計測を表示してくれます。

問題点を見つけ出して修正していく事が可能です。

ページの読み込み速度を上げる方法

画像の圧縮

画像を圧縮する事で読み込むデータ量を減らす事ができます。

表示速度は ホームページ の表示時間はデータ量に比例するのでデーター量を削減する事は有効な方法です。

現在、chromeブラウザでは画像のデータ量を圧縮できる WebP という画像形式が使用できます。

Googleもこの画像形式を推奨しているので、Chromeブラウザでは WebP 形式の画像を表示し WebP に対応していないブラウザでは、JPEGやPNGに切り替えて表示する手法が推奨されています。

弊社のサイトも、Chromeブラウザ では WebP 形式の画像を表示する設定にしています。

遅延読み込み（Lazy Load）

最近ウェブ標準となりChromeブラウザではデフォルトで導入されているファイルを遅延させて読み込む技術です。

ページを表示するために不要なファイルの読み込みを後に設定できるので、最初の読み込み時間を短縮する事が可能です。

「ネイティブ Lazyload がウェブ標準になりました。」の記事で詳しく紹介しています。

CDNを使用する

CDNは世界中のサーバーにホームページデータを設置することで、ホームページを開く場所に近いサーバーからデータを読み込む事が出来る技術です。

もう１つの利点は、アクセスを分散してくれる事です。アクセスが集中すると帯域が不足し表示速度が低下（遅延）するのですが、CDNでは軽減する事が可能です。

ホームページの最適化

HTMLやJavaScript、CSSなどのファイルを見直したり、WordPressのコードを最適化する事でページの読み込み速度を上げる事が可能です。

コードの不要なスペースや改行を削除する事でもファイル容量を少しだけ軽減できます。この小さな積み重ねを行う事でより軽量で最適化された ホームページ を 制作 する事が可能です。

Googleの Web.dev のサイト測定サービスではホームページを測定し、問題点を確認する事ができます。

サーバーが遅い、画像をもっと圧縮する必要があるなど、測定の点数を上げるためのアドバイスを出してくれるので、アドバイス通りに修正する事で読み込みスピードを改善する事が可能です。