Accessible Content refers to content that is available to all users, emphasising the inclusion and involvement of individuals with disabilities to ensure their access to your material. Several factors influence how people navigate content, including:
Colour
Contrast ratio
Typography (ie. text)
Infographic, image and chart design
Writing style and layout
How does colour impact accessibility?
How does colour impact accessibility?
Relying too heavily on visual formatting such as colour alone excludes anyone who is colour blind or unable to see the screen. Don’t rely on colour alone to convey information. Include text, audio or other methods of communication.
What is the contrast ratio and how does it impact accessibility?
What is the contrast ratio and how does it impact accessibility?
Contrast ratio is the ratio of the luminance of the brightest shade to that of the darkest shade, this can apply to text and its background or the brightest and darkest shades of an image or graph. A high contrast ratio is a desired aspect of any display. WCAG recommends a 7:1 contrast ratio for users with vision loss equating to 20/80 vision, but 3:1 for large text since large print with wider character strokes is much easier to read at low contrast.
How do I make sure my typography is accessible?
How do I make sure my typography is accessible?
Consider font and size. Roboto is an accessible font and using 14-16pt for body copy is advisable. Smaller text should never be less than 10pt.
Avoid using images of text as this can cause issues for screen readers, use an actual text field instead. Informative text on an image needs to be captured in alt text. In most scenarios, if you can’t highlight the text with your mouse, it can’t be read by a screen reader.
Avoid writing in all caps. The use of all capital letters makes reading more challenging for some, including people with dyslexia.
How do I ensure my images and infographics are accessible?
How do I ensure my images and infographics are accessible?
Include alt text - screen readers “read” images via alternative text which is added in the code or CMS. It’s easy to add alt text, simply right-click on the image, select “alt text” and write a description of the image. You can do the same for charts or infographics. You do not need to add alt text to ornamental images, only to informative ones.
Make sure that the colours are distinguishable when viewed in greyscale.
How can I check to see if there is alt text on my images/infographics?
How can I check to see if there is alt text on my images/infographics?
Hover over the image and the alt text should appear. Alternatively, right-click and select Inspect to view the HTML.
What can I do to make my PDFs accessible?
What can I do to make my PDFs accessible?
PDFs are not very accessible in general, so avoid them if possible. If you do need to use PDFs you can use tagging or remediation software to mark them up.
How do I ensure my writing is accessible?
How do I ensure my writing is accessible?
Use text to convey critical information.
Avoid overfilling the page and if using different media types (text, image, animation) ensure there is a balance between them.
Avoid embedding - use a text asset or field rather than an image of text.
What is best practice for making sure my videos are accessible?
What is best practice for making sure my videos are accessible?
Make sure your videos incorporate closed captions.