Skip to content

Instantly share code, notes, and snippets.

@corinneling

corinneling/a11y-checklist.md

Last active May 21, 2018 17:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save corinneling/a550df3859565e8ad4375b411a81060b to your computer and use it in GitHub Desktop.
Save corinneling/a550df3859565e8ad4375b411a81060b to your computer and use it in GitHub Desktop.
Download ZIP
Accessibility Checklist for Testing Your Site
Raw
a11y-checklist.md

Site Accessibility

Reviewed Page

Visual

Check item of it is meets standards and/or content is still readable

  • Check color contrast with Color Ratio & Colorable

    • Primary Color: [Hex Code] [Score] [Smallest font size that uses this color]

    • Secondary Color: #7d7de6 3.53 AA Large 16px

  • Check color blindness with Funkify

  • Check if color is used to convey information, if so use additional design such as icons

  • Font weight

    • All headers are bold [Font name] [Font weight]

    • Paragraphs are 400+ font weight Montserrat 500

  • Basic browser testing

    • IE 9+

    • Safari

    • Firefox

    • Chrome

    • Edge

  • Tab test

    • Each link has a focus state

    • Each item can be accessed using Tab

    • Each applicable item can be interacted with using Enter

    • There is a skip to main content link

Screen Reader

WIP

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment