アクセシビリティ：カスタムウェブアプリケーションに ARIA 属性を追加する

この記事内

ARIA 属性は、スクリーンリーダーのような支援技術に要素のセマンティクスに関する追加情報を提供します。サイト上のカスタム要素またはアプリケーションに ARIA 属性を追加することができます。

ARIA 属性は、要素のネイティブ HTML でアクセスできない場合にカスタム要素やアプリケーションにアクセスできるようにする方法を定義するため、重要です。

重要：

この機能は、ARIA 属性を必要とするカスタムアプリケーション / 要素を持っているユーザーを対象としています。サイトにこれらをお持ちでない場合は、ARIA 属性を編集する必要はありません。

サイトのほとんどの要素には、すでに ARIA 属性がハードコーディングされています。しかし、カスタムアプリケーションを作成している場合は、アクセシビリティのために独自の ARIA 属性を追加することができます。

Wix Studio エディタ

Wix エディタ

Wix Studio エディタで開発者モード（Velo by Wix）を有効にして、要素に属性を追加します。Velo ではコーディングの追加、データベースの構築などが可能です。

要素	プロパティ
ライトボックス	label
テキスト	label, role heading, status, alert], live, relevant, atomic, hidden, current, level
ボックス	label, tabindex, role [region, group, none, status, alert], live, relevant, atomic, current, controls, hidden
ストリップ	label, tabindex, role [heading, status, alert], live, atomic, hidden, current
リピーター	label, role [heading, status, alert]
テキストボタン	tabindex, pressed, expanded, haspopup

より多くの要素に ARIA 属性を追加できるよう、日々取り組みを行っています。特定の ARIA 属性に関するリクエストがある場合は、[お知らせください。

カスタムアプリケーションに属性を追加したら、「アクセシビリティ」アイコン

でいつでも編集および更新できます。このアイコンは、属性を接続した要素に自動的に追加されます。

属性名	カテゴリー	トークン
tabindex		0, -1
role		token: according to definition in primitive
aria-level		int
aria-live	Live	token: polite, assertive
aria-multiline	詳細	true, false
aria-multiselectable	詳細	true, false
aria-pressed	都道府県	true, false
aria-relevant	Live	token: all, additions, removals, text
aria-activedescendant	Relationships	ID_REF
aria-atomic	Live	true, false
aria-autocomplete	詳細	true, false
aria-controls	Relationships	ID_REF
aria-current	都道府県	step, page, true, false
aria-describedby	Relationships	ID_REF (space separated items)
aria-expanded		true, false
aria-haspopup	Relationships	dialog, menu, true, false
aria-hidden		true, false
aria-invalid	都道府県	true, false
aria-label		string
aria-labelledby	Relationships	ID_REF (space separated items)

こんにちは、さん