Webサイトの速度を上げる具体的な方法
こんにちは。メンタのまさやです。
今回はWebサイトの読み込み速度を上げる具体的な方法を2つ紹介します。
納品前に必ず行いましょう。
まずは今のサイトがどのくらいの速度かを以下のサイトで確認しましょう。
すると点数が出てくると思います。
納品前には80点以上になるようにしましょう。
ではどうすればいいのか、主な原因は画像、Javascript、CSSの読み込み速度が問題です。
まずは画像の読み込み速度について改善方法を紹介します。
画像の読み込み速度を改善
手順1 新しいフォーマットwebPを使う
以下のサイトを参考にどうぞ
webPって何?
https://webdesign-trends.net/entry/13745
画像をフォルダごとWebPに変換できるサイト
※軽量化する前の画像をwebp変換するようにしてください。
https://saruwakakun.com/tools/png-jpeg-to-webp/
手順2 画像を圧縮する
webpが読み込まれない場合に表示される画像は圧縮しましょう。
以下のサイトでフォルダごと圧縮できるのでおすすめです。
https://kraken.io/web-interface
上記の手順で画像の読み込み速度は大幅に改善されるでしょう。
次にJavaScriptとCSSの読み込み速度について改善方法を紹介します。
JavaScriptとCSSの読み込み速度を改善
余分な記述を消しましょう。
手順は以下のサイトを参考にどうぞ
注意 そのページで使われていないだけで他のページでは使われている可能性もあります。あまりにそれが多い場合は共通のCSSとページごとのCSSを分けているとよりいいでしょう。
https://deve-cat.com/not-use-further-improvement/
ワードプレスのサイトであればより簡単に改善できます。
WPのプラグインで簡単に解決できるので共有します。
以下のサイトを参考にどうぞ
https://nico-mama.com/seo/