Paragraphs | CSS-Tricks

I really appreciate little reminders of HTML semantics, especially those that are harder to remember. Scott has a greatstarting with this award:

I am a paragraph.
I am also a paragraph.
You might hate it, but I'm a paragraph too.

  
Even I am a paragraph.
  
Though I'm a list item as well.

I might trick you
Guess who? A paragraph!

You might look at this award and say, “Hey! I can’t be fooled, only the

Elements are “real” paragraphs!

You could even add elements like divs or spanUsing it as “paragraphs” is a WCAG error.

But if you think like that, you may not be aware that it is Strictly speaking all “paragraphs”.

This can be easy to forget because many of these non-paragraph elements are not allowed between paragraph tags and this is usually all sorted out when HTML is parsed anyway.

It is the aspects of accessibility that I always enjoy about Scott’s texts:

The examples I gave at the beginning of this post? macOS VoiceOver, NVDA and JAWS all treat them as paragraphs ([asterisks] for NVDA, read on…). […] The point is that screen readers keep up with HTML and understand that “paragraphs” are more than just the p Element.

Direct link →