Div de présentations?

(reprise du message précédent)

Au fait, quelqu'un a-t-il un exemple de navigateur pour mobile/pda où un layout tableau est illisible?

Je viens de tester sur Opéra Mobile et le contenu est aussi bien rendu avce une mise en page via tableaux ou DIV, du moment que le contenu est linéarisé bien sur.
Modifié par Chandy (23 May 2007 - 20:30)

Hum pas de navigateurs répondant aux critères?

J'ai aussi testé sur Lynx et pareil, pas de problèmes d'affichage avce des tableaux non imbriqués utilisés pour le layout.

Existe-t-il vraiment un problème d'accessibilité avec des tableaux de layout? Parce que là, à part la sémantique non conformes aux normes, je vois pas trop les inconvénients des tableaux.

Chandy a écrit :
Existe-t-il vraiment un problème d'accessibilité avec des tableaux de layout?

Comme dit précédemment il me semble, ça dépend de l'utilisation qu'on en fait. Utiliser de multiples tableaux de mise en forme imbriqués, sans se poser de question, c'est la garantie d'avoir un contenu non linéarisable. Par contre, pour peu que les agents utilisateur s'adaptent aux mises en pages en tableaux, des tableaux linéarisables devraient être exploitables même sur mini écran. Il faudrait effectivement voir ce que ça donne avec les différents agents utilisateurs (en gros les navigateurs pour mobiles, smartphones, pda, tablet pc...).

Les « attaques » contre la mise en page en tableaux sont souvent excessives, et versent dans la glorification un peu niaise du tableless. D'ailleurs, un site bien conçu utilisant quelques tableaux de mise en page à bon escient sera plus accessible et plus robuste qu'un site tableless mal fichu. Mais il faut bien avoir à l'esprit que la « condamnation » des tableaux de mise en page vise avant tout leur utilisation excessive et intensive, qui est clairement problématique.

Si ta question est les tableaux de mise en page, est-ce que c'est le mal ?, la réponse est : non, ça n'est pas le mal.

Donc résumons.

Les tableaux, avec leur système de lignes et cellules, sont très bien pour réaliser une grille et y placer des éléments. Donc excellents notamment pour une mise en page par colonnes. Il ne gênent pas l'accessibilité du moment qu'ils ne sont pas imbriqués.

Les DIV eux, permettent de positionner plus librement sans contraintes dues à une grille, semblent être un complément naturel des tableaux de layout.

Avantages tableaux :
- plus robustes que les DIV pour des mise en pages basées sur des alignements, notamment des colonnes. Moins d'incompatibilités navigateurs.

Avantages DIV :
- Un peu moins de code que les tableaux


Donc d'après celà, j'en retiens que le mieux pour un layout global en colonnes est d'utiliser des tableaux et de compléter la mise en page avec des DIV pour des éléments nécessitant plus de liberté dans leur mise en page.

Enfin, si on a vraiment du volume en trafic, le passage à un full CSS peut valoir le coup si on peut réduire la taille initiale de la page car avec le volume, le gain sera non négligeable et compensera l'investissement initial pour régler les problèmes d'incompatibilité navigateurs présents ou futurs.

Oui enfin les tableaux sont utiles pour des mises en page relativement simples, mais dès que l'on en vient à des superpositions d'éléments, des décalages divers et autres petits plaisirs graphiques, le positionnement en css se révèle être bien plus pratique. De plus, les incompatibilités que tu évoques vont se faire de plus en plus rare, IE7 en est d'ailleurs l'exemple.

Tu oublies de parler d'un des principaux avantages des feuilles de style : la possibilité de faire évoluer un habillage graphique sans modifier le code HTML. Dans le cas d'un site dynamique avec un système de template, ça n'est pas indispensable, mais ça reste utile.

Personnellement, je conseillerais une mise en page avec essentiellement les CSS (appliquées à des div ou autre éléments HTML... il n'y a pas que les div la spécification HTML, hein !), et des tableaux de mise en forme uniquement dans des cas très précis et ponctuels :
1 - pour les quatre ou cinq choses qu'il est difficile de faire correctement sans tableau de mise en forme, le plus souvent à cause de l'absence d'implémentation d'une propriété CSS 2.1 (display: table-cell dans IE, display: inline-block en partie dans IE mais surtout dans Firefox...) ;
2 - pour les choses qu'on ne maitrise pas encore en CSS, et que l'on peut faire rapidement de manière non problématique avec un tableau de mise en forme.

Bien entendu, plus on connait les CSS, plus la seconde catégorie s'amenuise.

Mon avis personnel sur les div et table :

je parle d'un point de vue sémantique.

Les tables ne servent qu'à la présentation de données tabulaires et ne servent pas à positionner. Je dirais même que la mise en forme d'un table par le navigateur n'est que superflue. L'essentiel est de savoir à quoi correspondent les colonnes, les lignes, les titres, etc. Bref quand on fait un table il faut le rendre accessible également.

Les div servent à regrouper des données liées dans leur sens ou leur utilité.
N.B. On peut obtenir le même résultat qu'un table uniquement avec des div.

Tout à fait d'accord avec Florent .

Ne pas penser tout le temps à l'élément div (les CSS ne s'appliquent pas qu'à cet élément (et heureusement )). Ne pas penser découpe ; penser contenu ...

L'utilisation des tableaux (à but de présentation) aura un impact évident sur la maintenabilité et l'évolutivité de ton code. En plus, avec un minimum de réflexion sur le code, je ne suis vraiment pas sur que le nombre de div soit excessivement important dans un document ...
Modifié par yodaswii (25 May 2007 - 16:20)

yodaswii a écrit :
Tout à fait d'accord avec Florent .

Ne pas penser tout le temps à l'élément div (les CSS ne s'appliquent pas qu'à cet élément (et heureusement )). Ne pas penser découpe ; penser contenu ...

L'utilisation des tableaux (à but de présentation) aura un impact évident sur la maintenabilité et l'évolutivité de ton code. En plus, avec un minimum de réflexion sur le code, je ne suis vraiment pas sur que le nombre de div soit excessivement important dans un document ...

Oui mais pareil. Du moment qu'on veut faire du 3 colonnes avec des tailles variables, les DIV semblent obligatoires pour encapsuler le tout.(voir les gabarits proposés sur ce même site)

Si bien que si on veut vraiment repositionner des éléments, on est obligé de retoucher à la structure XHTML.

Je pense surtout que tu te prend la tête avec pas "grand chose".

Evidemment, certaines modifications nécessiteront de modifier la structure XHTML (mais minimalement). Pour répondre à ta question : div = structure ou présentation ? Et bien je pense les deux (sans omettre la liaison css/js) !

La séparation contenu/présentation ne peut être complète (il faut bien donner des pistes au logiciel client ) et ne le sera jamais (la fameuse guerre Homme versus Machine).

Il faut bien prendre conscience que le développement web implique de faire des choix. Voilà tout !
Modifié par yodaswii (25 May 2007 - 17:57)

Chandy a écrit :
Si bien que si on veut vraiment repositionner des éléments, on est obligé de retoucher à la structure XHTML.

Cet aspect a déjà été discuté en première page de ce sujet. Au risque de me répéter, j'y avais dit (en gros) que :

- le simple fait d'utiliser des div pour de la mise en forme, de regrouper des éléments dans un même bloc de mise en forme, etc., signifiait que le code HTML n'était pas totalement neutre du point de vue de la mise en forme, et donc que certains changements de mise en forme demanderaient des changements de la structure HTML ;
- cependant, les possibilités de modifications de la mise en forme en ne retouchant que la feuille de styles sont beaucoup plus importantes qu'avec une mise en page en tableaux (à fortiori dans le cas d'une utilisation intensive de tableaux de mise en forme).

Et pour être encore plus clair, parlons de productivité :

1 - Dans le cas d'une refonte graphique complète, le fait d'avoir à modifier des gabarits en plus de la modification des feuilles de style ne sera à priori pas problématique, et ne fera pas perdre tellement de temps. Partant, dans ce genre de situation, avoir un layout à base de tableaux ou de positionnement CSS reviendra globalement au même. Bien entendu, pour des pages statiques c'est une autre histoire : une mise en page à base de tableaux sera impossible à modifier profondément, on aura meilleur jeu de reconstruire des pages neuves.

2 - Dans le cas de modifications mineures d'une mise en page (ce qui arrive fréquemment quand on fait évoluer progressivement un site web, démarche qui me semble d'ailleurs préférable aux classiques refontes bisannuelles), on appréciera grandement le fait d'avoir une mise en page utilisant massivement les CSS, et pas ou peu de tableaux de mise en page.
Modifié par Florent V. (25 May 2007 - 20:06)

Bonsoir,

Utiliser <table> en vue d'une mise en page c'est très bien à partir du moment où on est globalement capable de s'en passer.

Si l'approche tableless est plutôt niaise comme Nouvelle Religion Evangélisatrice (N.R.E), non pas du fait que ce soit tableless, mais bien parce qu'elle s'est présentée comme N.R.E ne change rien au fait qu'en terme de méthode d'apprentissage c'est tout à fait pertinent.

Inutile donc d'inventer un nouveau paradigme oedipien en s'en prenant à la conception tableless comme telle.

Par contre s'interroger sur les évangélisations à venir ça oui... Bon, c'est peine perdue, mais oui quand même.

Je vous laisse méditer là dessus.
Modifié par Christian Le Bouler (25 May 2007 - 22:28)

<spam />
Modifié par Julien Royer (29 May 2007 - 20:19)

@xhtml : Quel rapport avec le sujet ? Inutile de faire de la pub pour tel ou tel truc ... ce forum n'a pas cette vocation !

Mais pourquoi toujours se focaliser sur ces maudits écrans d'ordi ? Il y a bien d'autres outils de restitutions, et parions qu'il y en aura de plus en plus... Avancer que Lynx est capable de restituer correctement une mise en page en tableau n'argumente rien. Avancer en revanche que demain (oui, bon, disons après-demain...) un flux ordonné pourra par exemple être transmis via la bande FM sur une radio numérique présuppose un dispositif de "filtrage" des éléments du contenu pour ne diffuser que certains d'entre eux (contenu global -> utilisateurs multiples, exactement comme pour l'impression papier de documents web). Un ordonnancement en <div> découpant des unités cohérentes s'y prêtera toujours mieux qu'un tableau global, que ce soit techniquement ou économiquement.
C'est pas qu'en soi la <table> c'est le mal, c'est que ça peut à terme devenir pénalisant.

Arsene a écrit :
Mais pourquoi toujours se focaliser sur ces maudits écrans d'ordi

Pas trop fort, pas trop fort Arsene, il y a le mien d'écran qui viens de me faire savoir assez vertement que la prochaine fois qu'on lui demanderait d'afficher de telles atteintes à sa dignité, ce serait la grève sans préavis.

Méfiance donc

Ah ben j'en sais quelque chose, j'ai un des miens qui a rendu l'âme récemment J'ai dû menacer les autres de les donner à Emmaüs...
Modifié par Arsene (30 May 2007 - 09:28)