WordPressで動画の遅延読み込みを簡単に追加する方法

最近、ウェブサイトの読み込みに時間がかかっていた小規模ビジネスのオーナーを支援しました。複数の埋め込みYouTube動画がすべてを遅くしていることがわかりました。

読み込み速度が遅いと、訪問者をイライラさせ、検索エンジンのランキングを下げてしまいます。幸いなことに、動画の遅延読み込みは、まず軽量なプレビュー画像を読み込むことで、この問題を解決します。

私たちは、ページを非常に高速に保つために、この正確なテクニックを独自のサイトで使用しています。WordPressで動画の遅延読み込みを追加する最も簡単な方法は次のとおりです。

動画のラジーローディングとは何ですか？どのように機能しますか？

ラジーローディングは、実際​​に必要になるまでウェブページの必須でない部分の読み込みを遅延させる、パフォーマンスを向上させる技術です。

通常、YouTubeやVimeoのようなサイトから動画を埋め込むと、ブラウザは動画プレーヤー全体とその関連スクリプトをすべて読み込む必要があります。これにより、ページに余分な負荷がかかり、ウェブサイトのパフォーマンスが著しく低下する可能性があります。

ビデオの遅延読み込みは、重いビデオプレーヤーを軽量でクリック可能なプレビュー画像（サムネイル）に置き換えることで、この問題を解決します。フルビデオプレーヤーは、訪問者が画像上の再生ボタンをクリックした後にのみ読み込まれます。

画像は動画よりもサイズがはるかに小さいため、遅延読み込みテクニックはページの速度を大幅に向上させます。

利点がわかったところで、WordPressでYouTubeとVimeoの動画を遅延読み込みする方法を見てみましょう。

WordPressで動画のラジーローディングを追加する方法

動画の遅延読み込みを追加するには、まずLazy Load for Videosプラグインをインストールして有効にする必要があります。

このプラグインはすぐに使用でき、コードを一行も変更する必要はありません。

遅延読み込みが機能していることを確認するには、YouTubeまたはVimeoの動画が含まれる投稿またはページを表示するだけです。デフォルトのプレーヤーの代わりに、動画のサムネイルと再生ボタンが表示されることに気づくでしょう。

画像をクリックすると、動画が読み込まれて再生されます。

動画が読み込まれる際に一瞬遅延が生じるかもしれませんが、それは完全に正常です。心配しないでください。遅延読み込みは正常に機能しています。

このプラグインはすぐに機能しますが、ニーズに応じて設定を構成できることに注意してください。投稿エディタ画面では、YouTube動画埋め込みのサムネイル品質を選択できます。

サムネイルの品質以外にも、さらにカスタマイズオプションが利用可能です。

設定 » 動画の遅延読み込み にアクセスして、これらのオプションを確認および調整できます。

「一般/スタイリング」タブでは、動画サムネイルの外観をカスタマイズできます。レスポンシブモードを有効にしたり、再生ボタンのスタイルを選択したり、カスタムCSSを使用したり、schema.orgマークアップを有効にしたりすることもできます。

このプラグインはYouTubeとVimeoの両方をサポートしています。それぞれのタブをクリックすると、プロバイダー固有の設定を見つけることができます。

「YouTube」タブでは、プログレスバーの色を選択したり、Cookieを無効にしたり、注釈を非表示にしたりできます。YouTube動画の遅延読み込みを無効にすることもできます。

同様に、Vimeo設定タブでは、コントロールの色を選択したり、動画のタイトルを非表示または表示したり、Vimeo動画の遅延読み込みを無効にしたりできます。

これらの設定を変更した場合は、進捗を失わないように、一番下にある「変更を保存」ボタンをクリックすることを忘れないでください。

WordPressには動画のラジーローディングが組み込まれていますか？

そもそもプラグインが必要なのか疑問に思うかもしれませんが、それは素晴らしい質問です。バージョン5.7以降、WordPressは自動的に動画に基本的な遅延読み込みを追加します。動画が画面の近くに来るまで読み込みを待つようにウェブブラウザに指示します。

ただし、プラグイン方式は依然として速度にとってより効果的です。WordPressの組み込み方式では、動画プレーヤー全体（YouTubeまたはVimeoからの重いサードパーティートラッキングスクリプトを含む）が少し遅れて読み込まれます。プラグインは、訪問者が実際に再生ボタンをクリックするまで、これらの外部スクリプトが読み込まれるのを防ぎます。

最も大きな速度向上を得るには、動画をプレビューサムネイルに置き換えるプラグインを使用するのが最善の方法です。👍

ボーナス：動画は常に埋め込み、アップロードしない

WordPressサイトに動画をアップロードするのを避けるべき理由を詳しく説明する前に、アップロードと埋め込みの違いを明確にしましょう。

動画をアップロードするということは、WordPressメディアライブラリに画像を保存するのと同様に、動画ファイルをサイトに直接保存することを意味します。私たちはこれを強くお勧めしません。

一方、動画を埋め込むには、まずYouTubeのようなサードパーティサイトにアップロードする必要があります。その後、ブログに動画を埋め込むことで、動画は他の場所に保存されたまま、ウェブサイトで視聴できるようになります。可能な限り動画を埋め込むことを強くお勧めします。

WordPressに動画をアップロードするのではなく埋め込むことの利点について詳しく知りたい場合は、WordPressに動画を絶対にアップロードしてはいけない理由に関するガイドを参照してください。

動画チュートリアル

WPBeginnerを購読する

遅延読み込み動画に関するよくある質問

ここでは、WordPressで動画の遅延読み込みを追加することについて、読者からよく寄せられる質問をいくつか紹介します。

1. WordPressはデフォルトで動画を遅延読み込みしますか？

はい、バージョン5.7以降、WordPressには動画のネイティブ遅延読み込みが含まれています。ただし、動画プレーヤーが画面の近くに来るまで読み込みを待つだけです。動画をサムネイルに置き換えるプラグインを使用すると、速度の向上にさらに効果的です。

2. 遅延読み込みはSEOに良いですか？

はい、遅延読み込みはSEOに優れています。サイトの速度はGoogleの重要なランキング要因です。ページの速度を向上させることで、遅延読み込みはCore Web Vitalsスコアの向上に役立ち、検索エンジンのランキングを向上させることができます。

3. ビデオの遅延読み込みは、YouTubeやVimeoの視聴回数に影響しますか？

いいえ、視聴回数には影響しません。訪問者がプレビュー画像の再生ボタンをクリックすると、公式の動画プレーヤーが読み込まれます。その後、YouTubeまたはVimeoによって通常通り視聴回数がカウントされます。

4. 動画の遅延読み込みに最適なプラグインは何ですか？

シンプルさと効果から、「Lazy Load for Videos」プラグインをお勧めします。また、WP Rocketのような多くの人気パフォーマンスプラグインには、パフォーマンス最適化ツールの機能の一部として、優れた動画遅延読み込み機能が含まれています。

サイトを高速化するための追加リソース

この記事がWordPressで動画の遅延読み込みを追加するのに役立ったことを願っています。ウェブサイトを高速化する他の方法についてさらに知りたい場合は、これらのガイドを確認することをお勧めします。

• WordPressの速度とパフォーマンスに関する究極のガイド – この包括的なガイドでは、キャッシュから画像圧縮まで、サイトの速度を最適化するために知っておくべきすべてをカバーしています。
• WordPress CDNの適切なセットアップ方法 – コンテンツ配信ネットワーク（CDN）が世界中の訪問者のサイトの読み込み時間を劇的に改善する方法を学びます。
• WordPressに動画を絶対にアップロードしてはいけない理由 – 動画を埋め込むことが、サイトのパフォーマンスとユーザーエクスペリエンスにとって常に優れている理由を詳しく説明します。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterやFacebookでも私たちを見つけることができます。