modern.IE : un nouvel ensemble d'outils pour tester la compatibilité des sites Web

IEBlog Français

Blog de l'équipe de développement de Windows Internet Explorer

modern.IE : un nouvel ensemble d'outils pour tester la compatibilité des sites Web

  • Comments 2

Nous avons lancé hier modern.IE, un nouvel ensemble d'outils et de ressources qui permet aux développeurs de tester leur site pour les 50 % d'utilisateurs et plus qui exécutent différentes versions d'Internet Explorer. modern.IE inclut un assistant qui recherche les problèmes d'interopérabilité récurrents dans l'URL d'une page Web et recommande des solutions possibles afin d'optimiser l'expérience utilisateur sur les navigateurs modernes et antérieurs. Le site offre également 3 mois de tests gratuits entre différents navigateurs, grâce à un partenariat avec BrowserStack. modern.IE fournit de nouveaux compléments Chrome/Firefox et des images d'ordinateur virtuel hors connexion pour aider les développeurs à tester leur site quel que soit le navigateur ou la plateforme qu'ils préfèrent utiliser. Le site modern.IE, que nous actualiserons régulièrement, représente un autre pas en avant en aidant les développeurs à atteindre l'objectif d'interopérabilité par le biais du même code. Notre souhait est que, grâce à ces efforts, les développeurs consacrent davantage de temps à l'innovation sur le Web et moins de temps aux tests.

Recherche des problèmes de codage récurrents (BÊTA)

Commençons par l'assistant. Notre objectif est d'aider les développeurs à consacrer moins de temps aux tests pour Internet Explorer et d'aider la communauté à utiliser le même code sur différents navigateurs et plateformes. La version BÊTA de l'outil détecte 10 problèmes récurrents de codage des sites pour lesquels nous savions pouvoir apporter notre aide. Nous pouvons identifier trois groupes principaux : problèmes découlant de la prise en charge de versions modernes et antérieures d'Internet Explorer, problèmes liés à la prise en charge de plusieurs plateformes et navigateurs et certains aspects qui intéresseront les développeurs pour optimiser l'expérience sur Windows 8.

L'assistant, qui repose sur un scanneur que nous avons utilisé pendant quelque temps au sein de Microsoft, est une version BÊTA et nous planifions de l'améliorer régulièrement au cours des mois à venir, en fonction des commentaires de la communauté. Par exemple, modern.IE effectue désormais une analyse statique du code sur un site Web. Même si cette analyse présente de nombreux avantages en termes de performances, elle peut également donner des résultats incomplets si un développeur utilise du code conditionnel ou la détection des navigateurs. Toutes vos idées sur la manière dont nous pourrions faciliter le test de votre site dans Internet Explorer sont les bienvenues.

Groupe 1 : résoudre les problèmes récurrents découlant de la prise en charge des versions modernes et antérieures d'Internet Explorer

  • Problèmes de compatibilité connus : à chaque version d'Internet Explorer, nous recherchons dans le trafic principal et les sites d'influence les problèmes de compatibilité susceptibles d'empêcher l'affichage du site dans les dernières versions d'Internet Explorer. Nous contactons généralement les développeurs concernés et collaborons avec eux pour les aider à résoudre les problèmes de compatibilité gratuitement. Avec cet assistant, les développeurs peuvent maintenant accéder aux données de compatibilité plus facilement, nous contacter lorsqu'ils ont besoin d'aide et passer moins de temps à parcourir les documents sur MSDN pour en savoir plus sur les correctifs.
  • Mode de compatibilité : la liste d'affichage de compatibilité indique à quel moment un code créé pour des versions antérieures d'Internet Explorer provoque des problèmes de compatibilité avec les versions modernes d'Internet Explorer (telles qu'Internet Explorer 9 et Internet Explorer 10). Les développeurs ne savent pas toujours où, quand et pourquoi leur site est répertorié. Ce test permet de savoir si un site figure ou non dans la liste. Si un site est répertorié, le test recommande l'utilisation de l'outil JS automatisé Compat Inspector qui détecte et supprime l'ancien code afin de rendre le site compatible avec les versions modernes d'Internet Explorer.
  • Infrastructures et bibliothèques : tout comme les navigateurs, les versions antérieures de ces « blocs de construction » Web peuvent entraîner des problèmes de compatibilité. Ce test recherche jQuery, jQuery UI, jQuery Form, SWFObject, MooTools, Modernizr et Prototype.js qui constituent la majorité des problèmes récurrents de compatibilité des bibliothèques que nous observons sur les sites principaux. De nombreuses infrastructures et bibliothèques ont récemment adopté un modèle de mise à jour automatique qui ressemble à ce que les navigateurs modernes, notamment Internet Explorer, utilisent aujourd'hui.
  • Mode de document standard Web : ce test recherche le code DocType qui indique au navigateur qu'il doit s'attendre à recevoir des standards Web modernes, tels que HTML5 et CSS3. Les modes de document antérieurs obligent toutes les versions d'Internet Explorer à adopter le mode de rendu d'Internet Explorer 8, ce qui peut impacter les performances du site et compliquer l'écriture d'un code qui fonctionne dans tous les navigateurs modernes.

Groupe 2 : permettre à un site de bien fonctionner sur plusieurs navigateurs et appareils

  • Préfixes CSS : ce test détecte le moment où le code CSS doit rechercher les préfixes spécifiques aux fournisseurs (-moz, -ms, -o et –webkit) susceptibles d'optimiser la compatibilité de votre code sur tous les navigateurs. Les développeurs peuvent suivre certaines meilleures pratiques pour éviter les problèmes de préfixage, en particulier sur les plateformes mobiles.
  • Plug-ins de navigateur : avec Internet Explorer 10, nous avons illustré notre vision d'un Web sans plug-in. Cependant, nous savons également qu'il s'agit d'une pratique émergente et les développeurs doivent fournir la meilleure expérience possible à l'utilisateur. Ce test détermine si un site a besoin ou non de plug-ins qui peuvent ne pas être disponibles sur un appareil mobile (par exemple sur Surface ou sur un iPad). Si un plug-in est détecté, l'outil indique alors comment en savoir plus sur la création de sites sans plug-in. Si le site s'appuie sur Adobe Flash, l'outil explique comment ajouter votre site à la liste d'affichage de compatibilité pour Flash.
  • Conception Web réactive : en tant que meilleure pratique émergente, ce test détecte si un site utilise les requêtes de médias, une technologie couramment utilisée pour détecter la taille d'écran des appareils utilisés pour la navigation et pour optimiser « de manière réactive » l'affichage du site à l'écran. Plusieurs méthodes permettent d'implémenter les sites conçus de manière réactive et ce test vise principalement à rendre compte de toutes les possibilités offertes par le Web moderne.
  • Détection des navigateurs : l'assistant détecte par ailleurs les modèles de codage (tels que navigator.useragent ou $.browser) susceptibles de déduire la détection des navigateurs. Pour cette version de l'outil, nous observons une approche traditionnelle de détection en éliminant les résultats provenant de scripts qui font référence à un domaine autre que celui de la page Web (comme un logiciel analytique tiers). Nous indiquons quand utiliser la détection des fonctionnalités à la place de la détection des navigateurs en cas de prise en charge de plusieurs navigateurs et plateformes. Même si elle n'est pas requise pour tous les sites, la détection des fonctionnalités peut faciliter la prise en charge d'un site sans qu'il soit nécessaire de retester manuellement chaque nouvelle version de navigateur.

Groupe 3 : faire appel à certaines fonctionnalités nouvelles de Windows 8 lors de la conception

  • Navigation tactile : ce test recommande de configurer le comportement par défaut lorsqu'un utilisateur accède à votre site sur un navigateur tactile. Cette opération indique au navigateur à quoi il doit s'attendre lorsqu'un utilisateur effectue des mouvements tactiles courants (pincement et zoom ou double appui, par exemple).
  • Vignette de site de l'écran d'accueil : enfin, l'assistant recommande aux développeurs une nouvelle manière d'insérer le logo de leur site dans une vignette de l'écran d'accueil de Windows 8. Les utilisateurs peuvent « épingler » leur site favori et le placer directement à côté de leurs applications du Windows Store.

Options virtuelles pour tester Internet Explorer

Bien que les versions modernes d'Internet Explorer soient mises à jour automatiquement, un grand nombre d'utilisateurs utilisent en réalité une version antérieure d'Internet Explorer, telle qu'Internet Explorer 8, Internet Explorer 7 et Internet Explorer 6. Plusieurs options permettent de configurer une matrice de tests, notamment l'administration des PC avec des versions antérieures de Windows et d'Internet Explorer ou la gestion d'une suite d'images de virtualisation, telles que celles que nous avons mis à votre disposition sur le Centre de téléchargement Microsoft. Sur modern.IE, deux options permettent de tester plus facilement le navigateur, même si vous développez sur un autre navigateur ou sur une autre plateforme du système d'exploitation.

Virtualisation hébergée

Les services de virtualisation cloud (ou virtualisation « hébergée ») simplifient la gestion des PC anciens ou d'une suite d'images de test. Grâce à des solutions, telles que BrowserStack, vous pouvez effectuer des tests visuels de votre site directement sur votre navigateur. Si le site que vous testez n'est pas publiquement accessible via une adresse IP ou une recherche DNS, vous pouvez tirer parti des tests du serveur local de BrowserStack à l'aide du tunnel sécurisé Java. Nous mettons également à votre disposition des compléments pour Chrome et Firefox afin de rendre encore plus simples les tests d'Internet Explorer sur ces navigateurs.

Voici par exemple à quoi ressemble le blog Internet Explorer dans Internet Explorer 7 sous Windows XP :

Tests de compatibilité d'Internet Explorer avec BrowserStack

L'offre de trois mois proposée avec modern.IE comprend les services Windows de BrowserStack, notamment la plupart des versions d'Internet Explorer, Firefox, Safari, Chrome et Opera. L'offre est valable pendant une période de trois mois suivant votre inscription au service sur modern.IE. Vous pouvez choisir la date d'activation de votre période de trois mois à tout moment au cours de l'année à venir.

Virtualisation locale

Nous avons également actualisé nos images d'ordinateur virtuel de test pour inclure Internet Explorer (Internet Explorer 6 à Internet Explorer 10) et différentes versions du système d'exploitation Windows. Nous proposons des images pour les plateformes de virtualisation suivantes :

  • Hyper-V sur Windows Server 2008 R2
  • Hyper-V sur Windows Server 2012
  • Virtual PC
  • Parallels pour Windows et Mac
  • VirtualBox pour Windows, Mac et Linux
  • VMWare Fusion pour Mac
  • VMWare Player pour Windows

Nous ne proposons ici qu'une partie des nombreuses informations qui seront divulguées sur modern.IE. Nous sommes impatients de recevoir vos premières réactions : dites-nous ce que vous aimez et quelles sont vos attentes !

— Sandeep Singhal, chef de projet, Internet Explorer

  • Loading...