ネットショップにおける画像には必ず代替テキストを入れよう
ネットショップでは、訪問したお客様にインパクトを与える目的で良く画像が用いられることがあります。例えば「なんと定価の50％オフ！」という文字だけの部分であっても画像化して目立つようにすることが多々あるかと思います。
こうした場合、一般のユーザーは確かに目立つ画像の方が購買意欲をそそるかもしれません。しかし、画像に書かれた文字や表現というものは、機械的に何が書いてあるかを判断できません。
どういうことかというと、最近では目が不自由な方もインターネットを使ってホームページを見ることが増え来ているそうです。そうした人はパソコンにインストールした「自動読み上げソフト」を利用しています。自動読み上げソフトはHTMLに書かれている文字を読み上げてくれます。
HTMLで書かれている本ページのようなテキストはしっかりと読み上げてくれますが、画像にはHTMLのソース上（<img src="URL" />）と書かれているだけで、何が書いてあるのを判断することができません。
そこで活用したいのが「代替テキスト」です。代替テキストとはHTML上の画像データに対して「この画像にはこうしたことが書いてあるんですよ」という画像を代替する文字です。HTML読み上げソフトなどでは、こうしたイメージの代替テキストを読み込んでくれます。
代替テキストの付け方は簡単です。 <img src="URL" />にalt="テキスト内容"とするだけです。具体的には、<img src="URL" alt="なんと定価の50%オフ"/>といった感じです。この代替テキストは、こうしたユーザビリティ・アクセシビリティの観点からも有効ですが、別途解説しますが、検索エンジン上も有効な手段です。
画像にはできるだけ代替テキストを入れるようにしましょう。 |
