たすとしブログ

雑記ブログです。よろしくお願いします!

【VScode】aタグの警告

最近、突然vscodeでタイトル通りの警告が出たので、対応してみました。

それ以前に作成していた時点では何も問題は無かったのですが、ある日突然です。

何事かと調べていると原因が分かりましたので、備忘録的に。

バリデーションでは問題は無いのですが、vscode側の計らいで、警告を出してくれているみたいです。

 

警告の原因

なにやら、テキストも無く空の要素として配置すると、ザックリ言うと「このリンクは何をしているのだい?」というのを指摘しているようです。

 

対策として

aタグの属性に

aria-label="○○"

と言うのを付与してしてあげれば良いです。これで、テキストが記載されていなくても問題は収束してくれます。

たったこれだけです。

aria-label 属性の使用 - アクセシビリティ | MDN

ちなみに私は「装飾用」として配置していたので、”装飾用”としてあげています。

※○○にはご自身の分かりやすい様に、何に使って居るのか判断できるものを記載すると良いと思います。そして、何か大きな間違いがございましたら指摘して頂けると幸いです。

 

以上です!