Text Content: Headings, Paragraphs, and Lists

Most of a web page is text, and HTML gives you a small set of elements to describe what kind of text it is.

Headings and paragraphs

<h1>Kodstigen</h1>
<h2>Learn to Code</h2>
<p>Kodstigen is a platform for learning to code through interactive lessons and projects.</p>

There are six heading levels, <h1> through <h6>, from most to least important. Use exactly one <h1> per page, it's the page's main title, and don't skip levels just to make text smaller, that's what CSS is for.

Lists

<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ul>

<ol>
  <li>Write the HTML</li>
  <li>Style it with CSS</li>
  <li>Add behavior with JavaScript</li>
</ol>

• <ul> is an unordered list (bullets), use it when order doesn't matter.
• <ol> is an ordered list (numbers), use it when sequence matters, like steps in a recipe.
• Every item in either list goes inside an <li> (list item).

Inline emphasis

<p>This is <strong>very important</strong> and this is <em>subtly emphasized</em>.</p>

<strong> and <em> carry real semantic meaning (importance and emphasis) that screen readers announce differently, they're not just "bold" and "italic". The purely visual tags <b> and <i> still exist but should be reserved for cases with no semantic meaning at all.