HTML Headings and Its Types | Web Development Notes | New Topic [2024]

In this note, we are going to learn about HTML Headings and Its Types. Welcome to Poly Notes Hub, a leading destination for engineering notes for diploma and degree engineering students.

Author Name: Arun Paul.

Introduction to HTML Headings

HTML (Hyper Text Markup Language) headers define the titles or subtitles of online pages. The headings run from <h1> to <h6>, with <h1> being the highest and <h6> the lowest. These headers not only help to structure the material on a webpage, but they also have a significant impact on SEO (Search Engine Optimization) and accessibility.

Types of HTML Heading

There are 6 types of HTML headings –

  • <h1>, used for Main heading.
  • <h2>, used for Sub heading.
  • <h3>, used for Sub-subheading
  • <h4>, used for Sub-sub-subheading.
  • <h5>, Sub-sub-sub-subheading.
  • <h6>, Sub-sub-sub-sub-subheading.

General Tip For Using Headings

  • Hierarchy: Use headings in a hierarchical order to organize text coherently.
  • SEO: Proper usage of headers can boost a webpage’s SEO by allowing search engines to better grasp its structure and content.
  • Accessibility: Headings make it easier for screen readers to browse the material, making the webpage more accessible.
  • Styling: While headers have default styles, CSS can be used to change their appearance.

Example of Using Headings

Input
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sample Document</title>
</head>
<body>
    <h1>Main Heading: Welcome to Poly Notes Hub</h1>
    <h2>Section 1: About Us</h2>
    <h3>Subsection: Our Mission</h3>
    <h4>Details: Our Values</h4>
    <h5>Specifics: Commitment to Quality</h5>
    <h6>Minor Detail: Employee Training Programs</h6>
</body>
</html>
Output
Sample Document

Main Heading: Welcome to Poly Notes Hub

Section 1: About Us

Subsection: Our Mission

Details: Our Values

Specifics: Commitment to Quality
Minor Detail: Employee Training Programs
Share To:

One thought on “HTML Headings and Its Types | Web Development Notes | New Topic [2024]

  1. Its like you read my mind You appear to know so much about this like you wrote the book in it or something I think that you can do with a few pics to drive the message home a little bit but instead of that this is excellent blog A fantastic read Ill certainly be back

Leave a Reply

Your email address will not be published. Required fields are marked *