Red Hound

 

UGLY but Functional Test Site

Not A Real Button

Test Heading ARIA Level Two

#a11y

Need to Fix:

NVDA goes through all the links in the Twitter feed before the rest of the content, and this is a big headache. Fix this.

Current Accessibility References

Adobe Mega Menu

CSSMojo Progressive Ehnancement Articles

Focus on WordPress Accessibility

a11y WordPress Tickets

Tickets with a focus on Accessibility

I simply do not get it.

Why does tabbing work backwards, but not forwards? This affects accessibility in a big way....

Ticket #27642

Boostrap Image Handling

Image of a dog used to test Bootstrap Hover states

Bootstrap Progress Bar

Source: Bootstrap Progress Bars

40% Complete

Bootstrap Labels

Default Label Primary Label Success Label Info Label Warning Label Danger Label

Modified Bootstrap Labels

Default Label Class btn-red

Source:Accessible Lightboxes

More Information:Smashing Magazine--Making Modal Windows Better for Everyone

Requirements

  • Make sure there is a logical, predictable tabbing order that matches the visual order.
  • Focusable elements (links and form controls) need to have obvious visual feedback so users can see where keyboard focus is. Do not use outline:0 in your CSS unless you add an adequate replacement. It’s incredibly frustrating when you get no visual feedback whatsoever.
  • Do not use JavaScript to trap keyboard focus, like in an input field. If you can get in, make sure you can get out.
  • Make sure all functionality and information is accessible without using a mouse. If you open a dialog or lightbox, put keyboard focus in it. If you show information on hover, also display it on focus. If you add click events to random elements that aren’t natively focusable, make them focusable by giving them a tabindex attribute (via scripting).
...