Tester ses navigateurs de façon fiable [Article]

[Bovino]

jpvincent vous présente un article détaillant selon lui la meilleure façon de tester ses réalisations Web sur différents navigateurs.

Tester ses navigateurs de façon fiable

Que pensez-vous de sa façon de procéder ?
Trouvez-vous qu'il en fait trop ou au contraire, qu'il oublie des points importants ?

N'hésitez pas non plus à faire part de vos remarques et / ou encouragements !

à lui pour cette contribution très utile !

[camus3]

Ah ça c'est le cœur de métier du développeur/intégrateur "front".

Le problème est le suivant :
Certaines choses fonctionnent sur la plupart des navigateurs.
D'autres ont moins de chances de fonctionner sur un grand nombre de navigateurs.

La solution est la suivante : réduire la partie client à des éléments qui auront le plus de chance de fonctionner sur la plupart des navigateurs. Donc exit toutes les technos trop nouvelles ou certains effets qui ne servent à rien.

Par exemple , la transparence png c'est bien mais IE6 ne supporte pas.
Solution 1: un hack dans les CSS, un plug , ect ...
Solution 2: ne pas utiliser la transparence PNG.
c'est relativement simple.

Il est impossible de contrôler le client de l'internaute, vieux client ou client du future.
Soit on cible une catégorie de gens dont on sait qu'ils utiliserons plus telle ou telle techno ( un site sur CSS3 par exemple peut se permettre de faire du CSS3 , un site sur silverlight peut se permettre de mettre du silverlight ...).

Soit on utilise les technos les plus génériques possibles quitte à ce que le graphisme en souffre un peu ( un site institutionnel par exemple , on va le faire tout en canvas 3D ?!? ).

Sinon adobe a sorti browserlab , le problème est qu'on peut juste comparer le rendu des pages , pas le reste.

Les machines virtuelles me semble une solution intéressante , mais peut être un peu lourde pour les tests ( sans compter qu'il faut en théorie une licence windows par installation , machine virtuelle ou pas ).

Personnellement, je m'engage à ce que les sites que je développe soient "compatibles" IE6 uniquement. Impossible de garantir qu'un site s'affiche correctement sur toutes les versions de tout les navigateurs.

De plus les développeurs "prennent javascript pour acquis", c'est une faute à mon avis. Il doit y avoir un fallback quand javascript n'est pas activé, 99% des sites "javascript" n'en fournissent pas.

Enfin , l'internet mobile va représenter une part de plus en plus importante des clients. Ca va devenir impossible de tester sur tout les handsets possibles...

[IceFab]

Envoyé par camus3

Enfin , l'internet mobile va représenter une part de plus en plus importante des clients. Ca va devenir impossible de tester sur tout les handsets possibles...

Exact , d'ou l'importante du html5 (et la compatibilité des terminaux)

Sinon tres beau travail Vincent ca sera utilise a plus d'une personne

[jpvincent]

Envoyé par camus3

l'internet mobile va représenter une part de plus en plus importante des clients. Ca va devenir impossible de tester sur tout les handsets possibles...

Oui, c'est un vrai problème, extrêmement coûteux à l'équipement, et extrêmement lourd lors des tests. Perso concernant la partie mobile j'ai longtemps essayé d'adapte un site desktop pour qu'il passe aussi sur mobile. Techniquement ça va, on peut même gérer les événement touch sans trop de problème.
Mais ergonomiquement et en terme de perfs, on se rend vite compte que le site n'est en fait pas vraiment pratique : boutons trop petits, chargement trop long, trop de textes et d'interface à décrypter ... Bref j'en suis arrivé à la conclusion qu'il faut construire un site dédié simplé pour tous mobiles. Et à partir du moment où on fait simple, on a de plus grandes chances que ça passe partout sans aller le vérifier.

Concernant le desktop, je reste sur mes positions cependant : l'équipement n'est pas très cher, les machines virtuelles sont un tout petit peu pénibles à gérer, mais c'est plus fiable que des packs d'IE et plus pratique que d'autres solutions comme des machines physiques ou des accès à distance

[kain_tn]

L'article est pas mal et je suis d'accord sur le principe des environnements séparés grâce aux VMs. C'est une très bonne pratique. Après, le fait de tourner sous OSX honnêtement c'est une question de goûts et d'habitudes (selon les missions je travaille sous Windows ou sous Linux (ou sur les deux avec des VMs) et je suis franchement mal-à-l'aise sous mac, que ce soit au niveau du confort du clavier, de la souris ou encore du shell et de la console trop peu confortables par rapport à ceux de mon Linux habituel. Je suis de ceux qui pensent qu'une tour avec des éléments interchangeables a encore tout-à-fait sa place pour du développement, mais je m'égare!)

En revanche, je suis d'avis qu'à partir du moment où un site peut se le permettre, il ne doit pas se casser la tête pour supporter toutes les versions d'IE par exemple.

Je sais, c'est dur, mais avant de hurler, laissez-moi m'expliquer:

Je pense qu'il vaut mieux respecter les standards W3C le plus possible et expliquer au visiteur que son navigateur est dépassé si celui-ci ne les respecte pas.
MS fait des efforts (enfin) avec son dernier navigateur et avec l'émergence du web pour les smartphones, il y a de plus en plus de navigateurs à tester. Il faut donc viser la standardisation (le plus possible) pour obliger les éditeurs de navigateurs à implémenter correctement les standards et non pas les encourager à faire ce qu'ils veulent.

Après, il reste tous ceux qui n'ont pas la possibilité de migrer de IE6 à IE8+ par exemple. Pour ceux là je dirais: vous avez de la chance car vous êtes sur Windows et que par conséquent il y a plein de navigateurs gratuits aux normes W3C et qui pourront cohabiter avec votre version de IE6

[camus3]

Je pense qu'il vaut mieux respecter les standards W3C le plus possible et expliquer au visiteur que son navigateur est dépassé si celui-ci ne les respecte pas.

Mouais ... Quel standard ? HTML4 est un standard aussi valide que HTML5 , HTML3 ou XHTML ...
De plus j'imagine ma cousine arriver sur une page qui dit : "votre navigateur ne respecte pas le standard X fixé par Y , nous ne pouvons afficher le site , changez de navigateur ..."
Ma cousine qui ne connait pas le W3C et ne veut pas changer de client , va tout simplement zapper ton site, quand bien même il est bien fait, puisque ce genre de message n'est pas une invitation mais un reproche fait à l'internaute, qui ne consommera aucun de tes services parce que tu as fait le choix de le "snobber". encore une fois il y a une répartition des navigateurs , ce n'est pas au développeur de dire au client ce qu'il doit faire , c'est au développeur de s'adapter au besoin du client , en tout cas dans l'optique ou il compte toucher le plus de monde possible.
En entreprise par exemple , les usagés ne peuvent pas upgrader ou choisir leur browsers ( pour X raisons ).
Idem avec les fallbacks javascript dont je parlais. Si un site m'affiche vous avez besoin de javascript sans rien m'afficher d'autre comme contenu je zappe direct. Il faut savoir que de plus en plus d'internautes désactivent flash et javascript par défaut( flash est plus facile à activer car les plugs laissent des place holder avec une icone , javascript désactivé , bah ya rien qui s'affiche , à par la balise no script bien sur ).

[Bovino]

Il faut savoir que de plus en plus d'internautes désactivent flash et javascript par défaut

Première nouvelle ! Tu tiens ça d'où ?

Mais tu as probablement raison, ce qui explique que des sites "mal faits" et peu populaires (Facebook, iGoogle, Yahoo!, j'en passe) sont délaissés par les utilisateurs se sentant snobbés par le message "JavaScript doit être activé"...

[Farid63]

Envoyé par Bovino

Première nouvelle ! Tu tiens ça d'où ?

Mais tu as probablement raison, ce qui explique que des sites "mal faits" et peu populaires (Facebook, iGoogle, Yahoo!, j'en passe) sont délaissés par les utilisateurs se sentant snobbés par le message "JavaScript doit être activé"...

+1
Avec Youtube, beaucoup de monde installe Flash sans savoir ce que c'est, ça lit les vidéos, c'est ce que l'utilisateur veut donc... (Pareil pour les sites de jeux en flash).

Pour le Javascript, il me semble qu'aujourd'hui beacoup moins de personnes le désactive.

[David_g]

Disons que Camu3 se contredit un peu en partant du principe qu'il faut des fallbacks. Ceux ci ne sont comme il le dit lui même nécessaire si les clients que tu veux toucher peuvent en avoir besoin (sinon cela ne vaut pas l'effort supplémentaire)

Par exemple pour les sites de collectivités c'est une obligation légale (accessibilité) mais pour un site lambda cela n'a que peu d'utilité (Personne sauf les geeks ne désactivent Js par défaut ou a mis une extension noscript sur son navigateur)

Js fut relativement "beaucoup" désactivé à l'époque ou chaque site ouvrait 25 pop up de pub. Depuis la pub, et les antipop up, adblock etc ont évolués et les gens ne le font plus.

[jpvincent]

Envoyé par kain_tn

le fait de tourner sous OSX honnêtement c'est une question de goûts et d'habitudes

Oui j'ai eu une petite levée de boucliers quand j'ai écrit cet article, donc je vais juste re-préciser mes propos : OSX + les VMs, c'est pour moi l'environnement de travail idéal pour garantir la fiabilité des tests, c'est en tout cas celui que j'exige de mon employeur.
Maintenant des machines physiques ou des VMs sur un windows/linux avec un Mac à côté pour tester, ça marche aussi ... techniquement Ce que je constate dans les équipes Web c'est que dès qu'il y a une machine physique et qu'il faut se lever de sa chaise pour aller tester, ou utiliser du contrôle à distance qui lag un peu, les développeurs Web l'utilisent beaucoup moins, et ça compromet la qualité du site. C'est mieux que de rien n'avoir et donc ne pas pouvoir tester des bugs qui te sont remontés, mais c'est juste moins pratique et donc moins utilisé.

Envoyé par kain_tn

Je pense qu'il vaut mieux respecter les standards W3C le plus possible et expliquer au visiteur que son navigateur est dépassé si celui-ci ne les respecte pas.

Ca sent le jeté de trolls
C'est un vieux débat, et mon constat c'est que les utilisateurs qui savent ce qu'est un navigateur ET qui ont le choix ont déjà migré, et que ce ne sont pas les sites qui leur feront changer de browser. 2 faits :

• Facebook pendant l'été 2009 a mis un bandeau sur son site : upgradez votre IE6. A cette époque il représentait déjà 200 millions d'utilisateurs, donc une part significative du Web : les stats d'utilisation d'IE6 à travers le monde n'ont pas baissé
• Début 2010, Microsoft dans un de ses patchs a été contraint par l'Europe de mettre un gros bandeau pour que les utilisateurs choisissent leur navigateur. Les stats d'utilisation d'IE en Europe n'ont pas baissé, alors qu'Opéra s'est vanté d'avoir multiplié le nombre de téléchargement par 10

Moralité : personne même microsoft qui paye de la publicité pour upgrader en IE8 ne peut inciter ces utilisateurs à changer.
Et philosophiquement, je vois ces utilisateurs comme des handicapés : c'est notre devoir de faire notre possible pour qu'ils aient accès aux fonctionalité des sites (je n'ai pas dit pixel perfect)

[kain_tn]

Envoyé par jpvincent

Oui j'ai eu une petite levée de boucliers quand j'ai écrit cet article, donc je vais juste re-préciser mes propos : OSX + les VMs, c'est pour moi l'environnement de travail idéal pour garantir la fiabilité des tests, c'est en tout cas celui que j'exige de mon employeur.

Tu as bien raison de t'imposer. Un environnement adapté à l'utilisateur, c'est du travail plus efficace et une motivation accrue.

Envoyé par jpvincent

Ca sent le jeté de trolls

Pas du tout!
C'est seulement mon point de vue et non une vérité. Il est donc logique et vraisemblable que tout le monde ne soit pas d'accord avec ça. Néanmoins c'est ce que j'applique à chaque fois que je le peux.

Envoyé par jpvincent

Et philosophiquement, je vois ces utilisateurs comme des handicapés : c'est notre devoir de faire notre possible pour qu'ils aient accès aux fonctionalité des sites (je n'ai pas dit pixel perfect)

Ouh! C'est violent comme point de vue

C'est aussi pour ça que je commençais ma phrase plus haut par "je suis d'avis qu'à partir du moment où un site peut se le permettre". Pour un site étatique je ne trouve pas normal de pénaliser une partie des visiteurs, étant donné que ce dernier est supposé être accessible au public (c'est-à-dire à toute la population).
Le truc c'est qu'à un moment il faut faire un choix: celui de toucher le plus de monde possible avec des fonctionnalités vieilles de plusieurs années, ou de toucher moins de monde mais de se distinguer des autres... Un site privé a le droit de faire ce choix, contrairement à un site étatique (en gros, il y en a un qui a le droit de choisir son public, et l'autre non).

Bref c'est un sujet qui a déjà été maintes fois débattu sur le forum, comme par exemple lors du choix de silverlight pendant les JOs je crois (ou alors les championnats du monde d'athlétisme, je ne sais plus) pour diffuser la TV sur le net.

[kimjoa]

Encore un très bonne article , bravo jpvincent!

Est-ce que c'est aux développeur de s'adapter aux surfeur, ou aux surfeur de s'adapter au web et ses standards?

Personnellement je pense un peu comme kain_tn, et penche pour la deuxième solution, avec l'aide du développeur. Sensibiliser plus les utilisateurs d'ancien navigateur sur les standards du web, les informer que leurs navigateurs ne les respectent pas, que ca demande plus de temps de développement et limite par conséquence l'évolution du web....
Pourquoi pas avec un petit bandeau avec un message courtois plus un lien vers plus d'information sur les différents navigateurs moderne et leurs procédure installation...
De plus pour des petit site ou le design et son intégration représente pratiquement la totalité du cout du projet, l'adapter a tout les navigateurs peux très vite faire monté la facture et donc son retour sur investissement.
Après bien sûr ca dépend aussi du publique visé par le site. Un site institutionnelle ne pourra pas se permettre de mettre de coté les 10 ou 15% d'utilisateur d'IE6.

En tout cas j'ai appris plein de truc avec se tuto !! Le coup de la virtualisation c'est malin merci !!

[Meskalyn]

Article un peu trop "mac" à mon gout. On peut faire la même chose sous Win ou sous Linux et dire que les journalistes ou les graphistes sont sous Mac, ça pique les yeux.

Bon, moi de mon côté j'ai arrêté le support IE 6 depuis quelques temps (plus d'1 an en tout cas).

Sur certains sites je me suis permis des messages plutôt insultants, et sur d'autres des redirections vers des pages explicatives.

Quand on voit que même niveau serveur on est obligé de faire des exceptions pour IE 6 (compression gzip), perso ça m'embête.

Bon, sinon l'article est très sympa. Manque en effet quelque chose sur les mobiles, là le gros point positif est le SDK d'android qui permet quand même de faire pas mal de test sur pas mal de résolution et de pas mal de version du navigateur intégré.

[jpvincent]

Envoyé par Meskalyn

Article un peu trop "mac" à mon gout. On peut faire la même chose sous Win ou sous Linux et dire que les journalistes ou les graphistes sont sous Mac, ça pique les yeux.

et pourtant je ne suis pas du genre fanboy (pas d'iPod, pas d'iPhone, pas de MacOS en dehors du taf)

Si tu ne me crois pas concernant les graphistes et les journalistes qui sont originellement les utilisateurs principaux des Mac (et effectivement je n'ai pas de chiffres à montrer), considère au moins que Mac représente 6% des visiteurs, que ce chiffre augmente et qu'on ne peut donc pas les ignorer, et donc qu'il faut pouvoir tester sur cet OS.

Envoyé par kimjoa

plus pour des petit site ou le design et son intégration représente pratiquement la totalité du cout du projet, l'adapter a tout les navigateurs peux très vite faire monté la facture et donc son retour sur investissement.

Le support des navigateurs est à gérer au cas par cas selon la population du site, on est d'accord. Dans ma boîte nous avons jeté le support d'IE6 depuis 6 mois car il passait sous les 3% et que les intégrateurs ont eu du poids
Mais ce n'est pas professionnel de dire : j'ai pas envie de m'embêter avec IE6 et 7, donc je teste pas. Ton patron ou ton client perd de l'argent, et sur les sites dont je me suis occupé le coût de l'intégration CSS (+10-30% de temps selon l'expérience de l'intégrateur) est assez petit par rapport au coût de développement global du projet. Sur le projet que je gère depuis 2 ans et demi, on doit être à 40% de PHP-SQL, 50% de JS, et 10% de HTML-CSS.
Mais chaque projet a ses spécificités

[WhoIsTiti]

Envoyé par jpvincent

Oui j'ai eu une petite levée de boucliers quand j'ai écrit cet article, donc je vais juste re-préciser mes propos : OSX + les VMs, c'est pour moi l'environnement de travail idéal pour garantir la fiabilité des tests, c'est en tout cas celui que j'exige de mon employeur.
Maintenant des machines physiques ou des VMs sur un windows/linux avec un Mac à côté pour tester, ça marche aussi ... techniquement Ce que je constate dans les équipes Web c'est que dès qu'il y a une machine physique et qu'il faut se lever de sa chaise pour aller tester, ou utiliser du contrôle à distance qui lag un peu, les développeurs Web l'utilisent beaucoup moins, et ça compromet la qualité du site. C'est mieux que de rien n'avoir et donc ne pas pouvoir tester des bugs qui te sont remontés, mais c'est juste moins pratique et donc moins utilisé.

je partage cette analyse à 150%.
la virtualisation est la solution idéale.
Mon confort se résume à très peu :1 tour (avec un 6 coeurs/8go RAM/une carte graphique dédiée/Des DD rapides) et 3 écrans de 22 pouces.(pas de wifi, pas de trucs qui clignote et qui font 'puet', bref de l'efficacité) et biensûr VMWare Workstation.


En tous cas, tu as bien fait de rédiger cet article, ça me permet de rectifier le tir avec certains 'webmasters' qui font un peu trop confiance aux softs qui 'émulent' IE avec des résultats qui diffèrent par rapport à de vraies versions sous des OS virtualisés.