WordPress 遅延読み込み: サイトに追加する方法

公開: 2023-03-09

優れたページ読み込み速度を持つことは、優れたユーザー エクスペリエンスを提供するために重要であり、検索エンジンのランキングを向上させるのにも役立ちます。 オンライン Web サイトやビジネス Web サイトを作成する場合、WordPress に勝る CMS はありません。

遅延読み込みは、Web サイトの読み込み時間を適切に保ちながら、多くのメディア リソースを確保するための最良の戦略です。 重要でないリソースを特定し、必要な場合にのみロードすることは、重要な戦略です。 この戦略を使用すると、ページの読み込み時間が短縮され、直帰率が低下し、カスタマー エクスペリエンスが向上します。

WordPress は、動画、画像、その他のメディアを Web サイトに統合できる主要な CMS です。 ただし、新しいバージョンには、WordPress の遅延読み込み機能も付属しています。

WordPress の遅延読み込み機能を有効にすると、サイト上のすべてのすばらしい画像や動画が遅延読み込みされます。

WordPressの遅延読み込み

これで、訪問者はサイトをすばやく読み込んでコンテンツにアクセスできるようになります。 ビジネスの収益が WordPress ウェブサイトに依存している場合は、この戦術を強くお勧めします。

遅延読み込みとは何ですか? また、どのように機能しますか?

遅延読み込みは、コンテンツの読み込みをユーザーに表示する最適化手法であり、スクロールせずに見えるコンテンツのダウンロードとレンダリングを遅らせます。

ウェブサイトに高解像度の画像や動画がたくさんある場合、サイトの読み込みが遅くなる必要はありません。 これらの重要な画像や動画を優先することができるため、読み込み時間が大幅に短縮されます。

これがどのように機能するかです:

  • ブラウザは、画像をダウンロードしたりビデオをプリロードしたりせずに Web ページ DOM を構築します。
  • ダウンロードされる画像とプリロードされるビデオは、JavaScript によって決定された最初に表示されるコンテンツに基づいています。
  • 遅延読み込みでは、訪問者が画面上で画像や動画を表示したときにのみ読み込まれます。

画像や動画は、実際に必要になるまで事前に読み込まれません。 Web サイトの複数の部分にアクセスしないと、それらの画像の一部が読み込まれません。

遅延読み込みは基本的に、WordPress の画像と動画の優先度に基づく読み込みです。 これは、両方の世界を最大限に活用するための非常に効果的な方法です。 優れたグラフィックスとスピードを備えたすばらしい Web サイトを作成できます。

WordPress の遅延読み込みをウェブサイトに追加する方法

サイトに遅延読み込みを追加するには、2 つの方法があります。 WordPressプラグインと手動で行うことができます。 このタスクを確実に成功させるには、両方の方法を知っておくことが重要です。

1. プラグインを使用して遅延読み込みを実装する

プラグインをインストールすることで、WordPress の遅延読み込みの問題をすべて解消できます。 WordPress には多くのプラグインが用意されていますが、速度最適化プラグインを使用すると他の利点が得られます。

遅延読み込みを実装しながらサイト全体の速度を最適化する w3speedster などのプラグインを使用できます。 遅延ロードできる画像を完全に制御でき、これらすべてをコーディングなしで実行できます。

チームに技術的な専門知識があまりない場合は、プラグインを使用するのが最適なオプションです。 プラグインの使用が完了したら、PageSpeed Insights で速度を確認してください。 大幅な改善が見られた場合は、仕事を正しく行ったことになります。

訪問者は優れたユーザー エクスペリエンスで歓迎されることを確信できます。

次の手順に従って、w3speedster プラグインを Web サイトに正常に追加します。

ステップ 1: プラグインをインストールしてアクティブ化する

WordPress ダッシュボードに移動し、プラグイン セクションをクリックしてから、[新規追加] をクリックします。 w3speedster プラグインを見つけて、[アップロード] をクリックします。 zip ファイルを選択し、[インストール] をクリックします。

インストールプロセスを開始する前に、WordPress はサイトにプラグインを追加するかどうかを確認するように求めます. はいを選択すると、インストールプロセスが開始されます。

プラグインを有効にすると、そのメリットを享受できるようになります。 ただし、その前に、設定セクションに移動する必要があります。

ステップ 2: 設定パネルを使用してプラグインを構成する

w3speedster プラグインに移動して、遅延読み込みの設定を構成できるようにします。 ここで、サイトを遅延ロードするメディア ファイルを選択できます。

このプラグインを使用すると、画像、ビデオ、オーディオ、および iframe を遅延読み込みできます。 遅延ロードするメディア ファイルのチェック ボックスをクリックします。 選択したら、変更を保存して終了します。

2.遅延読み込みを手動で追加する

WordPress サイトに別のプラグインを追加したくない場合は、これを手動で行うこともできます。 Chrome、Firefox、Opera などの複数のブラウザーは、ネイティブの遅延読み込みをサポートしています。

追加するだけです選択した画像とビデオに属性を付けます。 属性を追加すると、サイトでの遅延読み込みが自動的に有効になります。

遅延読み込みがデフォルトで WordPress サイトに実装されるようになりました。 いくつかの画像に対してのみ遅延読み込みを有効にしたい場合は、手動で行うことができます。

<img src=”画像名.png” loading=”lazy” alt=”alt 属性” width=”300” height=”300”>

これは、WordPress Web サイトに遅延読み込みを追加する素晴らしい方法ですが. すべてのブラウザーがこの方法をサポートしているわけではないことに注意してください。 ただし、最も人気のあるもののいくつかはそうです。 したがって、それはまだ安全な賭けです。

遅延読み込みの長所と短所

WordPress ウェブサイトへの遅延読み込みの実装について確信が持てない場合。 次に、長所と短所を考慮して決定を下すことができます。

長所

  • 帯域幅の使用を減らし、ホスティング コストを削減します。
  • サイトの速度が向上し、訪問者のエクスペリエンスが向上します。
  • モバイルの使いやすさを向上させます。
  • サイトのランキングを向上させます。
  • ユーザー維持の可能性を高める

短所

  • スクロール速度を遅くします。

遅延読み込みは SEO にどのように影響しますか?

検索エンジンは、ユーザーに結果を提供するために、Web サイトや画像などのその他の要素をクロールします。 遅延読み込みはサイトの速度を上げ、パフォーマンスを向上させますが。

場合によっては、検索エンジンによる画像のインデックス作成が妨げられることがあります。 ウェブサイトの画像も、検索エンジンでのランク付けに役立ちます。 場合によっては、ユーザーが画像だけで Web サイトを見つけることがあります。 したがって、それらは有機的な結果を得るために不可欠です。

ここで確認すべき点がいくつかあります

  • Google やその他の検索エンジンが、遅延読み込みされた画像を引き続きクロールできることを確認する必要があります。 これは、Google Search Console のクロール セクションにあるツール「Fetch as Google」を使用して確認できます。 ソース コードに画像が表示されていれば、問題ありません。
  • Web サイトの画像には alt タグを使用する必要があります。 これにより、検索エンジンは画像のコンテキストと、それが Web サイトの他のコンテンツとどのように関連しているかを知ることができます。

結論

遅延読み込みはユーザー エクスペリエンスを向上させる優れた方法ですが、同じことを戦略的に行うことが重要です。 たとえば、サイトのヘッダーに表示される画像を遅延読み込みしないでください。 これらの画像をすばやく読み込むことが重要だからです。

それ以外は、サイトの残りのメディアを遅延読み込みできます。 遅延読み込みには複数の利点があります。 サイトの速度が向上し、帯域幅の使用量が削減され、優れたユーザー エクスペリエンスが提供され、SEO が改善されます。