I was curious if anyone could give me their opinion. Do you run into situations where you need more than h6? I.E. 7, 8 etc? If so . . . what is your solution? I was also curious which of these 2 examples you would consider more semantically correct for a single page.
EXAMPLE 1:
<h1>Heading</h1> <hr> <h2>Section 1</h2> <p>Some Content</p> <p>Sub Section</p> <p>Some Content</p> <p>Sub Section</p> <p>Some Content</p> <hr> <h3>Section 2</h3> <p>Some Content</p> <p>Sub Section</p> <p>Some Content</p> <p>Sub Section</p> <p>Some Content</p> <hr> <h4>Section 3</h3> <p>Some Content</p>
EXAMPLE 2:
<h1>Heading</h1> <hr> <h2>Section 1</h2> <p>Some Content</p> <h2>Sub Section</h2> <p>Some Content</p> <h3>Sub Section</h3> <p>Some Content</p> <hr> <h3>Section 2</h3> <p>Some Content</p> <h2>Sub Section</h2> <p>Some Content</p> <h3>Sub Section</h3> <hr> <h4>Section 3</h3> <p>Some Content</p>
What do you do when h6 is not enough?
I think you misunderstand how heading levels work
Heading levels imply that a higher numbered Hx is a sub-section of and nested in a parent section. Your examples show no nesting, thus all sections are at equal levels. Structurally you've shown us a top level heading (H1) followed by several sections/headings that are at the same level. You have one h1 and several h2 level headings.
HTML5 tries to address the issue, but no browsers presently support the outline function that html5 section elements require (though firefox does in a round-about way), so it's really a big cluster boop boop beep. If your code expects Firefox results, you may have a mess with other browsers.
cheers,
gary
Would you Mind Elaborating
Hi Gary:
I appreciate your time and reply. I am not 100% sure I understand what your saying. Would you mind elaborating? Do you have any examples you could provide as to the correct way it should be done?
I really appreciate your time.
I don't really know what you're doing
From your examples, each of the sections are pretty much equal, so the headings should be equal.
Consider a document outline, like you probably did for an English term paper. You have the document's title heading, h1.
Within this top level, let's say there are several sections (I'm not talking html sections here). Let's call them the abstract (what you're going to talk about), procedures (how you gathered your data), evidence (what the data show), and the conclusion (why you were right all along).
This can be outlined like so:
Title of paper (<h1>) There's ever only one h1 I. The abstract (<h2>) a section of the paper II. Procedures (<h2>) another section below the top level A. First method (<h3>) a subsection of procedures B. Another method (<h3>) III. The evidence (<h2>) We're back up a level IV. Conclusions (<h2>) Again, a section of the paper. A. See the evidence supports my hypothesis (<h3>) B. This evidence doesn't (<h3>) 1. this data must be wrong (<h4>) 2. this batch had errors (<h4>) C. Strong evidence favors my conclusion, weak evidence doesn't (<h3>) D. On whole I'm right but need more money to study further (<h3>)
As you can see, any document that would require more heading levels than the six we have is probably in need of a serious refactoring to achieve a better organization and structure.
Does that help?
cheers,
gary
Awesome!!!
Thanks Gary. Priceless information.
I appreciate it. Best explanation I have read to date.
Thank You!