Suzy Naschansky from the HTMHell Advent Calendar:
<h2 id="article1-heading"All About Dragons</h2<pI like dragons. Blah blah blah blah blah.</p<p<a id="article1-read-more" aria-labelledby="article1-read-more article1-heading"Read more</a</pSee that aria-labelledby attribute? It chains two IDs from the …
Most inputs have something in common — they are happiest with a companion label! And the happiness doesn’t stop there. Forms with proper inputs and labels are much easier for people to use and that makes people happy too.…
WCAG 2.1 Recommendations rolled out in 2018. It’s been a couple years now and there are some new Success Criterion. In this article, I will discuss Label in Name, which is how we visually label components. We’ll take a …
Danielle Romo covers the HTML pattern you need when you have a wordy <label> with fancy styling for an <input type="radio">.
The trick? The ol’ <span class="hidden-visually"> that contains the label that you want to be read, and a …
The floated label technique has been around for a good long while and the general idea is this: we have an text input with the placeholder attribute acting as a label. When a user types into that input, the label …
