アメブロ 画像に代替テキストつけてますか？画像に追加して、SEO対策しよう

この記事を読むのに必要な時間は約 5 分です。

[アイキャッチモデル: 茜さやさん]

この記事で伝えたいこと
  • 少しの手間で差をつける
  • alt属性(オルト属性）とは
  • alt属性を追加してSEO効果を高めよう
  • alt属性の目的はユーザビリティの向上

このブログは基本的に、メンタルセラピストやスピリチュアル系を仕事にしたい方で、ブログを書いている方でITが苦手な方を対象にしています。

今回は、少しの手間で差がつく代替テキスト(alt属性)について解説します。

代替テキスト（alt属性）とは

代替テキスト（alt属性）はHTMLのimgタグ（要素)などの属性の一つでその画像の代わりに表示するテキスト(文字)を指定するための属性です。

alt属性はオルト属性、もしくはアルト属性と読みます。（実際の発音ではアとオの中間ぐらいの発音なんだそうです）

記事の表題に使っている代替テキストと呼ばれることが一般的です。

因みにaltはalternative（代わりの、代わりになる）の略語だそうです。

Windows系のPCの場合キーボードのスペースキーの左右についてます。（間に変換キーなどがついていたりしますが・・）

どんな働き？

働きはというとブラウザで画像が表示されないときに、alt属性で指定されたテキストが表示されます。

他にも音声ブラウザでの読み上げを行う場合にも、alt属性を指定しておくと読み上げられるそうです。

HTMLタグで記述する場合は次のようになります。


alt属性(オルト属性)で画像の代替えテキストを設定したほうがいい3つの理由


1.通信などの問題で画像が正しく表示されない場合の画像の意味を正しく伝えるため

通信が不安定であるなど何かしらの理由で画像が表示されない場合、画像の説明を代替えテキストで表示することで読者にコンテンツの意味が伝わるようにします。

記事の文脈で重要な画像に代替えテキストがない、画像が表示されない場合、その記事全体の意味が通じなくなる可能性があります。

2.視覚に障害のある読者がスクリーンリーダーなどを使用した場合に画像の意味が伝わるようにするため

記事の内容は、スクリーンリーダーや音声ブラウザで読み上げることで視覚に障害のある方も利用することできます。

ただ画像のような非テキストコンテンツは、そのままでは読み上げることができないためその内容が伝わらなくなってしまいます。

そこでalt属性を使って代替テキストを設定することで、スクリーンリーダーや音声ブラウザでも代替テキストを読み上げることでコンテンツの情報が正しく伝わるようにします。


3.検索エンジンのクローラーに画像情報をつたえるため

Googleなどの検索エンジンのクローラーも画像のような非テキストコンテンツの意味は理解が難しいといわれています。

そこでalt属性を使用して代替テキストを適切に入力しておくことでクローラーがその意味を理解することができるためSEO対策につながると言われています。

SEOよりもユーザビリティの向上のためにalt属性を設定しよう

こういったIT解説の記事によってはalt属性を設定する目的はSEO対策,向上のためと書いてある場合があります。

しかしながら僕はそうは思いません。

alt属性を設定する目的はユーザビリティの向上を第一とするべきだと僕は思っています。

つまり僕の場合はというと読んで出さっているあなたのためにalt属性をせっていすることでより分かりやすい記事にすることが大事ということです。

そして現在の検索エンジン、とくにGoogleがSEOとして特に評価しているのがユーザビリティの向上と言われています。

読み込み速度向上する、表示速度を上げる、レイアウトずれをすくなくするといったなかに、視認できない方への配慮をするというのがalt属性を設定するということだと思います。

そういった設定をすることがGoogleで評価され検索順位が上がるのだと僕はおもっています。

そのためalt属性に過度にキーワードを入れることはNGとされています。

alt属性というのは、この画像が持つ意味を示す以外の内容を盛り込むべきではないということです。

 

次ページから実際のアメブロやWordpressでのalt属性の設定方法を説明していきます。

次ページ

  1. 1
  2. 2