Éléments visuels de haute qualité pour les sites épinglés dans Windows 8

Le billet de blog Sites épinglés dans Windows 8 explique comment les développeurs de sites peuvent fournir une icône de site (icône favorite) pour les vignettes de sites épinglés sur l'écran d'accueil de Windows 8. Vous avez été nombreux à nous indiquer que vous souhaitiez fournir des éléments visuels de résolution supérieure pour mieux présenter la marque de votre site sur les vignettes de sites épinglés de vos utilisateurs. Windows 8 Release Preview rend cela possible : nous avons ajouté la possibilité de fournir une image de vignette PNG et de spécifier la couleur d'arrière-plan de la vignette.

Exemples

Voici deux exemples : à gauche, une vignette de site épinglé avec l'icône favorite du site et la couleur définie automatiquement et à droite, une image PNG haute résolution avec une couleur de vignette personnalisée :

Vignette par défaut pour la démonstration Fresh TweetsVignette de la démonstration Fresh Tweets suivant @BenThePCGuy

Code

Les balises Meta indiquent l'image et la couleur d'arrière-plan de la vignette. Exemple :

<meta name="msapplication-TileImage" content="images/benthepcguy-144.png"/>

<meta name="msapplication-TileColor" content="#d83434"/>

Les images des vignettes doivent être des images PNG carrées de 144 pixels sur 144 pixels. Pour de meilleurs résultats, nous recommandons l'utilisation d'un arrière-plan transparent, et non d'un arrière-plan correspondant à la couleur de la vignette. La couleur de la vignette peut être spécifiée en couleur RVB hex avec la notation #rrggbb de CSS, via des noms de couleurs CSS ou à l'aide de la fonction rgb() CSS.

Regardez ce comportement en action dans notre démonstration Fresh Tweets mise à jour.

Remarque : IE10 ne télécharge l'image de la vignette que lorsque l'utilisateur épingle le site sur son écran d'accueil, afin d'éviter des coûts supplémentaires liés à la bande passante.

Conclusion

Avec Internet Explorer 10, les développeurs Web peuvent créer des éléments visuels de haute qualité propres au site pour les vignettes de sites épinglés. Il en résulte un meilleur respect des marques des sites sur l'écran d'accueil de Windows 8 et une meilleure intégration visuelle avec le reste des vignettes des applications et de contenu. Les développeurs n'ont besoin de fournir qu'une seule icône de haute qualité que Windows 8 redimensionne selon les différentes résolutions auxquelles s'exécutent les périphériques.

Les sites peuvent également partager des notifications et offrir des listes de raccourcis pour accélérer la navigation. Consultez le billet de blog Sites épinglés dans Windows 8 pour en savoir plus.

Nous sommes impatients de découvrir comment vous ajouterez ces fonctionnalités simples à votre site Web, afin d'améliorer toujours plus sa visibilité dans Windows 8.

—Rahul Lalmalani, chef de projet, Internet Explorer