hfaerber/Refactor-tractor-Fit-lit

Fix Accessibility Issues

Opened this issue · 1 comments

Background and foreground colors do not have a sufficient contrast ratio.
The yellow color we're using is now getting flagged in the accessibility audit.

- h2.date
- p.subtext
- p.subtext
- p.subtext
- p.subtext

Html element does not have a lang attribute

Some elements have a [tabindex] value greater than 0

Items to manually check
- The page has a logical tab order
- Interactive controls are keyboard focusable

  • Interactive elements indicate their purpose and state
    - The user's focus is directed to new content added to the page
    - User focus is not accidentally trapped in a region
  • Custom controls have associated labels
  • Custom controls have ARIA roles
    - Visual order on the page follows DOM order
  • Offscreen content is hidden from assistive technology
    - Headings don't skip levels
  • HTML5 landmark elements are used to improve navigation

We will need to examine the tab order once the post form is merged to ensure the user is able to tab through and doesn't get stuck in the process.