Comment éviter le piège de la mise en page à base de table de html5

Les tables sont assez grande. Ils sont un excellent moyen de présenter certains types de données en utilisant HTML5. Lorsque vous ajoutez les concepts et, vous pouvez utiliser des tableaux pour créer des mises en page très intéressantes. En fait, en raison de la vieille école HTML n'a pas vraiment toute sorte de technologie de mise en page, un grand nombre de développeurs est venu avec quelques dispositions assez étonnantes basées sur les tables.

Utilisation de tableaux pour la présentation provoque quelques problèmes mais, comme

  • Les tables sont pas destinés à la mise en page. Les tableaux sont conçus pour la présentation des données, et non pas la mise en page. Pour faire des tables de travail pour la mise en page, vous devez faire beaucoup de hacks sournois, comme les tables imbriquées dans d'autres tableaux ou des images invisibles pour l'espacement.




  • Le code se complique vite. Tables impliquent beaucoup de balisage HTML. Si le code implique tables imbriquées les unes dans les autres, il est très difficile de se rappeler quel élément est lié à ce qui rangée de quelle table. Mises en page basée sur la table sont très difficiles à modifier à la main.

  • Le formatage est fait cellule par cellule. Une page Web pourrait être composé de centaines de cellules de tableau. Faire un changement dans la police ou la couleur implique souvent des changements dans des centaines de cellules à travers la page. Cela rend votre page moins souple et plus difficile à mettre à jour.

  • Présentation est liée étroitement aux données. Une mise en page basée sur la table mêle étroitement les données et leur présentation. Cela va à l'encontre de l'objectif principal de la conception de sites Web - séparation des données à partir de sa présentation.

  • Mises en page basée sur la table sont difficiles à changer. Après avoir créé une mise en page basée sur des tables, il est très difficile d'apporter des modifications parce que toutes les cellules du tableau ont un effet potentiel sur les autres cellules.

  • Mises en page à base de tables causent des problèmes pour les lecteurs d'écran. Les personnes ayant une déficience visuelle utilisent un logiciel spécial pour lire des pages web. Ces lecteurs d'écran sont bien adaptés à lire des tableaux comme ils étaient destinés (pour gérer les données tabulaires), mais les lecteurs d'écran ont aucun moyen de savoir quand la table est utilisé comme une technique de mise en page plutôt que d'un outil de présentation de données. Cela rend configurations basées sur des tables moins conforme aux normes d'accessibilité.

  • Mises en page basée sur la table ne sont pas bien adaptées. Les utilisateurs modernes attendent à exécuter des pages sur les téléphones cellulaires et tablettes ainsi que des machines de bureau. Conceptions basées sur des tables ne échelle pas facilement à ces facteurs de forme plus petits.

Résistez à la tentation d'utiliser les tables HTML. Utilisez des tableaux pour faire ce qu'ils sont conçus pour: la présentation des données. Les approches à base de CSS que vous pouvez utiliser pour générer toute sorte de mise en page visuelle vous voudrez peut-être plus facile, plus fiable, et beaucoup plus souple.


» » » » Comment éviter le piège de la mise en page à base de table de html5