Discussion :

[Artemus24]

Salut à tous.

Un problème récurrent maintes fois décrit dans le net, mais je n'arrive toujours pas à le résoudre.
Il s'agit de l'affichage de l'icône !!!

1) mon icône se trouve à la racine de mon site.
Je ne fais aucune référence dans le document HTML à cette icône.
Mon document HTML se trouve à la racine de mon site web.
--> L'icône s'affiche.

2) cette fois-ci mon document HTML se trouve ailleurs dans l'arborescence de mon site.
Je ne fais aucune référence dans le document HTML à cette icône.
--> L'icône ne s'affiche pas.

3) je mets l'icône au même niveau que mon document HTML.
--> L'icône ne s'affiche pas.

4) dans le document HTML, je déclare mon icône comme ci-après :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

--> L'icône s'affiche.

5) je déplace mon icône afin de la mettre dans le répertoire des images.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="shortcut icon" type="image/x-icon" href="/Images/favicon.ico">

--> L'icône ne s'affiche pas.

6) j'ai lu qu'il fallait mettre l'url dans le lien :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="shortcut icon" type="image/x-icon" href="https://chez.jcz.fr/Images/favicon.ico">

--> L'icône ne s'affiche pas.

Afin de la faire apparaitre, je fais un rafraichissement de ma page web.

Je ne désire pas dupliquer cette icône en la mettant dans tous mes sous-répertoires.
Soit elle reste à la racine, soit elle va dans le répertoire des images.

Comment dois-je déclarer le lien vers l'icône dans tous mes documents HTML, afin qu'elle puisse enfin s'affiche correctement ?

Question subsidiaire. Il faut que cela fonctionne aussi bien dans :
--> Mozilla Firefox
--> Opera
--> Microsoft Edge

Cordialement.
Artemus24.
@+

[mathieu]

5) je déplace mon icône afin de la mettre dans le répertoire des images.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="shortcut icon" type="image/x-icon" href="/Images/favicon.ico">

--> L'icône ne s'affiche pas.

cela devrait fonctionner, pouvez-vous nous montrer une page de test avec ce code ?

[Artemus24]

Salut Mathieu.

Mes pages web ne sont pas en cause.
J'ai bien fait attention au cache afin de voir si ce n'est pas lui qui bloque l'affichage.
Il parait que "shortcut" est devenu obsolète. Il faut mettre seulement "icon" et rien de plus.

J'ai créé moi-même mon icône en utilisant "www.favicon.cc" et je l'ai importé dans le répertoire racine.
Le problème ne vient pas de là, car elle s'affiche correctement, enfin quand j'arrive à le faire.

Il y a le format de l'icône. On peut mettre du :
--> png : type="image/png"
--> gif : type="image/gif"
--> ico : type="image/x-icon"
Le standard, il me semble, ou le plus fréquent, reste ".ico".

Pour ce qui est du chemin vers l'icône, parfois il est dit de mettre "/" devant, parfois l'url du site, et parfois rien du tout. Là aussi, il n'y a pas un consensus sur la bonne pratique.

Où mettre l'icône dans son site web ? Là non plus, pas de consensus à ce sujet. La pratique la plus courante reste de la mettre à la racine de son site web. Cela va dépendre du lien vers cette icône.

Pour ce qui est de son nom, on peut la nommer comme on veut, mais le standard est "favicon.ico".

En ce qui me concerne, j'ai choisi de mettre ceci :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="icon" type="image/x-icon" href="favicon.ico">

Je découvre qu'il n'est plus nécessaire de mettre le "/" de fin dans toutes les balises comme cela se faisait avant.
Cela provoque un avertissement dans "validator.w3.org".

Si j'utilise ce lien, l'icône doit être au même niveau que le document html, ce qui implique alors de la dupliquer partout.

Après avoir poursuivi mes lectures sur le net et d'autres tests, j'en arrive à la conclusion que le mieux est de ne pas mettre de lien dans les documents html. De laisser le navigateur (peu importe lequel) se charger d'afficher l'icône.
Dans cas, l'icône doit se nommer "favicon.ico" et se trouve à la racine de mon site web.

Pour les tests, il est nécessaire de passer par le serveur web afin de préciser où se trouve la racine du site.

Cordialement.
Artemus24.
@+