jsx-a11y/alt-text 正しさ
何をするか
代替テキストが必要なすべての要素に、最終ユーザーに伝える意味のある情報があることを強制します。
なぜ問題なのか
代替テキストは、画面読み上げユーザーにとってアクセシビリティの重要な要素であり、要素の内容や機能を理解できるようにします。代替テキストが欠けている、または不十分な場合、補助技術に依存するユーザーにとってコンテンツは利用できなくなります。
例
このルールに対する誤りの例：
jsx
<img src="flower.jpg" />
<img src="flower.jpg" alt="" />
<object />
<area />このルールに対する正しい例：
jsx
<img src="flower.jpg" alt="白いデイジーのクローズアップ" />
<img src="decorative.jpg" alt="" role="presentation" />
<object aria-label="インタラクティブなチャート" />
<area alt="ナビゲーションリンク" />設定
このルールは、以下のプロパティを持つ設定オブジェクトを受け入れます。
area
type: string[]
default: []
area 要素の代替テキストについてチェックするカスタムコンポーネント。
img
type: string[]
default: []
img 要素の代替テキストについてチェックするカスタムコンポーネント。
input[type="image"]
type: string[]
default: []
input[type="image"] 要素の代替テキストについてチェックするカスタムコンポーネント。
object
type: string[]
default: []
object 要素の代替テキストについてチェックするカスタムコンポーネント。
使用方法
このルールを設定ファイルまたは CLI で有効化するには、次のように使用できます：
json
{
"plugins": ["jsx-a11y"],
"rules": {
"jsx-a11y/alt-text": "error"
}
}bash
oxlint --deny jsx-a11y/alt-text --jsx-a11y-plugin