よくある勘違い①：画像を文章で表せばよい？
img要素のalt属性には、単に『画像を文章（テキスト）で表せば良い』と考えている方も少なくないかと思います。
この考えは決して間違っているわけではなく、基本的には正しいと言えます。
ですが、安易に『画像をテキストで表す』という認識を持っているだけでは、思わぬ落とし穴にハマることもあります。
その具体例を１つ提示しましょう。
下のように歯車の画像があったとして、『歯車の画像をクリックすると設定画面が現れる』という目的で歯車の画像を配置したとします。
この時、この歯車の画像のalt属性には、どんなテキストを設定するのが適切でしょうか？
単に『画像をテキストで表す』という認識に従うのであれば、下のような指定になるでしょう。
HTML
<img src="gear.png" alt="歯車のアイコンの画像" width="50" height="50">
ですが、ここでは別に『歯車のアイコン画像であること』を示したいわけではなく、あくまで『設定画面を呼び出すための画像であること』を伝えたいわけですよね。
このような場合は、alt属性に直接的な画像の説明文を指定するのではなく、下のように『画像を配置した目的』を指定した方が、アクセシビリティが向上すると言えます。
HTML
<img src="gear.png" alt="設定" width="50" height="50">
視覚に異常がない人にとっては、『歯車の画像をクリックすれば設定画面が現れる』ということが、経験則的に理解できます。
しかし、視覚に障がいを持つ人にとっては、歯車の画像＝設定というイメージが結びつかない場合があります。
なので、歯車の画像であるということを伝えるよりも、設定のための画像であるということを伝えた方がより親切であると言えます。
画像にalt属性を指定する際は、単に画像を文章で説明すれば良いと考えるのではなく、何のためにその画像を配置しているのかという目的をよく考えて指定することが大切です。
POINT!
- ・基本的に、alt属性には画像の内容を文章で説明すればOKだが、それが適さないケースもある！
- ・例えば、設定画面を呼び出すための歯車のアイコン画像であれば、alt属性には『設定』と指定した方が親切！
- ・画像をクリックすると何らかのアクションが起こるような場合は、画像を配置した目的をalt属性に指定しよう！
よくある勘違い②：alt属性はSEO対策として重要？
SEO対策＝検索エンジン最適化＝検索ページで上位に表示されるための施作…ということですが、検索ページで上位に表示されるための仕組みは日々アップデートされています。
なので、『ちょっと昔のSEO対策は、今はあまり役に立たない（ほとんど意味がない）』ということもかなり多いです。
たとえば、昔は単に被リンク数が重要だったので、故意にリンクを貼ってもらったり、相互リンクをお願いしたり…といった手法が横行していましたが、今ではこのような手法は全く通用しません。（被リンクが全くの無駄というわけではありませんが）
筆者としては、img要素のalt属性の指定も、SEO対策としてはそこまで大きな意味を持たないのではないかと思っています。
もちろん、アクセシビリティが全く配慮されていないページよりは、アクセシビリティに優れたページが評価されることはあるでしょう。
しかし、いくらアクセシビリティに優れていても、誰の役にも立たないような、内容が薄いページが検索で上位に表示されることはありません。
alt属性の指定は、あくまで視覚的な障がいを持つ方に対するためのものであって、検索順位を上げるためのものではないと筆者は思います。
検索順位を高めたければ、オリジナリティがあって価値のある体験や情報を提供できるよう、記事ページの内容（コンテンツ）を充実させることに労力を注いだ方が良いと言えるのではないでしょうか。
その上で、読み上げ機能を使ってWebページを閲覧している方にもしっかり情報を提供できるよう、画像にはalt属性を指定する…というのが本来の順番ではないかと思います。
POINT!
- ・検索ページで上位に表示されるには、何よりもまず記事の質（独自性が高いものや専門性が高いものなど）が大事！
- ・alt属性の指定をするだけで、検索順位が大きく上がることはないと考えた方が良い！
- ・alt属性の指定はSEO対策としてではなく、あくまでアクセシビリティの向上として考えよう！
よくある勘違い③：全ての画像にalt属性に説明文を指定するべき？
img要素のalt属性について、少しだけ学んだことがあるという人に多い勘違いなのではないかと思いますが、全ての画像にalt属性に説明文を指定するべきというのは正しくありません。
alt属性には必ず何か説明文を入れなければならないということはなく、空白の文字列（テキストを何も入れない）でも良い場合があります。
それが、単なるイメージとして画像を配置する場合です。
たとえば下のように、『この夏行きたい南国の島！』というタイトルで記事を書くとして、イメージ画像としてテキトーに南国風の写真を配置したとしましょう。
この時、南国風の写真に何か特別な意味や意図があるわけではありませんよね。
画像がないと見た目的に寂しくなってしまうから画像を配置するわけであって、イメージ画像がなくても記事の内容を伝える分には全く問題ないわけです。
このような場合、画像に説明文を加える意味も全くないと言えるので、alt属性の値を空の文字列（未指定）にしておいても大丈夫です。
むしろ、単なるイメージ画像で特別な意味を持たない画像に関しては、alt属性に無理やり説明を加えない方が親切でしょう。
ただ、alt属性に空の文字列を指定するのと、alt属性そのものを省略するのとでは、img要素に対するブラウザの認識が異なるので注意が必要です。
alt属性に空文字を指定すると、暗黙のARIAロールはpresentation（特に意味を持たないもの）となりますが、alt属性を省略した場合の暗黙のARIAロールはimg（画像）となってしまいます。
▼img要素の暗黙のARIAロールに関しての参考ページ
<img>: 画像埋め込み要素 – HTML: HyperText Markup Language | MDN
少し難しい話になってきましたが、シンプルに『alt属性を省略すると、特に意味のない画像とは認識してくれなくなる』と思っておけば良いかと思います。
src属性と違い、alt属性は必須ではない（省略することも可能ではある）のですが、意味のないイメージ画像を配置する場合は、alt属性を省略するのではなく、空の文字列を指定するようにしましょう。
POINT!
- ・特に意味を持たないイメージ画像である場合、alt属性の指定は空でもOK！
- ・alt属性そのものを省略すると、暗黙のARIAロールがimgになるので要注意！
- ・意味のない画像の場合、alt属性を省略するのではなく、空の文字列を指定しよう！
