Geek Answers Handbook

How to use h1 - h6 in the title, section, article, etc. In html5?

In xhtml 1.0, hn (h1 to h6) should represent the structure of the document, like chapters in a book, and they all come down from the body . Html5 has a section , article , header , hgroup , and it seems that the hn tags come off one of these tags and then do not belong to the body element. as

 <html> <body> <h1>My personal homepage</h1> <section id="resume"> <header> <h1>My resumre</h1> <p>A brief description of my skills</p> </header> <!-- bla bla bla --> </section> </body>

In xhtml 1.0, I would do:

 <html> <body> <h1>My personal homepage</h1> <div id="resume"> <h2>My resumre</h2> <p>A brief description of my skills</p> <!-- bla bla bla --> </div> </body>

Does it make sense? Or should I follow the same rules as in xhtml 1.0, and ignore the section, title, etc ... and make hn tags regarding body elements?

The tips and answers regarding semantics and SEO are most valuable to me.

+4
source share
2 answers

Best SEO - Have Good Content, Easy At This! Semantically, what you have illustrated here is beautiful. What's new in HTML5 is that containers like <footer> , <header> , <section> and <article> have their own internal structure. Thus, the outline of your first example will be as follows:

  • My personal page
    1. My resume

If you changed the markup to this:

<html>
<body>
<h1>My personal homepage</h1>
<h2>Introduction</h2>
<p id="intro">...<\p>
<h2>About me</h2>
<section id="resume">
<header>
<h1>My resume</h1>
<h2>Overview</h2>
</header>
<p>...</p>
</section>
</body>

The outline will look like this:

  • My personal page
    1. Introduction
    2. About me
    1 My resume
    1. Overview

See project section 4.4.11 for an explanation. Jeffrey Sneddon made an HTML 5 Outliner tool to check the page layout.

+3
source

Semantically, what you do is beautiful. Perhaps the section should be an article.

SEO is probably good, but I could not say for sure.

0
source

More articles:


All Articles