Compatibilité avec les vieux navigateurs : 3 tactiques pour réduire les coûts

par
   

Les navigateurs Web ont la faculté d'être compatibles de façon descendante (backward) et ascendante (forward). Cette compatibilité ascendante est une bénédiction. En effet, elle nous permet d'utiliser les balises HTML les plus récentes sans faire planter les vieux navigateurs.

Par exemple, on peut spécifier qu'un champ de formulaire est de type "email", ce qui permet à un téléphone intelligent comme l'iPhone d'afficher le clavier approprié. Les anciens navigateurs, qui ne savent pas interpréter ce paramètre, vont simplement l'ignorer. Dans le jargon, on parle d'une approche d'amélioration progressive (progressive enhancement).

Malheureusement, les anciens navigateurs ont tendance à afficher les pages avec des différences esthétiques importantes, et ce, même si ces pages respectent parfaitement les normes.

Il est toutefois possible de contourner une partie des problèmes de compatibilité, mais au prix de beaucoup d'efforts. Ces efforts sont-ils un bon investissement? N'est-il pas plus simple de demander aux utilisateurs de mettre à niveau leur navigateur?

Les versions désuètes d'Internet Explorer

Le fait est que les problèmes de compatibilité concernent surtout Microsoft Internet Explorer, d'une part à cause de sa popularité, et d'autre part à cause du faible taux d'adoption des nouvelles versions de ce navigateur.

Ce faible taux d'adoption, visible sur le graphique ci-dessous, est en partie influencé par le mode de mise à niveau de l'application. Contrairement à Chrome qui se met à jour automatiquement au redémarrage, il faut faire une opération manuelle pour mettre à jour Internet Explorer. Aussi, un administrateur de système peut bloquer cette mise à jour.


Taux d'adoption des versions d'Internet Explorer

C'est pourquoi Internet Explorer 6 est encore utilisé par 1.5% des utilisateurs au Canada, principalement dans certaines grandes organisations qui estiment que le coût d'une mise à jour est trop élevé.

Le coût de la compatibilité

Plusieurs compagnies majeures ont abandonné le support d'IE6, par exemple : Google (Gmail, Apps, YouTube), Facebook et même Microsoft (Sharepoint). Ceci est dû principalement aux coûts engendrés qu'on pourrait séparer en trois catégories :

1. Coût de codage

À partir d'informations recueillies auprès de développeurs et de firmes spécialisées, il semble que l'effort supplémentaire  pour assurer la compatibilité avec la version 6 de Microsoft Internet Explorer (IE) soit d'environ 10% à 25%.

Sachant cela, la plupart des entreprises prennent la décision d'ignorer IE6. Mais les problèmes de compatibilité des versions 7 et 8 ne sont pas négligeables non plus.

2. Coût de maintenance

L'ajout de cette comptabilité ne manquera pas de complexifier le code source du site ou de l'application, ce qui en augmentera le coût de maintenance.

3. Coût d'opportunité

En exigeant un maximum de compatibilité au lancement d'un site ou d'une application Web, on en retarde le lancement. Or, ce retard aura un impact sur la part de marché qu'on peut espérer. C'est pourquoi certaines compagnies lancent d'abord et bonifient ensuite la compatibilité quelques mois après le lancement.

Aussi, certaines entreprises vont parfois jusqu'à exiger un affichage uniforme dans tous les navigateurs. C'est sans doute une erreur, car en plus d'entrainer des coûts importants, un tel requis limite les fonctionnalités qui peuvent être proposées aux internautes. Par exemple, l'adoption d'une mise en page réactive ne serait pas possible avec une telle contrainte.

N'y aurait-il pas une approche moins coûteuse ? Voici trois tactiques pour tenir compte des vieux navigateurs :

Tactique no 1. Dégradation élégante

L'une des tactiques consiste à développer d'abord en testant pour Firefox et WebKit (Safari et Chrome), et d'ensuite s'assurer d'une dégradation élégante les vieux navigateurs. Suivant cette approche, on s'autorise à utiliser les fonctionnalités récentes des navigateurs, tout en prévoyant une alternative fonctionnelle pour les plus anciens.

Par exemple, un bouton pourrait avoir des coins arrondis dans les navigateurs récents et avoir des coins carrés dans Internet Explorer 6 et 7.

Tactique no 2 : Utiliser uniquement des solutions à code ouvert

L'union fait la force. En utilisant uniquement des solutions à code ouvert pour l'intégration d'un site ou d'une application, on évite la plupart des coûts liés à la compatibilité. Souvent utilisées par des milliers de développeurs, ces solutions sont déjà compatibles avec les plus vieux navigateurs, en utilisant une approche de dégradation élégante.

Voici quelques exemples de solutions à code ouvert qui permettent d'éviter une bonne partie des problèmes de compatibilité :

jQuery (en Javacript)

jQuery est une libraire JavaScript qui permet d'interagir avec le HTML et le CSS d'une page, sans se soucier des différences entre les navigateurs.

Foundation

Le framework Foundation permet de créer des sites réactifs nécessitant peu d'effort. Seul IE6 n'est pas supporté.

Twitter Bootstrap

L'équipe d'intégrateurs chez Twitter a créé le framework Bootstrap à code ouvert qu'ils utilisent pour créer toutes les applications Web de Twitter. IE6 n'est pas supporté.

Tactique no 3 : traiter IE 6 et 7 comme un téléphone mobile

Combinant l'approche « mobile d'abord » (mobile first) et le design réactif, Joni Korpi proposait récemment une approche encore plus radicale : traiter les vieilles versions d'Internet Explorer (6 et 7) comme un site mobile en leur présentant une version simplifiée d'un site.

Conclusion

À moins d'avoir un budget illimité, il n'est désormais plus possible de réaliser un site ou une application optimisée pour tous les navigateurs et tous les types d'appareils.

COMMENTAIRES

  1. Fred Prieur

    Très bon article, je ne connaissais pas l’existence de foundation, merci pour la découverte.

Laisser un commentaire

XHTML: Balises autorisées <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>