---
id: html-headings
title: "HTML Headings"
category: "Frontend"
status: "draft"
verification_status: "conceptual"
canonical_id: ""
aliases: ["heading tags", "h1", "h2", "h6", "headings hierarchy", "HTML titles"]
duplicate_of: ""
source_trust_level: "B"
confidence_score: 0.90
created_at: 2026-06-23
updated_at: 2026-06-23
review_reason: ""
merge_history: []
tags: ["html", "web", "frontend", "w3schools", "headings", "semantics"]
raw_sources: ["https://www.w3schools.com/html/html_headings.asp"]
applied_in: []
github_commit: ""
---
# [[HTML Headings]]
## π― ν μ€ ν΅μ°° (One-line insight)
HTML headings `
`β`` express the importance and structure of content (not merely its size), with `` most important and `` least. [S1]
## π§ ν΅μ¬ κ°λ
(Core concepts)
- **Six heading levels** β `` through ``. [S1]
- **Importance, not size** β `` defines the most important heading; `` the least important. [S1]
- **Browsers add margins** β browsers automatically add some white space (a margin) before and after a heading. [S1]
- **Headings are for structure** β search engines use headings to index the structure and content of web pages; users skim them to grasp a page. [S1]
- **Size is styled with CSS** β use the `style` attribute with `font-size` to change a heading's rendered size. [S1]
## π§© μΆμΆλ ν¨ν΄ (Extracted patterns)
- **One `` per page** β use `` for the main title (or logo). [S1]
- **Logical hierarchy** β `` for page title β `` for section titles β `` for subsections, in order. [S1]
- **Don't misuse headings for visuals** β do not use headings just to make text big or bold; use CSS for that. [S1]
- **Resize via inline style** β `β¦
`. [S1]
## π μΈλΆ λ΄μ© (Details)
**HTML Headings**
HTML headings are titles or subtitles that you want to display on a webpage. They are defined with the `` to `` tags. `` defines the most important heading; `` defines the least important heading: [S1]
```html
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
```
> **Note:** Browsers automatically add some white space (a margin) before and after a heading. [S1]
**Headings Are Important**
Headings are important. Search engines use the headings to index the structure and content of your web pages. Users often skim a page by its headings; it is important to use headings to show the document structure. `` headings should be used for main headings, followed by `` headings, then the less important ``, and so on. [S1]
> **Note:** Use HTML headings for headings only. Don't use headings to make text BIG or **bold**. [S1]
**Bigger Headings**
Each HTML heading has a default size. However, you can specify the size for any heading with the `style` attribute, using the CSS `font-size` property: [S1]
```html
Heading 1
```
**Heading reference table**
| Tag | Description |
|---|---|
| `` | Defines the root of an HTML document |
| `` | Defines the document's body |
| `` to `` | Defines HTML headings |
## π οΈ μ μ© μ¬λ‘ (Applied in summary)
A typical applied structure (e.g. a travel guide) uses `` for the page title, `` for region/section titles, and `` for country/subsection titles β demonstrating heading hierarchy as document outline. No external project/commit applications found in the source.
## π» μ½λ ν¨ν΄ (Code patterns)
All six heading levels (HTML):
```html
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
```
Resizing a heading with inline CSS:
```html
Heading 1
```
## βοΈ λͺ¨μ λ° μ
λ°μ΄νΈ (Contradictions & updates)
The source stresses semantics over appearance: headings should encode document structure for search engines and users, not be repurposed to make text big or bold β use CSS `font-size` instead. [S1]
## β
κ²μ¦ μν λ° μ λ’°λ
- **μν:** draft
- **κ²μ¦ λ¨κ³:** conceptual (μ€μ μ μ© μ¬λ‘ λ°κ²¬ μ applied/validatedλ‘ μΉκ²© κ°λ₯)
- **μΆμ² μ λ’°λ:** B (W3Schools β widely used educational reference, not a primary standards body)
- **μ λ’° μ μ:** 0.90
- **μ€λ³΅ κ²μ¬ κ²°κ³Ό:** μ κ· μμ± (New discovery)
## π μ§μ κ·Έλν (Knowledge Graph)
- **μμ/루νΈ:** [[HTML Tutorial]]
- **κ΄λ ¨ κ°λ
:** [[HTML Paragraphs]], [[HTML Basic]], [[HTML Styles]], [[HTML Elements]]
- **μ°Έμ‘° λ§₯λ½:** Referenced whenever structuring page content into titles and sections for readers and search engines.
## π μΆμ² (Sources)
- [S1] W3Schools β HTML Headings β https://www.w3schools.com/html/html_headings.asp
## π λ³κ²½ μ΄λ ₯ (Change history)
- 2026-06-23: Initial draft synthesized from the W3Schools "HTML Headings" page (Astra wiki-curation, P-Reinforce v3.1 format).