-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Checkbox Patternの日本語化 #137
base: waic-main
Are you sure you want to change the base?
Changes from all commits
6c7f412
1c8bec2
d06687a
fea0816
ca5205e
d7d31d3
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
@@ -1,9 +1,9 @@ | ||||||
<!DOCTYPE html> | ||||||
<html lang="en"> | ||||||
<html lang="ja"> | ||||||
<head> | ||||||
<meta charset="UTF-8"> | ||||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"> | ||||||
<title>Checkbox Pattern</title> | ||||||
<title>チェックボックス パターン</title> | ||||||
|
||||||
<!-- Core JS and CSS shared by all patterns --> | ||||||
<link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/2016/base.css"> | ||||||
|
@@ -14,61 +14,62 @@ | |||||
</head> | ||||||
<body> | ||||||
<main> | ||||||
<h1>Checkbox Pattern</h1> | ||||||
<h1>チェックボックス パターン</h1> | ||||||
<!-- 翻訳元リビジョン: https://github.com/w3c/aria-practices/tree/d6cf9d8db772603a456e7d7ef52e409d39124301 --> | ||||||
|
||||||
<section id="about"> | ||||||
<h2>About This Pattern</h2> | ||||||
<p>WAI-ARIA supports two types of <a href="#checkbox" class="role-reference">checkbox</a> widgets: dual-state checkboxes toggle between two choices -- checked and not checked -- and tri-state checkboxes, which allow an additional third state known as partially checked.</p> | ||||||
<h2>このパターンについて</h2> | ||||||
<p>WAI-ARIA は、2種類の <a href="#checkbox" class="role-reference">チェックボックス</a> ウィジェットをサポートしています:二つの状態のチェックボックスは、--チェック済みとチェック済みでない--の2つの選択肢を切り替えるもので、三つの状態のチェックボックスは、これに加えて「部分的にチェックされた」という第三の状態を許容するものです。</p> | ||||||
<p> | ||||||
One common use of a tri-state checkbox can be found in software installers where a single tri-state checkbox is used to represent and control the state of an entire group of install options. | ||||||
And, each option in the group can be individually turned on or off with a dual state checkbox. | ||||||
三つの状態のチェックボックスの一般的な使用方法の1つは、ソフトウェアのインストーラです。三つの状態のチェックボックスがインストールオプションのグループ全体の状態を表し、制御するために使用されます。 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 原文は1文ですね。
Suggested change
|
||||||
そして、グループ内の各オプションは、二つの状態のチェックボックスで個別にオン又はオフにすることができます。 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
</p> | ||||||
<ul> | ||||||
<li>If all options in the group are checked, the overall state is represented by the tri-state checkbox displaying as checked.</li> | ||||||
<li>If some of the options in the group are checked, the overall state is represented with the tri-state checkbox displaying as partially checked.</li> | ||||||
<li>If none of the options in the group are checked, the overall state of the group is represented with the tri-state checkbox displaying as not checked.</li> | ||||||
<li>グループ内のすべてのオプションがチェックされている場合、全体の状態は、三つの状態のチェックボックスがチェックされることで表現されます。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. displaying as checked は「チェック状態として表示」くらいですかね
Suggested change
|
||||||
<li>グループ内の一部のオプションがチェックされている場合、全体の状態は、三つの状態のチェックボックスの一部がチェックされることで表現されます。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. partially checkedを「部分的にチェック」としたので
Suggested change
|
||||||
<li>グループ内のオプションが1つもチェックされていない場合、全体の状態は、三つの状態のチェックボックスがチェックされていないことで表現されます。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
</ul> | ||||||
<p>The user can use the tri-state checkbox to change all options in the group with a single action:</p> | ||||||
<p>ユーザーは、三つの状態のチェックボックスを使用して、グループ内のすべてのオプションを1つのアクションで変更することができます:</p> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. an action ではなく a single action となっていて単一であることが強調されているので、その辺のニュアンスは出したいかもです。
Suggested change
|
||||||
<ul> | ||||||
<li>Checking the overall checkbox checks all options in the group.</li> | ||||||
<li>Unchecking the overall checkbox will uncheck all options in the group.</li> | ||||||
<li>全体のチェックボックスをチェックすると、グループ内のすべてのオプションがチェックされます。</li> | ||||||
<li>全体のチェックボックスのチェックを外すと、グループ内のすべてのオプションのチェックが外れます。</li> | ||||||
<li> | ||||||
And, In some implementations, the system may remember which options were checked the last time the overall status was partially checked. | ||||||
If this feature is provided, activating the overall checkbox a third time recreates that partially checked state where only some options in the group are checked. | ||||||
そして、一部の実装では、最後にどのオプションがチェックされていたかを記憶する場合があります。 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. "the last time" はこの文脈では「前回」としたほうがいいですね。
Suggested change
|
||||||
この機能が提供されている場合、全体のチェックボックスを3回目に作動させると、グループ内の一部のオプションのみがチェックされている状態が再現されます。 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. ここのthird timeは「3回目」ではなく「3回」ですね。
Suggested change
|
||||||
</li> | ||||||
</ul> | ||||||
</section> | ||||||
|
||||||
<section id="examples"> | ||||||
<h2>Examples</h2> | ||||||
<h2>例</h2> | ||||||
<ul> | ||||||
<li><a href="examples/checkbox.html">Checkbox (Two-State) Example</a>: Demonstrates a simple 2-state checkbox.</li> | ||||||
<li><a href="examples/checkbox-mixed.html">Checkbox (Mixed-State) Example</a>: Demonstrates a checkbox that uses the mixed value for aria-checked to reflect and control checked states within a group of two-state HTML checkboxes contained in an HTML <code>fieldset</code>.</li> | ||||||
<li><a href="examples/checkbox.html">チェックボックス(二つの状態)の例</a>:シンプルな二つの状態のチェックボックスのデモンストレーションです。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
<li><a href="examples/checkbox-mixed.html">チェックボックス(三つの状態)の例</a> :HTML <code>fieldset</code> 内に含まれる二つの状態の HTML チェックボックスのグループ内のチェック状態を反映し制御するために、aria-checked の混合値を使用するチェックボックスのデモンストレーションです。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. mixed valueは aria-checked="mixed" という指定のことを指しているので、そのままmixedで良いかと。「aria-checked に mixed を指定」というくらいでしょうか。
Suggested change
|
||||||
</ul> | ||||||
</section> | ||||||
|
||||||
<section id="keyboard_interaction"> | ||||||
<h2>Keyboard Interaction</h2> | ||||||
<p>When the checkbox has focus, pressing the <kbd>Space</kbd> key changes the state of the checkbox.</p> | ||||||
<h2>キーボードの操作</h2> | ||||||
<p>チェックボックスにフォーカスがあるとき、<kbd>Space</kbd> キーを押すとチェックボックスの状態が変わります。</p> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 以下 "the checkbox" の the を訳出すべきかどうか悩ましいですね。 かといって「このチェックボックス」とするのも変な気がしますね。 |
||||||
</section> | ||||||
|
||||||
<section id="roles_states_properties"> | ||||||
<h2>WAI-ARIA Roles, States, and Properties</h2> | ||||||
<h2>WAI-ARIAのロール、ステート、及びプロパティ</h2> | ||||||
<ul> | ||||||
<li>The checkbox has role <a href="#checkbox" class="role-reference">checkbox</a>.</li> | ||||||
<li>チェックボックスには <a href="#checkbox" class="role-reference">checkbox</a> ロールがあります。</li> | ||||||
<li> | ||||||
The checkbox has an accessible label provided by one of the following: | ||||||
チェックボックスには、以下のいずれかによってアクセシブルなラベルが提供されています: | ||||||
<ul> | ||||||
<li>Visible text content contained within the element with role <code>checkbox</code>.</li> | ||||||
<li>A visible label referenced by the value of <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> set on the element with role <code>checkbox</code>.</li> | ||||||
<li><a href="#aria-label" class="property-reference">aria-label</a> set on the element with role <code>checkbox</code>.</li> | ||||||
<li><code>checkbox</code> ロールを持つ要素内に含まれる表示可能なテキストコンテンツ。</li> | ||||||
<li><code>checkbox</code> ロールを持つ要素に設定された <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> の値によって参照される表示可能なラベル。</li> | ||||||
<li><code>checkbox</code> ロールを持つ要素に設定された <a href="#aria-label" class="property-reference">aria-label</a> 。</li> | ||||||
</ul> | ||||||
</li> | ||||||
<li>When checked, the checkbox element has state <a href="#aria-checked" class="state-reference">aria-checked</a> set to <code>true</code>.</li> | ||||||
<li>When not checked, it has state <a href="#aria-checked" class="state-reference">aria-checked</a> set to <code>false</code>.</li> | ||||||
<li>When partially checked, it has state <a href="#aria-checked" class="state-reference">aria-checked</a> set to <code>mixed</code>.</li> | ||||||
<li>If a set of checkboxes is presented as a logical group with a visible label, the checkboxes are included in an element with role <a href="#group" class="role-reference">group</a> that has the property <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> set to the ID of the element containing the label.</li> | ||||||
<li>If the presentation includes additional descriptive static text relevant to a checkbox or checkbox group, the checkbox or checkbox group has the property <a href="#aria-describedby" class="property-reference">aria-describedby</a> set to the ID of the element containing the description.</li> | ||||||
<li>チェックされている場合、チェックボックス要素の状態は <a href="#aria-checked" class="state-reference">aria-checked</a> が <code>true</code> に設定されています。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. この state は ARIA のロール、ステート、プロパティのうちのステートですね。WCAGのほうでは「状態 (state)」としているやつです。ARIA側ではどうしてましたっけ。カタカナ「ステート」?
Suggested change
|
||||||
<li>チェックされていない場合、状態は <a href="#aria-checked" class="state-reference">aria-checked</a> が <code>false</code> に設定されています。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
<li>一部チェックされている場合、状態は二つの状態 <a href="#aria-checked" class="state-reference">aria-checked</a> が <code>mixed</code> に設定されています。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
<li>チェックボックスが論理的なグループとして表示可能なラベルとともに提示される場合、チェックボックスは、ラベルを含む要素のIDに設定されたプロパティ <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> を持つ <a href="#group" class="role-reference">group</a> ロールの要素に含まれています。</li> | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 冒頭の a set of の訳が落ちているようです。「一連の」くらい?
Suggested change
|
||||||
<li>チェックボックスまたはチェックボックスのグループに関連する静的な補足の説明テキストを表示させる場合、チェックボックスまたはチェックボックスのグループには、その説明テキストを含む要素のIDと関連づいた <a href="#aria-describedby" class="property-reference">aria-describedby</a> プロパティを設定します。</li> | ||||||
</ul> | ||||||
</section> | ||||||
</main> | ||||||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"dual-state" "tri-state" はハイフンで結合された単語なので、日本語でもうまく結合した感じに訳したいですね。「二状態」「二元」あたり? MDNの日本語訳を見ると「3 状態チェックボックス」のように言っているようです。
https://developer.mozilla.org/ja/docs/Web/API/Element/ariaChecked#mixed
partially checkedは以降でも何度も出てきますが、訳がだいぶ揺れているのでしっかり統一したいです。
Apple の HIG の日本語版だと「部分的にオン」と言ってますね。これに揃えるなら「部分的にチェック」?
https://developer.apple.com/jp/design/human-interface-guidelines/toggles
ダッシュはhyphen minusではなくem dashを使った方が良いと思います。
こう?