WordPressで画像を簡単に遅延読み込みする方法（2つの方法）

WordPressで画像を遅延読み込みするように実装することは、ウェブサイトに大きな違いをもたらすことができる小さな一歩です。これは、今日の高性能サイトにとって重要なプラクティスです。

この単一のテクニックは、すべてのサイトオーナーが望む2つのことを直接支援します。訪問者にとってより良い体験と、検索エンジンのランキングの向上です。

訪問者にとっては、ページが非常に高速で応答性が高いと感じられるようになります。コンテンツがほぼ瞬時に表示されるため、エンゲージメントが維持されます。

Googleのような検索エンジンもこの速度に気づいています。より高速なウェブサイトを好む傾向があり、より多くの人にコンテンツが見つけてもらえるようになります。

これらのメリットをすぐに実感していただきたいと考えています。今日からあなたのサイトで遅延読み込みを機能させるための、簡単で2つの方法をご紹介します。

WordPressで画像を遅延読み込みする理由

WordPressの画像を遅延読み込みすると、ウェブサイトの速度が向上し、ユーザーエクスペリエンスが向上します。

低速なウェブサイトを好む人はいません。実際、ウェブサイトのパフォーマンスに関する調査によると、ページの読み込み時間が1秒遅れると、コンバージョンが7%減少し、ページビューが11%減少し、顧客満足度が16%低下することがわかりました。

Googleのような検索エンジンも、遅いウェブサイトを好みません。だからこそ、高速なサイトは検索結果でより上位にランク付けされるのです。

WordPressサイトでは、他のウェブ要素と比較して、画像の読み込みに最も時間がかかります。記事に多くの画像を追加すると、各画像がページの読み込み時間を増加させます。

この状況に対処する一つの方法は、CDNサービス を BunnyCDN のように利用するか、画像専用に構築された Envira CDN のようなよりシンプルなオプションを利用することです。CDN を使用すると、ユーザーは最も近いウェブサーバーから画像をダウンロードでき、ウェブサイトの読み込み速度が向上します。

ただし、画像は引き続き読み込まれ、ページの全体の読み込み時間に影響します。この問題を回避するには、ウェブサイトに遅延読み込みを実装して画像の読み込みを遅延させることができます。

画像の遅延読み込みはどのように機能しますか？

すべての画像を一度に読み込むのではなく、遅延読み込みではユーザーの画面に表示されている画像のみをダウンロードします。他のすべての画像はプレースホルダー画像または空白スペースに置き換えられます。

ユーザーがページを下にスクロールすると、ブラウザの表示領域に表示されている画像がウェブサイトによって読み込まれます。

遅延読み込みは、WordPressブログに非常に役立ちます:

• 初期ウェブページの読み込み時間を短縮するため、ユーザーはより速くサイトを確認できます。
• 表示されている画像のみを配信することで帯域幅を節約し、WordPressホスティングのコストを節約できます。

WordPress 5.5のリリースにより、遅延読み込みがデフォルト機能として追加されました。

ただし、画像の遅延読み込み方法をカスタマイズしたり、背景画像の遅延読み込みも行いたい場合は、WordPressプラグインを使用する必要があります。

2つの異なるプラグインを使用してWordPressで画像を遅延読み込みする方法を見てみましょう。以下のクイックリンクを使用して、使用したい方法に直接ジャンプできます。

1. WP RocketでWordPressの画像を遅延読み込みする（推奨）
2. OptimoleでWordPressの画像を遅延読み込みする（無料）
3. 遅延読み込み画像に関するよくある質問
4. WordPress画像を最適化するためのボーナスのヒント

方法1：WP RocketでWordPressの画像を遅延読み込みする

WordPressで画像を遅延読み込みするために、WP Rocketプラグインの使用をお勧めします。これは市場で最高のWordPressキャッシュプラグインであり、画像遅延読み込みを簡単にオンにできます。

それ以外にも、複雑な専門用語を知らなくても、エキスパート設定を構成しなくても、ページの速度を最適化できる非常に強力なプラグインです。

そのままの状態でも、推奨されるすべてのデフォルトのキャッシュ設定により、WordPressウェブサイトが大幅に高速化されます。

まず最初に行う必要があるのは、WP Rocketプラグインをインストールして有効化することです。詳細については、WordPressプラグインのインストール方法に関するガイドをご覧ください。

画像の遅延読み込みを有効にするには、いくつかのチェックボックスをオンにするだけです。動画の遅延読み込みも有効にでき、サイトの速度をさらに向上させることができます。

WordPressダッシュボードの**設定 » WP Rocket**に移動し、「メディア」タブをクリックするだけです。次に、「遅延読み込み」セクションまでスクロールし、「画像に遅延読み込みを有効にする」と「iframeと動画に遅延読み込みを有効にする」の横にあるチェックボックスをオンにします。

詳細については、WordPressでWP Rocketを正しくインストールしてセットアップする方法に関するガイドをご覧ください。

方法2：OptimoleでWordPress画像を遅延読み込みする

この方法では、無料のOptimoleプラグインを使用します。これは、画像の遅延読み込みを簡単に有効にできるWordPressの画像圧縮プラグインの1つです。

月間訪問者数が5,000人を超える場合は、Optimoleのプレミアムバージョンが必要になります。詳細については、当社の完全なOptimoleレビューをご覧ください。

まず、Optimoleプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドをご覧ください。

アクティベートすると、APIキーのサインアップを求める画面が表示されます。管理メニューの**Optimole**に移動しても、この画面を見つけることができます。

メールアドレスが正しいことを確認し、「アカウントを作成して接続」ボタンをクリックしてください。または、既存のユーザーの場合は、「APIキーをすでに持っています」ボタンをクリックしてください。

プラグインがOptimoleに接続するまで数秒待つ必要がある場合があります。その後、プラグインは自動的に画像を最適化し始め、訪問者はデバイスに最適な画像を見ることができるようになります。

それが完了するのを待っている間に、「設定」タブをクリックして遅延読み込みを設定できます。

ここでは、「画像をスケーリングして遅延読み込み」設定が有効になっていることを確認する必要があります。これにより、訪問者の画面サイズに基づいて画像が生成され、読み込み速度が向上します。

次に、「詳細設定」メニューオプションをクリックし、「遅延読み込み」を選択します。この画面には、画像の遅延読み込み方法をカスタマイズできるいくつかの異なる設定があります。

まず、「遅延読み込みから最初の画像数を除外する」設定を調整できます。これにより、投稿またはページの上部にある画像が遅延読み込みされなくなり、画面上部の画像が常に表示されるようになります。

すべての画像を遅延読み込みさせたい場合は、これを 0 に設定できます。

Optimoleには、確認できるその他の高度な遅延読み込み設定がいくつかあります。これらの設定はデフォルトで有効になっています。

1つ目は「画像のサイズ変更」設定です。これにより、訪問者の画面サイズに合わせて画像が調整され、ページの読み込みが速くなります。

その後、「背景画像を遅延読み込みする」設定が表示されます。これにより、ウェブサイト上で最も大きな画像である可能性のある背景画像が遅延読み込みされます。

その他の設定として、埋め込み動画やiframeの遅延読み込みがあります。埋め込み動画コンテンツが多い場合は、この設定をオンにしておくことをお勧めします。動画の代わりにプレースホルダー画像が読み込まれます。プレースホルダーがクリックされると、完全な動画が読み込まれます。

これらの設定をさらにカスタマイズして、ご自身のウェブサイトと画像に最適なものを見つけることができます。

プラグインの設定を終了する前に、必ずページ下部にある「変更を保存」ボタンをクリックしてください。

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

WordPressでの遅延読み込みについて、まだいくつかの質問があるかもしれません。ここでは、よく受ける質問とその回答をご紹介します。

1. WordPressは自動的に画像を遅延読み込みしますか？

はい、WordPress 5.5 のリリース以降、画像の基本的な遅延読み込みはデフォルト機能となっています。ただし、このネイティブ機能は、背景画像や動画などには適用されません。すべてのメディアを遅延読み込みさせるためのより詳細な制御と確実性を得るために、WP Rocket や Optimole のような専用プラグインの使用をお勧めします。

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

もちろんです。遅延読み込みはページの読み込み速度を大幅に向上させ、これはユーザーエクスペリエンスの重要な要素です。Googleのような検索エンジンは高速なウェブサイトを好むため、遅延読み込みで速度を改善すると、サイトの検索ランキングが向上します。

3. WordPressで最も優れた遅延読み込みプラグインは何ですか？

あらゆる用途でのパフォーマンスと使いやすさのために、WP Rocketをお勧めします。これは市場で最高のパフォーマンスプラグインであり、数回のクリックで強力かつシンプルな遅延読み込み機能を備えています。優れた無料の代替手段を探しているなら、Optimoleは堅牢な遅延読み込みオプションも提供する優れた選択肢です。

4. WordPressで動画を遅延読み込みできますか？

はい、できますし、すべきです！これは、多くの埋め込み動画コンテンツを特徴とするページの速度を向上させる素晴らしい方法です。WP RocketとOptimoleの両方で、動画の遅延読み込みを簡単に有効にでき、ユーザーが再生をクリックするまでプレースホルダー画像に置き換わります。

5.画面上部の画像は遅延読み込みすべきですか？

一般的に、ページの最上部（ファーストビュー）にある画像は遅延読み込みから除外するのがベストプラクティスです。これにより、訪問者が最初に目にするものが即座に読み込まれ、素晴らしい第一印象を与えることができます。Optimoleのようなプラグインを使用すると、この理由から、最初の数枚の画像を遅延読み込みから簡単に除外できます。

WordPress画像を最適化するためのボーナスのヒント

遅延読み込みはウェブサイトの読み込み速度の向上に役立ちますが、WordPressの画像を最高のパフォーマンスのために最適化するには、他にもいくつかの方法があります。

例えば、ウェブサイトにアップロードする前に、TinyPNGやJPEGminiのようなツールを使用して画像を圧縮することをお勧めします。または、OptimoleやEWWW Image Optimizerのような自動画像圧縮プラグインを使用することもできます。

また、画像の適切なWordPress画像サイズとファイル形式を選択することも重要です。JPEGは写真や多くの色を含む画像に最適で、PNGはシンプルまたは透明な画像に適しており、GIFはアニメーション画像にのみ使用されます。

この記事がWordPressで画像を遅延読み込みする方法を学ぶのに役立ったことを願っています。また、品質を損なうことなくWeb用に画像を簡単に最適化する方法に関するチュートリアルや、WordPress向けの最高のファイルアップロードプラグインの専門家による選択肢もご覧ください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。