Inscris-toi au e-camp "Héberge ton jeu Facebook sur Azure" de Microsoft vendredi 25 mai à 13h30 !

> Le Site du Zéro - Informatique > Les forums > Site Web > HTML / CSS > Les raisons pour ne pas créer de sites en tableaux > Lecture du sujet

Les raisons pour ne pas créer de sites en tableaux

Pour accéder à cette section
Connectez-vous !

Auteur	Message
Page 1 2 3 4 5 6 Suivante
1 visiteur sur ce sujet (1 Anonyme)
Page 1 2 3 4 5 6 Suivante
nicknick63	# Posté le 18/04/2007 à 15:04:06
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Depuis que j'essaie d'aider les personnes ayant des problèmes avec leur site web, je suis très souvent confronté au problème des sites en tableaux. Seulement, la plus part de ceux qui en créent et qui ont des problèmes avec ne veulent pas changer, car ils ne voient pas l'intérêt, ils se disent sûrement que ça ne viens pas de là... Mais voilà, les sites en tableaux sont un vrai fléau sur le net, et je vais essayer de vous expliquer pourquoi. Ne m'accusez pas de troll, je vais essayer de relater la vérité, ce n'est pas mon point de vue personnel que je donne là, mais celui de toutes les personnes qui veulent le bien du web, dont la W3C. Les points positifs : Si il y a tant de sites en tableaux sur le web, il doit bien y avoir des raisons... Voila celles que j'ai trouvées, elles peuvent bien entendu paraître ambiguës a certains. Quand on conçoit un design, on a souvent une vision un peu tabulaire du squelette, surtout avec certaines dispositions. Pour un débutant, les tableaux paraissent plus simple a utiliser, car on a déjà la base sans utiliser le css Il y a plusieurs balises, ce qui donne une impression de possibilités plus forte qu'avec les div Voilà, c'est a peu près tout ce que j'ai trouvé, mais si vous avez des idées, n'hésitez pas a me le signaler . les points négatifs Cette partie risque d'être un peu plus conséquente étant donné qu'il y a beaucoup plus de points négatifs ! La lenteur Les tableaux n'étant pas faits pour la structure d'un site, ils ne sont pas optimisés pour cette tache, ce qui fait que leur affichage est beaucoup plus lent pour le navigateur. Cet affichage nécessite beaucoup de ressources que ce soit pour la mémoire vive, ou bien pour le processeur... D'ailleurs quand on scroll (descend dans la page) sur un site en tableaux, souvent, on constate nettement un ralentissement... Donc en gros, si vous voulez un site qui s'affiche rapidement et qui ne se ralentisse pas quand on scroll, évitez d'utiliser uniquement des tableaux, et notamment de les imbriquer. L'inaccessibilité L'accessibilité est l'une des choses les plus importantes en informatiques, et pourtant, beaucoup de webmasters ont tendance à l'oublier... Un site accessible est un site sur lequel tout le monde peux naviguer sans problèmes, que ca soit vous, moi, une personne avec un ordinateur ou un brownser archaïque, ou bien encore une personne atteint d'un handicap. Or, avoir un site accessible a tout le monde est très important sur tout les plans, que ca soit pour le nombre de personnes qui pourrons se servir de votre site, ou bien encore pour votre référencement sur les moteurs de recherche... Cependant, les tableaux, surtout ceux imbriqués, ne sont pas accessibles, car ils posent problème notamment aux personnes atteintes d'un handicap. En plus, il est plus dur de créer un site valide aux normes de la W3C avec les tableaux. En effet, ils déconseillent très fortement cette utilisation, même si leur validateur ne peut pas détecter leur bonne ou mauvaise utilisation, certaines techniques utilisées ne sont pas du tout valides avec les tableaux, tandis qu'elles le sont avec les div. La difficulté d'entretien Bien qu'ils permettent aux débutants de structurer soi disant plus facilement leur design, les tableaux sont plus difficiles a modifier que les div. Par exemple, si vous voulez modifier la largeur d'une de vos cellules, vous devrez le faire sur toutes vos pages, tandis qu'avec les div et le css, vous n'aurez qu'a modifier un petit chiffre dans feuille de style... Oui, mais moi, je met la taille de mes cellules dans mon css, donc je n'ai plus ce problème... Bon, ok, mon exemple laisse a désirer, mais si vous voulez un jour changer la structure de votre site, avec les div, vous n'aurez qu'a changer 2-3 balises et une petite partie du css, alors qu'avec les tableaux, c'est tout le html et le css qui est a revoir, ce qui est une perte de temps considérable ! Le poids Les tableaux prenant beaucoup plus de place que les div dans le html, le fichier est donc nettement plus lourd... et figurez vous que c'est exactement la même chose pour le css ! Donc non seulement les tableaux sont plus longs a afficher, mais ils prennent plus de poids sur le serveur, et mettent donc plus longtemps a charger. Si vous avez un petit hébergeur de quelques Mo, vous risquez vite d'être a court d'espace libre si vous restez avec un squelette aussi archaïque. Les difficultés d'impression Si votre site est intéressant, il y a de grandes chances pour que certains de vos visiteurs cherchent a imprimer quelques unes de vos pages... Mais si vous utilisez un design en tableaux, il sera massacré par l'éditeur de texte pour rentrer dans la page, tandis qu'avec les div, il sera modifié, mais au moins, l'ordre sera respecté. Vous pensez bien que si il faut complètement modifier chaque page que l'on veux imprimer, ça risque de très vite devenir long... Conclusion Bon, après ça, certains d'entre vous n'aurons toujours pas compris pourquoi il faut utiliser les div, et d'autres, au contraire, ne voudrons plus jamais utiliser de tableaux de leur vie . Mais le but de ce topic est de ne tomber dans aucun de ces deux extrêmes ! Je pense qu'avec tout ce que je vous ai dit, il y a plus de chances que vous soyez dans le camp de ceux qui refusent d'utiliser les tableaux. Mais ce qu'il faut bien comprendre, c'est qu'il ne faut surtout pas les bannir ! déjà, pour toutes les données tabulaires, il n'y a que cette solution qui soit fiable, et même pour certaines parties de votre design. Parfois, il est beaucoup plus lourd d'utiliser les div et certains hack css qu'un tableau, même si ça reste relativement rare. Donc en gros, ne faites pas tout votre design en tableaux, mais utilisez les div ainsi que quelques tableaux, en faisant bien attention a ne pas en abuser et a éviter de les imbriquer. Liens externes : ce sujet étant récurant sur le net, les liens en rapport sont donc conséquents ! Les problèmes de la mise en page par tableaux - Oppenweb En quoi la mise en page par tableaux est-elle stupide - Cybercodeur Maléfiques tableaux ! - Alsacréation Tableaux V/S CSS - Pompage.net La preuve qu'on peux complètement changer un design en div juste avec des CSS différents -Css Zen Garden L'ordre des données dans un tableau - AccessiWeb A l'assaut de l'accessibilité ! - LiberT PS: Si vous avez des suggestions, si vous voulez approfondir un point, ou si vus n'êtes pas d'accord avec moi, répondez tout simplement a ce message, tout en évitant bien le troll . Édité le 18/04/2007 à 17:45:37 par nicknick63 Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
Publicité	# Posté le 18/04/2007 à 15:04:06

anonyme	# Posté le 18/04/2007 à 15:12:07
	juste une question, les sites étaient en tableau avant le css ?
nicknick63	# Posté le 18/04/2007 à 15:14:43
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Oui, mais le tableaux se sont surtout développés à l'arrivée du border: 0px Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
nicknick63	# Posté le 19/04/2007 à 20:19:44
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Un petit up et une petite édition . Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
lumiru	# Posté le 19/04/2007 à 20:40:01
	Très bonne idée ce topic. Personnellement, j'utilisais les tableaux jusqu'à ce qu'on me fasse une remarque à propos de mon dernier design. Aujourd'hui, je n'utilise que les div et c'est vraiment beaucoup plus pratique. Je n'avait toujours pas vraiment compris pourquoi mais grâce à ce topic, je comprends beaucoup, beaucoup mieux. Édité le 19/04/2007 à 20:41:50 par lumiru
iKs	# Posté le 19/04/2007 à 20:41:23
Find it. Fix it.	Intéressant même si je n'apprend rien, mais tu va le transformer en tuto ? Ubuntu user - GNOME user - Ruby user - XML user
nicknick63	# Posté le 19/04/2007 à 20:46:21
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	je ne sais pas encore si ca en vaux la peine... Mais peut être qu'en le mêlant avec autre chose, ca pourrait en devenir un... Par exemple, comment passer d'un design en tableaux a un design en div... Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
rainbowspiky	# Posté le 19/04/2007 à 20:53:50
développeur & consultant Web	Très bon message. J'ai un tuto en cours. Effectivement le plus dur est de dire comment changer plutot que juste critiquer. Eventuellement je peux le publier (pas avant deux semaines) et puis les critiques l'amélioreront rapidement... Édité le 19/04/2007 à 20:55:49 par rainbowspiky Mon micro- blogue Signez la pétition pour l'accessibilité des services en ligne ! IUT de Mulhouse (UHA) : Vie Etudiante. Mes bouts de code PHP. Groupe "Site du Zéro" sur FaceBook. N'oubliez ni la recherche ni le lien "résolu". Merci ! Liens sur les standards du Web : introduction, présentation approfondie, 10 raisons (d'autres raisons), FAQ, importance, avantages (dont commerciaux), lexique, passage, développement ; introduction à l'accessibilité. FAQ décideurs. AlsaCréations. OpenWeb.
nicknick63	# Posté le 19/04/2007 à 22:00:52
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	D'accord . Mais si tu veux mon aide, n'hésite pas a me contacter. Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
Kanor	# Posté le 20/04/2007 à 08:08:47
Groupe : Bannis	Il ne s'agit pas non plus de faire une surcouche de div, ce qui est fréquent sur les sites des zéros, notamment dû à un exemple foireux de M@teo21 dans son cours : Code : HTML <div id="pied_de_page"> <p>Copyright "Tout pourri Corporation" 2005, tous droits réservés</p> </div> alors que que la balise "<p>" suffirait. Code : HTML <p id="pied_de_page">Copyright "Tout pourri Corporation" 2005, tous droits</p> Mettre des div aussi inutiles que cela, cela s'appelle mettre de la présentation dans la page HTML, tout comme les tableaux. Édité le 20/04/2007 à 08:16:28 par Kanor
iKs	# Posté le 20/04/2007 à 12:58:41
Find it. Fix it.	Oui tu as raison Kanor seulement généralement on met plus qu'un paragraphe dans le pied de page, donc il pourrai être intéressant de rajouter un p mais pas de virer la div (AMHA) histoire de comprendre que le div est sensé contenir une division entière du document et pas juste une paragraphe… Ubuntu user - GNOME user - Ruby user - XML user
Perlejade	# Posté le 20/04/2007 à 13:14:41
Voit des formats partout	C'est une connerie de dire "les divs" par opposition aux tableaux ; les divs ne sont qu'une balise parmi d'autres, qui peut (et doit) être utilisée pour structurer le document, ou comme balise neutre si on a besoin d'un élément qui ne correspond à rien. L'opposé des tableaux de présentation, c'est du HTML qui se fonde sur le sens des balises et qui laisse la présentation au CSS, c'est-à-dire du HTML tout court, vu que c'est pour ça qu'il est fait. Liberté, ha ben ouais quoi.
nicknick63	# Posté le 20/04/2007 à 18:23:03
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Oui, mais je dit les div pour aller plus vite . De toutes facons, comme je parle de la structure du site, ce sont surtout les balises div et span qui sont utilisées, et puisque j'aime pas trop les span... Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
Perlejade	# Posté le 08/05/2007 à 19:57:36
Voit des formats partout	Ben non. La structure d'une dissert', ça serait pas seulement les parties et sous-parties (qui seraient des div en HTML), mais aussi les paragraphes (p) et titres (h[1-6]). Pour la structure d'un site, ben c'est pareil. Liberté, ha ben ouais quoi.
nicknick63	# Posté le 08/05/2007 à 20:35:42
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Mouais... je ne suis pas tout a fait d'accord, je ne parle pas de sémantique, mais de structuration du design... Parce que de toutes façons, quand tu utilise les tableaux, tu met quand même les balises p, hx, li... Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
darkpower	# Posté le 09/05/2007 à 10:37:13
	il faut dire que des logiciel comme photoshop, qui permettent de faire des maquette de site, propose de creer la page html, qui va avec, en tableau, et quand on sait bien utiliser photoshop ont peut TOUT faire(paragraphe,titre...) Comme c'est plus simple de cliquer sur le bouton "creer la page html" que de taper tout le code, les gens (les féniant lol) n'ont pas envi de tout refaire en div(mais moi c'est pas mon cas). Édité le 09/05/2007 à 10:38:06 par darkpower
boomy bx	# Posté le 09/05/2007 à 11:44:50
boomy vous salue bien	Citation : darkpower il faut dire que des logiciel comme photoshop, qui permettent de faire des maquette de site, propose de creer la page html, qui va avec, en tableau, et quand on sait bien utiliser photoshop ont peut TOUT faire(paragraphe,titre...) Comme c'est plus simple de cliquer sur le bouton "creer la page html" que de taper tout le code, les gens (les féniant lol) n'ont pas envi de tout refaire en div(mais moi c'est pas mon cas). Photoshop peut te créer 1 page et c'est tout. Et le texte que t'auras mis dans photoshop se transformera en image, donc c'est terriblement inutile. Il faut connaître un minimum le code pour pouvoir transformer son PSD en HTML. Mais le mieux est de connaître un maximum le code pour le diminuer à l'essentiel. @ Kanor: je suis totalement d'accord avec toi. On appelle ça la "divite". Quelques webmasters découvrent la solution HTML+CSS et abusent des div alors que pleins de balises ont une valeur intrinsèque non négligeable (surtout par les moteurs de recherche). D'ailleurs c'est pour ça que je m'efforce d'éviter une div "header" mais plutôt un h1 "header", beaucoup plus intéressant. bbxdesign.com (Web Design, CSS) 29minparjour (Ruby, Rails) twitter.com/bbx
darkpower	# Posté le 09/05/2007 à 11:51:56
	je suis tout a fait dacord avec toi mais je dit juste que sa peut etre une des raisons qui fait que les gens utilise les tableaux ps:sous photoshop on peut avoir une partie qui reste en texte et donc pas la transformer en image.
boomy bx	# Posté le 09/05/2007 à 12:00:59
boomy vous salue bien	Si tu le dis. Je pense pas que Photoshop soit la raison pour laquelle les gens font des tableaux. La raison c'est que depuis longtemps ça a été la seule façon de structurer graphiquement son site, donc c'est resté. Deuxième raison: avec les logiciels WYSIWYG accessibles aux plus novices, il est bcp plus facile de créer des tableaux en 3 clics que de gérer des styles CSS mal interprétés par le logiciel. En effet, ce qu'on voit quand on utilise ce logiciel n'est pas forcément ce qu'on aura dans le navigateur, à part si on utilise des tableaux. Dans ce cas, ce qu'on voit dans le logiciel sera à peu près ce qu'on aura dans le navigateur. bbxdesign.com (Web Design, CSS) 29minparjour (Ruby, Rails) twitter.com/bbx
Gwenn	# Posté le 09/05/2007 à 12:51:10
Chez moi ça marche. Groupe : Anciens	Très bonne idée ce topic. +1 à Kanor et aux autres sur le coup des div... Trop souvent on a l'impression que pour certains, div et span sont les balises pour "mettre le CSS". L'exemple de M@teo est bon dans le fond: dans le pied de page, on met généralement plus d'un élément... Mais ici, un p serait certes plus approprié. Perso j'utilise principalement div/p/h, en mettant les p dans les div... darkpower -> tout le monde n'a pas les moyens pour toshop. C'est une minorité qui fait ca, le principal problème est que les div n'apportent pas d'amélioration "visible" par rapport aux tables, les questions de sémantique, accessibilité ou même performance se posent rarement aux novices. Pour la plupart des codeurs, un tableau reste quelque chose de de "standard" à une page.
nicknick63	# Posté le 09/05/2007 à 14:20:46
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Pas bête l'idée d'un simple paragraphe pour le pied de page, et d'un h1 pour le header . J'avoue que je n'y avais pas encore pensé, mais que point de vue sémantique, c'est beaucoup plus correct... Alala, le jour où on aura un validateur comme celui de la W3C mais pour l'accessibilité et la sémantique... Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
boomy bx	# Posté le 10/05/2007 à 10:41:31
boomy vous salue bien	Oui l'intérêt de mettre un h1 pour le header c'est que les moteurs de recherche prendront davantage en compte ce header parce que c'est un titre. Et c'est exactement ce qu'on veut: que le titre du site soit mis en valeur non? bbxdesign.com (Web Design, CSS) 29minparjour (Ruby, Rails) twitter.com/bbx
nicknick63	# Posté le 11/05/2007 à 18:36:07
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Oui, j'y penserais a l'avenir :o) . Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
nicknick63	# Posté le 17/05/2007 à 13:51:39
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Un petit up pour que mon travail ne tombe pas trop loin dans les abimes du fora . Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
nicknick63	# Posté le 25/05/2007 à 17:20:43
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Allez, encore un petit pour la route . Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)
C0c0	# Posté le 25/05/2007 à 17:30:13
Ca y est j'ai une citation !	Ca mériterait presque d'être en post-it selon moi La boîte à sons du Geek : Application Android sympa à télécharger !
Ze Rallyman du 13	# Posté le 25/05/2007 à 17:31:17
J'aime bien quand ça pousse !	Juste pour le H1 header, moi j'ai une bannière en header, donc j'ai mis un div + une img. Vaut-ce la peine de changer le div en h1 et/ou de mettre juste l'image avec un display: block et de lui mettre mes margin dessus ? J'espère que vous avez compris ! PASSIONNE 2 RALLYE INSIDE
Mr Mark	# Posté le 25/05/2007 à 17:36:23
	Hellow, Moi mon design est que en tableau et j'ai beaucoup presque tout le temps entre des div et je voudrais juste savoir si je pourrais changez mon design enfin mettre des div donc en gros le recoder Merci.
Ze Rallyman du 13	# Posté le 25/05/2007 à 18:00:01
J'aime bien quand ça pousse !	Tu PEUX toujours.... PASSIONNE 2 RALLYE INSIDE
nicknick63	# Posté le 25/05/2007 à 18:07:24
Blog Twitter close Ville : Clermont-ferrand Pays : France métropolitaine	Oui, c'est même moins dur qu'on ne le crois . Mon blog Ezida, la communauté qui milite pour la création et le développement de moteurs de recherche libres. (xmpp:ezida@chat.jabberfr.org)