I was planning to do something like this:
<ul class="menu">
<li><h2>Contact</h2></li>
<li>my email</li>
<li>my phone</li>
</ul>
Is it semantically incorrect (or a bad practice?)
If the answer is yes, should I do this instead?
<ul class="menu">
<li><strong>Contact</strong></li>
<li>my email</li>
<li>my phone</li>
</ul>
(I can't place just a heading tag, since there are not divs to group them):
<div id="branding">
<h1>
<ul class="menu">
<ul class="menu">
<ul class="menu serif">
<ul id="lang">
</div>
For your code to be valid you can't put any tag inside a <ul> other than an <li> .
The HTML5 syntax rules allow heading elements h1 , h2 etc. inside li elements.
All HTML specifications forbid ul inside h1 , see e.g. HTML 4.01 on h1 (where the content model notation %inline; means text and text-level markup; this excludes list elements for example). So the h1 element embraces the list and continues after it.
An H2 tag marks the first sub-heading after your document's main heading. It defines the second-level headings on your webpage. Like an H1 tag, an H2 tag also appears larger than the rest of your main body text.
According to the W3C Validator using an <h2>
tag inside a <li>
tag is perfectly valid. This is much preferred ver using a <strong>
tag with styling as this communicates the semantic intention of the text (and consequently helps with SEO).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With