5568 sujets

Sémantique web et HTML

bonjour, c'est mon premier post ici alors je vous remercie d'avance pour toute l'aide que vous pourez peut être me fournir et en espérant que je puisse à mon tour aider d'autres personnes Smiley smile . J'aurais aimer votre avis concernant ceci :

Je recode le site qu'un amis a réalisé avec un editeur de page et voici une page type que je dois convertir en xhtml : ici . La question qui me turlupine est dois-je faire un tableau en y inserant le contenu comme on le vois sur la page ou juste metre photo puis titre et ainsi de suite . (D'apres moi un tableau ne doit contenir que des données, statistiques et pas de photo à moins que je n'ai mal compris le chapitre concernant les tableaux) .
Modifié par Pouet (23 Jan 2007 - 15:45)
Dans ce cas précis, y'as pas photo (heu... enfin si...), un ul bien stylé ira trés bien !
Aprés concernant les "listes" de vignettes pour des photos, personellement, je reste adepte de l'utilisation de tableau pour faire ça (trés pratique pour gérer le positionnement des miniatures/titres sur des planches genre 4 photos par lignes avec vertical-align par exemple).

Mais, n'étant encore qu'un novice sur le sujet, je pourais volontier me laisser contredire Smiley biggrin
Modifié par RobertVonTagada (23 Jan 2007 - 14:35)
Tout d'abord merci pour ta réponse : ) .

Donc d'apres toi tu ferai un ul de ce genre :

<ul>
  <li>soleil</li>

<img alt="photo du soleil"
 src="photo.blabla" />

  <li>terre</li>
<img alt="photo de la terre"
 src="photo.blabla" />
</ul>


mais je ne vois pas vraiment comment tu veux faire en fait car tu parle d'utiliser un tableau en plus... Smiley ohwell
Modifié par Pouet (23 Jan 2007 - 14:49)

<ul>
<li><img src="terre.jpg" alt="terre"> terre</li>
<li><img src="terre.jpg" alt="terre"> terre</li>
</ul>


Quand je parlé de tableau, c'était plus pour faire ça :


<table>
<tr>
<td>une image<br />son titre<td>
<td>une image<br />son titre<td>
<td>une image<br />son titre<td>
</tr>
<tr>
<td>une image<br />son titre<td>
<td>une image<br />son titre<td>
<td>une image<br />son titre<td>
</tr>
</table>

Mais, je ne sais pas si cette solution peut être toléré.
Je l'utilise surtout quand je génère depuis php, avec une variable nb_vign_par_ligne par exemple... mais c'est un autre sujet, mieux vaut prendre exemple sur ce que je propose plus haut !
Modifié par RobertVonTagada (23 Jan 2007 - 14:57)
Ok pour le tableau j'avais la meme idée mais je n'etais pas sur qu'elle soit toléré donc je vais utiliser la première solution que j'avais d'ailleur mis en place mais pas sous forme de unordered list.

ps: je metrais résolu dans quelques heures si personnes ne m'indique d'autre solution pour bien respecté la sémantique.
Modifié par Pouet (23 Jan 2007 - 15:04)
tu peux même envisager des listes de définition ...
voir ce tuto : http://pompage.net/pompe/listesdefinitions/ (voir en bas de page)

Le tableau peut se justifier pour ce que tu montres, vu que, lu en ligne ou en colonne, on lit tjrs le même type d'informations (soit toutes les images, ou tous les noms pour la lecture en colonnes, soit toutes les infos sur une planète pour la lecture en ligne). Cependant, je pense qu'il y a moyen de faire plus joli, même si le tableau *pourrait* convenir dans cet exemple.

EDIT : respecter la sémantique ne veut pas forcément dire respecter la philosophie du document ... Faut faire attention à ça. Tu auras beau avoir un tableau tout ce qu'il y a de plus propre sémantiquement parlant, si dans la philosophie de ton document tu ne présentes pas de données tabulaires, quand bien même la page passera au validateur (qui n'est, rappelons-le, qu'une machine) elle n'aura pas forcément la philosophie de l'HTML ou l'XHTML selon le doctype choisi.

Je pense par exemple à ce que tu mettais plus haut :

<ul>
   <li>vignette</li>
   <li>texte</li>
</ul>


si c'est pour faire 10 fois ça, ça sera sémantiquement correct, mais une seule liste avec des margin et/ou des padding appropriés serait mieux (vu qu'après tout, tu ne souhaites pas présenter 10 listes de 1 planètes mais bien une liste de 10 planètes)
Modifié par Malcolm (23 Jan 2007 - 15:25)
Bonjour,

Pouet a écrit :
(D'apres moi un tableau ne doit contenir que des données, statistiques et pas de photo à moins que je n'ai mal compris le chapitre concernant les tableaux) .


L'élément <table> est un peu particulier en HTML, en ce sens qu'il fait partie des très rares éléments HTML qui tentent d'établir non pas la nature du contenu mais des relations entre contenus.

Autrement dit, il n'existe pas de définition du contenu qui peut ou ne peut pas entrer dans un tableau HTML. Tout au plus peut-on dire que des contenus ayant entre eux des relations représentables sous forme de cellules en lignes/colonnes peuvent être structurées de cette manière : statistiques, textes, images, objects, iframes ou même... tableaux Smiley cligne

<Sgmbl>En revanche, si on pouvait éviter ces fichues listes de définition pour des contenus qui ne définissent rien et qui ne comportent aucune instance de terme à définir... Smiley ravi </>
Modifié par Laurent Denis (23 Jan 2007 - 15:27)
Je n'avais pas penser a l'utilisation d'une liste de définition et je n'avais pas vu cet article sur pompage. je pense me tourner vers cette solution parce que j'ai fait un test avec la ul

<ul>

   <li>Soleil<br />
   <a href="img/soleil.jpg"><img alt="photo du Soleil"
 src="img/soleil.jpg" /></a>

   </li>Terre<br />
   <a href="img/terre.jpg"><img alt="photo de la Terre"
 src="img/terre.jpg" /></a>
 
   etc...

</ul>


et ce n'etait pas top. Merci à tous : )

ps: merci le cache google car l'article sur pompage n'est plus dispo actuellement.
Modifié par Pouet (23 Jan 2007 - 15:44)