Tableaux / Div

[Aurelsicoko]

Bonjour,

Après la lecture d'un sujet et d'une ouverture faîte par captain_torche, j'ouvre ce sujet pour débattre de la façon de coder un site internet.

Etant nouveau sur le WEB, j'ai appris à coder en div (blocs) mais avant on codait en tableaux et chez certaines personnes, la façon de développer est resté la même soit de développer en tableaux.

Alors, j'aimerai savoir ce qu'apporte le développement en div ? Les moteurs de recherche s'y retrouver mieux ? C'est plus propre ? C'est plus accessible ?

Car, le W3C a mis en place des normes et je pense que si elles sont là, ce n'est pas pour rien

Merci d'éclairer ma lanterne car je suis un peu perdu

[Sarc]

Le problème qui se pose dans ce "débat" est un problème de sémantique. C'est en gros la question "quel outil utiliser pour telle utilisation". Quand on fait une maison, on utilise des briques, des parpaings ou du bois, pas vraiment du sable, du papier... Pour ouvrir une boîte de conserve, on utilise un ouvre-boîtes, pas une cuiller. Pour mettre des données tabulaires, on utilise des tableaux. Pour faire des couches et des blocs de contenu, on utilise des div.

Je suis presque sûr que je pourrais te faire un design rien qu'avec des <ul> et des <li>. Mais est-ce là leur but ?

Après, la limite entre tableaux et d'autres balises est très intéressante : on avait eu un grand débat avec Dudu notamment, sur la délimitation entre les listes de définitions et les tableaux.

Mais bon, après avoir bien appris à faire des designs avec des div, et ce de façon très propre, on arrive à un code compréhensible, simple, et allégé pour tout le monde.

[captain_torche]

En fait, ce que tu appelles un "code aux normes" est très loin de "une page pleine de divs".

Pour commencer, aucune norme n'interdit l'usage des tableaux, même à des fins de présentation de contenu, et les moteurs de recherche s'en sortent très bien avec ce type de sites (C'est le contenu uniquement qui les intéresse, pas les balises utilisées pour le présenter). Le validateur du W3C ne tiquera pas non plus tant que l'imbrication des balises est respectée (On peut très bien avoir un site en tableaux qui passe le validateur W3C).

Par contre, un site codé "en tableaux" est relativement difficile à maintenir : sa structure est figée, et cette manière de coder "à l'ancienne" est souvent liée à une très mauvaise utilisation des CSS.

Les avantages d'avoir un site codé "proprement" sont nombreux : le code source est plus léger, la maintenance est facilitée, et lorsque les balises sont utilisées correctement dans leur contexte sémantique, les lecteurs d'écran (pour les internautes ayant des déficiences visuelles, par exemple) s'en sortent bien mieux.

Nombreux sont ceux qui, lorsqu'ils critiquent les designs tabulaires, parlent uniquement de divs. Ceux-là n'ont malheureusement rien compris : il est inutile de passer d'une bouillie de balises table, tr et td, pour passer à une bouillie de balises div.

Par définition, un "div" n'est rien d'autre qu'un diviseur. Avec la balise "span", ce sont les seules balises HTML qui ne véhiculent aucune sémantique. Pour avoir un code correct, il est nécessaire d'utiliser chacune des balises dans son contexte : un paragraphe devra être encadré de balises "p", par exemple. Une liste d'éléments (au sens large : même un menu peut être considéré comme une liste), avec des balises "ul" et "li". Un titre avec la balise appropriée "h1 - h6", en fonction de sa position hiérarchique dans la page. Un tableau sera rendu avec les balises "table" et consorts ! (J'en ai vu certains qui essayaient de remplacer des données tabulaires par des divs parce que "les tableaux c'est pas bien").

Dans cette optique, il ne faut utiliser les divs qu'en dernier recours, principalement pour séparer différents blocs de contenu, ou pour encadrer un élément de contenu, quand aucune autre balise n'a de sens.

Edit : pour plus d'infos, je vous invite à lire l'article d'OpenWeb, les problèmes de la mise en page par tableaux.

[Aurelsicoko]

D'accord, je comprends mieux. Si par exemple, j'ai une div qui n'est là que pour afficher une image avec la propriétés background autant mettre une balise <img />.

Mais, quand on ouvre son site web aujourd'hui, il est quand même conseillé de coder en div, p, hx, ... que en tableaux par rapport à la simplicité et la propreté du code.

Merci