accessible practices overview
[ synopsis for apps and resources ]
This document has an overview of accessibility links from the resources page. Additionally, it contains direct links for accessible web applications in design. This list has sources I reference within my own practice as a freelance graphic designer.
Being disabled, I get the diverse requirements within the disabled community. I value accessibility for all. In order for this list to meet all needs, I would appreciate your input!
If you would like to suggest links or resources click here to get in touch. Or, if you find anything listed here to be harmful or misleading, please reach out.
overview of external links
- Guide to WCAG (source = Kai Prince & Jessica Oddi):
A simple step-by-step breakdown of the Web Content Accessibility Guidelines (WCAG) 2.1.
- a11y stands for ACCESSIBILITY (source = The A11y Project):
A community effort to make accessibility easy. Resources, courses, and guides.
- Do’s and Dont’s on Designing for Accessibility (source = Karwai Pun — Home Office Digital):
A guide from the UK government on designing for disabilities. It ranges from users who are autistic, blind/low vision, D(d)eaf/HoH, low motor functions, and dyslexic.
- Tips for Making Social Media More Accessible (source = Ryerson University):
A guide to create alt text, image descriptions, and closed captions for videos o social media. This resource also has tips for language, GIFs, emojis, and camel case hashtags.
- Guides for Alt Text, Image/Audio Descriptions, and More (source = Veronica With Four Eyes):
Guides on low vision accessibility. It includes help on writing alt text and image descriptions. Examples even get specific for photojournalism photos, product photography, and more. This link goes to the low vision category. I recommend viewing their entire blog archive — particularly the blog on audio descriptions.
- WebAIM – Contrast Checker (source = Web Accessibility in Mind):
A helpful tool to check the contrast ratio of two colours. Note: this is not a pass/fail scenario to determine if a colour is 100% accessible; it’s only a tool for contrast. Making colours accessible needs to account for other disabilities (e.g., sensory issues).
- Coblis — Color Blindness Simulator (source = Colblindor):
A tool to see how images look with various levels of colour blindness.
- Hemingway Editor (source = Adam & Ben Long):
Text editor that makes writing bold and clear. Provides suggestions to make sure text is readable and understandable.
more accessible resources
The following links are guides or tools I reference when designing accessible websites:
- Web Content Accessibility Guidelines (WCAG) 2.1 (source = W3C):
A wide range of recommendations for making Web content more accessible.
- Web Accessibility Checker (source = AChecker):
This tool checks single HTML pages for conformance with accessibility standards to ensure the content can be accessed by everyone.
- WordPress Accessibility Coding Standards (source = WordPress):
Resource for WordPress accessibility guidelines in development.
- One Click Accessibility WordPress Plugin (source = One Click Accessibility):
Plugin for an accessible toolbar. It can change the font size, colour, contrast, background, links, and select a readable font. It is currently on my own website.
- Wix Website Accessibility (source = Wix):
Wix accessibility practices.
- Squarespace Accessibility (source = Squarespace):
Guide for making Squarespace websites more accessible.