Designing for Accessibility

Digital products are made to be operated by all people but we designers still don’t address and ensure all users have equal access to any digital product.

Universal Accessibility

Accessibility

LEFT: Seen by color blind | RIGHT: Normal people

Why Web Accessibility

Principles of Accessibility

  • Perceivable: All information and user interface components on any given website must be available in ways all individuals can perceive.
  • Operable: All navigation and user interface components on any given website must be operable for all individuals.
  • Robust: All content on any given website must be robust enough that user agents, including assistive technologies, can interpret it.
  • Understandable: All information and user interface operation must be clearly understandable for all users.

Accessibility Checklist

Include text alternatives for visual content:

Retain text hierarchy:

Using live text not flattened:

Choose decent colors:

Convey information not just color alone:

Use labels or instructions with form fields and inputs:

Add alt text to all of your images:

  • Within the <alt> attribute of the image element.
  • Within context or surroundings of the image itself.

Enable keyboard navigation:

Conclusion

References

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store