Free HTML Course / Lesson 3 of 20

How to use headings, paragraphs, and text semantics in HTML

Use meaningful tags to communicate hierarchy and improve accessibility for screen readers and search engines.

What to know about headings, paragraphs, and text semantics in HTML

Use meaningful tags to communicate hierarchy and improve accessibility for screen readers and search engines. This chapter explains the concept, demonstrates a practical example, and gives you a guided exercise.

How to use headings, paragraphs, and text semantics in HTML

Choose elements for their meaning, nest them in a clear document structure, and use descriptive attributes. Check that links and forms work with a keyboard and that images have useful alternative text.

Example: headings, paragraphs, and text semantics in HTML

Use this example as a starting point. Identify the part that controls the result, then adapt it to your own page or project.

<h1>Product launch</h1>
<p>Our newest feature is ready.</p>

Common questions about headings, paragraphs, and text semantics

When should I use headings, paragraphs, and text semantics?

Use this technique when it expresses the structure, styling, or behavior your page needs. Keep the implementation focused and test it with the surrounding content.

What should I practice next?

Build a small profile page using a heading, paragraph, image with alt text, a link, and a semantic main element.

Practice headings, paragraphs, and text semantics

Build a small profile page using a heading, paragraph, image with alt text, a link, and a semantic main element. Compare your result with the example and check it at both desktop and mobile widths where relevant.

Course progress stays in this browser.