Accessibility is the practice of designing so that people with disabilities can have equal access to information and functionality, applicable to both websites as well as physical environments.
In keeping with the IndieWeb principles that "UX and design is more important than protocols, formats, data models, schema etc.", it's important to make sure that one's site is inclusively "human readable" by as many people as possible.
While designers may create for themselves in pristine and ideal environments, readers using other devices/hardware in harsher environments or who may have various visual, auditory, or other deficits may not be able to access their content easily or at all.
Remember to consider people with blindness, low vision, and color-blindness.
Color and Contrast
Kevin Marks has written an interesting article on How the Web Became Unreadable which discusses some interesting accessibility issues which covers even average users having difficulty seeing material on websites.
The article includes some interesting examples and tools which may help others:
- Color and Contrast chart
- Lea Verou's Contrast Ratio tool
- Color Contrast Checker
- Contrast Rebellion gives some great motivation why contrast is important
When making the contrast of text and other visual elements lower, designers need to consider the experience of the following:
- elderly users or those with bad vision
- low quality monitors
- bad lighting and glare
- reading on tiny screens
Auditory / Hearing
Remember those who are hard-of-hearing or deaf.
Remember those with the inability to use a mouse, slow response time, limited fine motor control or even those with "fat fingers" using small mobile interfaces.
Remember those with earning disabilities, distractibility, inability to remember or focus on large amounts of information.
Some research indicates that custom fonts can be of help those who suffer from reading issues that include dyslexia.
Remember those with disabilities when setting up event spaces.
- This is something that came to mind while planning IWC Bellingham and some of the event space is not wheelchair accessible. I'm researching and considering how to best advertise that clearly to potential attendees. gRegor Morrill
- Appears to be primarily software-related, but haven't gone through all the links yet
- https://twitter.com/ellenfromnowon/status/846010218404306946 Ellen Murray's Twitter thread about accessibility information disabled people are looking for on event websites
Below is a list of useful resources to turn to when considering web accessibility:
- W3C's Web Accessibility Initiative
- Web Accessibility in Mind
- Accessibility Club
- Wikipedia on Accessibility
- Totally: An accessibility visualization toolkit
Several IndieWebCamps and even HWC meetings have included material and discussions on accessibility that could be transplanted onto this page.
- 2018-01-08 : How Do I Increase Accessibility? (archived) in which the community is asked for general advice surrounding accessible blog mark-up, and provides in the comments!
- A List Apart On Alt Text, great discussion of cases in the comments.
- Accessibility and Contrast Bookmarklet
- Userway.org helpful accessibility plugins that work without refactoring your website's existing code and will increase compliance with WCAG 2.0, ATAG 2.0, ADA, & Section 508 requirements.
- There is software to simulate colour blindness that will help in picking palettes where colour differences are a required design element (e.g. in graphs). For macOS the free and open-source Sim Daltonism is very easy to use.
- https://tenon.io - helpful checking tool
- http://pa11y.org/ - accessibility checking tool
- https://www.funkify.org/ - Fantastic accessibility checker & simulator
- Scott Jehl shares some simple CSS to disable animations for visitors that do not want those
- Smashing TV: Léonie Watson on why semantic HTML document landmarks assist her using a screenreader - 5 min intro on how screenreaders present pages
- Ethan Marcotte on The Web We Broke