今すぐ試すべき 10 の実用的な画像最適化ハック

公開: 2022-11-23

投稿を公開する前に厳密なチェックを行って、コンテンツにタイプミスや文法上の誤りがないことを確認していますか? もちろんです。

チェックリストにもイメージを実行しますか? いいえ？

さて、あなたは一人ではありません。

ほとんどのブロガーはコンテンツの最適化に懸命に取り組んでいますが、画像 SEO はしばしば後付けです。

それを変える時が来ました。

Web サイトで画像の力を活用できますし、活用すべきです。 そして、人生の他のすべてと同様に、方法を知っていれば、それは非常に簡単です.

ウェブサイト全体の 1 回限りのアクション アイテム

画像の SEO を効果的に行うために、Web サイトで 1 回だけ実行する必要がある 4 つのタスクから始めましょう。

1. 画像サイトマップを作成する

Web サイトのすべての投稿とページ (または少なくとも検索エンジンによってインデックスまたは検出される必要があるもの) を含めるのと同じように、Web サイトのサイトマップに画像を含めます。

Google の画像サイトマップ ガイドラインによると、画像と投稿をすべて同じサイトマップに含めるか、画像用に別のサイトマップを作成するかを選択できます。

ただし、CDN を使用して画像をホストする場合、一般的なサイトマップには通常同じドメインに属するファイルしか含まれないため、Web サイト用に生成された一般的なサイトマップに画像が含まれない場合があります。 そのため、そのような場合には別の画像サイトマップを作成することを検討してください。

また、サイトが JavaScript コードを使用して画像にアクセスする場合、サイトマップに画像がリストされていない限り、Google は画像を見つけられない可能性があります。

Google が画像サイトマップを推奨する理由について詳しくは、こちらをご覧ください。

画像サイトマップはどのように作成しますか?

RankMath や Yoast などのほとんどの WordPress SEO プラグインは、デフォルトで投稿やページ (同じサイトマップ内) と共に画像を含むサイトマップを作成します。 また、注目の画像を除外するか含めるかを選択することもできます。これらの画像は時々「派手」になる傾向があり、インデックスを作成しても必ずしも付加価値が得られない可能性があるためです。

2. CDN を使用する

    画像コンテンツ配信ネットワークを使用すると、画像をより速くロードできます。 高品質の画像を配信すると、Web サイトの速度が大幅に低下する可能性があります。これはもちろん、SEO にとって決して良いことではありません。

    イメージ CDN とは何か、または CDN とは何かがわからない場合は、ここで簡単に説明します。

    CDNとは？

    CDN は、コンテンツ配信ネットワークの頭字語です。 それはまさに文字通りです。

    CDN は、世界中のさまざまなデータ センターにある接続されたサーバーのネットワークです。

    ユーザーが Web サイトにアクセスすると、その訪問者の場所に物理的に最も近いデータ センターがコンテンツを提供します。 これにより、明らかに高速になります。

    たとえば、Web サイトのコンテンツが西海岸のサーバーにあるとします。 東海岸からの訪問者があなたの Web サイトにアクセスし、サイトを閲覧します。

    現在、西海岸から東にコンテンツを取得するには時間がかかり、Web サイトの速度が低下します。 代わりに、CDN を使用すると、コンテンツがニューヨークのデータ センターに置かれる可能性があり、ウェブサイトの読み込みがはるかに高速になります。

    Google はウェブサイトの速度を真剣に考えています。 CDN を使用すると、Web サイトのパフォーマンスを劇的に向上させることができます。

    もちろん、本当に単純化された説明以上のものがあります。 CDN について詳しく知りたい場合は、詳細な CDN ガイドをお読みください。 最高の無料 CDN ソリューションのリストについては、こちらをお読みください。

    イメージ CDN とは何ですか?

    画像 CDN は、先ほど説明した通常の CDN と非常に似ていますが、画像を変換してサイズ、形式、品質を変更する機能が追加されているため、画像が表示されているデバイスに合わせて最適化されます。 .

    詳細については、Google がここに基本をまとめています。

    Image CDN サービスの一般的なプロバイダーをいくつか紹介します –

    Optimole – 最適化された方法で画像を圧縮、変換、保存、配信します。 Optimole は、WordPress.org で優れた評価を得ている WordPress プラグインを使用して、WordPress Web サイトと簡単に統合できます。 詳細については、こちらの Optimole の詳細なレビューをお読みください。

    Quicq – 画像配信パフォーマンスの高速化を約束します。 ここでQuicqの詳細なレビューを読んでください.

    さらに、MaxCDN、Cloudinary、Filestack、Imgix、および Imagekit など、考慮すべきイメージの CDN プロバイダーが他にも多数あります。

    3.遅延読み込みを有効にする

    遅延読み込みはまさにその名のとおりです。訪問者が実際に下にスクロールするか、その領域に移動してその画像を「要求」したときに、画像が訪問者のブラウザにジャスト イン タイムで読み込まれます。

    遅延読み込みを有効にするにはどうすればよいですか?

    メディア ライブラリにアップロードされたすべての画像の遅延読み込みは、WordPress バージョン 5.5 のデフォルト機能として追加されました (幅と高さの属性を持つimgタグに loading=”lazy” 属性を追加することにより)。 その後、WordPress バージョン 5.7 には、 iframeタグの遅延読み込みも含まれるようになりました。

    ただし、必要に応じて、無料の a3 Lazy Load プラグインなどの WordPress プラグインを使用することもできます。

    • WordPress のデフォルトの遅延読み込み動作を無効にするか、
    • の遅延読み込みをサポートすることで、WordPress の遅延読み込み機能を強化します。
      • メディア ライブラリー外の画像
      • この WordPress 属性をサポートしていないブラウザ
      • WordPress が遅延読み込みできない iframe または動画

      4.ブラウザのキャッシュを有効にする

      ブラウザー キャッシングとは、ブラウザーがダウンロードしたリソースをローカルに保存し、ユーザーが Web サイトに再度アクセスしたときに再度ダウンロードするのではなく、そこからそれらを提供することです。

      ブラウザのキャッシュを有効にする方法は?

      コードに手を出すことに熱心でない場合は、WP Rocket や W3 Total Cache などのキャッシュ プラグインに任せるのが最善です。 コーディングを恐れていない場合は、次の手順に従ってブラウザのキャッシュを DIY してください。

      各画像の反復可能なアクション アイテム

      コンテンツ チェックリストに含める必要がある 6 つのアクション アイテムのリストを次に示します。 画像を含む投稿を公開する前に、これらの画像最適化要件のそれぞれが遵守されていることを確認してください。

      5. 正しい画像形式を選択する

      「WebP ロスレス画像は、PNG と比較してサイズが 26% 小さくなっています。 WebP ロッシー画像は、同等の JPEG 画像よりも 25 ～ 34% 小さくなっています。」

      WebP に関する Google のメモ

      Google はさまざまな形式の画像をサポートしていますが、比較的新しくあまり知られていない形式の WebP が理想的です。 JPGは通常、写真に使用されます。 PNG は通常、イラストやロゴに使用されます (PNG では背景を透過できるため)。

      Google は、WebP、PNG、および JPG 画像を比較して実施した調査の結果に基づいて、パフォーマンスのために WebP を使用することを推奨しています。

      確信している？ WebP 画像の使用方法に関する Google のヒントを次に示します。

      6. 画像に適切な名前を付ける

      画像のファイル名は、検索エンジンが画像を「読み取って理解」するのに役立ちます。 MYPRODUCT202541.jpg のように、茶色のラップトップ バッグなどのイメージ ファイルにランダムに名前を付けても、まったく役に立ちません。

      代わりに、「light-brown-laptop-bag.jpg」という名前を付けることで、検索エンジンは画像が何であるかについての手がかりを得ることができます.

      繰り返しますが、いつものように、画像ファイル名にキーワードを詰め込むことは避けてください。 代わりに、できるだけ自然で「人間的」に保ちます。

      7. 画像を圧縮する

      品質を損なうことなく、画像ファイルのサイズを可能な限り小さく保つ必要があります。

      画像の固定制限や推奨ファイル サイズはありませんが、私が見たほとんどの Web サイトでは、50 KB から 100 KB までのファイル サイズの画像が使用されています。

      WPSmush、TinyPNG、OptiMole、EWWW Image Optimizer などの無料の WordPress プラグインを使用して、Web サイトの画像を圧縮できます。

      8. 意味のある Alt タグを追加する

      各画像には、文字通り代替テキストを表す「alt」というタグが付いています。 Alt タグは、SEO とアクセシビリティの両方にとって、画像の最も重要な側面の 1 つです。

      画像をアクセシブルにする

      視覚障害のあるユーザーが使用するスクリーン リーダー ツールは、Web サイトのテキスト コンテンツを読み上げます。 画像の場合、代替テキストはそのようなツールによって読み上げられます。

      そのため、代替テキストが画像を適切に説明していない場合、Web サイトの訪問者にとってまったく意味がありません。

      アクセシビリティ チェック ツールを使用して、Web サイトのアクセシビリティを改善する必要があるかどうかを評価することも検討してください。

      画像を検索エンジンに適したものにする

      Google は画像を「読み取る」方法がないため、代替テキストを使用して画像を解読します。 また、ブラウザが何らかの理由で画像を読み込めない場合、代替テキストを表示するだけです。

      altタグを追加する際に避けるべきいくつかのこと–

      • 代替テキストにキーワードの長いリストを詰め込もうとしないでください。Google はそれを見抜くのに十分賢いです。
      • 同じ投稿やページで画像に alt タグを重複させないでください。Google に迷惑をかけるだけです。

      WordPress では、画像ブロックを使用して、画像に alt タグを簡単に追加できます。 Web サイト上のすべての画像の alt タグを一括更新する場合にのみ、プラグインが必要になることがあります。

      補足– 画像のタイトルとキャプションは、2022 年 8 月 6 日以降、Google によって廃止されました。つまり、Google はこれらの画像タグを完全に無視するようになりました。

      画像にこれらのタグを既に指定している場合は、戻って削除する必要はありません。 この追加データがあればデメリットはありませんが、もはやメリットもありません。

      9.アニメーションGIFを避ける（疫病のように）

      アニメーション GIF を使用すると、ファイルが大きく肥大化する可能性があります。

      代わりに、MP4 などのビデオを使用すると、ファイル サイズを大幅に削減できます。 WebP ビデオを使用するとさらに効果的です。 証明については、Google の例を参照してください。

      10. コンテンツを補完する画像を使用する

      画像 (および代替テキスト) が、画像の前後のテキスト コンテンツと一致していることを確認する必要があります。 そうしないと、混乱を招き、検索エンジンによっても誤解される可能性があります。

      たとえば、パスタのレシピを説明する 2 つの段落の間に宇宙船などの画像を埋め込むのは不自然です。

      結論は

      要約すると、画像を効率的に配信し、Google が画像を見つけやすくし、画像を正確に理解するだけで済みます。

      これらの単純な画像最適化技術が生成に役立つ SEO ジュースは非常に多くあります。 これらを本当に無視する言い訳はありません。 画像 SEO に少し注意を払うだけで、Web サイトのユーザー エクスペリエンスを劇的に向上させることができます。 そして、それが生成するオーガニック トラフィックは歓迎すべきボーナスです。

      コメントを残して、WordPress Web サイトの画像をどのように最適化しているか教えてください。 あなたが試して好きだった (または嫌いだった) 画像最適化 WordPress プラグインはありますか?