Lazy Loadの使い方!画像読み込み速度を改善しWordPress高速化する方法

今回はプラグイン『Lazy Load』を使って画像の読み込み速度を改善し、WordPressサイトを高速化する方法をお伝えします。

ブログのコンテンツボリュームが増えてくると、サイトの読み込み速度の遅さが気になってきます。サイトの高速化はSEOにも関係していて、検索エンジン上位表示にも影響が出ると聞くと尚更なんとか改善しなくては…!と思うものです。

参考:GTmetrixでサイトの読み込み速度を調べる方法

僕のサイトの場合は、スクリーンショットなど画像がとにかく多いので、画像読み込み速度を高めることが急務だったのですが、今回『Lazy Load』というプラグインを採用したところ、読み込み速度も3秒ほど向上させることができたので、シェアさせていただきます。

fast car

photo credit: Viernest via photopin cc

 

Lazy Loadとはどんなプラグインか

 

今回採用した『Lazy Load』ですが、簡単に言うと、サイトを表示する際にユーザーの見えている画面内に画像スペースが表示されてから画像を読み込むプラグインです。

つまり、画面の外側、ユーザーが見えていない部分については画像の読み込みが行われないので、ページの表示速度が改善されるという仕組みです。非常に便利そうな雰囲気がします!

Lazy Loadのインストールと設定

 

ダッシュボードから『プラグイン>新規追加』で『Lazy Load』と入力し検索をしてください。インストール後は忘れずに有効化を済ませましょう。

参考:プラグインのインストールと有効化の方法

有効化したら、後は特別な設定をすることなく、Lazy Loadが機能するのですが、デフォルトのままだと画像の表示のされ方がやや不自然になってしまいます。チカチカしてぎこちないような印象ですね。

ページ表示をより美しく自然にするために、プラグインを編集していきます。

lazy settei

『プラグイン>Lazy Load>編集』をクリックします。

『Lazy-load/js/lazy-load.js』を編集しますが、下の画像のように赤枠で囲った部分を『200→400』に変更します。400はあくまで目安ですが、400~600程度がオススメなようです。

lazyload

以上で、Lazy Loadの編集は終わりです。

最後に

 

『Lazy Load』を有効化したところ、目に見えてサイトの表示速度が改善された印象を受けましたし、実際にGTmetrix等の評価も向上しました。

ただ、高速化に関するプラグインは他のプラグインとの組み合わせやテンプレートとの愛称によって効果が出なかったり、サイトが正常に機能しなくなる恐れもあるので、慎重に使うようにしてください。

サイトで画像をたくさん使うという方には、Lazy Loadは特にオススメなプラグインです!

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でnozzieをフォローしよう!

記事公開日:2014年5月16日
最終更新日:2014年7月14日

無料メールマガジン

ネットビジネス




ネットビジネスで自由な人生を描くノジーのブログへ戻る

    
サブコンテンツ

このページの先頭へ