Our must-haves criteria

  • Web
  • Mobile
  • Beginner

Introduction #

You may have noticed that we now offer 3 new must-haves criteria checklists to help you start your journey towards accessible production.

This idea emerged when we realized that, far too often, we detected many non-conformities during the final audit period or accessibility declaration, even though these issues could have been avoided earlier without the need for experts on the subject.

To assist projects in improving their products from the design phase, during development, and without waiting for an expert's verdict, we started creating a testing grid that anyone could execute without expertise and with very few tools.

These checklists are aimed at various contributor profiles on a project during the design, build, or run phases.

Without further ado, here are our checklists:

Why These Criteria? #

We have defined 11 criteria, categorized by themes for your convenience. Why 11? To remind you of the 11 in the numeral a11y, of course!

Some WCAG criteria are not always easy to understand or test, so to avoid frustration, we ensured that each criterion is easy to test.

Note that these criteria will not fully make your product accessible, but no doubt that they are essential to achieve that goal.

Common Criteria for Web and Mobile #

  • Provide titles for each screen
  • Text alternatives for images
  • Sufficient text contrast
  • Color must not be the only source of information
  • Keyboard navigation
  • Form field names
  • Relevant error messages

Specific Web Criteria #

  • Provide headings for sections
  • Indicate the primary language
  • Control of animations
  • Responsive display

Specific Mobile Criteria #

  • Text increase
  • Touch target size
  • Portrait and landscape orientation
  • Screen reader output

How to Use the Checklists? #

We present each criterion in 3 parts:

  • Procedure: what you need to do with the code inspector or the proposed tool
  • Check: what you need to verify
  • Results: what you need to observe

Expert tip #

Some criteria are easily implementable and testable in web and mobile page templates or mockups.

For example:

  • Document language
  • Page title
  • Colors and contrasts
  • Keyboard navigation and focus visibility

Conclusion #

We're counting on you to use these checklists at the start of each project, and then regularly throughout the project, to ensure no regression.

This is just the first step, and you must not stop there. Once these criteria are understood and integrated, it will then be possible to focus on other accessibility criteria to further enhance the quality of the developed products.