altタグについて詳しくない人、altタグは知ってるけど、使う意味がよくわからない人に、設置するとどんな効果があるのかを紹介します。
altタグとは
かんたんに言うと、画像につける名前のことを「altタグ」といいます。
インターネットが画像の名前を認識するためにつけるものと考えてください。
画像の名前というと「image1.jpg」「犬.jpg」などの部分を想像すると思いますが、これとは異なります。というのも、私たちには「image1.jpg」と目で見て読めますが、インターネットは読めません。
そこでaltタグの出番です。
altタグの使い方
altタグはこのように設置します。
当たり前ですが、altタグは<img>タグに使います。
<img src=”画像のリンク” alt=”画像の名前”>
このように設置すればOKです！かんたんですね。
altタグを設置すると何が得なの？
それでは、altタグを設置することで何が得なのでしょうか。
ポイントは3点あります。
エラー時に、画像の代わりにaltタグ（テキスト）が表示される
alt属性（オルト属性）とは画像の代わりになるテキスト情報のことを指しています。altとは「alternate」のことです。
画像のリンクが切れたり、画像が表示されなくなってしまったり、エラー時に代わりとして表示されます。「代替テキスト」とも呼ばれています。
視覚障がい者への補助になる
視覚に障がいを持っている方は、音声ブラウザやスクリーンリーダーを利用してWEBサイトの内容を読んでいます。
ただ、画像や動画の内容は見ないとわからないため、そのまま伝えるのが難しいです。その役割がaltタグです。
altタグのテキストに、「なにが表示されている画像なのか」「どういう内容の動画なのか」を端的にまとめると、音声ブラウザは、画像や動画の内容を伝えるためにaltタグ（代替テキスト）を読み上げてくれます。こうすれば、視覚に障害がある方にも内容がtだしく伝わります。
Google検索の画像一覧に表示される
画像にaltタグを設置すると、その代替キーワードで検索した人に検索結果として画像が表示されます。
直接的な効果はありませんが、多少なり流入数の増加が見込めますね。
altタグ設置のコツ
それでは、どんな代替テキストにすればよいのでしょうか。
画像に文字がある場合
例えばこんな画像です。
この場合は、
<img src=”画像のリンク” alt=”30点以下は絶対やるべきサイトスピード改善”>
これでOKです！
画像にたくさん文字がある場合
では、このような画像の場合はどうするべきでしょうか。
文字がたくさんありますね。
さすがに
<img src=”画像のリンク” alt=”正規化ページ特に記述の必要なし類似ページ・重複ページ■記述礼<head>‥”>
などといれてしまうのは、NGです。
もし画像が表示されていなかったとして、「正規化ページ特に記述の必要なし類似ページ・重複ページ■記述礼<head>‥」と言われても、なんのことだか全く理解ができないですよね。
こういう場合は、「つまり何が言いたいのか？」を明確にし、その内容をaltタグに入れましょう。
代替テキストには、ユーザが画像や動画の内容を理解できるテキストを登録することが必要です。
今回なら、
<img src=”画像のリンク” alt=”正規化ページと重複ページのcanonicalタグの書き方”>
等が良いかと思います。
画像に文字がない場合
画像に文字がない場合も同様です。
要は、何を示しているのかを代替テキストに設置すれば問題ありません。
この画像なら、
<img src=”画像のリンク” alt=”パソコンとスマートフォン”>
などが適切だと思います。
altタグはこう使え！
いかがでしたでしょうか。
ルールがはっきりしておらず適当に設置されがちなaltタグですが、altタグを正しく設置することで役に立つことはあります。
必ず覚えてほしいのは、「適当に設置しないこと」です。とりあえずテキストを入れるのではなく、この画像は何を意味しているのか？を理解して設置しましょう。
ユーザビリティが上がれば、おのずとSEO効果も上がりますので、ぜひaltタグを見直してみてはいかがでしょうか。
関連記事
無知は罪！pタグを改行のために使っていませんか？
pタグの意味は？
「段落」を意味するタグ（パラグラフ/paragraph）のこと。＜p＞で囲 […]
初心者必見！発リンクの意味や効果についてわかりやすく解説します
「発リンク」という言葉を知っているでしょうか？
言葉を知っていても意味は知らない・実 […]
PC・スマホが別サイトは要チェック！alternateの設置方法 PC・スマホを別ページで作成している場合は要チェック！
alternateタグ（link […]
strongタグの今昔！使うことでSEOに効果はあるのか？
今回の記事はざっくり
昔はタグは
重要なキーワードを検索エンジンに送るために使って […]
被リンクはSEO対策において重要な存在だった！意味と効果について解説
「被リンク」という言葉を知っているでしょうか？
実はこの被リンク […]
筆者紹介
