In this lesson: Use headings in a correct hierarchy and mark up text meaningfully.
Headings
HTML gives you six heading levels, <h1> through <h6>. They are not font sizes — they are an outline, like chapter and section numbers in a book.
<h1>Learning web development</h1>
<h2>HTML</h2>
<h3>Tags</h3>
<h3>Attributes</h3>
<h2>CSS</h2>
Rules that matter: use one
<h1> per page, and never skip a level to get a smaller size — use CSS for size. Screen-reader users navigate a page by jumping between headings, so a broken outline makes your site genuinely hard to use.
Paragraphs
Wrap every block of prose in <p>. Do not use <br> to fake paragraph spacing — that is a line break inside one paragraph, not a new one.
<p>Yanjye offers free ICT courses.</p>
<p>Every course ends with a certificate.</p>Marking up meaning, not looks
Several elements look similar but say different things:
<strong>Important</strong> <!-- carries weight/urgency -->
<b>Bold</b> <!-- just visually bold -->
<em>Emphasised</em> <!-- stress when read aloud -->
<i>Italic</i> <!-- just visually italic -->Prefer <strong> and <em>. They mean something to screen readers; <b> and <i> only change appearance.
Other useful text elements
<blockquote>A longer quotation.</blockquote>
<code>inline code</code>
<pre>preformatted text, spacing preserved</pre>
<small>fine print</small>
<time datetime="2026-09-05">5 September 2026</time>Entities
Some characters are part of HTML itself, so you must escape them:
<gives<>gives>&gives& gives a space that never breaks across lines