HTML Basics:

Headings

Headings are defined with the <h1> to <h6> elements, <h1> being the most important heading on the page.

Below are some examples of different headings

<h1>This is a H1-heading</h1>
<h3>This is a H3-heading</h3>
<h6>This is a H6-heading</h6>

Headings are important as webbrowsers interpret the headings as the structure of your page. Therefore headings should only be used for actual headings and not for making text bold or large. Besides than structuring your page, headings also increases the readability of your pages – your users will most likely skim your pages and they use the headings as navigation.

Below is an example of how you use the different headings. The headings are used to outline the page – the following HTML would create this page structure:

Introduction
Back to 2nd level headings
The last 2nd level heading

<!DOCTYPE html>
<html>
<head>
	<title>Your first HTML5 Document</title>
</head>
<body>
	<h1>Introduction</h1>
		<p>Okay, now we’re going somewhere! This is the first paragraph of the page.</p>
	<h2>The less important heading</h2>
		<p>This is the second paragraph and it is right below a h2-heading</p>
	<h3>My 3rd level heading</h3>
		<p>Just another paragraph </p>
	<h2>Back to 2nd level headings</h2>
	<h2>The last 2nd level heading</h2>
</body>
</html>

This article has been fully translated into the following languages:

Is your preferred language not on the list? Click here to help us translate this article into your language!