This is a checklist to be used to gain an overview of accessibility in a project. Additional information for each item will be found in our Accessibility guidelines.
Specify a language in the <html> element.
Use the ARIA role to increase the ability to navigate with screen readers and assistant technology. You can receive warnings when validate your HTML5 but still it´s necessary to use landmark roles in a lot of cases.
Global menu / page header.
Primary navigation for example the global menu, local menu and footer.
The page's main content. May only be used once per page.
Article, puff or similar.
Related content of the article or the main content.
Contains information about the document (meta info, copyright, company info, etc).
Role search should be for example in a
<div> in conjunction with
Enable accesskeys to quickly navigate on the page.
Follow the guidelines for HTML5 and use a logical structure and hierarchy of headings.
All links will have a distinctly focus state. Distinguishable links It should be easy to distinguish the links from other content.
All images that are important for the user should have descriptive
<img alt="..."> text.
Font icons should have a descriptive text and screen readers will not read out the icon itself.
Logical order of form elements, navigate with tab to the test your device. Labels for input and select elements
<select>, etc. must have a
<label> attached to it.
Content that is loaded dynamically must be made clear to users with for example
The contrast between text and background should at least meet WCAG 2 AA Compliant. Test the contrast with our Contrast checker.
Zoom is not disabled.
Try using only the keyboard to navigate and test with a screen reader such as VoiceOver, ChromeVox or Jaws.
WCAG 2.1 (optional)
Optional goals from WCAG 2.1 - First Public Working Draft, that we belive is good for the users and hope to be standard soon.
Increases zoom requirements to 400% without horizontal scroll. Usually by browser zoom and requires web page to reflow to a single column with responsive design.
We believe that voice will become more common as input and therefore we build stuff that not break normal speech software interaction with the site.
A minimun of 44 x 44px targets on mobile for finger targets and 24 x 24px for mouse, and stylus targets.
Do not rely on a screen orientation. All content sholud work regardless of diffrent screen orientation.