OLD | NEW |
1 <h1>Accessibility (a11y)</h1> | 1 <h1>Accessibility (a11y)</h1> |
2 | 2 |
3 | 3 |
4 <p> | 4 <p> |
5 When you design an extension, | 5 When you design an extension, |
6 try to make it as accessible as possible | 6 try to make it as accessible as possible |
7 to people with disabilities such as | 7 to people with disabilities such as |
8 visual impairment, hearing loss, and limited dexterity. | 8 visual impairment, hearing loss, and limited dexterity. |
9 </p> | 9 </p> |
10 | 10 |
(...skipping 285 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
296 <a href="http://dev.aol.com/dhtml_style_guide">guidelines for keyboard shortcuts
</a>. | 296 <a href="http://dev.aol.com/dhtml_style_guide">guidelines for keyboard shortcuts
</a>. |
297 </p> | 297 </p> |
298 | 298 |
299 <p> | 299 <p> |
300 A good way to ensure discoverability of keyboard shortcuts | 300 A good way to ensure discoverability of keyboard shortcuts |
301 is to list them somewhere. | 301 is to list them somewhere. |
302 {{?is_apps}} | 302 {{?is_apps}} |
303 Your application's options page | 303 Your application's options page |
304 {{:is_apps}} | 304 {{:is_apps}} |
305 Your extension's | 305 Your extension's |
306 <a href="options.html">Options page</a> | 306 <a href="options">Options page</a> |
307 {{/is_apps}} | 307 {{/is_apps}} |
308 might be a good place to do this. | 308 might be a good place to do this. |
309 </p> | 309 </p> |
310 | 310 |
311 <p> | 311 <p> |
312 For the example toolbar, | 312 For the example toolbar, |
313 a simple JavaScript keyboard handler could look like the following. | 313 a simple JavaScript keyboard handler could look like the following. |
314 Note how the ARIA property <code>aria-activedescendant</code> | 314 Note how the ARIA property <code>aria-activedescendant</code> |
315 is updated in response to user input | 315 is updated in response to user input |
316 to reflect the current active toolbar button. | 316 to reflect the current active toolbar button. |
(...skipping 143 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
460 <a href="http://www.webaim.org/techniques/alttext/">WebAIM article on appropriat
e alt text</a>. | 460 <a href="http://www.webaim.org/techniques/alttext/">WebAIM article on appropriat
e alt text</a>. |
461 | 461 |
462 <h2 id="examples">Examples</h2> | 462 <h2 id="examples">Examples</h2> |
463 | 463 |
464 <p> | 464 <p> |
465 For an example that implements keyboard navigation and ARIA properties, see | 465 For an example that implements keyboard navigation and ARIA properties, see |
466 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news_a11y/">examples/extensions/news_a11y</a> | 466 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news_a11y/">examples/extensions/news_a11y</a> |
467 (compare it to | 467 (compare it to |
468 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news/">examples/extensions/news</a>). | 468 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news/">examples/extensions/news</a>). |
469 For more examples and for help in viewing the source code, | 469 For more examples and for help in viewing the source code, |
470 see <a href="samples.html">Samples</a>. | 470 see <a href="sampleshtml">Samples</a>. |
OLD | NEW |