Saturday, August 31, 2024
HomeProgrammingParagraphs | CSS-Tips

Paragraphs | CSS-Tips


I positive do love little reminders about HTML semantics, notably semantics which are more durable to decide to reminiscence. Scott has a terrific one, starting with this markup:

<p>I'm a paragraph.</p>
<span>I'm additionally a paragraph.</span>
<div>You may hate it, however I am a paragraph too.</div>
<ul>
  <li>Even I'm a paragraph.</li>
  <li>Although I am an inventory merchandise as nicely.</li>
</ul>
<p>I would trick you</p>
<handle>Guess who? A paragraph!</handle>

It’s possible you’ll have a look at that markup and say “Hey! You may’t idiot me, solely the <p> components are “actual” paragraphs!

You may even name out such components as divs or spans getting used as “paragraphs” a WCAG failure.

However, if you happen to’re pondering these types of issues, then possibly you’re not conscious that these are truly all “paragraphs”.

It’s simple to neglect this since a lot of these non-paragraph components should not allowed in between paragraph tags and it often will get all sorted out anyway when HTML is parsed.

The accessibility bits are what I all the time come to Scott’s writing for:

These examples I supplied at first of this put up? macOS VoiceOver, NVDA and JAWS deal with all of them as paragraphs ([asterisks] for NVDA, learn on…). […] The purpose being that display screen readers are consistent with HTML, and perceive that “paragraphs” are extra than simply the p factor.


Direct Hyperlink →

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments