Heading in HTML

The heading element is primarily used for displaying titles on a web page. HTML offers six levels of headings, which can be used to organize web content into hierarchical levels. The highest level heading is denoted as <h1>, and the lowest level is represented by <h6>.

These headings not only organize content hierarchically but also offer search engines valuable information about the structure and importance of your text.

<h1>This is an H1 Heading</h1>
<h2>This is an H2 Heading</h2>
<h3>This is an H3 Heading</h3>
<h4>This is an H4 Heading</h4>
<h5>This is an H5 Heading</h5>
<h6>This is an H6 Heading</h6>

Here's an example of how you can use headings in HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Attribute Example</title>
</head>
<body>
    <h1>Article Title</h1>
    <p>Introduction...</p>
    <h2>Section 1</h2>
    <p>Content of section 1...</p>
    <h2>Section 2</h2>
    <p>Content of section 2...</p>
    <h2>Section 3</h2>
    <p>Content of section 3...</p>
</body>
</html>

Best Practices for HTML Headings

  1. Use Headings Sequentially:

    2. Follow a logical sequence when using headings. Avoid skipping levels (e.g., going from <h2> to <h4> directly) as it can confuse both readers and search engines.

  2. Use Natural Keywords:

    3. Use relevant keywords in your headings, while also emphasizing natural language. The search engines, such as Google, are advanced and capable enough to identify the use of keywords in headings.

  3. Maintain Consistency:

    4. Using the same style for headings throughout your website creates a consistent look and makes it easier for people to understand the organization of your content.

  4. Use Semantic Headings:

    5. Pick headings that clearly match the content they cover.

  5. Maintain Heading Hierarchy:

    6. Maintain a logical hierarchy when using headings. For example: use <h1> for main titles, <h2> for subsections, and so on.

    <h1>Main Topic</h1>
<h2>Subtopic 1</h2>
<h3>Sub-subtopic 1.1</h3>
<h2>Subtopic 2</h2>
<h3>Sub-subtopic 2.1</h3>