Skip to content
Design Academy My progress

Stage 9 · Lesson 12 of 12

Common accessibility failures and how to fix them

The problems that appear on almost every site.

  • Intermediate
  • 30 min
  • 3 check questions
  • Exercise: 30 min

By the end of this lesson you can

  • Recognise the most common accessibility failures.
  • Explain who each failure affects and how to fix it.
  • Build a quick check for designs.

The idea

WebAIM's yearly analysis of the top one million home pages finds the same failures again and again. The most common:

  1. Low contrast text: affects people with low vision and anyone in bright light.
  2. Missing alt text: blind people miss image content.
  3. Missing form labels: screen reader users cannot tell what fields are.
  4. Empty links and buttons: icon controls with no name.
  5. Missing document language: screen readers mispronounce content.
  6. Empty or skipped headings: navigation by heading breaks.

Other frequent problems

  • Invisible focus or keyboard traps.
  • Custom controls (drop-downs, date pickers, carousels) that do not work with keyboard or screen readers.
  • Colour-only information.
  • Auto-playing media and moving content without pause.
  • Inaccessible PDFs and documents.
  • CAPTCHAs and cognitive tests without alternatives.

Most of these are preventable at the design stage with good annotations.

Why it matters in real projects

A small set of failures causes most accessibility problems. Knowing them lets you catch the majority of issues quickly in any design review. It also helps you prioritise when time is limited, and explain clearly to colleagues why each issue matters.

A realistic example

A charity website is preparing for a relaunch. The designer runs a 20-minute quick check against the common failures and finds: grey text at 3.1:1, social icons with no names, a donation form using placeholders as labels, a carousel that auto-advances without pause, and a hero image with text in it.

All five are fixed in the designs before development. The post-launch audit finds far fewer issues than the previous site.

Step by step

  1. Learn the list

    Memorise the top six failures.

  2. Create a quick check

    Turn the failures into a checklist.

  3. Apply to a design

    Run the check on a design file.

  4. Apply to a live site

    Run it on a live site using tools.

  5. Note who is affected

    For each issue, note which users it harms.

  6. Fix and share

    Fix issues and share the checklist with your team.

Common mistakes

  • Mistake Building custom controls without a spec.

    Instead Use native controls or fully specify accessible behaviour.

  • Mistake Auto-playing carousels.

    Instead Avoid them or provide pause controls.

  • Mistake Text in images.

    Instead Use live text.

Check your understanding

Choose an answer, then check it. There is an explanation either way.

Question 1 of 3Which is consistently the most common failure?
Show answer

Low contrast text. Low contrast tops the list year after year.

Question 2 of 3Who is affected by empty buttons?
Show answer

Screen reader and voice control users. Without a name, controls cannot be identified.

Question 3 of 3When can most common failures be prevented?
Show answer

At the design stage. Annotations prevent them.

Practice exercise

Exercise · about 30 min

Quick check

Build and use a quick accessibility check.

Steps

  1. Write a 10-item checklist from this lesson.
  2. Run it on two websites.
  3. Record failures and who they affect.
  4. Share the checklist with a peer.

Deliverable

A checklist and results for two sites.

Self-assessment

Tick each item when it is true of your exercise. Be honest; this is for you.

4 items

Summary

  • A few failures cause most problems.
  • Low contrast, missing alt, missing labels and empty controls lead the list.
  • Custom controls and colour-only cues are frequent too.
  • Most are preventable in design.

Further reading

Third-party sources, chosen for reliability. They open in a new tab.

Your notes

Marking complete updates your course and roadmap progress.

Back to Accessibility and inclusive design Roadmap

PreviousAccessibility testing tools Next lessonProduct goals and user needs