[Résolu] Compatibilité sur tous les navigateurs

[thibo]

Je suis désespéré ! Moi qui prend soin à ce que mes quelques petits sites soient compatibles partout ... et qui y passe tant de temps !

Mes navigateurs de test sont IE6, Mozilla 1.7 et Netscape 7. Toutes les pages ont (sensiblement) la même tronche sur ces trois-là. Ces derniers jours j'ai croisé pas mal de personnes qui ont d'autres configs (PC et Mac). Et là, c'est la cata :

- MacIE 5 n'interprète pas certains scripts que Win IE interprète très bien (alors que j'avais lu qu'ils fonctionnaient de la même manière)
- Firefox PC pinaille sur des styles que ma suite Mozilla interprète très bien (alors qu'il me semblait que le la suite Mozilla comprenait un navigateur identique à Firefox)
- Et un pote vient de me relater deux ou trois petits bugs sur son Thunderbird.
- Quant à Opera ... j'ose même plus tester mes sites avec ...


Là, je suis en train de pointer le canon de mon reveolver sur ma tampe. Quand le coup partira, la chaise sur laquelle je suis debout tombera, faisant tomber mon corps qui tendra la corde enroulée autour de mon cou. Et lorsque la chaise touchera le sol, elle déclenchera le détonateur relié aux 25 kilos de TNT accrochés partout autour de moi. Je devrais pas me rater là ...


Plus sérieusement ... vous connaissez un site de référence qui explique les principales choses à ne pas utiliser poru qu'un site soit affiché à peu près de la même manière sous tous les navigateurs ? Ou qui explique au moins les différences fondamentatles entre tous ces navigateurs ?
Est-ce que vous savez aussi si ça pose problème d'installer plein de navigateurs sur le même système ? Genre IE + Netscape + Mozilla (la suite) + firefox + thunderbird

[fandecine]

Bonjour,

La première régle à respecter et d'écrire du code conforme au spécification du w3c.

Ensuite , tu peux installer tous les navigateurs que tu veux sur ta machine pour tester tes sites et même faire cohabiter linux et windows!

Mais il faut pas se desespérer pour 1 ou 2 navigateurs éxotiques ou obsoletes.

[slender]

bon, heureusement qu'on a les pilules miracles:
http://www.alsacreations.com/
3 comprimés de deux à trois heures par jour pendant une semaine
et, au cas où tu comprendrais pas la notice, tu peux encore demander du secours ici:
http://forum.alsacreations.com/forum.php

mais comme le suggère si bien fandecine à l'étage au-dessus, et ce en quoi il a parfaitement raison, occupe toi déjà des gros navigateurs (opera doit représenter 0.5% environ..) ici: http://www.atelier.fr/article.php?artid=28975

[srappaille]

Bonjour,

Pour le résultat, j'utilise parfois -http://www.browsercam.com/

Lorsque vous vous sentez prêt, évaluez le produit sur votre site. En ce qui me concerne, c'est souvent Safari qui me pose problème (même avec du XHTML strict et valide !)

Bon courage,

Serge

[thibo]

Waow ! Merci pour ces précieuses informations !


Les statistiques :

Je ne pensais que Microsoft avait encore un tel poids dans les navigateurs ! Les personnes que je connais personnellement, et qui se détournent tous d'IE, ne doivent pas être représentatifs de la population moyenne
Une autre page de statistiques sur les navigateurs, les résolutions, les systèmes, ... dans le monde : http://solutions.journaldunet.com/dossi ... eurs.shtml

Donc comme vous me le suggérez, je vais arrêter de me prendre la tête pour quelques navigateurs plutôt rares sur le net.


L'installation de plusieurs navigateurs :

Vu les stats de navigateures, je crois que je vais lâcher Netscape. Je vais tester mes sites avec Mozilla (la suite), Firefox et Thunderbird pour avoir enfin une idée précise des éventuelles différences que je constate.
Maintenant, je n'ai plus qu'à braquer une banque pour me payer un Mac doté de MacIE 5.2


Tester sur différents navigateurs :

Je n'ai pas encore testé le site que tu me conseilles srapaille, mais s'il marche comme ils le disent, c'est une vraie merveille ! Ca évitera peut-être d'installer plein de navigateurs sur mes deux machines (toujours 2 pour tester avec et sans javascript, avec et sans Flash, ...), et même de braquer une banque pour me payer un Mac !
Edit : Un autre site du même genre (pas encore testé personnellement) : http://www.dejavu.org/emulator.htm


Alsacreations :

Ca fait pas mal de fois que je tombe sur des pages de ce site. C'est vrai qu'il a l'air très complet ! Je vais sérieusement approfondir la question.
Mon médecin (adepte des méthodes bourrines) m'a confié qu'on peut aller jusqu'à 40 comprimés par jour sans risquer l'overdose. On va voir ça



En tout cas, merci encore à vous tous.
Affaire à suivre ...

[oberon]

Tu as besoin de tester tes pages dans IE6, Firefox, Opera et Safari. Avec ça tu dois pas être loin de 95% des navigateurs.

Si tu peux tester dans IE5.5 en plus (très proche d'IE6), tu seras dans les 98% des navigateurs.

Attention, les proportions de navigateurs varient selon le type de site et le pays. Moi personnellement IE5 mac, je m'en tape, ça doit représenter 0,1% de mes visites. Par contre si je fais un site lié à l'actualité mac, il est probable que ce taux serait plus élevé. De la même manière, sur tous les sites liés à l'informatique et à la technique en général, les stats de Firefox s'envolent pour parfois dépasser les 50%.

J'ai eu accès il y a quelques mois à des stats de la redoute, c'est 95% IE, la ménagère de moins de 50 ans surfe microsoft

La seule méthode fiable pour faire tes sites c'est de suivre les standards et ça marchera sans problème dans Firefox/netscape7+/Opera7+/Safari/Konqueror après tu ajustes un peu pour contourner les comportements absurdes d'IE6.

[thibo]

La seule méthode fiable pour faire tes sites c'est de suivre les standards et ça marchera sans problème dans Firefox/netscape7+/Opera7+/Safari/Konqueror après tu ajustes un peu pour contourner les comportements absurdes d'IE6.

OK, je faisais plutôt le contraire jusqu'à maintenant : d'abord compatibilité IE6, et ensuite je testais sous Mozilla, et enfin Netscape. Maintenant, je vais faire plutôt l'inverse. D'après ce que je lis un peu partout, il existe beaucoup plus de navigateurs comme Mozilla qui suivent les normes, que de navigateurs comme IE qui fait sa propre sauce.

Merci

[thibo]

Suite de l'affaire

En téléchargeant FireFox, je suis tombé sur cette page : http://openweb.eu.org/articles/navigateurs_alternatifs/ qui explique que :
- Mozilla FireFox est destiné à remplacer Mozilla. Donc Mozilla au placard !
- MacIE fonctionne différemment de IE pour Windows (alors que j'avais lu plus d'une fois le contraire)


Après tous mes tests :
- Mozilla et FireFox ont l'air de tout interpréter de la même manière. Les bugs que j'avais vus chez mon pote venaient à mon avis du fait que sa police était affichée en plus grand
- J'ai réglé deux petits soucis liés à css (un display:inline qui ne donnait pas le même résultat sous IE et FireFox)

Par contre, j'ai un dernier problème qui me troue le ... A propos du doctype et de la couleur de ma scrollbar : Dans ma feuille de styles, j'utilise les "scroolbar-base-color", et autres attributs pour faire un bel ascenceur (seulement sous IE). C'est là, qu'il faut s'accorcher !

Code: Tout sélectionner

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

La scrollbar reste celle par défaut sous IE

Code: Tout sélectionner

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Après quelques tests, je trouve la version 3.2 du même doctype qui affiche la scrollbar comme il faut sous IE. Par contre, catastrophe sous Mozilla : j'ai un menu composé de pleins de jpg les une à côté et au-dessus des autres le tout dans un tableau. Et avec ce doctype, toutes les lignes ont un espace blanc de 5 pixels en-dessous


Edit : il me semble que ce sont toutes les lignes des tableaux qui comportent cet espace, et pas moyen de le réduire à 0 par css ou des attributs html genre vspace

Code: Tout sélectionner

<!-- -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


Je refais quelques tests pour me rendre compte que la version 4.01 de ce doctype fonctionne, à condition qu'il ne soit pas écrit en première ligne du fichier ! Je m'explique : Si je mets une ligne de commentaires avant le doctype, ou si j'écris "bonjour", le menu est correct sous FireFox et la scrollbar aussi sous IE. Si je mets le doctype dès la première ligne, ça se met à déconner sous IE, plus de scrollbar colorée !


Bref, je vais lâcher l'affaire avec ma scrollbar. Si j'ai bien compris ce que j'ai lu sur le site de w3c, c'est encore un truc spécifique d'IE ...

[MarvinLeRouge]

Les propriétés scrollbar-truc sont effectivement spécifiques IE.
Conseils :
1) utilise un doctype strict si tu veux avoir un rendu correct sous IE
2) mets tes propriétés spécifiques IE dans une feuille css à part, et charge la avec un "commentaire conditionnel"

[oberon]

pour tes images, c'est normal les images sont des éléments inline ayant un bas de lettre, il faut les passer en block :
td img {display:block;}

Les tableaux ne doivent pas servir à positionner des éléments mais à présenter des données tabulaires.

[thibo]

2) mets tes propriétés spécifiques IE dans une feuille css à part, et charge la avec un "commentaire conditionnel"

J'avais vu passer des trucs sur les commentaires conditionnels. Je ne connaissais pas. Pour ceux que ça intéresse : http://forum.alsacreations.com/faq/index.php#item53 et http://cybercodeur.net/weblog/commentai ... essage=927 (théorie, exemples pratiques, avis pour et contre)

pour tes images, c'est normal les images sont des éléments inline ayant un bas de lettre, il faut les passer en block :
td img {display:block;}

Les tableaux ne doivent pas servir à positionner des éléments mais à présenter des données tabulaires.

Avant de lire ta réponse, j'étais déjà en train de virer ma structure de tableau pour ce menu . D'abord, ça alourdit inutilement ma page. D'autre part, d'après ce que tu me dis, ce tableau n'est pas utilisé comme il faut (je vais m'intéresser à ces notions de display block et inline, et données tabulaires).


Merci à vous