What

Headings are used to structure and organise content on a web page and documents like this one. They are like signposts, guiding both users and search engines through the content.

Headings are defined using the following html tags <h1> <h2> <h3> <h4> <h5> <h6> tags, where <h1> represents the most important heading and <h6> represents the least important heading.

Why

Headings are important for both users and search engines, as they provide a clear hierarchy of information and help users to quickly navigate to the content, they are interested in. Headings highlight the main ideas and key points of each section.

Search engines will understand the main topics and subtopics of a webpage. This allows them to index the content more accurately and rank it higher for relevant search queries.

For sighted people heading size helps orientate the reading experience and for people who are visually impaired headings provide a navigation tool (more in Headings for screen readers).

How

Here is an example of how to use HTML to create the headings:

<h1>Main Heading</h1> 

<h2>Secondary Heading</h2> 

<h3>Subheading</h3> 

<h4>Sub-subheading</h4> 

<h5>Sub-sub-subheading</h5> 

<h6>Least Important Heading</h6>

The code above will create the following hierarchy of headings:

Main Heading

Secondary Heading

Subheading

Sub-subheading

Sub-sub-subheading

Least Important Heading

It is important to use headings correctly in order to maximize their benefits.

Here are some tips for using HTML headings:

Use headings sparingly.

Only use headings for the most important sections of your content.

Use the correct heading level.

Use <h1> for the main heading, <h2> for secondary headings, and so on.

Use descriptive headings.

The heading should accurately reflect the content of the section.

Use consistent heading styles.

Use the same style for all headings of the same level.