5568 sujets

Sémantique web et HTML

Balise <ul>: pourquoi ne pas s'en servir comme div?

Bonjour à tous,

Une question m'obsède...
Traditionnellement on utilise les listes ainsi (exemple: dans un menu) :


<div id="menu">
	<ul>
		<li>Catégorie 1</li>
		<li>Catégorie 2</li>
	</ul>
</div>


Y a-t-il une raison quelconque qui justifierait qu'on ne puisse pas faire ça :


	<ul id="menu">
		<li>Catégorie 1</li>
		<li>Catégorie 2</li>
	</ul>


Smiley lol

Je n'ai vu nulle part des sites utilisant les <ul> ainsi... alors que les navigateurs l'interprètent très bien, aussi bien que n'importe quelle div.
J'y vois pourtant un avantage : moins de div donc moins d'intermédiaires, on va directement à l'essentiel.
Modifié par wbnet (18 May 2011 - 17:13)
sinon pour se mettre à l'html 5 tu peux aussi ajouter de la sémantique en remplaçant la balise div par une balise nav
Salut,

Dans l'optique d'avoir le code HTML le plus léger possible, il est bien évidemment mieux de ne pas ajouter de div supplémentaire. Donc la solution avec l'identifiant sur la liste préférable.

Ceci dit, cette div (ou autre balise englobante) sera peut être utile si le design présente une certaine complexité nécessitant plus de balises pour appuyer différents fond et/ou styles. Smiley cligne
Effectivement je pense que l'ajout de div permet après une manipulation spécifique en CSS, de plus c'est surement due à une habitude (mauvaise ... ou pas du coup Smiley lol )
Bonjour,

Euh... La seconde solution est tout à fait fonctionnelle et recommandée, personnellement, si je n'ai pas besoin du div (qui dans le meilleurs des monde engloberait autre chose que la liste), j'utilise toujours la seconde solution.
Une réaction sur le titre:

- Non, en ce qui concerne HTML on ne peut pas utiliser un élément UL comme un DIV. Ce sont deux éléments différents qui ont des significations différentes.
- Oui, en ce qui concerne CSS on peut styler un élément UL (ou OL) de la même manière que l'on stylerait un autre élément en display:block, que ce soit un DIV, un P, un BLOCKQUOTE, etc.
wbnet a écrit :


	<ul id="menu">
		<li>Catégorie 1</li>
		<li>Catégorie 2</li>
	</ul>


C'est effectivement LA méthode à privilégier, à moins que des besoins (très) particuliers de mise en forme nécessite l'usage de balises parentes
Modifié par dolmenhir (25 May 2011 - 16:27)
Ça dépend Smiley langue

Si tu utilises la balise nav de HTML5, elle ne peut pas contenir directement des balises li (contrairement à la balise menu), dans ce tu auras :


<nav>
<ul>
<li>...</li>
</ul>
</nav>
Administrateur
Bonjour,

dans la plupart de mes projets, j'ai toujours eu besoin de 2 éléments imbriqués donc div et ul, que ce soit pour centrer, avoir une couleur de fond sur un conteneur, un fond faisant toute la largeur avec un menu pas assez large, etc Bref il y a toujours quelque chose qui m'oblige à rajouter un conteneur. Smiley ohwell (parfois c'est le CMS retenu ou le client qui - se chargeant de l'intégration dynamique - exige que chaque bloc découpé soit une division)

Bon maintenant en 2011 avec l'abandon du support d'IE6, la moindre exigence (parfois) vis-à-vis d'IE7 et le support par les bons navigateurs de :before, :after, multi-background et autres bienfaits ça devrait être nettement plus facile Smiley smile
Sujet clos
Aller à