| 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 |