Skip to content

UX & accessibility

Design accessible journeys from navigation to completion

Accessibility concerns using a site with keyboards, screen readers, enlarged text and different visual or motor conditions. Plan it in the design and verify real tasks, using WCAG as a reference framework.

Give content meaningful structure

Use descriptive headings, coherent hierarchy and links with understandable destinations. Match lists and tables to the information they contain.

Preserve logical reading order across layouts and larger text. Provide useful alternatives for informative images without unnecessary descriptions of decoration.

Support navigation without a mouse

Make menus, links, buttons and viewers keyboard usable with visible focus. Follow a complete task to check understandable order and avoid trapping users.

Plan opening, closing and focus return for dialogs. Hover-only actions also need consideration for keyboard and touch use.

Check readability under different conditions

Check contrast and communicate meaning through more than colour alone. Use clear status labels, readable type and comfortable spacing.

Test light and dark themes, enlarged text and small screens. One successful layout does not establish that every condition remains usable.

Explain actions, errors and outcomes

Give fields identifiable labels and actionable errors while preserving useful entered data. A red border alone may not communicate the issue.

Plan asynchronous waiting, success and failure messages. Choose appropriate captions, transcripts or structured documents for the information conveyed by media.

Maintain testing through product changes

Combine automated tools, manual journeys and relevant assistive-technology feedback. Prioritise findings and verify corrections; a score is not a complete conformity determination.

New content and components can reintroduce barriers. Establish applicable requirements with responsible contacts and include checks in ongoing design and acceptance.

Your checklist

  • Check headings and reading order.
  • Complete tasks with the keyboard.
  • Test contrast, zoom and themes.
  • Prepare labels, errors and media alternatives.
  • Retest changes and corrections.

Frequently asked questions

Is an automated checker sufficient?

No. It detects some issues, while reading order, comprehension and task completion also need suitable testing.

Must improvements wait for a redesign?

No. Targeted fixes to headings, contrast, keyboard use and forms can improve existing journeys.

A project to explore

Jibril.me

Jibril.me’s reading journeys across devices illustrate why legibility, navigation and content interactions deserve careful design.

Explore the project

Further reading

Put your plans into practice.

Tell us about your needs and constraints. Together, we will define a useful first step.

Let’s talk