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

クライアントのウェブサイトを最適化していると、埋め込まれた動画がページの読み込み時間の遅延の主な原因であることがよくあります。問題は、訪問者が再生ボタンをクリックしなくても、ブラウザが動画プレーヤー全体をすぐに読み込んでしまうことで、サイトのパフォーマンスに悪影響を与える可能性があることです。

その解決策は、動画の遅延読み込みです。このシンプルなテクニックは、重い動画埋め込みを軽量なプレビュー画像に置き換えます。これにより、動画が多いページではページの読み込み時間が最大30%改善されることがわかりました。

動画コンテンツを削除せずにWordPressサイトを高速化したい場合は、正しい場所にいます。動画の遅延読み込みを追加する最も簡単で効果的な方法をご紹介します。

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

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

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

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

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

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

動画チュートリアル

WPBeginnerを購読する

文章での説明をご希望の場合は、このままお読みください。

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

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

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

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

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

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

このプラグインはすぐに使えるものですが、ニーズに応じて設定できる設定もあります。投稿エディタ画面では、YouTube動画の埋め込みのサムネイル品質を選択できます。

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

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

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

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

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

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

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

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

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

ただし、プラグイン方式は依然として速度面でより効果的です。プラグインは、訪問者が実際に再生ボタンをクリックするまで、重い動画プレーヤーがまったく読み込まれないようにします。WordPressの組み込み方式では、プレーヤー全体が読み込まれますが、少し遅れて読み込まれます。

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

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

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

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

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

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

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

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

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

はい、バージョン5.5以降、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でもフォローできます。