Testing baseline accessibility of documents

Last updated on October 29, 2020

There are numerous excellent contrast checkers available online that allow you to quickly test color contrast compliance with the Web Content Accessibility Guidelines (WCAG) as set forth by the World Wide Web Consortium (W3C). Given that OCN works with a lot with printed material, we have looked to apply this process to a mocked-up A4 document outline to let users play around with colours and text sizes to provide a visual representation of what an A4 page will look like using the given settings.

Once settings are in place, you can generate a report based on these that checks the colour contrast of background, text and links against WCAG recommendations, As the science of colour contrast for the web and print is not exactly comparable, we are using WCAG to provide a point of reference when it comes to ‘passing’ or ‘failing’ these recommendations.

We hope that this can provide a ‘quick and dirty’ tool to test various combinations out with user groups. The tool is current hosted on Codepen.

Screenshot of a Codepen demo

You can adjust colours and font sizes to check out baseline accessibility for documents.