WordPress サイトの速度を速くする画像遅延ロード(Lazy Load)プラグイン

  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

画像が多い場合やYouTubeなどの動画が多くのサイトの場合、サイトの読み込み速度が遅くなることがあります。 この場合、画像や動画の読み込みを遅延させてサイトの速度を向上させることができます。

有料テーマでは、画像遅延ロード(レイジロード)機能をテーマオプションを介して提供する場合があります。 このブログの現在使用されている ニュースペーパー(Newspaper)テーマでも画像遅延ロード機能を提供します。

ワードプレスニュースペーパーのテーマ - 画像の読み込み遅延機能

ニュースペーパーのテーマで画像の遅延読み込み機能を有効にするには、 ワードプレス伝言板> Newspaper > Theme panel> Template Settingsに移動し、 Use Loading Animation Image オプションをオンにして [設定の保存]をクリックします。

ベストセラーのテーマである ああ海(Avada)も画像遅延ロードオプションが搭載されています。 ああ、海のテーマでは、 ワードプレス伝言板> Avada > Theme Options> Performanceをクリックして、 Enable Lazy Loading オプションを Onに設定すると、レイジロード機能が有効になります。

ワードプレスああ海のテーマレイジロードを有効に

使用中のテーマからイメージ遅延ローディング機能を提供していない場合は、プラグインを使用してイメージを遅延ロードすることができます。

ワードプレスのサイトを高速化する画像遅延ロードプラグイン

a3 Lazy Loadプラグイン

ワードプレスレイジロードのプラグイン -  a3 Lazy Load

a3遅延ロードサイトページの読み込み速度を速くするモバイル中心(Mobile Oriented)の使用が非常に便利なプラグインです。 サイトのコンテンツが多いほど、このプラグインの効果がより大きく表示されます。

このプラグインは、画像遅延ロードだけでなく、動画の遅延ローディング機能も提供してYouTube、Vimeo、HTML5動画などすべてのワードプレスのビデオ埋め込み(Video Embed)をサポートします。

画像レイジロード:

次の項目について画像遅延ロード機能を使用するかどうかを設定(ON / OFF)することができます:

  • 文、ページ、カスタムポストタイプ(すべてのコンテンツ領域)
  • ウィジェット(サイドバー、ヘッダ、フッター)
  • 記事サムネイルの適用
  • はいバタ(Gravatar)に適用

動画レイジロード:

次の項目について動画遅延ロード機能を有効にするかどうかを設定(ON / OFF)することができます:

  • 文とページのURLに埋め込まれた動画(すべてのコンテンツ領域)
  • ウィジェットタイプ、テキストウィジェットおよびHTMLウィジェットの動画
  • YouTubeの
  • 動画(Video)
  • 人気YouTubeの挿入プラグインとの互換性

プラグインを使用してイメージを遅延ロードする場合、テーマオプション内の画像遅延(提供される場合)は、無効にしてください。

Lazy Load - Optimize Imagesプラグイン

ワードプレスの遅延読み込みプラグイン -  Lazy Load

WP Rocketで作成された Lazy Loadプラグインは、ページ内の画像や子供フレーム(iframe)がユーザーに表示される場合にのみ表示されます。 これにより、HTTPリクエストの数を減らしてロード時間を短縮します。

このプラグインは、サムネイル、ポストコンテンツ内のすべての画像は、ウィジェットのテキスト、アバター、スマイル絵文字、子供フレームに対して動作します。 ジェイクエリ(jQuery)のようなJavaScriptライブラリが使用されていないため、スクリプトのサイズが10KB未満です。

YouTubeの子供フレームをプレビューサムネイルに置き換えて、サイトの読み込み時間をさらに短縮することもできます。

Lazy Load for Videosプラグイン

ワードプレス動画レイジロードプラグイン

Lazy Load for Videosページの読み込み時間を改善し、Googleのスピードスコア(Google PageSpeed Score)を向上させます。 このプラグインは、埋め込まれたYouTubeの(YouTube)の動画と非メオ(Vimeo)動画をクリック可能なプレビュー画像に置き換えられます。

ユーザーがプレビュー画像をクリックするときにのみ、ビデオがロードされるため、不必要なJavaScriptをロードできません。 特にURLで動画を多く挿入されたサイトで良い効果を得ることができます。

おわりに

サイトに写真や動画が多くのサイトの読み込み速度が遅い場合は、この記事で紹介した遅延ロードのプラグインを利用してみることができます。 もしテーマが提供する画像の遅延読み込み機能が気に入らなければテーマで提供される遅延ロード機能を無効にして、プラグインを有効にして速度を比較することができます。

注:



6のコメント

  1. こんにちは。
    現在ご使用の携帯電話のメニューは、どのようなプラグインはありますか? かっこいいです。

    応答
    • こんにちは、シン・ドンヒョン様。

      現在このブログでは、モバイルメニュープラグインを使用せずにいます。 代わりテーマに搭載されたメインメニューを使用しています。
      このブログには、現在の人気雑誌のテーマである Newspaper (Newspaper)テーマが適用されています。

      昨年4月に Newspaperにテーマを変えました。 それなりまとも WordPress テーマです。

      https://www.thewordcracker.com/basic/switched-the-wordpress-theme-to-newspaper/

      応答
      • 前記事を見diviテーマだと思ったが、古くに変えたんですね。 ^^
        タイトルに下線引かれることもテーマに、独自のサポートしているのですか? 可読性が非常に高くね。

      • 現在は人気マガジン WordPress テーマである Newspaper (Newspaper)を使用しています。 コンテンツが多くのブログやニュースサイトなどに適したテーマです。

        Diviテーマを使用した時期にこのブログの訪問者数が最も多く増加したと思われる。 最近Diviテーマの多くの機能が強化され、以前よりも使いやすくなったようです。

        https://www.thewordcracker.com/basic/divi-4-0-%ec%97%85%eb%8d%b0%ec%9d%b4%ed%8a%b8/

        小見出し(h2、h3、h4タグ)スタイルは、Googleで検索して好みを適用した。 次の記事を参照してください。

        https://avada.tistory.com/1633

  2. 私はこのようなものがあることも知らなかった。^^
    良い情報ありがとうございます。楽しい一日を.. !!

    応答
    • 画像を遅延ロードすると、ページの読み込み速度が速くなりSEOに肯定的に作用するとですね。

      楽しい一日を過ごす。

      応答