表示サンプル： このページの修正箇所は次のように表示されます。
HTMLのフォーム・コントロール及びリンク
これは、次の達成基準に関連する実装方法である：
この実装方法の目的は、インタラクティブなユーザーインターフェイスを構成する要素のキーボード操作及び支援技術との相互運用性を提供するために、標準的なHTMLのフォーム・コントロール及びリンク要素を用いることである。
ユーザーエージェントは、HTMLのフォーム・コントロール及びリンクのキーボード操作を提供している。さらに、ユーザーエージェントは、フォーム・コントロール及びリンクを、アクセシビリティAPIに結び付けている。支援技術は、アクセシビリティAPIを利用して、役割（Role）、識別名（Name）、状態（State）、値（Value）といった適切なアクセシビリティ情報を抽出し、それらをユーザーに提供している。役割はHTMLの要素によって提供され、名前はその要素に関連付けられているテキストによって提供される。値及び状態が適切な要素は、複合的なメカニズムを通じて、それらの値及び状態も支援技術に提示している。
必須の属性を通じてテキストがすでにコントロールと関連付けられている場合もある。たとえば、送信ボタンは、button要素内のテキスト又は画像の「alt」属性を識別名として用いている。フォーム・コントロールの場合は、label要素又は「title」属性が用いられる。次の表は、HTMLのフォーム・コントロール及びリンクの役割、識別名、値、状態がどのように決定されるかを示したものである。
| HTML要素 | 役割 （Role） | 識別名 （Name） | 値 （Value） | 状態 （State） |
|---|---|---|---|---|
| <a> | リンク |
<a>要素のtitle属性、画像リンクの場合はalt属性。テキストと画像の alt属性を両方が提供されている場合は、両者を結合する。 | href属性 | |
| <button> | プッシュボタン | <button>要素内のテキスト又はtitle属性 | ||
| <fieldset> | グループ化 | <legend> 要素 | ||
| <input type = "button", "submit", or "reset"> | プッシュボタン | value属性 | ||
| <input type = "image"> | プッシュボタン | alt属性又はtitle属性 | ||
| <input type = "text"> | 編集可能なテキスト | そのコントロールに関連付けられた<label>要素又はtitle属性 | value属性 | |
| <input type = "password"> | 編集可能なテキスト | そのコントロールに関連付けられた<label>要素又はtitle属性 | ||
| <input type="checkbox"> | チェックボックス | そのコントロールに関連付けられた<label>要素又はtitle属性 | checked属性 | |
| <input type="radio"> | ラジオボタン | そのコントロールに関連付けられた<label>要素又はtitle属性 | checked属性 | |
| <select> | コンボボックス、リスト、又はドロップダウンリスト | そのコントロールに関連付けられた<label>要素又はtitle属性 | <option>要素のselected属性で「selected」と指定 | |
| <textarea> | 編集可能なテキスト | そのコントロールに関連付けられた<label>要素又はtitle属性 | <textarea>要素内のテキスト |
ユーザーエージェントは、リンクに移動したり、リンクを選択するメカニズムを提供する。次の各事例では、「リンク」という役割（Role）が<a href>で与えられている。<a name>は「リンク」という役割を与えない点に注意しよう。値（Value）に該当するのは、href属性のURIである。
事例 1aでは、識別名はリンクの中にあるテキストである。この場合は「サイト例」が該当する。
コード例：
<a href="www.example.com">サイト例</a>
リンクの中にある画像に関する事例 1bでは、画像のalt属性が識別名（Name）を提供している。例えば、Microsoft Inspect ObjectsなどのようにAPIを閲覧するツールには、alt属性を可視化できないものもあるが、支援技術では抽出できる。
コード例：
<a href="www.example.com"><img src="example_logo.gif" alt="例"></a>
事例 1cでは、識別名（Name）が「テキスト例」となるように、リンクの中にある異なる要素が組み合わされている。
コード例
<a href="www.example.com">テキスト<img src="example_logo.gif" alt="例"></a>
HTMLでは、ボタンを生成するのにさまざまな方法があるが、それらは全て「プッシュボタン」という役割（Role）に位置付けられる。
事例 2aでは、button要素内の「保存」というテキストが識別名（Name）となる。値（Value）はない。
コード例：
<button>保存</button>
事例 2bでは、value属性を用いて「保存」「送信」「リセット」という識別名（Name）を指定している。
コード例
<input type="button" value="保存" />
<input type="submit" value="送信" />
<input type="reset" value="リセット" />
事例 2cでは、alt属性を用いて「保存」という識別名（Name）を指定している。
コード例：
<input type="image" src="save.gif" alt="保存" />
事例 2dでは、alt属性ではなく、title属性を用いて「保存」という識別名（Name）を指定している。
コード例
<input type="image" src="save.gif" title="保存" />
事例 2eでは、input要素のalt属性を用いて「保存」という識別名（Name）を指定している。title属性は指定していない。【訳注：コード例と矛盾しているので、WCAGワーキンググループに確認中。】
コード例：
<input type="image" src="save.gif" alt="保存" title="保存" />
事例 3aでは、入力フィールドが「編集可能テキスト」という役割（Role）を持っている。label要素のfor属性が、input要素のid属性を参照することで、label要素をinput要素と関連付けている。input要素の識別名（Name）は、label要素で指定した「果物の種類」となる。値（Value）は、value属性の「バナナ」となる。
コード例：
<label for="text_1">果物の種類</label>
<input id="text_1" type="text" value="バナナ">
事例 3bでは、入力フィールドが事例 3aと同じ役割（Role）[ここから削除] と値（Value）[削除ここまで]を持つが、[ここから追加] 値（Value）がなく、[追加ここまで]識別名（Name）をtitle属性で指定している点が異なる。
コード例：
<input id="text_1" type="text" [ここから削除] value="バナナ" [削除ここまで]title="果物の種類">
事例 4は、input要素のtype属性から「チェックボックス」という役割（Role）を持っている。label要素のfor属性がinput要素のid属性を参照することで、label要素をinput要素と関連付けている。input要素の識別名（Name）は、label要素で指定した「チーズ」となる。状態（State）はchecked属性で「チェックあり」又は「チェックなし」に設定できる。そのコントロールに対するユーザーのインタラクションによって、状態（State）が変更される。
コード例：
<label for="cb_1">チーズ</label>
<input id="cb_1" type="checkbox" checked="checked">
事例 5は、input要素のtype属性から「ラジオボタン」という役割（Role）を持っている。input要素の識別名（Name）は、label要素から与えられる。状態（State）は、checked属性によって「チェックあり」又は「チェックなし」に設定できる。状態（State）は、ユーザーが変更できる。
コード例：
<input type="radio" name="color" id="r1" checked="checked"/><label for="r1">赤</label>
<input type="radio" name="color" id="r2" /><label for="r2">青</label>
<input type="radio" name="color" id="r3" /><label for="r3">緑</label>
事例 6aは、select要素によって「コンボボックス」という役割（Role）を持っている。識別名（Name）は「数量」で、label要素から与えられている。select要素に識別名を付け忘れるのは、よくあるエラーの一つである。値（Value）は、selected属性[ここから変更] （XHTMLでは値を "selected" と指定）のある[変更ここまで]option要素であり、初期値は「2個」ということになる。
コード例：
<label for="s1">数量</label>
<select id="s1" size="1">
<option>1個</option>
<option selected="selected">2個</option>
<option>3個</option>
</select>
事例 6bでは、事例 6aのselect要素と同じ識別名（Name）、役割（Role）、値（Value）であるが、識別名をtitle属性で指定している点が異なる。この方法は、ラベルを視覚的に表示しないほうがよい場合に用いることができる。
コード例
<select id="s1" title="数量" size="1">
<option>1個</option>
<option selected="selected">2個</option>
<option>3個</option>
</select>
事例 7aは、textarea要素の「編集可能なテキスト」という役割（Role）を持っている。識別名（Name）は、label要素で指定した「あなたの発言をここに入力」である。値（Value）は、textarea要素内にある「87年前」である。
コード例：
<label for="ta_1">あなたの発言をここに入力</label>
<textarea id="ta_1" >87年前</textarea>
[ここから変更] 事例 7bは、同じ役割（Role）を持ち、識別名（Name）はtitle属性を用いて指定していて、値（Value）は空である。[変更ここまで]
コード例：
<textarea id="ta_1" title="あなたの発言をここに入力" >87年前</textarea>
事例 8のラジオボタンのフィールドセットには「グループ化」という役割（Role）がある。識別名（Name）はlegend要素によって与えられている。
コード例：
<fieldset>
<legend>色を選択：</legend>
<input id="red" type="radio" name="color" value="red" /><label for="red">赤</label><br />
<input id="blue" type="radio" name="color" value="blue" /><label for="blue">青</label><br />
<input id="green" type="radio" name="color" value="green" /><label for="green">緑</label>
</fieldset>
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
HTMLのソースコードを調べる。
リンク及びフォーム要素に対して、上記の表で示されているように、識別名（Name）、値（Value）、状態（State）が指定されている。
上記2.を満たしている。
注意： この実装方法が「達成基準を満たすことのできる実装方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの実装方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の実装方法によってその達成基準が満たされていることもありうる。
日本語訳における注記：
この文書の正式版は、W3Cサイトで公開されている英語の文書であり、この日本語訳には誤訳が含まれていることもありえます。なお、文中にある「日本語訳における注記」は、W3Cの原文にはないものであり、日本語訳監修者が追記したものです。