Imbriques balises dans <li> ?

Bonsoir,

Voici ma question : je dois afficher une liste de blocs contenant chacun une miniature cliquable (avec lien donc) et un autre lien en-dessous.

J'ai pensé que la solution la plus appropriée pour cela était une liste non-ordonnée ? Aie-je bien choisi ?

Si oui, je voulais savoir si il était possible de faire quelque chose comme ça :

<ul>
  <li>
    <h2>Photo numéro 1</h2>
	  <a href="" title=""><img src="" alt="" /></a>
	  <p><a href="" title="">Lien 1</a></p>
  </li>
  <li>
    <h2>Photo numéro 2</h2>
	  <a href="" title=""><img src="" alt="" /></a>
	  <p><a href="" title="">Lien 2</a></p>
  </li>
  <li>
    <h2>Photo numéro 3</h2>
	  <a href="" title=""><img src="" alt="" /></a>
	  <p><a href="" title="">Lien 3</a></p>
  </li>
</ul>

Merci de votre réponse,

dig ^_^
Modifié par Dig (19 Jul 2006 - 23:31)

Hmm oui pourquoi pas. Il me semble que li accepte tout élément de type bloc ou en-ligne comme contenu.

Par contre, utiliser des h2 c'est peut-être un peu fort, ou de niveau un peu trop haut pour ta structure de page. À vrai dire, s'agit-il vraiment de « titres de section » ? Les Hn ne sont pas forcément ce qu'il y a de plus adapté à ton cas, et il se peut qu'un simple strong puisse faire l'affaire.

Question à se poser : veut-on que chaque titre d'image apparaisse dans une table des matières, si jamais l'on faisait un plan de la page ?
De plus, certains lecteurs d'écran utilisent les titres Hn (je ne sais pas jusqu'à quel niveau) pour permettre aux utilisateurs de naviguer plus rapidement d'une partie à l'autre d'un site. S'il y a dans la page 50 photos, et donc 50 h2, ça peut faire beaucoup…

Sinon, au niveau de la structure, il y a peut-être un intérêt à utiliser une liste de définition.

Bonjour,

mpop a écrit :

Par contre, utiliser des h2 c'est peut-être un peu fort, ou de niveau un peu trop haut pour ta structure de page

Les éléments de titrage n'ont pas de poids "en eux-mêmes". En d'autres termes, le "n" d'un titre <hn> découle mécaniquement du niveau de titrage supérieur et de la structure naturelle du contenu.

Ici, on peut tout à fait avoir une page où n'existent que des sections de second niveau titrées <h2> dans une ou plusieurs sections principales titrées <h1>.

Il y a en revanche surcharge avec la liste non ordonnée (qui n'est pas nuisible, mais simplement inutile si les titres sont présents).
Il y a donc un choix à faire selon le contenu complet de la page (qui serait à voir plus en détail):
- au mieux, conserver les <h2> (ou le niveau de titrage approprié dans la structure du document) et de supprimer les <ul><li>.
- sinon, supprimer les <h2> et ne conserver que les <ul><li>

Je privilégie le titrage sur les listes, les titres étant des éléments beaucoup plus significatifs et exploitables.

mpop a écrit :

De plus, certains lecteurs d'écran utilisent les titres Hn (je ne sais pas jusqu'à quel niveau) pour permettre aux utilisateurs de naviguer plus rapidement d'une partie à l'autre d'un site. S'il y a dans la page 50 photos, et donc 50 h2, ça peut faire beaucoup&#8230;

Non, ce n'est pas problématique en soi : de toutes manière, parcourir 50 items dans une synthèse vocale sera fastidieux quelque-soit la structure (titres, listes, tableaux...).

Ce n'est pas le choix de titrer ou de ne pas titrer qui est en cause. C'est le contenu lui-même qu'il faudrait revoir. En amont des structures accessibles, il y a des contenus accessibles

mpop a écrit :

Sinon, au niveau de la structure, il y a peut-être un intérêt à utiliser une liste de définition.

Perte de sens, d'information et d'accessibilité. C'est finalement la structure la plus pauvre, quand on en fait cet usage "élargi".

En perdant leur spécificité (de liste de définition), et à force d'usages détournés, les <dl> deviennent un élément tout aussi générique que <div>, mais aussi tout aussi appauvrissant que les <div class="titre"> dont leurs <dt> finissent notamment par jouer le rôle.

Une sorte de html vaporeux, en somme

Finalement, le seul cas où <dl> pourrait garder un sens tout en servant de manière générique, ce serait en le considérant comme le 7 niveau de titrage, c'est à dire obligatoirement au terme d'une structure complète de <h1> à <h6>... en le justifiant par le fait qu'<h7> n'existe pas. Mais cerait un autre HTML
Modifié par Laurent Denis (20 Jul 2006 - 06:17)

Alors personellement là j'utiliserais des DL, je pars également du principe que trop de titre tu le titre.
Mais ul+hn, je suis d'accord pour dire que c'est trop et qu'il faudrait éjecter l'un ou l'autre.
Les listes non ordonnées conviennent très bien lorsque les items sont relativement courts, ce qui ne convient pas ici. D'ailleurs je trouve que les specs HTML ont eu une mauvaise idée en autorisant l'utilisation d'éléments de type bloc dans les <li>.
Modifié par QuentinC (20 Jul 2006 - 07:08)

QuentinC a écrit :
je pars également du principe que trop de titre tu le titre.

Ah, quelqu'un pour me soutenir !
Je suis globalement d'accord avec les remarques de Laurent, mais je me souvenais des interventions de Quentin qui disait que le titrage Hn était très pratique pour naviguer dans une page. Du coup, du Hn en pagaille…

Ensuite, tout dépend du contenu de la page.
Bien souvent je trouve, on a tendance à mettre peu de titres car on les réserve pour les noms de sites ou les titres d'articles. C'est un usage un peu restrictif pour des titres de section.
Ces temps-ci, j'ai tendance à rajouter des titres qui seront minimisés ou cachés visuellement, pour introduire des sections dont le rôle est facilement compréhensible via la mise en page graphique. Par exemple :

H1 Titre du site
	H2 Menu de navigation
		UL
	H2 Autres liens
		UL
H1 Titre du contenu de page
	Contenu structuré (avec si besoin titres H2 à H6)

Ça n'est pas une structure type car tout dépendra du site ou du document, bien sûr.

QuentinC a écrit :
D'ailleurs je trouve que les specs HTML ont eu une mauvaise idée en autorisant l'utilisation d'éléments de type bloc dans les <li>.

Ou bien ne l'autoriser que pour ul et ol ? Histoire de permettre des hiérarchisées…

mpop a écrit :

Ou bien ne l'autoriser que pour ul et ol ? Histoire de permettre des hiérarchisées&#8230;

Bouh ! Il y a déjà assez d'exclusions et d'inclusions dans les DTD SGML du HTML (le sujet ayant l'objet d'empoignades parfois musclées, d'ailleurs). Et en XML, la DTD ne peut pas exprimer ces inclusions... On évite, donc, pour rester simple
Modifié par Laurent Denis (20 Jul 2006 - 14:14)

Merci pour vos réponses très intéréssantes . Je pense avoir compris le principal, mais je n'arrive toujours pas à me décider quant à la méthode à utiliser. J'avais auparavant pensé à simplement mettre chaque couple miniature/lien dans un <div> classé, mais je pensais qu'il serait plus simple de faire autrement...

Vous pouvez vous faire une idée ici : http://www.kits-gratuits.net/v2/kits/. Comme vous pouvez le voir, la méthode que j'avais utilisé est celle des <div>, mais je voulais savoir si à partir de cette page vous pouviez m'orienter vers telle ou telle solution.

Merci beaucoup =).

a écrit :

Je suis globalement d'accord avec les remarques de Laurent, mais je me souvenais des interventions de Quentin qui disait que le titrage Hn était très pratique
pour naviguer dans une page. Du coup, du Hn en pagaille…

Oui, par exemple jaws permet d'obtenir un menu proposant de choisir un titre pour y commencer la lecture.
Si ce menu est trop long, il devient tout aussi fastidieux que de parcourir la page...

Une solution à m'apporter ^_^ ?