X

HTML5 page structure

HTML5 offers more powerful structure comparing to older versions of Html. There are many new semantic elements in HTML5 which give more flexibility and standard to a web document. Using HTML5 now we can create more professional web pages in a standard way. Here is a sample of HTML5 page structure for reference which contains tags for header, Navi, Sections, article and footer.

 
 <!DOCTYPE html>
 
<html>
 
<head>
	<meta charset="UTF-8" />
	<title>Title of your webpage</title>
</head>
 
<body>
 
	<header>
		<nav>
			<ul>
				<li>Menu</li>
			</ul>
		</nav>
	</header>
 
	<section>
 
		<article>
				<h2>Article Title</h2>
				<p>Details of articles, here</p>
		</article>
 
		<article>
				<h2>Article 2 Title </h2>
				<p>Details of articles 2, here</p>
		</article>
 
	</section>
 
	<aside>
		<h2>Sidebar</h2>
		<p>Sidebar details</p>
	</aside>
 
	<footer>
		<p>Copyright details at bottom line</p>
	</footer>
 
</body>
 
</html>