Usability and accessibility
Design that excludes some cannot be “usable”. Here, I collect my preferred resources on specific (web) design tasks, with a strong focus on accessibility.
- Accessibility statements: The accessibility statement is an important part of a website, to give guidance, signal commitment and under certain circumstances even a legal requirement.
- Alt texts: So called alt-texts (alternative text) are the default means to make visual content accessible in a descriptive format. But using them correctly is not an easy, and for sure not precise, science.
- Cards: "Cards", areas of multiple elements wrapped as a clickable link area, are a standard component in most website designs. To ensure them to be usable for all actually requires careful implementation.
- Code highlighting: As soon as we want to make it look good, sharing program code on the web requires a bit of consideration for inclusiveness.
- Colors and contrast: Sufficient contrast between content and background is one of the most basic, yet still commonly ignored, accessibility features of any design.
- Drag-n-drop: Making a UI drag-and-drop, i.e. enabling moving around items with a mouse or by touch, inevitably leads to the need for alternative forms of interaction for non-keyboard users etc.
- Footnotes: Adding footnotes to an HTML document is anything but straightforward. As the standard astonishingly lacks a dedicated tag for this staple of academic writing, finding a usable and accessible design is tricky.
- Invisible content: Sometimes we want to hide content on websites, either visually or completely, for a variety of reasons. Getting it right is important, as hiding things with CSS can have an accessibility impact.
- Modals and popups: Opening modal windows on a webpage easily throws off assistive technology. Luckily, lightweight and accessible options exist to ensure good UX for everybody.
- Motion: While moving elements may enrich UX for some, they can be a burden or even outright dangerous to others; careful consideration needs to be taken when animating parts of a design.
- Skip links: An important feature for users navigating the web using their keyboard, designing "skip links" is not as straightfoward as one may think.
- Statistics on a11y: Statistics on disabilities, as well as on accessibility issues, are valuable for shaping advocacy messages.
- Tools: This category collects "accessibility tools" – for assessing and testing, but also for creating more accessible experiences.
- Visualizations: Commonly based on advanced visual representations, the accessibility of (interactive) information and data visualizations is often very limited. A growing community aims to tackle these limitations by developing and showcasing best practices.
- Web components: Web components are a popular technique to build encapsulated HTML building blocks. To make them universally accessible, they have to be carefully designed.