SEO効果を高める画像の使い方とは？設置するときのポイントも

SEO対策において、他のサイトと差別化を図る上でも覚えておきたいのが、効果的な画像の使い方です。画像検索という方法が一般的になりつつある昨今、コンテンツの一部である画像を活用することは、効率的なSEO対策への近道でもあります。

そこで今回は、世界シェア１位の検索エンジン「Google」のガイドラインをもとに、画像の使い方や設置するときのポイントなど、具体的な方法を交えて項目ごとに解説します。SEO画像でGoogleからの評価を上げ、上位表示させるサイトづくりの参考にしてください。

Googleのガイドラインではコンテンツに画像を設置することを推奨しており、SEO効果があると言えます。視覚的に一目で判断できる画像はユーザーにも好まれる傾向があり、良質なサイトを運営する上でも必要不可欠です。さまざまなデバイスが普及した今日、パソコンだけでなく、スマートフォンやタブレットなどに対応したサイトがGoogleの評価基準に含まれるようになりました。

Googleガイドラインとは｜SEO担当者が理解する意義も解説

この記事では、Googleガイドラインとは何か、概要やSEO担当者が理解しておく意義について、詳しく解説します。さらに、現在公開されている4つのガイドラインの内容についても解説するため、ぜひ参考にしてください。

せっかく設置した画像も、スマホやタブレットに適したサイズでなければ、画面に横スクロールバーが出るなど見にくくなる可能性があります。サイトはスマホユーザーが多いことを念頭に入れ、モバイルフレンドリーにしましょう。モバイルフレンドリーはGoogleが示す評価基準の1つで、スマホやタブレットからのサイトを使いやすく、見やすく、最適化するSEO対策です。

モバイルフレンドリーとは？確認方法と3つの対応策

この記事では、モバイルフレンドリーの概要を解説します。スマホの普及が進む中、モバイルフレンドリーに対応したWebサイトを作ることは、ますます重要と言えるでしょう。対応策も解説するため、Webサイトの担当者などは参考にしてください。

適切な画像を設置することは、ユーザーの利便性を高めるだけでなく、Googleの評価基準を上げることにもつながります。最近では、テキストを検索エンジンに入力するだけでなく、画像検索という手法も一般的になっています。画像からサイトへの流入を促したり、コンテンツ解析を促したり、画像を設置することで得られるメリットはたくさんあります。

ユーザビリティとは？アクセシビリティとの違いや測定方法・改善策も

当記事では、ユーザビリティとは何かを詳しく説明します。また、ユーザビリティを測る方法や高めるための改善策、アクセシビリティとの違いについても紹介するため、Webサイトを運用している人や企業の担当者は、ぜひ参考にしてください。

しかし、画像を多用すればいいというわけではありません。Googleはコンテンツを総合的に評価するため、ユーザーのニーズやテキストに合ったものを使うなど、状況に応じて画像を取捨選択することが検索上位を狙う上でも大切です。

SEO効果が発揮される画像には特徴があります。Googleのガイドラインには「画像を最適化する」という項目があり、SEO対策の要素として評価することを示しています。SEO効果を得たい場合、Googleに評価されやすい画像を設置しましょう。

画像は、ページをダウンロードする際、大きなデータ量を占めるコンテンツの1つと言えます。最適化することは、ページの表示時間を短縮する上でも欠かせない作業です。

ここでは、SEOが発揮される画像の特徴を8つに分け、使い方や設置するときのポイントを交えながら紹介します。

Googleで対応している画像形式には、SVG、BMP、JPEG、PNG、WebP、GIFなどがあります。SEOに適したメジャーな形式はJPEGとPNGで、他の画像形式と比べて容量と画質のバランスが優れています。内容の適性については、下記の通りです。

容量が重い画像はページ表示の遅延につながります。表示速度はGoogleの評価基準にも含まれているため、容量と画質のバランスが優れたJPEGとPNGはユーザーからの評価も高い傾向です。

次世代フォーマットの画像とは？主な3つの種類と表示速度の改善方法

当記事では、Google PageSpeed Insightsで提示される改善項目「次世代フォーマットでの画像の配信」について、各フォーマットの特徴や対応ブラウザのほか、次世代フォーマットが利用できない場合の代替策について解説します。

WebP（ウェッピー）とは｜JPEG・PNGとの違い・変換方法も

近年注目を集めている「WebP（ウェッピー）」は、今後画像フォーマットのスタンダードになると言われています。当記事では、WebPとは何か、他画像フォーマットの違いやメリット・デメリットを挙げながら詳しく解説しました。

Googleのガイドラインでは、画像のテーマが分かるファイル名を評価のポイントとしています。検索エンジンは画像の内容を単体では認識できないため、ページタイトルや本文、画像のファイル名やalt属性のテキストから判断しています。検索エンジンに画像の内容を認識してもらうためには、ファイル名に分かりやすい名前をつけるべきです。

より高いSEO効果を発揮するために、imgタグに画像の内容が分かるalt属性の説明文を記述しましょう。文章がページ内容と一致していれば、検索エンジンは質の高い画像と評価してくれます。

alt属性の情報まとめ｜記述時のポイントから必要性まで

当記事では、alt属性の書き方や記述するときのポイントなど、alt属性に関する情報をまとめています。記述した属性の確認方法も紹介するため、画像をテキストとして表示させたい方や、属性によるSEO効果を高めたい方は、ぜひ参考にしてください。#post_excerpt

検索エンジンに評価されるためには、関連性があるテキストの付近に画像を設置しましょう。テキストと関連していると分かる部分にimgタグを設置し、それに言及した説明文をalt属性にも記述します。あくまで重要なのは、ユーザーにとってストレスのない画像の「数」と「質」を心掛けることです。

また、画像を設置する位置も大切です。サイトに訪れたユーザーはページ上部から閲覧していく傾向があり、Googleでもページ上部に示される情報の質を重視しています。ページ内容や概要を表す重要な画像は上部に設置しましょう。

Googleの評価基準を満たすため、width（幅）・height（高さ）属性を指定しましょう。これまでは、imgタグに数値を指定せずCSSで調整するのが主流でしたが、Googleは2021年6月16日に下記のCore Web Vitalsという3つの指標を導入しました。

widthとheightの指定はCLSの改善につながります。また、画像読み込み時に表示領域があらかじめ確保できるため、サイトのレイアウトにずれが生じません。表示速度を上げることにもつながるため、モバイル向けのサイトを運営している場合におすすめです。

ウェブに関する主な指標とは？LCP･FID･CLSの改善方法

当記事では、ウェブに関する主な指標について解説します。コンテンツの作成やSEO対策にあたって、ウェブに関する主な指標を把握しておくことは重要です。検索順位への影響や、主な指標を改善する方法も紹介するため、ぜひ参考にしてください。

ページ内にアイコンを設置する場合、ラスター画像ではなくSVGのアイコンを使いましょう。SVGはラスター画像と比べて軽量で使いやすく、縮小拡大しても画質が落ちません。CSSでスタイルを設定でき、複雑なアイコンの設置にも適しています。

シンプルなアイコンを使用する場合、Unicodeがおすすめです。フォントの多くは多種多様なUnicodeグリフに対応しており、画像の代わりに使うことができます。ラスター画像と異なり、適切にスケーリングされるためSVG同様サイズにかかわらず明瞭に見えます。

HTML画像要素のimgタグやpictureタグをコンテンツに埋め込むことで、クローラが画像を検知しやすくなります。また、pictureタグでは、レスポンシブ画像のサイズに適応するオプションを複数指定することが可能です。CSSを使ったインデックスへの画像表示は避けるべきですが、backgroundプロパティを使えば要素に複雑な画像を追加することができます。

なお、 テキストと画像の両方を記述し、画像だけが見える形にするのはやめましょう。CSSを利用して画面外にテキストを置いたり、画像の背景にテキストを置いたりすると、スパム行為と認定されかねません。

オリジナルの画像を用意できない場合や、Web上の画像から拾う場合は、著作権フリーのものを選びましょう。画像や写真の著作権は厳しく、許可のないものを使えば刑罰の対象になる恐れがあります。

クリエイティブ・コモンズ・ライセンス（CCライセンス）を活用するのも手段の1つです。

参考：creative commons JAPAN「クリエイティブ・コモンズ・ライセンスとは」

CCライセンスは簡単に言うと「新しい著作権ルール」で、著作権を保持した状態で作品を流通できるという特徴があります。使用者はライセンスの条件範囲内でリミックスや再配布を行えるため、著作権の心配をせずに画像を使えます。

画像を効果的に活用するために、サイトマップに画像を加えるか、新しい画像専用のサイトマップを作成してインデックスを促進しましょう。Java Scriptコードでアクセスされるものなど、検出されにくい画像もGoogleで認識されるようになります。

追加でサイトマップに画像を設置したい場合は、XMLサイトマップに画像情報を入力します。Googleでは、画像サイトマップの一例を公表しています。　

参考：Google 検索セントラル「上級者向けSEO」

XMLサイトマップを編集する際は参考にするとよいでしょう。

サイトマップ（sitemap.xml）とは、作成するだけでSEO効果を2倍速に！

当記事は、XMLサイトマップのSEO効果から作成方法、さらにHTMLサイトマップの役割と作成方法までを解説しています。どちらの形式もWebサイトの運用に欠かせない知識となるため、Webサイト運営に携わる機会のある方は必見です。#post_excerpt

サイトを上位表示させるための方法は数多くありますが、Googleのガイドラインに沿ったSEO対策を取ることで、画像の設置でも十分にSEO効果を発揮できます。今回紹介した8つの方法を参考に、より質の高い画像の設置を心掛けましょう。

SEO対策は一見難しそうにも思えますが、知識とポイントさえ押さえれば初心者でも十分にできます。まずはできることから始め、上位表示を達成するために、見やすく、分かりやすいサイトづくりを目指しましょう。