WCAG explained
One success criterion at a time, in plain language. What the rule says, why it matters to real visitors, the mistakes we keep finding in audits, and how to test it yourself.
Tables: the part of SC 1.3.1 that breaks most often
Opening hours. Monday, 09:00 to 17:00. You look at it once and you know which time belongs to which day, because the two sit on the same row.
What is an accessible name?
Turn on a screen reader and move to a button. You hear two or three things: “Add to basket, button”. The word “button” is the role. “Add to basket” is the accessible name.
SC 2.4.4 - What does "Link Purpose (In Context)" mean?
Screen reader users have a shortcut that sighted visitors do not: pull up a list of every link on the page and jump straight to the one you want. It is fast and it is how a lot of people actually browse. Now imagine that list on a typical news site. Fourteen entries, all reading “Read more”. Success criterion 2.4.4 exists to stop that: the purpose of a link must be clear.
SC 1.4.3 - What does "Contrast (Minimum)" mean?
Light grey text on a white background looks calm and modern. Put a bit of sunlight on the screen and it is gone. For visitors with reduced vision it is not gone occasionally, it is gone always. That is why WCAG says: text needs enough contrast with its background.
SC 1.3.1 - What does "Info and Relationships" mean?
You can see that a line is a heading because it is big and bold. You can see that three lines belong together because they each start with a bullet. You can see which column a number belongs to because it sits underneath the word “Price”. None of that is visible to a screen reader. It only knows what the code says. Success criterion 1.3.1 is the rule that closes that gap: the structure a sighted visitor perceives must also be available in the markup.
SC 1.1.1 - What does "Non-text Content" mean?
Every image on your site is invisible to somebody. Not because their screen is broken, but because they browse with a screen reader, or because the image failed to load on a train, or because they turned images off to save data. What reaches them is whatever you typed into the alt attribute. That is the whole point of the first success criterion in WCAG: anything that is not text needs a text alternative that does the same job.