ブログサイトをより魅力的にするには画像が欠かせません。
よりリッチに魅せるためにも画像を数多く配置したいところですが、ユーザー側の読み込み速度が遅くなる可能性も……。
今回紹介するプラグイン「Lazy Load」を導入して、ページ自体の読み込み速度を改善してみましょう。
画像表示を「遅延」させてページを高速表示する「Lazy Load」
今回紹介する「Lazy Load」というプラグインは画像の読み込みを“遅延”させるプラグインです。
「遅延したのでは読み込みが遅くなるのでは？」
と思うかもしれませんが、このプラグインは重たいデータである「画像」の読み込みを制御してページ全体の読み込みを速くさせる、というタイプのプラグインです。
設定するためのインタフェース（ボタンやプルダウンメニューなど）はなく、直接jsファイルを修正する必要がある点に敷居の高さを感じてしまいますが、それほど難しいわけではありません。
ぜひチャレンジしてみましょう。
まずは、インストールとプラグインの有効化です。
ダッシュボード→プラグイン→新規追加→「Lazy Load」で検索します。
画像のようなアイコンのプラグインを選択してインストールし、有効化します。
jsファイルを直接指定して修正を実行→更新
「Lazy Load」は設定のためのインタフェースがありませんので、jsファイル自体を操作する必要があります。
「Lazy Load」が導入されていることを確認して、「プラグイン編集」をクリックします。
画像のような画面が表示した場合は「理解しました」をクリックして進めましょう！
※WordPressのバージョンによっては出現しない場合もあります。
数値を200→400にして設定完了
表示した画面の右側にあるプルダウンメニュー「編集するプラグインを選択」から「Lazy Load」を選び、「選択」ボタンをクリックします。
「プラグインファイル」の中で、「js」→「lazy-load.js」を選択します。
すると「選択したファイルの内容」（プログラムが記述されている部分）が切り替わります。
この中の画像の赤い囲みの部分「distance：200」と書かれたところの数値を「400」に変更します。
数字の変更ができたら、下部の「ファイルの更新」をクリックして完了です。
まとめ
以上、画像の読み込みを遅延させ、ページ表示スピードを早くするワードプレスプラグイン「Lazy Load」の使い方についてご紹介しました。
ちょっと難しそうな「Lazy Load」の設定ですが、作業自体はとても簡単。
読者がスマホで閲覧することを想定すると、読み込み速度の改善はユーザービリティ向上にとても有効なので、積極的に導入しましょう。
