I sure do love little reminders about HTML semantics, particularly semantics that are tougher to commit to memory. Scott has a great one, beginning with this markup:
<p>I am a paragraph.</p>
<span>I am also a paragraph.</span>
<div>You might hate it, but I'm a paragraph too.</div>
<ul>
<li>Even I am a paragraph.</li>
<li>Though I'm a list item as well.</li>
</ul>
<p>I might trick you</p>
<address>Guess who? A paragraph!</address>You may look at that markup and say “Hey! You can’t fool me, only the
<p>elements are “real” paragraphs!You might even call out such elements as
divs orspans being used as “paragraphs” a WCAG failure.But, if you’re thinking those sorts of things, then maybe you’re not aware that those are actually all “paragraphs”.
It’s easy to forget this since many of those non-paragraph elements are not allowed in between paragraph tags and it usually gets all sorted out anyway when HTML is parsed.
The accessibility bits are what I always come to Scott’s writing for:
Those examples I provided at the start of this post? macOS VoiceOver, NVDA and JAWS treat them all as paragraphs ([asterisks] for NVDA, read on…). […] The point being that screen readers are in step with HTML, and understand that “paragraphs” are more than just the
pelement.
I don’t understand the point of this post.
<p>is a paragraph element, and the rest aren’t. They may be “read” that way via screen readers, but that doesn’t make them paragraphs. Browsers may render them properly even when the author improperly structures the HTML, but that also doesn’t make them paragraphs. Sure most of the other elements render as blocks, but again, not paragraphs. The author of the article you linked to seems to just want to make his opinion a point, being “Focus on markup issues/problems that actually have a detrimental impact on users. Futzing about whether to use a div or span vs a p element as the most semantic tag for content that is all ready all under the umbrella of “paragraphs” is generally not one of them, in my opinion.”What else is a paragraph!
<ins>I am also a paragraph just added </ins>
<del>:( I am a deleted paragraph </del>
<details> paragraphs can be very very very very long. I am the details <summary> I’m a short paragraph of the details </summary></details>
I am a brand-now here, and seeing this makes me suffer more. WHAT SHOULD I DO?
You know, I don’t think there’s anything you need to “do” other than remembering that even some non-paragraph elements are recognized as paragraphs by browsers, and that it’s mostly to help prevent conflicts. So, in a way, HTML has got your back. :)