I am considering the placement and structure of heading tags to improve SEO. Which of the following three HTML code examples is the most suitable for SEO?
- html1
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Webpage Title - Website Name</title>
</head>
<body>
<h1>Webpage Title</h1> //Hide
<header>
<h2>Main Navigation</h2>
<nav>
<h3>Main Menu</h3>
<ul>
<li>Menu1</li>
<li>Menu2</li>
<li>Menu3</li>
</ul>
</nav>
</header>
<main>
<h2>Webpage Title</h2> //Shown
<section>
<h3>Sub Title</h3>
<p>
Section Contents...
</p>
</section>
<section>
<h3>Sub Title</h3>
<p>
Section Contents...
</p>
</section>
</main>
<footer>
<section>
<h2>Contact</h2>
<address>address, phone and email..</address>
</section>
<nav>
<h2>Sitemap</h2>
<ul>
<li>
<h3>Menu1</h3>
</li>
<li>
<h3>Menu2</h3>
</li>
<li>
<h3>Menu3</h3>
</li>
</ul>
</nav>
<section>
<h2>SocialMedia link</h2>
.
.
.
</section>
</footer>
</body>
</html>
- Html 2
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Webpage Title - Website Name</title>
</head>
<body>
<header>
<h1>Main Navigation</h1>
<nav>
<h2>Main Menu</h2>
<ul>
<li>Menu1</li>
<li>Menu2</li>
<li>Menu3</li>
</ul>
</nav>
</header>
<main>
<h1>Webpage Title</h1> //Shown
<section>
<h2>Sub Title</h2>
<p>
Section Contents...
</p>
</section>
<section>
<h2>Sub Title</h2>
<p>
Section Contents...
</p>
</section>
</main>
<footer>
<h1>Website Information</h1>
<section>
<h2>Contact</h2>
<address>address, phone and email..</address>
</section>
<nav>
<h2>Sitemap</h2>
<ul>
<li>
<h3>Menu1</h3>
</li>
<li>
<h3>Menu2</h3>
</li>
<li>
<h3>Menu3</h3>
</li>
</ul>
</nav>
<section>
<h2>SocialMedia link</h2>
.
.
.
</section>
</footer>
</body>
</html>
*Html3
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Webpage Title - Website Name</title>
</head>
<body>
<header>
<h2>Main Navigation</h2>
<nav>
<h3>Main Menu</h3>
<ul>
<li>Menu1</li>
<li>Menu2</li>
<li>Menu3</li>
</ul>
</nav>
</header>
<main>
<h1>Webpage Title</h1> //Shown
<section>
<h2>Sub Title</h2>
<p>
Section Contents...
</p>
</section>
<section>
<h2>Sub Title</h2>
<p>
Section Contents...
</p>
</section>
</main>
<footer>
<h2>Website Information</h2>
<section>
<h3>Contact</h3>
<address>address, phone and email..</address>
</section>
<nav>
<h3>Sitemap</h3>
<ul>
<li>
<h4>Menu1</h4>
</li>
<li>
<h4>Menu2</h4>
</li>
<li>
<h4>Menu3</h4>
</li>
</ul>
</nav>
<section>
<h3>SocialMedia link</h3>
.
.
.
</section>
</footer>
</body>
</html>
I have researched which of the three HTML code examples is more SEO-friendly, but there are many different opinions and pieces of advice, making it difficult to determine the correct answer.
New contributor
Faither is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.