Skip to main content

Maintaining Accessibility

There are several things we keep in mind when conceiving, designing and developing a new feature:

Keyboard Navigation

Users should be able to use the Tab, Enter, Esc, arrows and other keys to navigate and operate a page without using a mouse or other such pointer device.

  • Can every control or interactive element (form input, buttons, links) be reached by tabbing, and used or activated with a keyboard?
  • Is it clear which element has current focus?
  • If content is hidden from view, is it also hidden from tabbing? Does showing the content make it reachable by tabbing?
  • If a dialog or modal is opened, is focus trapped within the dialog while it is open? Can all of its interactive elements be tabbed to and interacted with by the keyboard? Does the Esc key close the dialog?

Screen Readers

Screen readers are software that process content and convert it to other forms, such as text-to-speech and Braille.

  • Is content hidden visually also hidden from screen readers?
  • Is content that is only decoration hidden from screen readers?
  • Are there alternatives for screen readers when information is presented in a non-text visual way?
  • Are there available instructions when it might not be clear how to operate something without a pointer device?
  • Is an action label read out only once (for instance, for an icon button, is only the button accessible to screen readers, and not both the button and the icon)?
  • Do form elements have clearly associated labels?
  • Are screen readers alerted to non-standard uses of form elements, such as checkboxes, that cause actions without the presence of a submit button?
    • Is a change in content caused by such an action called out by the screen reader?

Visual and Other Concerns

  • Is the contrast in color between text and its background sufficient?
  • When content is toggled open or closed, is the change absolutely clear? Is it clear what the new content is and why it changed?
  • Is content organized with clear, hierarchical headings that fit a logical document outline?
  • Can video, or audio or animation associated with it, be suppressed if the user needs to suppress it? Are there text alternatives to video and audio?

P.S. Regarding the unofficial Accessible Icon in the decorative image attached to this article: It originated as a street-art project and has taken on a controversial life of its own. Atlas Obscura chronicles the history of this accessibility icon and its predecessors, revealing interesting facts, such as the first such icon's depiction of a headless person.