WEBサイトの制作や運用で画像を使うとき、その画像の説明としてaltタグを使用します。
頻繁に使われるものですが、使い方や書く内容に迷ったり、意外とうまく使えていなかったりするのではないでしょうか？
サイトの見た目自体にはあまり影響しませんが、ユーザーの理解のしやすさや使いやすさ、SEOの効果を高める、という点で重要な働きをしています。
この記事では、
- altタグの役割
- alt属性の使い方、設定方法とその効果
この2点について、WEB制作において重要なSEOの観点やユーザーにとって使いやすいサイトにするために、私たちが大切にしている考え方を交えてお伝えします。
altタグの役割
altタグの役割としては以下のようなものがあります。
- 画像が読み込まれない場合でも、画像の代替としてaltテキストが表示され、そこにあった情報をユーザーが把握しやすくなる
- スクリーンリーダーなどの音声読み上げ機能を使用する人に、画像の代わりにaltテキストで情報が提供される
- 検索エンジンは画像を直接理解することは難しいため、img要素に設定されたaltテキストを使用して画像の内容や関連キーワードが提供される
このようにaltタグは、ユーザーの理解や使いやすさを高め、検索エンジンに対してもサイトこの内容を把握するのに役立ちます。
適切に使うとユーザーにとってわかりやすく使いやすいサイトになり、加えてSEO的にもよい効果があります。
altタグの付け方とその効果
ユーザーの理解や使いやすさを向上させる
上記の通りaltタグは、画像が表示されないときや、音声読み上げ昨日などを使い音で情報を得るときに使用されます。そのためaltに記入される内容は、具体的で画像の表すことが伝わるテキストである必要があります。
画像の中に入っている文字をそのまま入れる、SEOの効果を狙いキーワードを羅列する、では状況が状況が伝わりにくくなってしまいます。
「画像が表示されていない場合どういう内容だったら伝わるかな？」と、使う人の視点に立って考えるとわかりやすい内容になると思います。
altを画像に設定する際の注意点
ただし、装飾目的で使われている画像など、意味を持たない画像の場合はaltは空の状態で入力します。音声読み上げ機能を使用する場合altの内容も読み上げられるため、視覚障がい者の方や高齢者など、スクリーンリーダーを使用される方にとってはサイト閲覧の邪魔になってしまう可能性があります。
ただし、altタグ自体が入力されていないと、画像ファイル名がそのまま音声で読み上げられてしまうため、空の「alt=””」だけは必ず入れるようにします。
多くの方にとってaltタグは普段あまり気にされないものですが、WEBサイトが使われる状況も人も様々です。より多くの人にとってわかりやすい、使いやすいサイトにする上ではユーザーのことを考えて作られるべきところだと考えています。
ユーザーの使いやすさや分かりやすさだけでなく、altタグを適切に使うことはSEO強化の効果もあります。
適切なaltタグの使用によるSEO効果
検索エンジンは画像そのものからコンテンツの内容を把握することは難しく、altタグやその周辺のテキストから情報を補足します。img要素にaltタグが適切に記述されていれば、検索エンジンにより正確な内容を伝えることができます。
そうすることでよりユーザーの求める情報が届けられるようになります。
ユーザーのわかりやすさの点でaltタグにキーワードの羅列はよくないという話をしましたが、SEOの観点からも効果的ではありません。
検索エンジンのガイドラインでは、altタグにたくさんキーワードを詰め込んだり長い文章を入れることは、避けるべき事項として載っています。
SEO効果を狙った結果スパムとしてみなされたり、ユーザーにとって良くないサイトとしてみなされたりしては逆効果です。
SEOの根本的な考え方として「ユーザーにとって価値のあるサイト」にするというものがあります。
altタグを入れることが直接的にSEOの効果があるのではなく、altタグを適切に使いユーザーにとってわかりやすい、使いやすいサイトにすることがSEO強化につながります。
alt属性を適切に設定し、より良いサイトにしていく
以上のように、altタグはユーザーの使いやすさや理解を高めたり検索エンジンに内容を伝える役割があり、適切に使うことでより多くの人が利用できる、より良いサイトにしていくことができます。
ユーザーにとって良いサイトにするというのは私たちも大切にしている考え方で、ユーザーにとってのわかりやすさや使いやすさ、クライアントのビジネスへの効果を考え、価値のあるサイトを制作しています。
投稿者プロフィール
