Navigation de style Metro : un moteur, deux expériences, zéro compromis

Conception de Windows 8

Vision en coulisses de l'équipe d'ingénierie Windows

Navigation de style Metro : un moteur, deux expériences, zéro compromis

Rate This
  • Comments 2

Nous sommes ravis de l'enthousiasme avec lequel les développeurs ont accueilli hier la présentation d'un aspect particulièrement important de Windows 8. Après la version B8, nous allons maintenant passer à la version Developer Preview et nous concentrer sur son contenu et son évolution. Nous espérons que tous les utilisateurs qui participent à ce blog ont installé cette version et l'utilisent déjà ! Même s'il s'agit d'une version préliminaire avant tout destinée aux développeurs, elle est plutôt amusante à utiliser. Personnellement, je publie désormais tous mes billets à l'aide de la tablette de démonstration Samsung !

Dans ce billet, nous évoquons la navigation de style Metro et les efforts mis en œuvre pour proposer une expérience de navigation débarrassée des éléments d'interface classiques tels que les barres de titre, les barres de défilement ou les cadres de fenêtre : en bref, un navigateur dépourvu de ce qu'on appelle le « chrome ». Nous nous concentrons sur la prise en charge de HTML5 et des divers standards offrant ce qui se fait de mieux en termes de performances et de fiabilité, ainsi que sur les fonctionnalités de sécurité d'IE les plus fameuses. Nous continuons également à faire évoluer l'expérience utilisateur du Bureau, qui exploite ces mêmes technologies HTML5. Ainsi, avec IE10, nous proposons une navigation sans compromis. Dans ce billet, nous décrivons la version Platform Preview 3 d'IE, incluse dans Windows 8 Developer Preview. Dean est l'auteur de ce billet. --Steven

Pour proposer une expérience de navigation innovante, il ne suffit pas de transposer un navigateur traditionnel sur un appareil tactile. Aussi, afin de vous offrir ce qui se fait de mieux en matière de navigation sur tous les formats d'appareils exécutant Windows 8, nous avons réimaginé l'expérience utilisateur du navigateur Web ainsi que l'architecture sous-jacente.

Pour Windows 8, notre approche s'appuie en premier lieu sur un moteur de navigation HTML5 extrêmement performant, offrant deux expériences utilisateur différentes. Ce moteur unique assure notamment la prise en charge optimale des standards Web. Il offre en outre d'excellentes performances, grâce à l'accélération matérielle, ainsi qu'un haut niveau de sécurité et de confidentialité. Nous avons bâti deux expériences utilisateur par-dessus ce moteur : une nouvelle expérience de style Metro et une autre plus traditionnelle, similaire à celle offerte par les navigateurs de la génération actuelle, dotés d'onglets et présentant relativement peu de « chrome ».

Ainsi, vous pouvez profiter sans compromis des deux expériences sur un même périphérique, et utiliser celui-ci comme une tablette tactile immersive ou comme un ordinateur portable extrêmement flexible. Si vous disposez d'un ordinateur de bureau surpuissant équipé de plusieurs écrans, vous pouvez également profiter de ces deux expériences : zéro compromis !

Grâce au navigateur de style Metro de Windows 8, vous bénéficiez de l'immersion et des fonctionnalités tactiles des sites Web HTML5. Si vous préférez un système plus classique de gestion des fenêtres et des onglets, il vous suffit d'utiliser la version de Bureau d'IE. Les deux s'appuient sur le même moteur IE10.

Étonnamment, lors de la conception de la toute nouvelle expérience de style Metro, nous avons réalisé que cette interface de navigation peut s'avérer idéale même si vous disposez d'un grand écran, d'un ordinateur de bureau, d'un clavier et d'une souris. Si ce navigateur est avant tout destiné aux interfaces tactiles, il fonctionne parfaitement avec un clavier et une souris ou un trackpad. Si vous utilisez régulièrement votre téléphone pour naviguer sur le Web, vous vous êtes certainement habitué à l'absence de « chrome », au système de gestion des onglets plus visuel et à une navigation plus immersive, plus manuelle et moins centrée sur le Bureau. À l'usage, vous préférerez peut-être la nouvelle expérience de style Metro d'Internet Explorer 10 à l'interface classique de Bureau.

Un petit rappel : le navigateur de style Metro disponible dans la version Developer Preview actuelle de Windows s'adresse aux développeurs et non pas au grand public. Il reste beaucoup de travail à accomplir aux côtés de la communauté des développeurs pour rendre l'expérience adaptée au grand public (faire en sorte que les sites mettent à jour leurs bibliothèques anciennes et obsolètes qui ne fonctionnent pas correctement avec IE10, ou s'assurer que les sites qui fonctionnent déjà sans plug-in sur les autres périphériques sont compatibles avec le navigateur de style Metro).

Un moteur, deux expériences

Comme il est indispensable d'assurer une prise en charge optimale de HTML5 sur les deux interfaces d'IE, nous avons adapté l'architecture du moteur IE10 de façon à le rendre compatible à la fois avec l'interface de style Metro et l'interface classique de Bureau. Les deux expériences partagent un même historique de navigation, les adresses saisies, les paramètres et d'autres éléments. Le moteur commun offre une navigation rapide, fiable et performante dans toutes les situations, aussi bien sur les sites actuels qu'avec les applications de style Metro :

  • Performances. La version de style Metro d'IE assure le même niveau de performances que la version de Bureau. Elle offre notamment une accélération matérielle complète pour les graphismes, la vidéo et l'audio, du code JavaScript compilé, ainsi que de nouvelles optimisations de présentation et de mise en forme, pour plus de réactivité tactile.
  • Sécurité. Comme la version de Bureau d'IE, la version de style Metro offre également ce qui se fait de mieux en matière de sécurité, de confidentialité et de fiabilité. Vous profitez ainsi de la technologie SmartScreen, du filtrage XSS et de la navigation InPrivate.
  • HTML5. Comme la version de Bureau d'IE, la version de style Metro s'engage également sur la voie d'un modèle de programmation Web HTML5 toujours plus riche. Comme nous l'avons indiqué au cours de la conférence BUILD, le système prend en charge de nombreuses évolutions technologiques récentes, en plus des autres fonctionnalités déjà présentées dans les versions Platform Preview d'IE10 : propriété CSS Text Shadow, transformations 3D en CSS, API IndexedDB, Web Sockets, API de fichier HTML5, historique HTML5, césures, transitions et animations CSS et cache d'application.

Pour obtenir plus d'informations sur la version de Bureau d'IE et découvrir les détails techniques du moteur de navigation Trident sous-jacent et du moteur JavaScript Chakra, consultez le blog IE.

Un navigateur réimaginé sous forme d'application de style Metro

Lorsque nous avons réimaginé le navigateur sous forme d'application de style Metro, nous avons découvert une façon radicalement nouvelle de faire avancer le Web.

Par exemple, le style Metro est immersif. Ainsi, les pages Web affichées dans la version de style Metro d'IE ne présentent aucune distraction visuelle. Vous pouvez utiliser des mouvements de doigts standard pour accéder aux fonctionnalités qui risqueraient de détourner votre attention du contenu. Vous pouvez effectuer des recherches et partager des informations à partir de la version de style Metro d'IE en utilisant des « symboles », comme dans les autres applications Metro. Vous pouvez par exemple utiliser le symbole Devices (Appareils) pour lire et projeter sur des appareils externes les vidéos figurant dans des pages Web. Vous pouvez très facilement afficher IE et une autre application de style Metro côte à côte. Conçus pour fonctionner conjointement, les sites Web et les applications de style Metro peuvent être utilisés ensemble très facilement.

Le nouveau style Metro est bien plus qu'un simple concept visuel. Ainsi, il vous permet par exemple d'accéder à vos sites importants avec moins de manipulations qu'auparavant. Dès que vous ouvrez un nouvel onglet ou que vous affichez la barre d'adresse, une liste visuelle adaptée aux interfaces tactiles s'affiche. Elle regroupe tous les sites que vous visitez fréquemment ou que vous avez épinglés :

Image montrant des mosaïques contenant les sites visités fréquemment et les sites épinglés, au-dessus d'une barre d'adresse dotée d'un clavier virtuel
Liste
visuelle des sites visités fréquemment et des sites épinglés, adaptée aux interfaces tactiles, dans le navigateur de style Metro

Le fait de saisir des caractères dans la barre d'adresse filtre cette liste. Pour vous permettre d'accéder au site souhaité s'il n'est pas déjà ouvert, la barre d'adresse apparaît dès que vous affichez la liste des onglets ouverts :

Image du navigateur de style Metro affichant le site BUILD et présentant plusieurs onglets ouverts au-dessus de la page Web, ainsi qu'une barre d'adresse située au bas de l'écran.
Onglets ouverts et barre d'adresse dans le navigateur de style Metro

Les fonctionnalités de vérification orthographique et de saisie semi-automatique réduisent également la quantité de caractères à saisir pour utiliser les sites. Vous pouvez même naviguer sur le Web en profitant de la technologie InPrivate et de la protection contre le tracking.

Pour accéder plus facilement à vos sites Web importants et les utiliser, vous pouvez les épingler au nouvel écran de démarrage de Windows 8, comme n'importe quelle application de style Metro.

Les sites peuvent être épinglés à l'écran de démarrage
Les sites peuvent être épinglés à l'écran de démarrage

Pour faciliter l'utilisation des interfaces tactiles, IE10 laisse plus de place autour des différentes commandes (cases à cocher, cases d'option, etc.). Pour mieux adapter leurs pages aux interfaces tactiles, les développeurs peuvent utiliser des modèles de conception Web standard tels que CSS afin de définir l'apparence des commandes. L'image ci-dessous présente par exemple une commande HTML5 de saisie de plage de valeurs dotée d'une image d'arrière-plan personnalisée :

Commande HTML5 dotée d'une image d'arrière-plan personnalisée dans IE10, Chrome et Mozilla Firefox
Commande HTML5 dotée d'une image d'arrière-plan personnalisée dans IE10 (en haut), Chrome (en bas à gauche)
et Mozilla Firefox (en bas à droite)

La version de style Metro d'IE prend en charge les mouvements panoramiques tactiles et le zoom par pincement. Comme l'ensemble du système, les pages sont réactives et fluides, car le moteur HTML5 exploite l'accélération matérielle complète. Cette réactivité est particulièrement remarquable lors des opérations de défilement et des mouvements panoramiques.

Voici une présentation montrant la réactivité du navigateur et décrivant d'autres aspects de l'expérience de navigation :


Téléchargez cette vidéo pour la regarder sur votre lecteur habituel :
MP4 haute qualité | MP4 faible qualité

IE en style Metro : perspectives

Cette nouvelle expérience de navigation nous laisse entrevoir d'autres opportunités pour faire avancer les usages du Web. Il reste cependant beaucoup de travail à accomplir pour que les développeurs de sites puissent en profiter pleinement. Le tactile est très important, au même titre que l'immersion. Vu le temps passé sur le Web par les utilisateurs, le potentiel en la matière est immense.

La version Developer Preview actuelle de Windows s'adresse aux développeurs et non pas au grand public. Par exemple, nous avons encore du travail à accomplir pour faire en sorte que les sites qui s'exécutent déjà sans plug-in sur les autres périphériques puissent fonctionner de la même manière avec IE10. De même, certains sites devront peut-être mettre à jour des bibliothèques anciennes et obsolètes qui ne fonctionnent pas de façon optimale avec IE10. Nous devons également inclure le navigateur de Bureau tel qu'on le connaît à l'heure actuelle pour proposer le haut niveau de compatibilité que les utilisateurs sont en droit d'attendre d'une nouvelle version de Windows.

Certains pessimistes critiqueront peut-être notre choix de proposer « deux navigateurs ». En fait, il s'agit d'un seul et même moteur de navigation, proposant deux apparences différences. Au fil du temps, le style Metro devrait s'imposer dans les usages de navigation courants, mais le navigateur de Bureau continuera à jouer un rôle important dans la vie de nombreux internautes. Sous Windows 8, vous pouvez définir l'un ou l'autre comme navigateur par défaut, ou utiliser n'importe quel autre navigateur.

Certains trouveront peut-être que les fonctionnalités proposées sont trop nombreuses ou qu'ils n'ont pas besoin de tel ou tel aspect de chaque style de navigateur. Si vous souhaitez rester immergé dans l'univers Metro, vous le pouvez. Vous ne verrez jamais le Bureau, et Windows n'en chargera pas le code tant que vous ne déciderez pas de l'activer. Si vous préférez toutefois utiliser le Bureau pour bénéficier d'un contrôle plus précis, de fonctionnalités plus puissantes de gestion des fenêtres et des fichiers, et d'une meilleure compatibilité avec les plug-ins, vous pouvez y accéder à l'aide d'un doigt. Nous avons délibérément voulu proposer une expérience sans compromis en termes d'architecture et de conception, pour répondre à tous vos besoins, et ce, même si vous n'utilisez qu'un seul appareil. Avec Windows 8, vous naviguez comme vous l'entendez !

Dean Hachamovitch

  • Loading...
Leave a Comment
  • Please add 1 and 1 and type the answer here:
  • Post