28173 sujets

CSS et mise en forme, CSS3

Pages :
bonjour,

désolé pour la redondance de ce sujet...
Afin de faire face aux différences entre IE6 et IE7 que pensez-vous de réaliser une feuille de style pour IE6, une autre pour IE7 et une troisième pour les autres navigateur type FireFox ?


<link rel="stylesheet" type="text/css" href="/css/styles.css" />
<!--[if lte IE 7]>
   <link rel="stylesheet" type="text/css" href="/css/ie7.css" />
<![endif]-->
<!--[if lte IE 6]>
   <link rel="stylesheet" type="text/css" href="/css/ie6.css" />
<![endif]-->


Dans ma situation je ne peux malheureusement pas concevoir un gabarit de mise en page pensé pour supporté une seule feuille de style. Je reçois un gabarit photoshop et le traduis en XHTML et doit obtenir un résultat d'affichage au pixel près.

Merci pour vos témoignages.
Modifié par Jerome M (11 Jul 2007 - 10:26)
Un résultat au pixel près? Bon courage... Smiley rolleyes

Sinon, on fait les choses proprement: on ne se soucie pas de tel ou tel navigateur, on développe une belle feuille de style bien standard qui sera correctement interprétée par tous les navigateurs et on adresse les correctifs adéquats via commentaires conditionnels à Internet Explorer 6. Normalement, la dernière version du butineur de Microsoft ne devrait quant à elle pas devoir bénéficier de correctifs particuliers, sauf cas précis.
C'est surtout qu'il est impossible d'arriver au même résultat dans toutes les conditions au pixel près, à moins bien sûr de passer tout en image ou en flash...
a écrit :

C'est surtout qu'il est impossible d'arriver au même résultat dans toutes les conditions au pixel près, à moins bien sûr de passer tout en image ou en flash...


encore une fois je trouve la situation déplorable...
impossible non mais il faut alors bidouiller d'où l'idée d'avoir plusieurs feuilles de style.
Non non, désolé, j'insiste: il est vraiment impossible d'obtenir exactement le même rendu au pixel près dans toutes les conditions. Par exemple, la gestion des polices différentes sur Mac OS X et Windows; un même texte ne prendra donc pas exactement la même place sur le même navigateur sur deux plateformes différentes.
Sinon, bien d'accord avec toi évidemment sur le fait que cette situation est déplorable...
Tout à fait d'accord encore une fois le rendu au pixel près est impossible. Par contre je ne vois pas pourquoi l’utilisation des commentaires conditionnels serait plus propre qu'une belle feuille de style principale et une autre pour IE6 avec uniquement les correctifs.
Seubeu a écrit :
je ne vois pas pourquoi l’utilisation des commentaires conditionnels serait plus propre qu'une belle feuille de style principale et une autre pour IE6 avec uniquement les correctifs.
Heu... on n'a jamais dit le contraire. Smiley sweatdrop
Jerome M a écrit :
que pensez-vous de réaliser une feuille de style pour IE6, une autre pour IE7 et une troisième pour les autres navigateur type FireFox ?

C'est une perte de temps et d'argent.
Comme le disait Benjamin, la feuille de style pour IE6 (et à la rigueur celle pour IE7) ne doit contenir que des correctifs. Soit entre 5 et 30 lignes de CSS...

Le code HTML que tut proposes est donc bon, mais il faut bien garder à l'esprit que les fichiers ie6.css et ie7.css (ce dernier étant rarement nécessaire) ne contiendront que des correctifs, pas une feuille de styles complète.

Jerome M a écrit :
Je reçois un gabarit photoshop et le traduis en XHTML et doit obtenir un résultat d'affichage au pixel près.

Taper sur la tête du graphiste, qui ne devrait pas faire du Web.

Ou alors, plus constructif (surtout si on travaille régulièrement avec ce graphiste): lui faire un cours sur les contraintes du média Web (Edit: pardon, du média screen), ses spécificités, etc.
Bien sûr, ça demande un peu de pédagogie, et j'imagine que ça n'est pas évident. Smiley decu
Modifié par Florent V. (11 Jul 2007 - 21:50)

Taper sur la tête du graphiste, qui ne devrait pas faire du Web.

ou lui conseiller de faire de la PAO

Ou alors, plus constructif (surtout si on travaille régulièrement avec ce graphiste): lui faire un cours sur les contraintes du média Web, ses spécificités, etc.
Bien sûr, ça demande un peu de pédagogie, et j'imagine que ça n'est pas évident.

"le client est roi, il se fiche du code et des standards !"
c'est le genre d'attitude auquel il faut s'attendre chez certains.

Ne pas baisser les bras, courage !
Lorem Ipsum a écrit :
"le client est roi, il se fiche du code et des standards !"
c'est le genre d'attitude auquel il faut s'attendre chez certains.

Réponse: le client a tout intérêt à proposer un site de qualité à ses propres clients ou visiteurs. Et la qualité web consiste entre autres à tenir compte des contraintes, et à exploiter les spécificités du média.

;)
Seubeu a écrit :
Tout à fait d'accord encore une fois le rendu au pixel près est impossible. Par contre je ne vois pas pourquoi l’utilisation des commentaires conditionnels serait plus propre qu'une belle feuille de style principale et une autre pour IE6 avec uniquement les correctifs.


Un peu de lecture Smiley cligne : Qu'est-ce que les commentaires conditionnels ?
Mais qu'est ce que c'est que cette ambiance vendredÿenne là !!!

Smiley lol

Bon pour en revenir à la question de départ :

a écrit :

Afin de faire face aux différences entre IE6 et IE7 que pensez-vous de réaliser une feuille de style pour IE6, une autre pour IE7 et une troisième pour les autres navigateur type FireFox ?


Très bonne idée, les commentaires conditionnels c'est fait pour ça Smiley cligne

Dans la pratique ne pas se laisser embarquer dans de trop grosses machines à gaz de combinaisons de multi correctifs IE. Notamment en tenant compte des avancées d'IE7 dans l'implémentation de css2 et dans la disparition de nombre de bug liés au haslayout. D'un point de vue méthodologique il y a surement quelque chose à faire de ce point de vue pour développer un peu décontracté.

Sinon :
a écrit :


<link rel="stylesheet" type="text/css" href="/css/styles.css" />

<!--[if lte IE 7]>

   <link rel="stylesheet" type="text/css" href="/css/ie7.css" />

<! endif -->

<!--[if lte IE 6]>

   <link rel="stylesheet" type="text/css" href="/css/ie6.css" />

<! endif -->



Si une css vaut pour IE lte IE7 alors elle vaudra automatiquement pour IE lte IE6 Smiley cligne

Donc attention là dessus.
Modifié par Christian Le Bouler (12 Jul 2007 - 00:07)
Votre sujet est très interessant car je suis en plein dedans.
Actuellement je fais un site, qui passe bien sous IE7 (sauf un petit décalage parce que je n'arrive pas à placer un block sous un autre...), et Fireforks. Ceci avec deux feuilles de style différentes. Sous IE 6, j'ai un block qui dépasse. Je recherche donc sur votre forum et m'aperçoit que j'ai mis
<!--[if IE]>

Ma question est donc est-ce que le lte est important dans la condition.


Je ne vous mets pas le lien ici car je pense que ce n'est pas là que je dois poser ma question pour conprendre pourquoi j'ai ce décalage important.

a écrit :
Le code HTML que tut proposes est donc bon, mais il faut bien garder à l'esprit que les fichiers ie6.css et ie7.css (ce dernier étant rarement nécessaire) ne contiendront que des correctifs, pas une feuille de styles complète.
=> je ne vois pas comment faire autrement.

Merci de votre réponse et encore bravo pour votre site.
helazo a écrit :
Le code HTML que tut proposes est donc bon, mais il faut bien garder à l'esprit que les fichiers ie6.css et ie7.css (ce dernier étant rarement nécessaire) ne contiendront que des correctifs, pas une feuille de styles complète.
=> je ne vois pas comment faire autrement.
Autrement qu'un correctif ou autrement qu'une feuille de styles complète?
Bonjour,

Florent V. a écrit :
Taper sur la tête du graphiste, qui ne devrait pas faire du Web.

Ce ne sont pas les graphistes qui sont responsables, mais les clients.
Je travaille actuellement sur un gros projet,, très graphique, et la cliente passe beaucoup de temps à faire des copies d'écrans, à coller tout ça dans Photoshop, pour superposer les calques et mesurer les différences entre les différents navigateurs...

Perte de temps, et d'argent ? Hum, je ne sais pas pour qui... Pour nous, oui, sans doute, pour le client je ne pense pas, vu qu'on fait ce qu'il nous demande de faire Smiley sweatdrop
Modifié par Ericf (26 Jul 2007 - 16:33)
Ericf a écrit :
le client passe beaucoup de temps à faire des copies d'écrans, à coller tout ça dans Photoshop, pour superposer les calques et mesurer les différences entre les différents navigateurs...

C'est sérieux ça? Smiley sweatdrop
Je n'ai (heureusement) jamais vu ça pour ma part…
Administrateur
Ericf a écrit :
Je travaille actuellement sur un gros projet,, très graphique, et la cliente passe beaucoup de temps à faire des copies d'écrans, à coller tout ça dans Photoshop, pour superposer les calques et mesurer les différences entre les différents navigateurs...

Il voulait spécifiquement du standard et de l'accessible ? Si non, lui faire une version full-flash ou full-image, il sera content.
Lui expliquer ensuite la vraie vie et ce qu'est le média Web.

extrait des contrats d'Alsacreations.fr a écrit :
Clause relative au medium Web et à l'accessibilité : Sauf demande contraire explicitement formulée par le client, les pages web intégrées par Alsacréations sont conformes aux standards W3C de conception (X)HTML et CSS et réalisées dans un souci d'Accessibilité universelle.
La démarche d'accessibilité implique de prendre en compte la liberté de l'utilisateur : liberté de gérer sa navigation (taille de police, des éléments, modification des contrastes, etc.), liberté de choisir son outil de restitution (navigateur classique ou alternatif, sortie vocale ou braille), etc.
Ce choix de liberté implique qu'il ne sera pas possible d'obtenir un visuel en tout point identique sur tous les périphériques de sortie.
Accepter l'accessibilité, c'est accepter le fait que le média Web ne peut (et ne doit) pas être figé et statique comme le serait le média Print. Les livrables d'Alsacréations auront toujours un aspect semblable sur les navigateurs les plus utilisés, et parfois une dégradation acceptable sur les autres/anciens navigateurs.
Benjamin D.C. a écrit :

C'est sérieux ça? Smiley sweatdrop
Je n'ai (heureusement) jamais vu ça pour ma part…

Hélàs oui, c'est tout à fait sérieux.
Qui plus est, la cliente est en vacances, mais elle nous emm...... quand même (elle a du trouver une plage avec connexion internet Smiley sweatdrop )

Raphael a écrit :
Il voulait spécifiquement du standard et de l'accessible ?

Ils s'en moquent éperdûment...

Raphael a écrit :
Lui expliquer ensuite la vraie vie et ce qu'est le média Web.

Ici on touche à un problème qui est moins celui du client que du commercial qui va vendre le projet.
J'ai fait plusieurs formations en interne sur l'accessibilité et les bonnes pratiques, mais il est difficile de faire évoluer les choses...
D'autres sessions de formations, obligatoires Smiley biggrin , sont prévues à la rentrée Smiley cligne
Pages :