Forum Clubic

[CSS] défendez le css

bonjour,

apres une ptite discussion dans un topic sur ce forum.
on m’a conseillé de faire mes pages avec des balises div pour la présentation et d’éviter fortement les tableaux.

bien entendu, les balises respectent les normes patati patata, c’est bien pour l’accessibilité, pour imprimer aussi.

Mais je trouve que le comportement des balises avec certaines propriétes ( ex:float ) gâche la mise en page.
Il faut dire que la mise en page devient “bizarre” des qu’on rapetisse trop une fenetre ou que l’on agrandit exagérement la taille du texte.

Pour faire rapide, je suis déçu du positionnement css. Les tableaux ne sont peut-être pas conseillés, mais au moins la mise en page ressemble à qques choses.
( et qques soit la taille du texte ou la taille de la fenetre ).

exemple de comportement qui a mon avis est bizarre:
mon texte
mon texte2

les balises “span” ont la propriété d’être en ligne, pourquoi alors est on obligé de mettre en place des astuces types (parser).

j ai pas trop le temps d’achever le topic. ( je le contienurait ultérieurement )
mais je ne demande que d’être convaincu par le CSS powa :wink:

si vous avez de bonnes adresse avec des positionnements css. n’hésitez pas à les poster

Le problème de CSS, c’est Internet Explorer qui par se médiocrité limite la chose. Pour le reste, float permet de positionner un bloc à gauche ou à droite, et doit être utilisé conjointement avec clear: both | left | right pour avoir l’effet désiré.

Ensuite, on ne demande pas de ne plus utiliser les tableaux, mais de ne pas les utiliser pour faire de la présentations. C’est différent. Un tableau c’est quelque chose de très typé : ça a des cellules, un entête, et ce n’est pas un truc fait pour contenir des images histoire de bien découper le design.

C’est comme si je prenais une base de données pour faire de la présentation de texte : ça ne rime à rien.

Pour le reste, les tableaux sont un ensemble conteneurs + sous-conteneurs (les cellules).

[cpp]

A
B
Zog
[/cpp]

Ne produira jamais le même effet que le tableau correspondant :

[cpp]

A Zog B
[/cpp]

Sauf en utilisant les propriétés table de display.

http://www.w3.org/TR/CSS21/visuren.html#propdef-display

Bien entendu, c’est CSS 2.1 donc au revoir MSIE.

Pour finir, je dirais que le design ne doit pas être vu au départ pour ne fonctionner qu’avec des tableaux, mais il doit être abstrait et ne surtout pas rechercher des découpages imposés.

Maintenant, je suis pas designer.

Et a-t-on le droit de ne pas les défendre dans ce topic ou cela sera considéré systématiquement comme un troll ?
Parce que perso, même si la cause de mon choix est effectivement IE, je continue à utiliser principalement les tableaux dans un soucis de productivité et de rapidité, il m’est arrivé 3 ou 4 fois de faire un site en CSS niquel et de devoir passer des heures pour essayer de l’adapter à IE, donc à la majorité du marché.
En revanche, j’utilise énormément les CSS en qualité de feuilles de style, pour du texte ou même pour transformer les tableaux d’ailleurs.

Pour ma part, j’utilise netscape 7.2 et tout ce que j’ai vu sur IE 6 ressemble fortement a firefox et netscape par exemple.
Apres, c’est peut etre vrai que IE ne prend pas le css 2.1.
( il me semble avoir rencontré des problèmes avec les propriétés de
cursor: en css )

[cpp]Ensuite, on ne demande pas de ne plus utiliser les tableaux, mais de ne pas les utiliser pour faire de la présentations. C’est différent.[/cpp]
oui exact, j ai oublié de précisé

[cpp]Pour finir, je dirais que le design ne doit pas être vu au départ pour ne fonctionner qu’avec des tableaux, mais il doit être abstrait et ne surtout pas rechercher des découpages imposés.[/cpp]
tout a fait d’accord
Pourquoi donc définir des attributs du type “width: px|%”

il suffit de les utiliser pour voir que l’on rencontre des problèmes avec.( cf screenshots )

voila, quelques screenshots sur les problemes de positionnement css.
-la premiere image c’est juste comme ca. ( ca n’a rien avoir avec le topic )

C’est sûr que point de vue accessibilité, les tableaux sont à proscrire.
Les feuilles css ont respecté cela au détriment d’une présentation un peu farfelue à mon goût.

Rq: j’ai choisi le site de debian-fr car je sais qu’il a été refait avec des css. Je n’ai absolument rien contre son site. :wink:

WinterOfTheWolf> bien sur. Du moment qu’il y a une discussion et des argmuments sur les opinions avancées, je ne pense pas que ce soit considéré comme un troll. ( enfin j’espere, je suis pas modo :wink:

n’hésitez pas à poster vos remarques.

Une recherche de design passe systématiquement par un découpage imposés par rapport à ceux que l’on veut. Un menu, une partie news, une partie avec les 4 derniers articles, une partie avec les derniers téléchargements disponibles, etc. enfin, là je parle pour Clubic, mais si tu regardes tous les sites à fort trafic, tu remarqueras qu’ils sont quasiment tous structurés et définis et qu’ils rentrent dans un moule précis.
A contrario des designs exotiques qui sont souvent plus jolis et plus originaux ont en revanche une accessibilité et une ergonomie réduites.

Quand à l’utilisation des tableaux ou des CSS, l’important, c’est le résultat à l’affichage, les considérations ne sont pas toutes les mêmes selon les gens et les contraintes non plus.

Igor> Les feuilles css ont respecté cela au détriment d’une présentation un peu farfelue à mon goût.

Oui et Non. Dans ton cas (le float), tu utilise la mauvaise propriété, et donc en effet tu n’as pas l’effet désiré. Par contre, si IE supportait les propriétés étendues des CSS2.1, cela favoriserait l’essor de CSS2.1.

Sans oublier une chose que les designers oublient trop souvent (spa un troll WotW) : le html/xhtml sont des langages de balisage. Pas de présentation.

WotW> le découpage se fait carré, et pourtant, j’arrive à faire un découpage pour du CSS. C’est pas si compliqué (hormis les problèmes avec IE…) et ça nécessite de réfléchir pour CSS pas que pour des tableaux.

Rien qu’avec des background tu peux par exemple faire des bords arrondis dans un tableau.

Ah oui…comment :??:

En réfléchissant :slight_smile: C’est un truc assez con qui se fait avec un tas de div, etc.

bah à part avec au moins 5 div (une “globale” et une pour chaque coin), je ne vois pas :fou:

Gagné :slight_smile:

tiens, un autre exemple
inspiré du lien de 84mikael

j ai juste enlevé cette ligne:
[cpp]width: 15em;[/cpp]
de l’attribut #cadre

rétrécissez la fenetre et vous verrez le texte tranverser le cadre.
A quoi bon faire des cadres alors ??? :frowning:
http://membres.lycos.fr/graneat/img/page.htm

moi je suis en train de réaprendre le HTML, avec des div, des span …etc.
Ca me saoule considérablement, et ça limite parfois ce que je veux faire, ou bien me fait perdre un temps fou…mais puisque c’est pour la bonne cause… :confused:

C’est exactement le sentiment que j’ai eu. Pendant un temps, je me suis dit, allez, un petit effort pour la bonne cause et puis, au bout d’un moment, je me suis dit que la bonne cause, c’est juste faire plaisir aux adeptes de la sémantique HTML et ses mêmes adeptes ne payent pas mes heures perdues.
Autant, pour des choses simples, comme remplacer les fontsize par une déclaration de style, j’apprécie beaucoup ce genre de raffinement du HTML 4, autant, pour cette dénigration envers les tables, j’ai du mal.
Quand je vois des sites comme Clubic, HFR, PresencePC ou même le site de SansNom fait à partir de Table, à part un aspect purement théorique et sémantique, le fait qu’ils soient en CSS ne changeraient absolument rien. D’ailleurs, perso, je trouve que le forum Clubic a plein de bug d’affichage depuis qu’il est en CSS au lieu des tableaux comme avant.

Il faut dire aussi que :

  • je suis très perfectionniste
  • je fais des études d’informatique (je termine un DUT et j’espère poursuivre encore 3 ans), ça va être une partie de mon métier
  • j’approuve totalement le fait que c’est mieux de procéder selon les normes pour la portabilité, la légèreté du code et l’accessibilité, d’une part depuis les périphériques “nouveaux” (PDA, téléphones portables…) et à venir, et d’autre part pour les gens ayant une déficience visuelle ou moteur.

Quand j’ai appris le HTML/PHP cet été, j’ai fait un [url=http://als.web.free.fr/]site BOURRé de tableaux[/u] (bien qu’il soit relativement simple… je me rends compte à présent que c’est loin d’être l’idéal.
Je suis en train de penser à le refaire, j’ai fait quelques ébauches aujourd’hui : j’ai galéré toute l’après midi pour faire un truc que j’aurais mis 1/2h à faire avec des tableaux… mais j’y suis parvenu, je maitrise un peu mieux, le code est nettement plus léger et je suis content de moi. C’est juste un mauvais moment à passer ! Car j’ai été tenté X fois de revenir aux tableaux (“juste 1 ou 2…”) mais NON !!

Bref, courage ça peut en valoir la peine.

Pour le respect des normes :love:
http://openweb.eu.org/


http://emmanuel.clement.free.fr/
http://cybercodeur.net/
http://w3.org/
http://www.la-grange.net/w3c/
http://www.w3schools.com/

Et pour admirer la puissance du CSS :love:
http://www.csszengarden.com/

J’étais pas peu fier le jour où j’ai réussi à faire passer mon site à la norme HTML 4.01 Transitional. Par contre, faire passer ça en XHTML, en respectant les normes d’accessibilité…etc, ça demande de tout refaire… j’ai hâte de me lancer, mais je n’ai pas encore trop le temps avec mes études.

Heu, WotW (et ceux qui veulent faire joujou avec les bordures) :

http://www.w3.org/TR/2002/WD-css3-border-20021107/#property

ie: CSS3.0 prévoit de corriger le mauvais tir des bordures :slight_smile:

hé bah ça devient conséquent…ça va être balèze de tout savoir !!!
C’est mieux de prendre le train en marche maintenant hein parce que d’ici quelques années, la programmation web dans les règles de l’art ne sera plus à la portée de n’importe qui !

oui les CSS c’est bien mais ca dépend de ce que tu fais
de quel projet en somme …
j’ai utilisé des CSS pour un projet de site en SPIP car les boucles SPIP imbriquées dans le HTML (surtout des tableaux) c’était une gymnastique de l’esprit … lol)
ensuite j’utilise des moteurs de templates avec des tableaux pour des développements persos…

bref faut choisir …

Attention, je n’ai JAMAIS remis en cause l’utilité des CSS et le respect des normes. Ce que je remet en cause, c’est la compatibilité relative à IE et bien que ça me déplaise, car malgré mon discours, ça ne m’arrange pas, IE reste 90% du marché. Et il ne faut pas se leurrer, un site web, ce n’est pas perrain, ça dure 2 ou 3 ans grand maxi, d’ici 2 ou 3 ans, quand IE 7/8 et FireFox 3 seront là, il sera temps de refaire avec les CSS, je ne considère pas ça comme une grosse difficulté pour ma part, je dis juste qu’à l’heure actuel, c’est une perte de temps puisque PERSONNE D’AVEC QUI J’AI TRAVAILLE n’est près à payer le surplus de temps que nécessite l’adaptation des CSS IE/FireFox.
En attendant ce futur qui j’espère arrivera un jour, je continuerais de faire au plus vite. Pour ceux qui viennent me voir en me demandant des conseils, je commence toujours par leur expliquer que les tableaux ce n’est pas bien, et patati et patata, mais je leur dis que dans l’immédiat, il vaut mieux utiliser les tableaux UNIQUEMENT si dans la mise en page qu’ils ont prévus, ils perdent du temps à gérer la compatibilité IE/Gecko/KHTML. Parce que je préfère qu’on me présente un site en m’annonçant qu’il apparait pareillement sur IE/FireFox/Safari, qu’on arrive en me disant fièrement qu’il est W3C/CSS/Compliant et qu’il est une apparence douteuse sous IE.