HTMLのAlt属性画像タグについて学ぶ

ウェブサイトのアクセシビリティを向上させる最も簡単な方法の1つは、画像タグにalt属性を使用することです。 この単純な属性を使用することを忘れる人が何人いるかは驚きです。 実際、有効なXHTMLを記述したい場合は、imgタグにalt属性が必要です。 それでも人々はまだそれをしません。

ALT属性

alt属性はimgタグの属性で、視覚的でないブラウザが画像を見ているときに嫌な意味があります。 これは、画像がページに表示されていないときにテキストが使用されることを意味します。 代わりに、表示される(または読み込まれる)ものが代替テキストです。

多くのブラウザでは、顧客が画像上にマウスを置いたときにaltテキストも表示されます。 これは、テキストが明確で読みやすいものでなければならず、ページ上でマウスを一時停止している読者にとって大きなポップアップの悪夢を作り出さないことを意味します。 altテキストを追加するのは簡単です。画像のalt属性を使用するだけです。 altタグを書くためのヒントをいくつか紹介します:

ブリーフィングを受ける

代替テキストが長すぎると、一部のブラウザが実際に機能しなくなります。 また、イメージ内に正確に何が記述されているのがいいかもしれませんが、それはaltタグの目的ではありません。 代わりに、文脈にイメージを置くために必要な言葉だけで満たされなければなりません

クリアする

文脈が混乱するほど短くしないでください。 あなたのaltタグのテキストだけを表示する人もいることを覚えておいてください。短すぎると、あなたが表示しようとしているものを理解できないかもしれません。 例えば:

コンテクストに参加する

イメージが文脈で表示されることを意図している場合は、イメージを記述しないでください。 たとえば、会社ロゴのイメージがある場合は、「会社名ロゴ」ではなく、「会社名」と記述する必要があります。

サイトの内部動作を表示しない

スペーサー画像を入れている場合は、altテキストのスペースを使用してください。 「spacer.gif」と書くと、役に立つ情報を提供するのではなく、サイトに注目するだけです。 そして技術的には、有効なXHTMLを書こうとしている場合は、スペーサーイメージではなくCSSを使用する必要があります。

検索エンジンを意識する

あなたのページのイメージがあなたのキーワードを促進し、増強するので、あなたが良い、簡潔、明確な代替テキストを持っているなら、それは実際にあなたの検索エンジンランキングに役立つことができます。

検索エンジンの最適化にのみ使用しないでください

多くのサイトでは、代替テキストをSEOツールとして使用すると、検索エンジンを利用してサイトに最適化されていないキーワードをサイトに最適化することができます。 しかし、検索エンジンが結果を偽造しようとしていると判断し、結果から完全にあなたを取り除くと、これは逆行する可能性があります。