---
title: a11y/unknown-aria-attribute · 未知の ARIA 属性
description: aria-* 属性には、タイポではない実在の WAI-ARIA 属性名を指定します。
---

**重大度:** warning · **カテゴリ:** a11y

## チェック内容

`aria-*` 属性の名前が WAI-ARIA 仕様で定義されていない場合を検出します。コンポーネントのソースを解析します。

チェックするのは属性の _名前_ のみで、値は対象外です（実在する属性の不正な値は `a11y/invalid-aria-value` が扱います）。そのため、名前が未知であればリテラル値でも動的な式でも同じように検出されます。

- `aria-lable="x"`。名前のスペルミスとして検出されます。
- `aria-lable={x}`。同じスペルミスで、値が動的な形として検出されます。

検出しないもの:

属性の語彙は固定した ARIA データのコピーに由来し、そのコピー以降に ARIA 1.3 が追加した属性を手作業で補っています。どちらにも無い新しい属性は、データを更新するまで未知として報告されます。

- 仕様で定義された属性: `aria-label="x"`。
- 値が動的な、仕様で定義された属性: `aria-hidden={isHidden}`。

## なぜ重要か

支援技術は WAI-ARIA 仕様が定義する固定の `aria-*` 属性しか認識しません。未知の名前、たいていは `aria-label` を `aria-lable` と書くようなタイポは、ブラウザやスクリーンリーダーがエラーとして報告できるものではなく、単に無視されます。意図した読み上げは行われないまま、見た目には何の異常もありません。

## 修正方法

正しいスペルの、仕様で定義された属性を使います。

```svelte
<button aria-label="Close">×</button>
```

## モードによる違い

ありません。このルールが読むのは同じ `.svelte` / `.ts` のソースファイルなので、CLI、Vite プラグインのビルド、ライブダッシュボードの静的ベースラインのいずれでも結果は同一で、レンダリング済み HTML の解析で再評価されることもありません。`--route` で実行範囲を絞ると、このルールは動きません。コンポーネントスコープのルールには、検出を紐づけるルートが無いためです。

## 無効化

意図的に非標準な属性を使う場合は、`<!-- svelte-vitals-disable-next-line a11y/unknown-aria-attribute -->` で個別の要素を抑制するか、ルールを無効化してください。

```js svelte-vitals.config.js
export default {
  rules: {
    'a11y/unknown-aria-attribute': 'off'
  }
};
```