HTML are trei tipuri de liste, fiecare cu un sens semantic. Utilizarea celui corect ajută accesibilitatea (cititorii de ecran anunță "listă, 3 elemente") și structura.
Lista neordonată — ordinea nu contează
html
Apples
Bananas
Cherries
Se redă implicit cu puncte. Utilizați pentru meniu-uri de navigare, liste de caracteristici, etichetă — orice în care secvența nu este semnificativă.
<ol type="1" start="1">
<li>Preheat the oven</li>
<li>Mix ingredients</li>
<li>Bake for 20 minutes</li>
</ol>
Se redă cu numere. Utilizați pentru pași, clasamente, instrucțiuni. Atribute: type (1, a, A, i, I), start (primul număr), reversed.
<dl>
<dt>HTML</dt>
<dd>The markup language for web pages.</dd>
<dt>CSS</dt>
<dd>The styling language for web pages.</dd>
</dl>
<dt> este termenul, <dd> descrierea sa — excelent pentru glosare, metadate și perechi cheie/valoare.
<nav>
<ul>
<li><a href="/">Home</a>
<ul><li><a href="/sub">Sub-page</a></li></ul> <!-- nested submenu -->
</li>
</ul>
</nav>
Meniurile de navigare sunt în mod convențional marcate ca un <ul> în interiorul <nav>.
Listele nu sunt doar pentru puncte — ele dau conținutului o structură pe care cititorii de ecran o anunță și pe care o puteți stiliza liber (marcatorii impliciti sunt ușor eliminați cu CSS).
Alegerea <ul> versus <ol> versus <dl> comunică semnificație: neordonată, secvențială sau termen-definiție.