[好奇心]imgタグのalt=「」は省略できますか?

10365 ワード

imgタグのalt=""は省略できますか?


最近、スクリーンリーダーユーザー向けのwai-ariaが興味を持って勉強した後、特定のページをクローニングしてコードすると、突然好奇心が湧いてきた.
<div class="buttonArea">
  <ul class="buttonArea__list">
    <li class="buttonArea__item" aria-label="마이페이지"><a href="#" class="buttonArea__link"><img src="./assets/header/image__header-mypage.svg" alt="마이페이지"></a></li>
    <li class="buttonArea__item" aria-label="최근본상품"><a href="#" class="buttonArea__link"><img src="./assets/header/image__header-mypage.svg" alt="최근본상품"></a></li>
    <li class="buttonArea__item" aria-label="장바구니"><a href="#" class="buttonArea__link"><img src="./assets/header/image__header-mypage.svg" alt="장바구니"></a></li>
  </ul>
</div>
補機ユーザーのためにliのラベルにaria-labelの属性を付け、各リンクに名前を付けます.考えてみてください.imgのラベルのaltの属性に同じ内容の名前を付けて、スクリーンリーダーは2回読むのではないでしょうか.
では、imgのラベルにaltの値がある以上、aria-labelを別途追加しないほうがいいのでしょうか.いいえ、これはアイコンの履歴を明確に示す属性で、省略すべきではありません.imgラベルのalt値を省略してもいいですか.
明らかに、imgラベルは学んだ必須値ですが、念のためグーグルを試してみました.

スタックオーバーフローをチェックすると,意見がまちまちであった.😅
もう少し公式ファイルを確認して、Google検索をして、下記の説明を確認できます.
アイコンやその他の厳格な装飾装飾などの必須情報が提供されていない画像では、スクリーンリーダーがスキップするために、置換テキストnull(alt=""")を指定する必要があります.スクリーンリーダーコンテキストでは、これらの追加要素は、ユーザが処理する信号にノイズのみを追加するためである.
▶learnosity
ああ、新しい内容がわかりました.そう思って片付けてよ?!という考えが生まれた.このように、置換テキストは、アシストデバイスユーザに提供される属性ではなく、画像が画面に出力されない場合にユーザに提供される代替テキストである.ではalt値は必要ですよね?
😵‍💫 めまいがして、
最終的に最良の案を見つけた.
<a href="" title="Visit us on Twitter">
    <img src="" alt="대체텍스트" aria-hidden="true">
</a>
すなわち、代替テキストは提供されるが、aria−hidden属性の値はtrueに設定され、アシストデバイスユーザが読まずに通過できるようにする.
知らない内容ではないのに当たり前(?)私は長い間迂回してやっと結論を出したと思います.😅
今でもalt=""を空けることができますか?整理する必要がありますが、別にチェックして、整理してから文章を書き直します.