Howdy! This blog post provides a short and crisp overview of accessibility (design) particularly as it applies to web standards. Accessibility is a topic that has been mentioned many times in recent entries, so it’s time to dig a bit deeper. The purpose of the entry is mainly to refer to existing standards, to have the possibility to retrieve direct links at any time. So let’s start.
As we heard before accessibility refers to the design of the environment so that it can also be used and perceived by people with impairments without additional assistance. Accessible design focuses on the outcome or end result of a design project. It’s based on accessibility guidelines published by various governmental and industry groups, which aim to make sure people with disabilities can access websites and other digital products effectively.
In terms of web accessibility, an important metric is the WCAG (Web Content Accessibility Guidelines) standards by W3C. WCAG are developed through the W3C process in collaboration with individuals and organizations around the world. The goal is to create a single common standard for web content accessibility that meets the needs of individuals, organizations, and governments internationally.
WCAG documents explain how to make web content more accessible to people with disabilities.
‘Web content’ generally refers to the information on a web page or in a web application, including: Natural information (text / images / sounds) and Code or markup (defining structure, presentation, etc.)
There are two editions of the specifications, each of which extends over several pages and describes individual cases in detail. Since it makes little sense to copy the content to this blog post, I hereby refer to the two versions for further readings:
Web Content Accessibility Guidelines (WCAG) 2.0; W3C Recommendation 11 December 2008:
https://www.w3.org/TR/WCAG20/
Web Content Accessibility Guidelines (WCAG) 2.1; W3C Recommendation 05 June 2018:
https://www.w3.org/TR/WCAG21/
Another useful guide is provided by WUHCAG — Web accessibility for developers, which also builds on the WCAG standards. However it is structures as a checklist with different accessibility criteria levels. Thus it makes a good starting point to adapt or start accessibility on websites.
https://www.wuhcag.com/wcag-checklist/
Nevertheless, I want to provide the most important points from the Guideline 2.1. which are divided into four basic principles for accessible web content.
Perceivable
- Provide text alternatives for non-text content.
- Provide captions and other alternatives for multimedia.
- Create content that can be presented in different ways, including by assistive technologies, without losing meaning.
- Make it easier for users to see and hear content.
Operable
- Make all functionality available from a keyboard.
- Give users enough time to read and use content.
- Do not use content that causes seizures or physical reactions.
- Help users navigate and find content.
- Make it easier to use inputs other than keyboard.
Understandable
- Make text readable and understandable.
- Make content appear and operate in predictable ways.
- Help users avoid and correct mistakes.
Robust
- Maximize compatibility with current and future user tools.
Each of these different principles have a success rating of either A, AA, or AAA. An A rating is the minimum requirement for having an accessible site and AAA is the gold standard of accessibility.
The Web-Zugänglichkeit-Gesetz (WZG) is the country-specific accessibility law in Austria, which builds on the WCAG standards.
Accessibility is a team effort between designers, developers, copywriters, and content creators. To create an accessible end product, everyone must work together and design with the guidelines in mind. Thus to establish an holistic approach of UX, accessibility needs to be one of the pillars on which it is built.
Especially the discipline of Interaction Design indicates potential for creative design approaches of accessible products. Be it high-tech glasses that you wear to see or navigate, be it a smart way to hide your hearing aid, be it a flexible interface design for different user groups, etc.
Sources:
https://www.behance.net/gallery/134331461/Accessibility-Redesign-Maxim?tracking_source=search_projects_recommended%7Caccessibility%20ux
https://www.ris.bka.gv.at/GeltendeFassung.wxe?Abfrage=Bundesnormen&Gesetzesnummer=20010727
https://www.w3.org/TR/WCAG21/
https://www.w3.org/TR/WCAG20/
https://de.wikipedia.org/wiki/Barrierefreiheit
https://siteimprove.com/de-de/barrierefreiheit/checker-fuer-digitale-barrierefreiheit-wcag/?utm_campaign=dach_fy20_ppc_accessibility&utm_source=google&utm_medium=ppc&utm_content=wcag&utm_term=wcag%20w3c&campaign_id=11124962525&ad_group_id=110140008158&ad_id=524505898076&match_type=e&target=kwd-635041431331&gclid=CjwKCAiAlrSPBhBaEiwAuLSDUAPZv0S-5s0rebzzUH8GkRadA1ETVrYNc7EFOTty8epQ2xeClh9evxoChIEQAvD_BwE
https://uxplanet.org/a-primer-to-web-accessibility-for-designers-2c548448c612
https://www.behance.net/gallery/102184455/Teman-Netra-%28ver-10%29-App-for-the-Visually-Impaired?tracking_source=search_projects_recommended%7Caccessibility%20ux
https://www.behance.net/gallery/79659409/LIBRANDO?tracking_source=search_projects_recommended%7Caccessibility%20design
https://www.behance.net/gallery/132043961/Axces-Accessible-Door-Handle?tracking_source=search_projects_recommended%7Caccessibility%20design
