← HTML tutorial

HTML

Lists

Use <ul> for an unordered (bulleted) list, or <ol> for an ordered (numbered) list. Either way, each item goes inside its own <li> tag.

Example 1: unordered, order doesn't matter

<h3>Shopping list</h3>
<ul>
  <li>Rice</li>
  <li>Tomatoes</li>
  <li>Pepper</li>
</ul>

Use <ul> whenever the sequence of items doesn't actually matter, a shopping list reads the same regardless of which order the items are written in.

Example 2: ordered, sequence matters

<h3>Steps to make jollof rice</h3>
<ol>
  <li>Blend the pepper and tomatoes</li>
  <li>Fry the base</li>
  <li>Add rice and stock, simmer</li>
</ol>

Use <ol> whenever the sequence genuinely matters, here, swapping steps 1 and 3 would actually break the recipe. That's the whole test for choosing between the two: does the order carry meaning?

Try it yourself
Ready to go further?

These free tutorials are a preview, our Frontend Development cohort covers it in depth, with a real project and a cohort alongside you. Closes Nov 30

Enroll in Frontend Development

Cookie preferences

Choose what you're comfortable with. You can change this any time from the footer.

Don't miss out

Ready to build something real?

Create a free account to enroll in a track, and get notified the moment a cohort opens.

Create free account