HTML <h3> Tag

The <h3> tag defines a third-level heading in an HTML document. It is used to structure content hierarchically, sitting below <h1> (main heading) and <h2> (subheading), and above <h4>, <h5>, and <h6> headings. This hierarchical system helps both readers and search engines understand the organization of the content on a page.

Headings are semantic elements, meaning they carry meaning beyond just visual presentation. An <h3> typically represents a subsection within an <h2> section, helping to break down content into digestible parts. Using headings appropriately improves accessibility, as screen readers and other assistive technologies rely on them to provide an outline of the page.

Visually, <h3> text is typically rendered smaller than <h1> and <h2> headings but larger than normal paragraph text (<p>). However, the default appearance can be customized through CSS to match the design of the website.

In practice, <h3> is used for:

• Subsections within a major topic or section.
• Highlighting important content in a structured hierarchy.
• Supporting content outlines and table of contents automatically generated by some tools.

Example usage:

<h2>Fruits</h2>
<h3>Citrus Fruits</h3>
<p>Examples of citrus fruits include oranges, lemons, and limes.</p>
<h3>Berries</h3>
<p>Common berries are strawberries, blueberries, and raspberries.</p>

In this example, <h3> headings organize content under the <h2> main heading “Fruits,” creating a clear structure for readers and search engines.