An accessible site can be used by someone with poor eyesight, someone who navigates only with a keyboard, someone who listens to the page with a screen reader, or someone looking at their phone in bright sunlight. Accessibility therefore concerns many more people than you might first think, and most fixes make the site more comfortable for everyone.
The internationally accepted guideline is WCAG (Web Content Accessibility Guidelines), which organises into checkable criteria what makes a site accessible. The criteria are grouped around four principles, so a site has to be perceivable, operable, understandable and robust.
WCAG describes three levels of conformance, and level AA is the usual target, because it covers the most important barriers and can be reached with a reasonable amount of work on an average website.
What we pay attention to in design
- The contrast between text and background is strong enough
- Every function can be reached with a keyboard too, with a visible focus indicator
- Images have a descriptive alternative text, and decorative elements have none
- Form fields have a visible label, and error messages say what the problem is
- Information is not carried by colour alone, so a red field also gets text or an icon
People using screen readers find their way around a page by its headings, so the order and level of the headings matter too. On a well-structured page the headings on their own outline the content, which also helps other visitors get a quick overview.
These criteria take the least work at the start of the design. We check the contrast of a colour palette while shaping the style, and we design focus states and error messages as part of the design system, so the developer does not have to invent them later.
On an existing site a targeted review shows where the biggest barriers are. Some fixes affect the design and some the code, so we hand over the findings in a way that makes it clear to your developer what needs doing.
An accessible site is also easier for search engines to understand, because well-structured headings and image descriptions help them find their way around the content as well.
