Day 98: ARIA and Assistive Technology

For the last few days, I've been learning more about Accessibility and how to make sure everyone can access your website despite any limitations. In order to make your website accessible, some of the most important things are:

  1. Properly structuring the HTML and using semantic HTML

    • Using the right HTML tags for their correct purpose allows screen readers to draw user attention to specific elements as needed. For example, for a button, a button tag should be used and not a div.
  2. Use ARIA tags when appropriate to tag functionality to help assistive services

    • There's certain semantics that HTML can't express on it's own. That's where ARIA or Accessible Rich Internet Applications comes in.
    • It works by allowing you to specify attributes to an element, that changes the way information about that element is translated by assistive technology
    • If you have some information that is dynamically changing on your website, a screen reader has trouble reporting constantly updating content. You can add aria-live label to your changing element, which will then inform screenreader users. An example of this would be a clock on a website.
  3. Reviewing contrast between colours is also important to ensure maximum readability