Stop 06 · Design Collaboration & UXTopics · 7/10

Accessibility Basics

In short

Accessibility means people with low vision, shaky hands or a noisy bus ride can still use your product. Build it in early and it costs very little.

Designing so people with visual, motor, auditory or cognitive differences can use a product — covering color contrast, keyboard navigation, screen-reader support and clear labeling.

The purple blob pushes a luggage trolley up a gentle ramp next to some stairs.

Think of it like this

The ramp beside the stairs

A ramp at the station is built for wheelchair users. Then you notice who else uses it: parents with prams, porters with trolleys, you with a heavy suitcase. Design for those who need it most and almost everyone benefits.

Watch it happen

Four checks from the WCAG guidelines

Accessible

Perceivable

Operable

Understandable

Works with tools

Alt text, contrast

Keyboard works

1/5WCAG, the common web accessibility standard, groups its rules under four ideas, often shortened to POUR.

The big ideas

What you need to know

Contrast matters

Light grey text on white looks elegant and fails many readers. Check contrast with a free tool.

Keyboard and screen readers

Some people never use a mouse. Every action must be reachable by Tab and Enter.

Never colour alone

Red-only errors fail colour-blind users. Add an icon or text too.

Put it in acceptance criteria

Make accessibility part of done, not a separate project after launch.

Save yourself the pain

Common mistakes

Oops

Planning an accessibility fix-up sprint after launch.

Do this instead

Add simple checks to every story's acceptance criteria from the start.

Oops

Assuming few of your users have a disability.

Do this instead

Many people have temporary or situational limits too, like a broken arm or bright sunlight.

Your mission

Try your app without a mouse

~25 min

Quick check

A form shows invalid fields only by turning their border red. Who is most likely to miss the error?

Go deeper

1Try navigating a familiar website using only a keyboard, no mouse.
2Learn the basics of WCAG contrast ratio requirements.
3Understand why accessibility is often a legal requirement, not just a nice-to-have.