diff --git a/content/about/coverage-and-quality/coverage-and-quality-report.html b/content/about/coverage-and-quality/coverage-and-quality-report.html index 95f9be26..ca59a873 100644 --- a/content/about/coverage-and-quality/coverage-and-quality-report.html +++ b/content/about/coverage-and-quality/coverage-and-quality-report.html @@ -54,8 +54,8 @@

About These Reports

diff --git a/content/patterns/radio/examples/radio-activedescendant.html b/content/patterns/radio/examples/radio-activedescendant.html index bc88302e..b08c627a 100644 --- a/content/patterns/radio/examples/radio-activedescendant.html +++ b/content/patterns/radio/examples/radio-activedescendant.html @@ -3,7 +3,7 @@ - Radio Group Example Using aria-activedescendant + <code>aria-activedescendant</code> を使用したラジオグループの例 @@ -25,90 +25,90 @@
-

Radio Group Example Using aria-activedescendant

+

aria-activedescendant を使用したラジオグループの例

+
-

About This Example

+

この例について

- This example implements the features of the Radio Group Pattern for two radio groups -- one for choosing a pizza crust and another for choosing a delivery method. - This implementation uses aria-activedescendant for informing assistive technologies which radio button has visual focus. + この例は、ピザの生地を選択するラジオグループと、配達方法を選択するラジオグループの 2 つのラジオグループに対して、ラジオグループ・パターンの機能がどのように実装されているかを示しています。 + この実装では、aria-activedescendant を使用して、どのラジオボタンが視覚的にフォーカスされているかを支援技術に通知します。

-

Similar examples include:

+

類似の例は次のとおりです。

-

Example

+

- +
-

Pizza Crust

+

ピザの生地

    - - - + + +
-

Pizza Delivery

+

ピザの配達

    - - - + + +
- +
-

Accessibility Features

+

アクセシビリティ機能

-

Keyboard Support

+

キーボードのサポート

- NOTE: When visual focus is on a radio button in the radio group, DOM focus remains on the radio group container and the value of aria-activedescendant on the radio group refers to the radio button that is visually indicated as focused. - Where the following descriptions of keyboard commands mention focus, they are referring to the visual focus indicator, not DOM focus. - For more information about this focus management technique, see - Managing Focus in Composites Using aria-activedescendant. + 注: ラジオグループ内のラジオボタンに視覚的なフォーカスがある場合、DOM フォーカスはラジオグループ・コンテナに留まり、ラジオグループの aria-activedescendant の値は、視覚的にフォーカスされているとして示されているラジオボタンを参照します。 + 以下のキーボード・コマンドの説明でフォーカスに言及している場合、それらは視覚的なフォーカス・インジケータを指しており、DOM フォーカスではありません。 + このフォーカス管理テクニックの詳細については、aria-activedescendant を使用した複合要素のフォーカス管理を参照してください。

- - + + @@ -116,38 +116,38 @@

Keyboard Support

- + - + - + @@ -156,14 +156,14 @@

Keyboard Support

-

Role, Property, State, and Tabindex Attributes

+

ロール、プロパティ、ステート、及び tabindex 属性

KeyFunctionキー機能
Tab
    -
  • Moves focus to the checked radio button in the radiogroup.
  • -
  • If a radio button is not checked, focus moves to the first radio button in the group.
  • +
  • radiogroup 内のチェックされた radio ボタンにフォーカスを移動します。
  • +
  • radio ボタンがチェックされていない場合、フォーカスはグループの最初の radio ボタンに移動します。
Spaceスペース
    -
  • If the radio button with focus is not checked, changes the state to checked.
  • -
  • Otherwise, does nothing.
  • -
  • Note: The state where a radio is not checked only occurs on page load.
  • +
  • フォーカスのある radio ボタンがチェックされていない場合、状態を checked に変更します。
  • +
  • それ以外の場合、何も行いません。
  • +
  • 注: ラジオがチェックされていない状態は、ページ・ロード時にのみ発生します。
Down arrow
Right arrow
下矢印
右矢印
    -
  • Moves focus to and checks the next radio button in the group.
  • -
  • If focus is on the last radio button, moves focus to the first radio button.
  • -
  • The state of the previously checked radio button is changed to unchecked.
  • +
  • グループ内の次の radio ボタンにフォーカスを移動し、チェックします。
  • +
  • フォーカスが最後の radio ボタンにある場合、フォーカスを最初の radio ボタンに移動します。
  • +
  • 以前にチェックされていたラジオボタンの状態はチェック解除に変更されます。
Up arrow
Left arrow
上矢印
左矢印
    -
  • Moves focus to and checks the previous radio button in the group.
  • -
  • If focus is on the first radio button, moves focus to and checks the last radio button.
  • -
  • The state of the previously checked radio button is changed to unchecked.
  • +
  • グループ内の前の radio ボタンにフォーカスを移動し、チェックします。
  • +
  • フォーカスが最初の radio ボタンにある場合、フォーカスを最後の radio ボタンに移動し、チェックします。
  • +
  • 以前にチェックされていたラジオボタンの状態はチェック解除に変更されます。
- - - - + + + + @@ -171,37 +171,36 @@

Role, Property, State, and Tabindex Attributes

- + - + - + - + @@ -212,8 +211,8 @@

Role, Property, State, and Tabindex Attributes

@@ -223,9 +222,9 @@

Role, Property, State, and Tabindex Attributes

@@ -235,9 +234,9 @@

Role, Property, State, and Tabindex Attributes

@@ -246,8 +245,8 @@

Role, Property, State, and Tabindex Attributes

-

Assistive Technology Support

-

Learn how to interpret and use assistive technology support data

+

支援技術のサポート

+

支援技術のサポート・データの解釈と使用方法を学ぶ

RoleAttributesElementUsageロール属性要素使用法
radiogroup ulIdentifies the element as a container for a group of radio buttons.要素を radio ボタンのグループのコンテナとして識別します。
aria-labelledby="[IDREF]" ulRefers to the element that contains the label of the radio group.ラジオグループのラベルを含む要素を参照します。
tabindex="0"tabindex="0" ul
    -
  • Includes the radio group in the page Tab sequence.
  • -
  • Applied to the radio group because aria--activedescendant is used to manage focus as described below.
  • +
  • ラジオグループをページの Tab 順序に含めます。
  • +
  • 以下で説明するように、フォーカスを管理するために aria--activedescendant が使用されるため、ラジオグループに適用されます。
aria-activedescendant="[IDREF]"aria-activedescendant="[IDREF]" ul
    -
  • When a radio button in the radio group is visually indicated as having keyboard focus, refers to that radio button.
  • -
  • When arrow keys are pressed, the JavaScript changes the value.
  • -
  • Enables assistive technologies to know which element the application regards as focused while DOM focus remains on the radio group element.
  • +
  • ラジオグループ内のラジオボタンが視覚的にキーボード・フォーカスを持っているとして示されている場合、そのラジオボタンを参照します。
  • +
  • 矢印キーが押されると、JavaScript が値を変更します。
  • +
  • DOM フォーカスがラジオグループ要素に留まっている間、アプリケーションがどの要素をフォーカスしていると見なしているかを支援技術が知ることを可能にします。
  • - For more information about this focus management technique, see - Managing Focus in Composites Using aria-activedescendant. + このフォーカス管理テクニックの詳細については、aria-activedescendant を使用した複合要素のフォーカス管理を参照してください。
li
    -
  • Identifies the element as an ARIA radio button.
  • -
  • The accessible name is computed from the child text content of the element.
  • +
  • 要素を ARIA radio ボタンとして識別します。
  • +
  • アクセシブルな名前は要素の子テキスト・コンテンツから計算されます。
li
    -
  • Identifies radio buttons which are not checked.
  • -
  • CSS attribute selectors (e.g. [aria-checked="false"]) are used to synchronize the visual states with the value of the aria-checked attribute.
  • -
  • The CSS ::before pseudo-element is used to indicate visual state of unchecked radio buttons to support high contrast settings in operating systems and browsers.
  • +
  • チェックされていない radio ボタンを識別します。
  • +
  • CSS 属性セレクタ (例: [aria-checked="false"]) は、視覚的な状態を aria-checked 属性の値と同期するために使用されます。
  • +
  • CSS の ::before 擬似要素は、オペレーティング・システム及びブラウザのハイコントラスト設定をサポートするために、チェックされていないラジオボタンの視覚的な状態を示すために使用されます。
li
    -
  • Identifies the radio button which is checked.
  • -
  • CSS attribute selectors (e.g. [aria-checked="true"]) are used to synchronize the visual states with the value of the aria-checked attribute.
  • -
  • The CSS ::before pseudo-element is used to indicate visual state of checked radio buttons to support high contrast settings in operating systems and browsers.
  • +
  • チェックされている radio ボタンを識別します。
  • +
  • CSS 属性セレクタ (例: [aria-checked="true"]) は、視覚的な状態を aria-checked 属性の値と同期するために使用されます。
  • +
  • CSS の ::before 擬似要素は、オペレーティング・システム及びブラウザのハイコントラスト設定をサポートするために、チェックされているラジオボタンの視覚的な状態を示すために使用されます。