こんにちは、エヌ（＠enublog）です。
ブログで記事を作成する際に画像を使うことがあります。
文字だけの文章では読者が飽きてしまいページから離脱されるため離脱防止として画像を用いて読者にわかりやすく物事を伝えます。
画像を貼り付け終わっていませんか？
SEOの観点から見ると画像を貼るだけでは物足りません。
なぜなら検索エンジンのクローラーは画像の内容を把握しないからです
alt属性はあまり意味が無いと思っている方もいらっしゃいますが、
実際はSEO効果に必要な要素になりますので本記事で理解を深めてください。
今回の記事では、alt属性の役割とalt属性の記述方法についてご紹介します。alt属性を理解してSEO効果を上げましょう
目次
alt属性とは何？
alt属性とは、画像の内容をクローラーに伝えるための代替テキストのことです。
この背景にはGoogleの検索エンジンのクローラーが画像を認識できないということがあります。
なんども言いますが、現時点の検索エンジンでは画像の内容を把握しません。そのため画像を貼り付ける際にはalt属性に画像の説明を記述するべきと言えます。
alt属性の役割は情報は提供すること
前述でalt属性は画像を認識させるための代替テキストと言いました。これに関してはGoogleの公式サイトに記述されています。
alt 属性は、画像ファイルのコンテンツを説明するために使用されます。この属性は、次のような理由から重要です。
・Google にとって代替テキストは、画像の題材についての有用な情報です。Google はこの情報を使用して、ユーザーのクエリに最適な画像を判断します。
・視覚障害がある、スクリーン リーダーを使用する、接続速度が遅いなどの理由から、ウェブページの画像を見ることができないユーザーも多くいます。代替テキストはこのようなユーザーに重要な情報を提供できます。
画像 – Search Console ヘルプ
alt属性はHTMLで記述されます。
文章を音声で聞く場合、alt属性を記述していれば画像の部分があったとしても音声で文を読んでくれます。
画像の説明を入れていなければ画像の部分が飛ばされてしまいます。
上記の引用部分からわかることは仮に画像が見ることができなくても画像の内容を認識することができるということです。
コンテンツはユーザーのためにあるということを意識することが重要です
alt属性の役割
・Webページの読み込みが遅くてもテキスト表示が可能
・画像の内容をクローラーに認識される＝SEO効果
・音声読み上げ機能でも読み上げられる
今の時点で画像を貼り付ける際は代替テキストを記述する必要があるということが分かったと思います。
alt属性とtitle属性は違う
「alt属性」を検索するとtitle属性が同じく出てきます。どちらも画像の説明をするためのテキストです。では違いは何かご紹介していきます。
alt属性とtitle属性は役割が違う
簡単に言えば、alt属性はクローラー（コンピューター）のために記述します。
title属性はユーザーが画像の説明を知るために必要です。
alt属性→コンピューターのために必要
title属性→ユーザー（人間）のために必要
ユーザー側がalt属性を知ることはできません。
そのため画像の説明はtitle属性に記述が無いと説明が見れません。SEOの観点で重要なのはalt属性です
注意点としてalt属性とtitle属性の併用はしないようにしましょう。
alt属性 記述方法
>HTMLで記述
まずはalt属性をHTMLで記述する方法です。画像を貼り付けた際にタグがHTMLに表示されるのでそこから記述します
↓↓↓↓↓↓↓↓↓↓↓HTMLで表示
<img src="画像のURL.png" alt="ここがalt属性（説明を記述） " width="幅" height="高さ"/>
画像をHTMLで表示する方法はまず、画像をクリックすると下記のように表示されるので下記の箇所をクリックします
クリックすると詳細選択が可能になるので「HTMLとして選択」をクリックすると画像がHTMLで表示されるのでその箇所にalt=を付け加えます
<img src="画像のURL.png" alt="ここがalt属性（説明を記述） " width="幅" height="高さ"/>
このようにalt＝を自分で付け加えます。
HTMLがわからない人はブロックから記述
中にはHTMLを付け加えがわからいという人もいることでしょう。
HTMLがわからんくともalt属性に記述することができます。
まずは画像を挿入した後、画像を選択するまでは先ほどと同じです。
「画像を選択」→ブロック欄のAltテキストに直接文を記述します。
HTMLがわからない人でも文をいれることができます。次は文をどう記述するかについてご紹介します。
alt属性 パターン別記述
画像にリンクを設置する場合はキーワードを含める
もしも画像にリンクを付ける場合、alt属性はキーワードを記述します。
リンク先がどういったページになっているかを説明するためのキーワードです。
例えば、このページであれば、「alt属性とSEOの関係性について」と記述をします。
alt属性を記述することでサイトの内リンクを強めてくれます。
リンクを設置した画像にはキーワードを書きましょう！
基本は画像の内容を簡単＋分かりやすく
alt属性はあくまでも画像を説明するためのものです。
単語だけを並べるのではなくコンピューターがわかってくれるよう簡潔な文章且つわかりやすいものにします。
（例）「〇〇をするための方法」、「〇〇と〇〇の比較」、「〇〇の仕方」、「〇〇の解説」、「誰々が～をしている様子」、「〇〇の風景」等が挙げられます。
ポイントは長文にしないということです。
長文ではなく短文に書くよう心掛けましょう！
文字画像は書かれている文字を記述
画像に文字が入っている（ロゴなど）場合や文字を付けた画像の場合のalt属性は画像に書かれている文字をそのままalt属性に記述します。
装飾や意味無し画像は記述しない
サイト全体をよくするために用いた画像、いわゆる飾りのためにしようした画像の場合alt属性を記述しなくてもいいです。
説明したい画像→alt属性を記述
装飾or説明なしでもいい画像→alt属性記述なし
まとめ
これから記事を書く際にはalt属性を意識してみてください！
注意点としてalt属性とtitle属性を併用しないようにしてください。
おすすめはalt属性の記述になりますのでそちらをメインにしてもらえればと思います。
しかしalt属性の記述だけがSEO効果を絶大に上げるという考えはやめましょう。
alt属性を記述したからといって上位表示が約束されるというものではありません。
書かないよりかは書いたほうが良いという考えを持っておきましょう。