バージョン

アクセシビリティ準拠 (igHierarchicalGrid)

このトピックの内容

このトピックは、以下のセクションで構成されます。

igHierarchicalGrid 第 508 条の遵守の概要

すべての Ignite UI for jQuery™ コントロールおよびコンポーネントは、1973 年リハビリテーション法第 508 条第 1194 部 22 条を遵守しています。「第 508 条の遵守内容」という項に示す表は、コントロールについて第 1194 項第 22 節に規定されている個々の規則を列挙し、グリッド コントロールにおける各規則の遵守方法の詳細をまとめたものです。

各アクセシビリティ規則の要件を満たすためには、コントロールのプロパティについてインタラクティブな設定操作が必要とされる場合もありますが、コントロールがプロパティを自動的に設定する場合もあります。

注: jQuery コントロールはクライアント専用のため、一部の規則はサポートされておらず、制限として扱います。

第 508 条の遵守内容

規則 規則を遵守する方法
(a) あらゆる非テキスト要素に対してテキスト相当物を提供するものとします(つまり、「alt」、「longdesc」を介して、または要素コンテンツで)。
(b) マルチメディア プレゼンテーションに相当する代替物をプレゼンテーションと同期するものとします。
(d) コントロールのマークアップは、クライアント側のコントロールであり、CSS の規則に依存するため、関連付けられたスタイル シートがなしで読み取り可能です。
(g) 行と列のヘッダーはデータ テーブルで識別しなければなりません。
(h) マークアップは、行または列のヘッダーの 2 つ以上の論理レベルを有するデータ テーブル用にデータ セルとヘッダー セルを関連づけるために使用します。
(n) igHierarchicalGrid コントロールは、ページのタブ列に加えられ、マウス クリックなどによってフォーカスを獲得します。キーボードでナビゲートできるように、選択が有効になっている必要があります。
  • 左矢印 -- あるセルが選択されているときにこのコマンドを使用すると、ひとつ前のセルが選択された状態になります。
  • 右矢印 -- あるセルが選択されているときにこのコマンドを使用すると、次のセルが選択された状態になります。
  • 上矢印 -- ひとつ前の行にある行/セルが選択された状態になります。
  • 下矢印 -- 次の行にある行/セルが選択された状態になります。
  • Shift + 上矢印または下矢印 -- 複数選択時に上 (または下) の行/列を選択範囲に加えます。
  • Ctrl + 上矢印または下矢印 -- 現在アクティブな行/列を変更します。
  • Shift + Enter -- 現在選択されている行/セルを選択解除します。

WAI-ARIA サポート

2014 年に W3C は WAI-ARIA 仕様 を完成しました。障害を持つユーザーに Web コンテンツおよび Web アプリケーションへのアクセシビリティを提供するデザインを定義したものです。igHierarchicalGrid のデザインはこのガイドラインに準拠します。

以下のリストは、WAI-ARIA をサポートするための igHierarchicalGrid の変更点の詳細を提供します。この変更は、デフォルトですべて有効にされることに注意してください。

  • igHierarchicalGrid のすべての要素が igGrid の tabindex オプションからの相対値を持つ tabindex 属性を描画します。TAB および SHIFT+TAB キーの使用で要素へアクセスできます。
  • igHierarchicalGrid は grid role を使用します。
  • 各ヘッダー要素は、列のヘッダー テキストに設定された aria-label 属性を使用します。title 属性がある場合、title 属性の値の代わりにヘッダー テキストが読み込まれます。
  • すべての列ヘッダーは columnheader role を使用します。
  • thead、tbody、および tfoot 要素は rowgroup role を使用します。
  • 行は row role を使用します。
  • 行セレクター要素は rowheader role を使用します。
  • 表の本体の行内の表のセル要素は gridcell role を使用します。
  • 表の本体の行内の表のセル要素は aria-describedby 属性を使用します。その属性の値は、表のセルに属する列に対応する columnheader 要素の id に設定されます。
  • 表の本体の行での表セル要素は、選択機能が有効な場合、aria-selected 属性を使用します。構成で行が初期化で選択される場合以外、aria-selected のデフォルト値は false です。
  • 選択機能が有効な場合、表は aria-multiselectable 属性を使用します。この属性の値は、選択機能の multipleSelection オプションの値に基づいて設定されます。
  • チェックボックスは checkbox role および aria-checked 属性を使用します。また、チェックボックスは aria-title 属性を使用します。この属性の値は関連する列ヘッダーに対応します。
  • 表の本体の展開可能な行セル要素は aria-expanded 属性を使用します。値は展開状態に対応します。

オンラインで表示: GitHub