Lazy Loadの使い方と設定方法｜サイトの表示速度をアップさせるプラグイン

どうも！ブランドクリエイターの中江です。今回は「Lazy Loadの使い方と設定方法｜サイトの表示速度をアップさせるプラグイン」というテーマでお話していきたいと思います。

今回紹介する「Lazy Load」というプラグインですが、このプラグインは簡単にいうと、サイトの表示速度をアップさせるプラグインです。

サイト（ページ・記事）の表示速度は、そのページ内のデータ量によって変わります。

表示するために読み込むためのデータが少なければ、早く表示することができますし、多ければ遅く表示されます。

データ量で一番軽いのは、文字、その次が画像、そして最後が動画になっています。

動画については、1つのページでそこまで使用しないと思いますが、画像をたくさん使っているという人は多いんじゃないでしょうか？

画像も大量に使っていれば、表示速度が遅くなってきます。

表示速度が遅ければ、ストレスとなり、ページの閲覧者は離脱していく可能性が高くなりますし、検索順位にも影響が出てきます。

で、この「Lazy Load」というプラグインは、画像を遅延ロードしてくれるんですね。

例えば、1ページに100枚も画像があれば、それは表示速度が遅くなるわけです。なぜかといえば、1ページを表示するのに100枚の画像を一気に読み込もうとするからです。

「Lazy Load」は一気に100枚を読み込むのではなく、画像が表示される場所にスクロールした時にだけ画像を表示されるようにしてくれるんです。

だから、結局、画像を読み込むのは1枚だけということになって、結果的に表示速度がアップするというわけです。

今回は、そんな「Lazy Load」というプラグインの使い方と設定方法について見ていきたいと思います。

では、早速始めていきましょう！

1.Lazy Loadをインストールする

では、まずは自分のWordPressにLazy Loadをインストールしていきましょう。

管理画面から「プラグイン」→「新規追加」と進んでもらって、右上にある検索ボックスに「Lazy Load」と入力すると、このような画面に出て来るので、「今すぐインストール」をクリックしてください

そうすると、このような画面に切り替わるので、「有効化」をクリックします。

これで「Lazy Load」のインストールは完了です。

2.Lazy Loadの使い方と設定方法

「Lazy Load」は基本的には設定する必要はなく、有効化するだけでも使えるプラグインなんですが、初期設定だと少し、画像の読み込みが遅いので、それを早くする設定を行っておいた方がいいです。

画像の読み込み速度を早くするには、管理画面から「プラグイン」→「プラグイン編集」へと進んでください。

そして「編集するプラグインを選択」のところで「Lazy Load」を選んで、「選択」をクリックしてください。

そうすると、以下の画面になるので、「lazy-load/js/lazy-load.js」をクリックしてください。

そうすると、このようなページに切り替わるので、赤い枠で囲んでいるところの数字を「200」から「400」に変えましょう。

変えたら「ファイルを更新」をクリックしてください。

これで「Lazy Load」の設定と使い方は以上になります。

お疲れ様でした！