|
Icones de pages web (la bonne manière)
Ou comment mettre des icones pour vos pages web en suivant les standards de manière à ce qu'elles apparaissent dans les navigateurs libres tels que Mozilla.
Les « shortcut icons » ou « favicons » ou encore « icones de pages »Les « shortcut icons » sont supportées par les navigateurs suivants :
Comment faire apparaître une icone de page (la bonne manière)Il y a 2 approches possibles, une approche respectueuse des standards et une autre qui ne l'est pas. Vous opterez pour l'une ou pour l'autre en fonction de vos priorités. Quelque soit votre choix, vous devez faire attention à bien faire correspondre l'attribut type avec le format de l'image que vous utilisez. Une approche respectueuse des standards du Web, initiée par Mozilla, utilisant des formats d'images standards, mais ne fonctionnant pas encore avec Microsoft Internet Explorer : <link rel="icon" type="image/png" href="/img/logo.png" /> <link rel="icon" type="image/jpeg" href="/img/logo.jpg" /> Une approche initiée Microsoft utilisant des formats d'images non standards, fonctionnant (forcément) avec Microsoft Internet Explorer et aussi avec d'autres navigateurs qui ont décidé d'offrir cette compatibilité par égard pour les utilisateurs : <link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico" /> L'attribut type="image/x-icon" peut également être omis mais c'est encore plus à éviter : <link rel="shortcut icon" href="/img/favicon.ico" /> Les icones de pages doivent être réalisées à l'une des tailles suivantes :
Mozilla supporte une très grande variété de formats d'image : PNG, MNG, JPEG, GIF, XBM, BMP, ICO. Microsoft Internet Explorer supporte uniquement le format d'image ICO. Comment faire apparaître une icone de page (la mauvaise manière)Placer une image favicon.ico à la base d'un site, et elle sera automatiquement repérée et affichée par Microsoft Internet Explorer. Ceci est une mauvaise approche car :
ExemplesLes sites suivants utilisent correctement des icones de pages d'une manière respectueuse des standards :
RéférencesBugzilla bug 32087 : [RFE] favicon implementation (customizing bookmark icons) Microsoft reference : How to add a shortcut icon to a web page |
Sauf mention explicite contraire le contenu de ce site est Copyright AFUL sous licence Creative Commons Paternité - Partage des Conditions Initiales à l'Identique |