User Tools

Site Tools


dev:angular_dev_best_practices

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
dev:angular_dev_best_practices [2019/01/22 10:12]
erickson [Unit Tests]
dev:angular_dev_best_practices [2019/05/13 13:24] (current)
sandbergja Adding some a11y considerations
Line 24: Line 24:
     * <label for="​patron-name"​ i18n>​Name</​label><​input id="​patron-name"​ .../>     * <label for="​patron-name"​ i18n>​Name</​label><​input id="​patron-name"​ .../>
     * Beware repeatable components have unique form input IDs (extend id with incrementor,​ random(), etc.)     * Beware repeatable components have unique form input IDs (extend id with incrementor,​ random(), etc.)
-  * Give images, buttons, ​etcmeaningful title attributes ​+  ​* Give buttons meaningful title or aria-label attributes 
 +  ​* Give images ​meaningful alt attributes (alt=""​ is okay for decorative or redundant images; see the [[https://​www.w3.org/​WAI/​tutorials/​images/​decision-tree/​|W3C decision tree for alt text]]) 
 +  * Test keyboard navigation with tabshift+tab, arrow keys, and other keys as appropriate. Make sure that all buttons, ​links, and other interactive elements are focusable. 
 +    * The [[https://​www.w3.org/​TR/​wai-aria-practices-1.1/​|WAI-Aria Authoring Practices]] may help you determine the appropriate keyboard interactions for more complex widgets 
 +    * Don't add Bootstrap'​s "​btn"​ class to unfocusable elements, like <​span>​s,​ <​label>​s,​ or <a>s that don't also have a "​href"​ attribute. ​ Use a tag that is already focusable instead, like <​button>​ or <a> with a "​href"​ attribute.
  
  
dev/angular_dev_best_practices.txt · Last modified: 2019/05/13 13:24 by sandbergja

© 2008-2017 GPLS and others. Evergreen is open source software, freely licensed under GNU GPLv2 or later.
The Evergreen Project is a member of Software Freedom Conservancy.