...
be provided with a form label for each form control
be able to use the up/down ↑/↓ or left/right ←/→ arrow keys on the keyboard to navigate between radio buttons
be able to use the up/down ↑/↓ or left/right ←/→ arrow keys on the keyboard to select an option
be able to use the TAB key on the keyboard to move to the next form element
...
be able to explicitly associate the text forms labels with their respective form control
be provided with a <fieldset> that groups multiple form control options
be provided with a "legend" that describes the group of form controls
When the radio button has keyboard focus:
The the screen reader should announce the form label.
...
Markup and Code
| Code Block | ||
|---|---|---|
| ||
<fieldset> <legend>Choose<legend>Select ayour shipping methodoption:</legend> <input id="overnight" type="radio" name="shipping" value="overnight"> <label for="overnight">Overnight</label><br> <input id="twoday" type="radio" name="shipping" value="twoday"> <label for="twoday">Two day</label><br> <input id="ground" type="radio" name="shipping" value="ground"> <label for="ground">Ground</label> </fieldset> |
...