Headings & Paragraphs
Text is the heart of the web. Start with the two tags you will use more than any other.
What you will learn
- Use the six heading levels correctly
- Write paragraphs of text
- Understand why heading order matters for SEO and accessibility
Six levels of headings
HTML gives you six heading sizes, from <h1> (biggest, most important) down to <h6> (smallest). They work like chapters and sub-sections in a book.
<h1>Main Title (use only once per page)</h1>
<h2>A Major Section</h2>
<h3>A Sub-section</h3>
<h4>A smaller point</h4>
<h5>Even smaller</h5>
<h6>The smallest heading</h6>Each line uses a different heading tag, <h1> down to <h6>. By default the browser shows <h1> biggest and boldest and makes each one smaller as the number grows — but the number is really about importance, like chapter titles versus tiny sub-headings, not just size.
Note: Output: Six lines of text, the first (h1) largest and the last (h6) smallest, each one bold and starting on its own line.
Tip: Use exactly one <h1> per page — it is the page’s main title. Then use <h2> for sections, <h3> for sub-sections, in order. Do not skip levels just to change size — that is CSS’s job later.
Paragraphs
For normal blocks of text, use the paragraph tag <p>. The browser automatically adds space above and below each paragraph.
<h2>About CodingClave</h2>
<p>We are a training institute that teaches real, job-ready web development.</p>
<p>Every batch is hands-on. You build projects from day one.</p>Here one <h2> heading sits above two separate <p> paragraphs. Because they are two different <p> elements, the browser automatically puts a gap between them — you did not have to add any blank lines yourself.
Note: Output: About CodingClave (bold sub-heading) We are a training institute that teaches real, job-ready web development. (blank space) Every batch is hands-on. You build projects from day one.
Watch out: Pressing Enter many times in your code does not create blank lines on the page. The browser ignores extra spaces and line breaks. Use separate <p> tags for separate paragraphs.
Q. How many <h1> elements should a single page normally have?
✍️ Practice
- Build a mini article with one
<h1>, two<h2>sections, and a paragraph under each. - Try three sentences inside one
<p>, then split them into three separate paragraphs and compare.
🏠 Homework
- Recreate the heading + paragraph structure of a Wikipedia article of your choice — text only, no styling.