HTML Headings
What are HTML Headings?
HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading, while <h6> defines the least important heading.
Heading Levels
HTML has six levels of headings, from <h1> (largest) to <h6> (smallest):
Example
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>Importance of Headings
Headings are important for:
- SEO: Search engines use headings to index the structure and content of web pages
- Accessibility: Screen readers use headings to navigate the page
- Structure: Headings help organize and structure your content
- Visual Hierarchy: Headings create visual hierarchy on the page
Best Practices
- Use only one
<h1>per page (the main heading) - Don't skip heading levels (don't go from h1 to h3)
- Use headings to structure content, not for styling
- Keep headings concise and descriptive
Example Structure
Example
<h1>Main Title</h1>
<h2>Section 1</h2>
<h3>Subsection 1.1</h3>
<h3>Subsection 1.2</h3>
<h2>Section 2</h2>
<h3>Subsection 2.1</h3>