Tutoriel HTML

ACCUEIL HTML Introduction HTML Éditeurs HTML HTML de base Éléments HTML Attributs HTML En-têtes HTML Paragraphes HTML Styles HTML Formatage HTML Citations HTML Commentaires HTML Couleurs HTML HTMLCSS Liens HTML Images HTML Icône de favori HTML Tableaux HTML Listes HTML Bloc HTML et Inline Cours HTML Identifiant HTML Iframes HTML HTMLJavaScript Chemins d'accès aux fichiers HTML Tête HTML Mise en page HTML HTML réactif Code informatique HTML Sémantique HTML Guide de style HTML Entités HTML Symboles HTML Émojis HTML Jeu de caractères HTML Encodage d'URL HTML HTML contre XHTML

Formulaires HTML

Formulaires HTML Attributs de formulaire HTML Éléments de formulaire HTML Types d'entrée HTML Attributs d'entrée HTML Attributs du formulaire de saisie HTML

Graphiques HTML

Canevas HTML HTML SVG

Médias HTML

Médias HTML Vidéo HTML Audio HTML Modules externes HTML YouTube HTML

API HTML

Géolocalisation HTML Glisser/déposer HTML Stockage Web HTML Travailleurs Web HTML HTML SSE

Exemples HTML

Exemples HTML Questionnaire HTML Exercices HTML Certificat HTML Résumé HTML Accessibilité HTML

Références HTML

Liste de balises HTML Attributs HTML Attributs globaux HTML Prise en charge du navigateur HTML Événements HTML Couleurs HTML Canevas HTML HTML Audio/Vidéo Doctypes HTML Jeux de caractères HTML Encodage d'URL HTML Codes de langue HTML Messagerie HTTP Méthodes HTTP Convertisseur PX en EM Raccourcis clavier

Icône de favori HTML


Un favicon est une petite image affichée à côté du titre de la page dans l'onglet du navigateur.


Comment ajouter un favicon en HTML

Vous pouvez utiliser n'importe quelle image que vous aimez comme favicon. Vous pouvez également créer votre propre favicon sur des sites comme https://favicon.cc .

Conseil : Un favicon est une petite image, il doit donc s'agir d'une image simple avec un contraste élevé.

Une image favicon s'affiche à gauche du titre de la page dans l'onglet du navigateur, comme ceci :

Exemple de favicon

Pour ajouter un favicon à votre site Web, enregistrez votre image favicon dans le répertoire racine de votre serveur Web ou créez un dossier dans le répertoire racine appelé images et enregistrez votre image favicon dans ce dossier. Un nom commun pour une image favicon est "favicon.ico".

Ensuite, ajoutez un <link>élément à votre fichier "index.html", après l' <title>élément, comme ceci :

Exemple

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

Maintenant, enregistrez le fichier "index.html" et rechargez-le dans votre navigateur. L'onglet de votre navigateur devrait maintenant afficher votre image favicon à gauche du titre de la page.


Prise en charge du format de fichier favicon

Le tableau suivant montre la prise en charge du format de fichier pour une image de favicon :

Browser ICO PNG GIF JPEG SVG
Edge Yes Yes Yes Yes Yes
Chrome Yes Yes Yes Yes Yes
Firefox Yes Yes Yes Yes Yes
Opera Yes Yes Yes Yes Yes
Safari Yes Yes Yes Yes Yes

Résumé du chapitre

  • <link>Utilisez l' élément HTML pour insérer un favicon

Balise de lien HTML

Tag Description
<link> Defines the relationship between a document and an external resource

Pour une liste complète de toutes les balises HTML disponibles, consultez notre Référence des balises HTML .