Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

4 Required Tests Before Shipping New Features

Stephanie Eckles shares 4 quick checks you should make before pushing to production.

1. Almost 85% of homepages have text contrast issues – so check your colour contrast. Stephanie lists some automated tools that can detect these issues.
   • Use ButtonBuddy to choose accessible colours for your buttons and their focus states. For the text, background colour, and transition between focus states, there are five con trast considerations you’ll need to make!
2. Next consider keyboard interaction – here’s a handy set of rules, which I’ve copied directly from the article:
   • If it opens something, it may need to close with Escape.
   • If it’s scrollable, it needs to respond to Up/Down arrow keys.
   • If it’s a group of related options (like autocomplete or tabs), it may need to respond to Up/Down or Left/Right arrow keys (search phrase: roving tabindex).
   • If it opens a dialog/modal, it needs to prevent tab access with elements outside of that experience (search phrases: “trapping focus” and “inert”).
   • If it’s interactive at all, it needs to be able to gain keyboard focus, and that focus needs to have a visible style.
   • If a sighted mouse user can explore and make independent selections (like in an autocomplete), a keyboard user needs to be able to as well. This likely means allowing a combination of tab, arrow keys, and Enter to explore and then make a selection.
   • If a :hover triggers content, then so should :focus (ex. menus). You will also need a way to close this content, whether that’s a tap/click outside or Escape key, and ensure that the method you choose is also accessible for touchscreen users.
3. All focusable elements must have visible styles.
4. WCAG SC 1.4.10 Reflow stipulates that your design should be able to accommodate a zoom of up to 400% on desktop. Watch out for sticky navigation, ‘contained scroll’ areas becoming cut-off, or overflows that cut off content.

Prefer longer newsletters? You can subscribe to week11y, fortnight11y or even month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.