Difference between revisions of "Accessibility 101"
(Created page with "These are the things you need to know to get started. * [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/?utm_content=buffer40247&utm_medium=social&utm_sour...") |
|||
| Line 1: | Line 1: | ||
[[Category: Accessibility]] | |||
These are the things you need to know to get started. | These are the things you need to know to get started. | ||
Revision as of 14:19, 11 February 2019
These are the things you need to know to get started.
- The Web Accessibility Basics by Marco's Accessibility Blog
- Getting Started with Web Accessibility by Monika Piotrowicz at The Pastry Box.
- Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for people on the autism spectrum, people using screen readers or with low vision, people with physical or motor disabilities, [Deafness | people who are deaf or hard of hearing]], and people with dyslexia.
- Designing for Inclusivity: How and Why to Get Started by Allison Shaw at the Invision Design Blog
Design considerations
14 easy ways to make your website more accessible by Carl Cahill and Joss Cook cover:
- Remember alt text
- Consider animations carefully
- Think about other languages (especially around line heights)
- Keep the writing straightforward
- Use simple colors and shapes
- Empower the user
- Offer multiple options
- Offer customizations
- Think about tab order
- Don't forget about bots
- Get the right line length and amount of text
- Avoid anxiety-inducing prompts
- Add in verifications and checks
- Confirm the end of a user journey
It is not coincidental that these are all usability concerns as well.
Developer considerations
Common Accessibility Mistakes and How To Avoid Them by Ben Robertson outlines four of his own principles for developing accessible websites.
- Web Design is more than graphic design
- Be ASAP: As Semantic As Possible
- Websites should look good naked
- Talk to your computer (Use ARIA attributes)
It also outlines common accessibility mistakes:
- Missing page titles
- Poor heading structure
- Link text should tell where or what a user is clicking on
- Inputs missing a <label>
- CSS Grid / Flexbox: visual reordering sets a mismatch between logical ordering and visual ordering
- Missing or poor alt attributes for images
- Removing focus outlines
- Missing keyboard functionality
- Hiding things the wrong way
Paint the Picture, Not the Frame: How Browsers Provide Everything Users Need by Eric Bailey on A List Apart outlines some major browser functionality that is sometimes recreated by developers, such as a scroll-to-top pattern, scrollbar designs, scrolling, highlighting, text resizing, high-contrast themes, moving the focus, the clipboard, and browser history, that really probably shouldn't be messed with unless you're going to be incredibly thorough and consider a wide array of inclusive use cases.