【ロード】サイト表示速度がアップ!『BJ Lazy Load』の設定方法と使い方

【ロード】サイト表示速度がアップ!『BJ Lazy Load』の設定方法と使い方

Lazy Loadとは、サイトに表示されている画像を遅延して読み込ませることをいいます。

「遅延して読み込ませる」とだけ聞くと、なんだか遅くなるようなイメージを抱くかもしれませんが・・

通常、サイトが表示される際にはページ全体を読み込もうとして、画像を多用しているページなどは中々表示されなかったりして訪問者にストレスを与えてしまいます。

画像を遅延して読み込ませることで、現在画面に表示されている画像だけを読み込んでもらうことができます。

スクロールしていく度にその画面に表示されている画像を読み込んでいってもらえるわけです。

そうすることで、結果的にページの表示速度をアップすることができるわけですね。

同時に、サイト運営者側にとっても余計な読み込みを行わないことで、サーバーへの負担も軽減することができます。

WordPressのプラグインでは、『Lazy Load』というほぼ設定しなくてもよいプラグインもお手軽で人気ですが、こういったLazy Load系のプラグインは画像のalt(代替テキスト)を読み込まないという問題があります。

画像にaltを設定していない人は問題ありませんが、altを設定している人にとっては画像からのサイトへの訪問もあるわけなので、アクセスの増減に関わってくるわけです。

さらに、Googlebotが読み込まないことによりインデックス数が少なくなってしまうことになります。

これは検索結果にも大きく影響を及ぼす可能性がありますね。

ということで、機能面等も含め『BJ Lazy Load』というプラグインをおすすめしています。

この記事では、『BJ Lazy Load』の設定方法と使い方をお伝えしていきます。

BJ Lazy Loadをインストールする

管理画面からインストールする場合

siteguard-plugin

管理画面のメニューからプラグイン新規追加をクリックしましょう。

検索窓に『BJ Lazy Load』と入力して、キーボードのEnterで検索が開始されます。

BJ Lazy Load検索画面

BJ Lazy Loadを確認して今すぐインストールをクリックしましょう。

BJ Lazy Loadインストール画面

 自動的にプラグインのインストールが始まります。インストールが完了してそのまま使用する場合はプラグインを有効化をクリックして完了です。

BJ Lazy Load有効化

直接ダウンロードする場合

downloadボタン

BJ Lazy Loadを直接ダウンロードする場合は左側のDOWNLOADボタンをクリックしてダウンロードすることができます。

細かい解説は

を参考にしてください。

BJ Lazy Loadの設定方法

プラグインを有効化させたら、 設定BJ Lazy Load とクリックして設定を行っていきます。

英語表記となっているので、上から順に簡単に解説していくと

Apply to content - 遅延ロードを適用するかしないか

Apply to text widgets - ウィジェットに適用するかしないか

Apply to post thumbnails - 投稿記事のサムネイルに適用するかしないか

Apply to gravatars - コメント覧のアバター画像に適用するかしないか

Lazy load images - 画像の遅延を行うかどうか

Lazy load iframes - iframeを遅延させるかどうか(YouTubeを埋め込んだり、Facebookページを埋め込んだりする時に使用)

Placeholder Image URL - 遅延して読み込むまでの代替え画像URL(空白にしておけば白く表示)

Skip images with classes - 遅延を除外したい画像のクラス名(複数ある場合は半角『,』で区切る)

Threshold - 遅延させている画像の読み込みを開始するピクセル数を入力します。(例:200と設定しておくと、画像の200px前までスクロールされたら読み込みを開始する。推奨:400くらいが綺麗に表示される。)

BJ Lazy Load設定画面

変更を行った場合は、変更を保存をクリックして反映させます。

Apply to contentLazy load imagesは必ずYesにしておかないと機能しないので気を付けましょう。

Googlebotに読み込んでもらう方法

:こちらはPHPの編集を行っていきます。
難しい編集ではありませんが、必ずバックアップをとってから行うようにしてください。
サイトの不具合は、当サイトでは責任は負いかねますので個人の判断で行うことをご了承ください。
バックアップ方法が分からない場合は、

を参考にしてみてください。

Lazy Loadを行うプラグインにはfeedを除外する記述があるので、その部分を修正します。

FTPソフトから

wp-content/plugins/bj-lazy-load/inc/class-bjll.php

または管理画面から プラグインインストール済みプラグイン ➝ BJ Lazy Load(編集) ➝ 画面右側のプラグイン編集の項目から「bj-lazy-load/inc/class-bjll.php」をクリック

45行目~48行目部分にかけてを編集していきます。

<修正前>

<修正後>

管理画面から編集を行った場合は、ファイルを更新は忘れずにクリックして反映させましょう。

BJ Lazy Loadの使い方

使い方といっても、設定さえ行っておけばほぼ完了です。

補足として、BJ Lazy Loadを有効化すると、投稿・固定ページの記事編集画面にLazy Loadingというボックスが追加されます。

Lazy Loading

チェックを入れて投稿すれば、その記事だけ画像の遅延を無効にすることができます。

特に使用する必要はないかとは思いますが、使用したい記事があれば利用してください。

おわりに

Lazy Load系のプラグインは簡単に設置もでき、便利なプラグインなので多くの人が取り入れています。

ですが、「Googlebotに読み込まれていない」ということはあまり知られていないようです。

この設定を行っているだけで、アクセス数にもかなりの差が出てくると思います。

しっかりと対策を行っておくことをおすすめします。

[記事公開日]2016/07/24

最新情報、定期購読にはFacebookページが便利です。

ブログ吹き出し使用素材1

関連記事

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


ピックアップ記事

コンセプトを決めたチラシ作成のコツと、GIMPでチラシ作成

コンセプトを決めるコツと、GIMPでチラシ作成

GIMPの使い方として様々な基本操作方法をお伝えしてきました。 今回はその使い方を応用してチラシを作ってみます。 その工程を解説しながら…

おすすめ記事

Now!!

当サイトのテーマ(テンプレート)

WordPressテーマ「AN (tcd014)」
ページ上部へ戻る