5568 sujets

Sémantique web et HTML

Bonjour,

je suis confronté à un petit problème de sémantique concernant une liste !
En gros je dois afficher une liste séparée par des libellés, ça donnerai quelque chose dans ce genre la :

Titre 1
Liste 1
Liste 2
Liste 3
Titre 2
Liste 4
Liste 5
Titre 3
Liste 6
Liste 7

Naturellement je ferais quelque chose comme ça en html :

<strong>Titre1</strong>
<ul>
<li>Liste 1</li>
<li>Liste 2</li>
<li>Liste 3</li>
<strong>Titre2</strong>
<li>Liste 4</li>
<li>Liste 5</li>
<strong>Titre3</strong>
<li>Liste 6</li>
<li>Liste 7</li>
</ul>


Mais bien sur sémantiquement ce n'est pas correct, il n'est pas possible d'imbriquer un élément <strong> directement dans un <ul>. Avez vous une solution? Smiley smile

Merci d'avance !
Modifié par psykhe (09 Mar 2012 - 14:42)
Il me semble que <li> doit être l'enfant direct de <ul> ou <ol>...pourquoi ne pas faire des liste séparées et mettre en <h*> pour tes titres.
Hello. A voir selon l'usage, mais je verrais bien :
<ul>
	<li><strong>Bla</strong></li>
	<li>Liste 1</li>
	<li>Liste 2</li>
	<li>Liste 3</li>
	(...)
</ul>
Voire mieux :
<ul>
	<li>
		<hx>Bla</hx>
		<ul>
			<li>Truc 1</li>
			<li>Truc 1</li>
			<li>Truc 1</li>
		</ul>
	</li>
	(...)
</ul>
Après à voir si l'usage de la liste est pertinent dans le cas présent. La seule utilisation pertinente de titres dans une liste qui me viennent rapidement en tête, c'est une table des matières, le reste du temps, c'est qu'il y a un souci.
Salut,
psykhe a écrit :
<strong>Titre1</strong>

Ne trouves-tu pas qu'il y a, effectivement, un problème quand tu considères qu'il y a un titre sans pour autant utiliser l'un des éléments h1 à h6 ? Smiley rolleyes

Moi, je procéderais comme suit (une solution plus simple que celle proposée par Florian) : un titre de section (hN, N étant le niveau le plus approprié selon le contexte de la hiérarchie des titres), suivi d'une liste ul, et ainsi de suite.
a écrit :
un titre de section (hN, N étant le niveau le plus approprié selon le contexte de la hiérarchie des titres), suivi d'une liste ul, et ainsi de suite.


+1
Victor BRITO a écrit :
un titre de section (hN, N étant le niveau le plus approprié selon le contexte de la hiérarchie des titres), suivi d'une liste ul, et ainsi de suite.
C'est ce qui me semblait le plus clean aussi, mais apparemment, psykhe a besoin d'une seule liste (voir son deuxième post).

Maintenant, sans plus de détails sur le cas d'utilisation, difficile de répondre précisément.
Bonjour,

La structure indiquée par Victor est la bonne. Schématiquement:
<h2>Un titre</h2>
<ul>
  ...
</ul>

<h2>Un autre titre</h2>
<ul>
  ...
</ul>


Si le besoin est d'afficher un compte de numéros, tu peux:
- les écrire en dur dans chaque item de liste;
- ou bien utiliser des OL avec un attribut start;
- ou encore des OL avec des attributs value sur les LI.
<h2>Un titre</h2>
<ol start="1">
  ...
</ol>

<h2>Un autre titre</h2>
<ol start="5">
  ...
</ol>
fvsch a écrit :
utiliser des OL avec un attribut start

Auquel cas on emploiera un doctype HTML 4.01 ou XHTML 1.0 en mode transitionnel ou un doctype HTML 5, le mode strict du HTML 4 et du XHTML 1 n'autorisant pas l'attribut start.