Cainã Cainã - 4 months ago 4x
HTML Question

Why should I use UL/LI in my HTML?

I have the following structure that seems really nice for me and I always use HTML5:

<div class="drop-menu" data-dropmenu="language">
<a href="language/pt-pt" class="drop-menu-link">Português <span>(Brasil)</span></a>
<a href="language/pt-pt" class="drop-menu-link">Português <span>(Portugal)</span></a>
<a href="language/es" class="drop-menu-link">Español</a>
<a href="language/en" class="drop-menu-link">English</a>
<a href="language/ja" class="drop-menu-link">日本語</a>
<a href="language/it" class="drop-menu-link">Italiano</a>
<a href="language/de" class="drop-menu-link">Deutsch</a>
<a href="language/fr" class="drop-menu-link">Français</a>

So why should I use a list structure (ULs/LIs) if just A elements shown as blocks does the job? Is it REALLY useful to use lists in this case? I always do like this and it seems so good.


It is more semantically correct.

What you have above is an unordered list of languages. You should be using an unordered list of items (UL element with LI elements) to be semantically correct about it.

This also helps screen readers and other technologies that depend on correct semantics to work.