5568 sujets

Sémantique web et HTML

Tout d'abord bonjour à tous,

Après m'être bien documenté sur ce site, j'ai décidé moi aussi de me mettre à faire des designs sans utiliser la balise <table>, tout faire en <div> et full css.
Et après quelques problèmes, j'arrive finalement à manier correctement le css Smiley smile

Mais voila la question que je me pose : faut-il quand même continuer à utiliser des <table> ? Même sur alsacréation, les forums et d'autres parties du site comporte des <table>.

J'ai bien lu dans un des tutoriels du site que les <table> devaient être utilisées pour les vrais tableaux de données ou les forum...

A la limite je comprends pour les tableaux de données bien qu'on puisse utiliser des <div> mais pourquoi aussi dans les forums ? On peut pas faire un forum sans <table>, juste avec des <div> ?

J'avoue que je suis un peu perturbé par ce point, moi qui était surpris et content qu'on puisse faire des sites sans <table> ^^ Pourquoi les utiliser encore ?
Modifié par Gunth3r (05 Jan 2007 - 16:17)
Salut !

Il ne faut surtout pas penser qu'utiliser des <table> c'est mal.
C'est la manière dont tu les utilises et dans quel contexte.

Pour un tableau de données(statistisques) ou pour un formulaire de contact par exemple, un <table> à mon sens est tout adapté.

Ce qui est à proscrire surtout se sont les imbrications de <table>.
Merci de me répondre aussi vite Smiley smile

Je comprend que les tables soient utilisées pour un tableau statistiques mais pourquoi dans un formulaire de contact ?

Patidou : je n'ai pas bien saisi la notion de "données tabulaires"
Gunth3r a écrit :

Je comprend que les tables soient utilisées pour un tableau statistiques mais pourquoi dans un formulaire de contact ?


Perso, je ne suis pas très d'accord d'utiliser un tableau pour présenter un formulaire, c'est contraire à la sémantique. Smiley cligne

Gunth3r a écrit :


Patidou : je n'ai pas bien saisi la notion de "données tabulaires"


Les données tabulaires c'est simplement un tableau de données (comme dans excel ou access). Du moment qu'il y a des données toutes les mêmes misent sur plusieurs lignes et définies par des titres de colonnes, ce sont des données tabulaires.
Ah d'accord, je vois !

Donc pour résumer, tableaux de données (statistiques) et forums en <table> et le reste en <div>.

Pour ce qui est des news sur une page d'accueil, il vaut mieux utiliser des <div> à ce que je vois, non ?
Gunth3r a écrit :
Ah d'accord, je vois !

Donc pour résumer, tableaux de données (statistiques) et forums en <table> et le reste en <div>.

Pour ce qui est des news sur une page d'accueil, il vaut mieux utiliser des <div> à ce que je vois, non ?
Heu non, pas nécessairement... Il n'y a pas de règles fixes, cela dépend directement du contenu... Pour des news, on pourra utiliser le couple h(n)/p, des listes imbriquées, des listes de définitions, etc.

Un peu de lecture? Respecter la sémantique XHTML Smiley cligne
Modifié par Benjamin D.C. (05 Jan 2007 - 17:11)
Oui enfin dans l'article il ne parle pas bien des tableaux

C'est bon, je pense avoir bien compris.
Les forums formant une sorte de "tableau" avec plusieurs "encadrements", il parait effectivement plus logique de les faire dans un tableau html.

J'ai réalisé une Shoutbox, un petit module qui permet aux utilisateurs d'envoyer des petits messages sur la page d'accueil rapidement.

Je l'ai faite qu'avec des divs et du css

En voici un aperçu :

http://pix.nofrag.com/69/46/b7e0f85cf7bce77c9b47d1816599.jpeg

Celle-ci comportant régulièrement les 3 informations "pseudo", "heure" et "message", il serait peut être plus logique que je fasse un tableau pour les afficher ?
Modifié par Gunth3r (05 Jan 2007 - 17:30)
Gunth3r a écrit :
J'ai réalisé une Shoutbox, un petit module qui permet aux utilisateurs d'envoyer des petits messages sur la page d'accueil rapidement.

Je l'ai faite qu'avec des divs et du css

En voici un aperçu :

http://pix.nofrag.com/69/46/b7e0f85cf7bce77c9b47d1816599.jpeg

Celle-ci comportant régulièrement les 3 informations "pseudo", "heure" et "message", il serait peut être plus logique que je fasse un tableau pour les afficher ?

Disons que cette organisation ne correspond pas tout à fait à la logique d'un tableau. Si on respectait la logique d'un tableau de données, chaque message serait sur une ligne, avec trois colonnes : pseudo, heure, message.
Avec ce genre de structure sur deux lignes, ça devient tout de suite moins évident (et en tout cas pas obligatoire ni forcément « logique ») d'utiliser un tableau.

Je pense que dans ce cas précis je ferais quelque chose comme ça :
<p><strong>Pseudo</strong> <span>Heure</span></p>
<p>Contenu du message.</p>

À moins que l'on veille utiliser un titre de niveau (hN) à la place du premier paragraphe...
Ensuite, en CSS, on devrait s'en tirer très bien (même si ça peut demander de connaitre quelques subtilités).
Pour répondre à la question générale :

Quand peut-on utiliser les tableaux

On peut commencer par rappeler que les tableaux ne sont pas nécessairement inaccessibles aux aveugles et malvoyants, par exemple. Si on les utilise, on tâchera surtout d'éviter deux écueils :
1 - les tableaux imbriqués les uns dans les autres ;
2 - les tableaux ou l'organisation des contenus fait que la lecture linéaire (ligne par ligne, de gauche à droite) ne permet pas de restituer le sens.

Une fois que l'on sait ça, on peut utiliser les tableaux dans deux cas :

1 - Pour présenter des « données tabulaires »
Le problème, c'est qu'il y a controverse sur ce qui est « donnée tabulaire » ou pas. Un tableau de statistiques, pas de problème. Mais pour un formulaire, avec des couples label+input, peut-on faire un tableau avec une colonne de labels à gauche (intitulés des champs de saisie), puis une colonne d'input (champs de saisie) à droite ?
Certains diront qu'un tableau est un mode de présentation des données qui établit des liens à la fois horizontaux (succession des informations) et verticaux (nature des informations), et que l'usage de <table> pour le cas décrit précédemment est justifié. D'autres diront que c'est tiré par les cheveux, et que la démonstration est non seulement contestable, mais en plus sert surtout à justifier l'emploi d'une technique qui nous arrange bien pour réaliser la présentation d'un formulaire, par exemple.
Le débat reste ouvert.

2 - Pour réaliser une mise en page difficile à mettre en place autrement
Là, on sombre largement dans le pragmatisme le plus vil : si ça vous prend 10 minutes pour mettre sur pied une solution accessible (cf. les réserves ci-dessus) en tableaux, et que la même mise en page demanderait beaucoup plus de travail sans tableau, pour un résultat pas forcément fiable, alors banco : on utilisera un tableau. Surtout si on a des contraintes de productivité.
De plus, dans certains cas très précis on rencontrera des choses impossibles à réaliser correctement juste avec les CSS. Dans ce cas, il n'est pas honteux d'utiliser un tableau !
À accessibilité égale, entre une solution avec un tableau et une solution sans tableau, on choisira la solution que l'on estimera la plus performante, selon plusieurs critères ; entre autres : robustesse, compatibilité avec les navigateurs, facilité de la maintenance, et facilité de mise en place.
Attention cependant à ne pas comptabiliser le temps d'apprentissage dans la « facilité de mise en place ». L'ignorance n'est pas une excuse. Smiley lol


Voilà. Je précise au cas où que malgré le ton très généraliste de cette intervention, je parle en mon nom et de mon point de vue personnel. Je n'ai pas la science infuse. Smiley cligne
Quelles réponse bien fournie mpop ! Merci Smiley lol
Pour le débat sur les données tabulaires, je pencherai plutôt pour la deuxième catégorie de personnes, je trouve un peu inutile de mettre les labels dans une colonne et les inputs dans l'autre... à moins qu'on veuille tout bien aligner éventuellement...

Ma shoutbox ne correspondrait donc pas vraiment à la sémantique d'un tableau, donc oui, je vais peut être bien laisser en css.