Favicon

icône informatique symbolisant un site web

Une favicon /fa.vi.kon/, favoricône[1] ou favicône[1] est une icône informatique symbolisant un site web. Les navigateurs web peuvent utiliser la favicon dans la barre d'adresse, les signets, les onglets ou encore les autres raccourcis[2].

Favicon de Wikipédia.
Favicon de Google depuis septembre 2015.

La favicon est affichée dans le navigateur (par exemple dans les onglets de Mozilla Firefox) et dans les signets (par exemple dans les signets du navigateur Safari d’Apple), voire reprise directement par les logiciels de FTP ou de lecture des fils RSS afin d'identifier rapidement et facilement les sites. L'usage de la favicon revêt une certaine importance dans la finition d'un site et l'image de la société communiquant sa favicon. Ces icônes sont créées par les concepteurs des sites internet.

Étymologie

modifier

Le mot favicon est un mot-valise né de la contraction des mots anglais favorite (favori) et icon (icône). Le nom a été répandu par le navigateur web Internet Explorer qui exigeait que le fichier icône s'appelle favicon.ico[3].

Détails techniques

modifier

La fonctionnalité a été introduite par le navigateur Internet Explorer 5 de Microsoft[4] qui testait la présence d'un fichier favicon.ico à la racine du site. Sans avoir été standardisé, ce concept a été adopté par l'ensemble des navigateurs graphiques ; la page web précisant désormais son icône directement dans l'élément head, avec un code du type[5] :

<link rel="icon" type="image/png" href="favicon.png">

L'utilisation de l'entête a permis entre autres de s'affranchir du format propriétaire ICO et de l'étendre aux autres formats d'images tels que PNG et GIF tout en permettant l'utilisation d'un autre nom de fichier.

Les navigateurs Internet Explorer versions 6, 7, 8 et 9 ne supportent que le format ICO ; d'autres navigateurs, comme Firefox, Safari et Opera, acceptent également les autres formats[réf. souhaitée].

Cette icône avait initialement une taille de 16 × 16 ou 32 × 32 pixels. Aujourd'hui, les pages web intègrent généralement plusieurs tailles, par exemple 16 x 16, 32 x 32, 57 x 57, 60 x 60, 72 x 72, 76 x 76, 96 x 96, 114 x 114, 120 x 120, 144 x 144, 152 x 152, 180 x 180 et 192 x 192, ce qui permet à chaque navigateur d'afficher l'icône la plus adéquate en fonction de l'espace d'affichage disponible sur l'écran.

modifier

Les périphériques mobiles Apple équipés du système d'exploitation iOS de version 1.1.3 ou supérieurs, tels que iPod Touch, iPhone, ou iPad, ainsi que certains téléphones Android[6], offrent la possibilité de fournir une icône utilisée sur leur écran d'accueil. Cette icône est plus large que l'image utilisée en favicon et utilise un en-tête propriétaire d'Apple, avec une balise de type <link rel="apple-touch-icon" ...> dans l'élément head de la page.

Notes et références

modifier
  1. a et b « favoricône », Grand Dictionnaire terminologique, Office québécois de la langue française (consulté le ).
  2. Ajouter une icône favicon dans le navigateur, AlsaCreation
  3. Jay Hoffmann, « How We Got the Favicon », sur The History of the Web, (consulté le )
  4. Web Authoring FAQ, 8.11. How can I have a custom icon when people bookmark my site?
  5. (en) How to Add a Favicon to your Site, W3C, 2005
  6. (en) Mathias Bynens, « Everything you always wanted to know about touch icons », (consulté le )

Articles connexes

modifier