Pourquoi ne sommes-nous pas supposés utiliser <table> dans un design?
Quelles sont certaines des raisons claires et logiques pour lesquelles nous ne devrions pas concevoir de sites Web avec des tableaux? Où sont les avantages, qu'est-ce qui a motivé cette idée dans l'industrie? Quand est-il possible d'utiliser une table?
1) Les tableaux ne doivent pas être utilisés pour les mises en page car ils sont:
Lent à rendre car le navigateur doit télécharger la plupart - sinon la totalité - du tableau pour le rendre correctement
Ils nécessitent plus de HTML que les mises en page non-table, ce qui signifie un chargement et un rendu plus lents, ainsi qu'une utilisation accrue de la bande passante.
Ils peuvent être un cauchemar à entretenir car ils peuvent rapidement devenir complexes
Ils peuvent casser la copie de texte
Ils affectent négativement les lecteurs d’écran et peuvent rendre votre contenu inaccessible à certains utilisateurs.
Ils ne sont pas aussi souples que d'utiliser un balisage sémantique approprié
Ils n'ont jamais été destinés à être utilisés pour la mise en page
Il est très difficile de contrôler les tableaux en un format réactif.
2) Utilisez un tableau pour les données tabulaires. C'est à quoi servent les tables.
Voir aussi: Pourquoi les gens font-ils des tables avec des divs?
Les tableaux sont destinés aux données tabulaires et non à la conception. Les gens comprennent souvent mal la motivation derrière la création de pages "sans tableau".
Il est faux d'utiliser des tableaux pour créer votre mise en page. Vous devez utiliser d’autres éléments pour la mise en page (div, listes, sections, articles, en-têtes, pieds de page, apartements, etc.). Et vous pouvez obtenir d'excellents effets avec un minimum de HTML/CSS (laissant votre code sémantiquement significatif, léger et facile à gérer).
Bien sûr, les données tabulaires doivent être à l'intérieur d'un élément de table. Si vous le souhaitez, vous pouvez améliorer la sémantique des tableaux en ajoutant thead, tfoot, tbody, th, th, caption, etc. Tous ces éléments sont destinés à être utilisés avec des tableaux et, croyez-moi, ils peuvent rendre votre tableau beaucoup plus descriptif. .
Donc, le problème est que vous n'allez pas avec une conception basée sur des tables et utilisez n'importe quelle solution HTML/CSS qui vous convient. Commencez à partir du balisage sémantique HTML, puis construisez une conception avec CSS. Cela devrait garder quelqu'un en sécurité. Utilisez ceci comme une règle de base.
Les tableaux sont supposés contenir des données et non des éléments de conception.
Les tableaux ne doivent être utilisés que lors de l'affichage de données tabulaires. Sinon, ils sont généralement un mauvais choix pour l'affichage.
La vraie cause pour ne pas utiliser de tables est:
La disposition par défaut d'une table est la suivante: table-layout:fixed
Cela indique au navigateur d'analyser la table et de réparer les cellules afin qu'elles contiennent les éléments qu'elles contiennent, ce qui prend un certain temps. (c'est pourquoi les tables sont si bonnes pour des données complexes)
Ligne du bas: la table affichera après tout le contenu qu'elle contient est rendu, contrairement à l'utilisation d'éléments DIV, par exemple.