Un moyen universel de créer des favicons. Créer un favicon en ligne Créer un favicon à l'aide de GIMP - GNU Image Manipulation Program

Générateur de favicon - vous aidera à convertir et à modifier n'importe quelle image, en la transformant en favicon pour le site. Aujourd'hui, nous vous présentons un article sur le meilleur générateur de favicon pour sites Web d'aujourd'hui.

De nos jours, il est difficile d’imaginer un site Web sans favicon. Un favicon est une icône qui se trouve dans la barre d'adresse du navigateur ou dans le titre de la fenêtre (selon le navigateur), et qui distingue le site/onglet ouvert de beaucoup d'autres. Initialement, ces icônes ont été développées dans IE afin de mettre en évidence un site dans la liste des favoris du navigateur (dans IE, ces signets étaient appelés Favoris), d'où le nom Favicon - icône des favoris.

Mais créer un favicon de vos propres mains n'est pas si simple. Il doit avoir un format ICO, ce qui nécessite un logiciel spécial pour faire quelque chose d'utile et des compétences considérables. Par conséquent, pour vous faciliter la vie, il est préférable d’utiliser un générateur de favicon en ligne.

Il existe de nombreux services qui vous permettent de générer des favicons à partir d'images (il peut s'agir d'un logo ou d'une illustration spécialement conçue). Mais la plupart d’entre eux ont des problèmes de transparence.

Problèmes de transparence avec le service générateur de favicon

Pour plus de clarté, nous présentons l'illustration « Comment différents générateurs de favicon traitent la transparence et la réduction de la taille de l'image ».

Dans cette comparaison, nous avons utilisé les résultats obtenus auprès des services favicon.cc et favicon-generator.org. Pour être honnête, jusqu'à récemment, nous utilisions nous-mêmes le service favicon.cc, mais récemment, un excellent substitut a été trouvé - le générateur de favicon n°1.

Le meilleur générateur de favicon - www.xiconeditor.com

Comme favicon.cc, ce générateur de favicon possède son propre éditeur d'icônes en ligne intégré, mais son avantage réside dans son excellent travail en matière de transparence.

Il est bien évident qu'il existe une différence dans la qualité de la transparence (apparemment, la différence réside dans la qualité du changement de taille de l'image chargée).

De plus, xiconeditor.com présente un autre avantage : un excellent système de prévisualisation des favicon, qui vous permet de visualiser le résultat sous différentes formes sans télécharger le favicon généré. Leur aperçu est beaucoup plus informatif que favicon.cc.

Qu'est-ce qu'une favicon ?

Pour ceux qui ne savent pas ce qu’est un favicon, nous allons vous donner quelques informations qui vous aideront à vous mettre au courant. Un favicon est une petite icône mesurant 16x16 ou 32x32 pixels, contenant généralement un logo, la première lettre d'une marque ou une image caractéristique qui reflète le type d'activité ou le thème du site.

Pourquoi une favicon est-elle importante ?

Le favicon remplit les fonctions suivantes :

L'image de marque.

Identification du site par l'utilisateur (facilité d'utilisation).

Donne au site un aspect professionnel.

Examinons de plus près les principaux avantages de l'utilisation des favicons.

Reconnaissance de la marque

Favicon est comme une petite identité de site. Comme mentionné dans la partie introductive, un favicon aide l'utilisateur à se souvenir de votre site parmi les nombreux sites qu'il a consultés. Qu'il s'agisse de votre historique de navigation, des résultats de recherche Google ou de la liste des sites favoris de votre navigateur, les favicons aident les utilisateurs à reconnaître et à accéder facilement à votre site.

Confiance

Les utilisateurs ont tendance à juger les vendeurs de biens et de services en ligne en fonction du professionnalisme de leur site Web. Une négligence sous la forme d'un manque de favicon (les moteurs de recherche affichent un site sans favicon comme l'icône d'un document vierge) peut facilement conduire à une perte de confiance, surtout lorsque les utilisateurs vous comparent à vos concurrents.

Visites répétées

On sait que les gens réagissent mieux aux images qu’au texte. Supposons maintenant qu'un visiteur de votre site soit pressé lors de sa première visite et décide de le mettre dans ses favoris afin de pouvoir y revenir plus tard. Disons que cette personne décide par la suite de visiter à nouveau votre site et se tourne vers ses favoris. Vous avez de la chance si vous disposez d'un favicon reconnaissable, comme le G important et unique de Google, et les utilisateurs vous trouveront. Si vous n'avez pas de favicon, vous pourriez même être supprimé de votre liste de favoris.

Gain de temps pour l'utilisateur

Les favicons permettent à l'utilisateur de gagner du temps passé à identifier un site dans les favoris, l'historique ou à d'autres endroits où le navigateur place une favicon pour une identification rapide. Cela facilite simplement la vie du visiteur moyen de votre site.

Avantages du référencement

Si votre site dispose d’un favicon, vous serez plus visible dans les résultats de recherche que les sites qui n’en ont pas, et pourrez donc attirer plus de visiteurs.

Comment créer une favicon ?

Il existe de nombreux outils qui vous permettent de créer une favicon en quelques minutes. Si vous n'avez pas de compétences en conception ou si vous ne savez pas comment le faire, vous pouvez essayer de générer un favicon à l'aide de Logaster.

Pour ce faire, suivez les instructions étape par étape :

Étape 5 : Créez une favicon

Maintenant que vous avez un logo, cliquez sur « Créer un favicon avec ce logo » sur la page du logo.

Étape 6. Sélectionnez le design de favicon souhaité

Comme pour le logo, Logaster générera plusieurs dizaines de favicons magnifiques et prêts à l'emploi. Choisissez votre design préféré. L'aperçu vous permettra de voir à quoi ressemblera votre favicon sur le site.

Si vous devez modifier le favicon, vous pouvez le faire en modifiant le logo, tout comme les favicons sont créés sur la base du design du logo. Ainsi, si vous souhaitez, par exemple, une couleur de favicon différente, vous devez revenir à la page du logo, changer sa couleur, puis créer à nouveau le favicon.

Vous pouvez trouver de l'inspiration pour les favicons sur les sites suivants :

Étape 7. Téléchargez le favicon

Vous pouvez acheter le favicon séparément pour 9,99 $ ou acheter un pack de conception comprenant non seulement le favicon, mais également un logo, une carte de visite, une enveloppe et du papier à en-tête. Vous pouvez découvrir comment acheter un Design Pack.

Après le paiement, vous pouvez télécharger le favicon aux formats ico et png.

Où puis-je utiliser une favicon ?

Vous pouvez utiliser une favicon :

Sur le site;

Appareils mobiles. L'utilisateur peut ajouter un favicon à l'écran d'accueil de son appareil (quelque chose comme un signet) - Android, IOS, Windows Phone, etc. ;

Programmes et applications pour PC/Mac.

Comment installer une favicon sur un site internet ?

Une fois que vous avez reçu le favicon, son installation sur le serveur ne prendra pas plus de quelques minutes et se déroule en deux étapes. Pour ce faire, vous aurez besoin d'accéder au répertoire racine de votre site et d'un éditeur de texte pour modifier le code HTML du site.

Étape 1. Vous devez télécharger le fichier favicon.ico sur le serveur. Pour ce faire, vous devez télécharger et installer un client FTP, tel que FileZilla. Entrez ensuite votre nom d'utilisateur et votre mot de passe et téléchargez le fichier. Vous pouvez lire des instructions plus détaillées sur la façon de télécharger un fichier favicon.

Étape 2. Vous devez maintenant modifier la page HTML de votre site pour aider les navigateurs à trouver votre image favicon. Avec la fenêtre FTP ouverte, recherchez et téléchargez le fichier index.html ou header.php depuis le serveur.

Ouvrez le fichier index.html dans un éditeur de texte - Notepad, Notepad++, Sublime Text.

Si votre site contient du HTML pur, collez le code spécial dans la zone HEAD du fichier index.html.

Le code peut être copié sur la page favicon du site Web de Logaster.

Si vous utilisez WordPress, collez le code ci-dessous dans la zone HEAD de votre fichier header.php.

Une fois que vous avez fait cela, téléchargez le fichier là où vous l'avez obtenu. Prêt! Rechargez la page de votre site pour voir le favicon.

La plupart des navigateurs modernes sont suffisamment intelligents pour trouver le fichier favicon même sans un tel code, mais uniquement si le favicon a une image de 16 x 16 pixels, le nom favicon.ico, et est enregistré dans le répertoire racine de votre site.

Nous espérons que cet article vous a fourni des informations utiles pour vous aider à créer un favicon qui rendra votre site Web plus performant et plus attrayant.

Favicon – le terme se traduit littéralement par « icône préférée » – est considéré comme l'un des éléments les plus complexes de la conception Web moderne. Il s'agit d'une petite image qui se trouve dans l'onglet du navigateur, dans la barre de recherche et à d'autres endroits, et qui joue un rôle important dans la personnalisation du site.

En raison de son format non standard et de sa petite taille, créer un favicon peut s'avérer difficile, tant d'un point de vue technique que de conception.
Une tâche tout aussi difficile consiste à assurer la compatibilité des favicon avec différents navigateurs.

Dans cet article, vous apprendrez comment créer un favicon - nous vous donnerons des conseils de conception et vous parlerons des services de création d'un favicon et de la façon d'ajouter un favicon au site.

Qu'est-ce qu'une favicon et pourquoi est-elle nécessaire ?

Malgré le fait qu'un favicon soit un très petit objet graphique, il est extrêmement important dans la conception de sites Web et en général.

Cliquez pour agrandir l'image.

Premièrement, Un favicon rend votre site plus personnalisé et cohérent avec d'autres éléments graphiques, comme un logo.

Deuxièmement , une favicon distingue votre site des autres ressources Web dans la liste des résultats de recherche. Un site sans cette mini-icône semblera terne et perdra face à ses concurrents. En un mot, un favicon est tout simplement un « must have » pour les sites Web.

Troisième , un favicon permet à l'utilisateur de retrouver rapidement votre site dans le répertoire des favoris ou autres icônes du bureau.

Créer un design de favicon

Le favicon doit refléter l’essence et la marque dans un petit signe de la taille d’un visage souriant. Une version simplifiée du logo de l'entreprise serait une bonne solution, mais gardez à l'esprit : un logo à part entière avec du texte et des marques ne convient pas à cet effet.

Ces sites Web utilisent un graphique de leur marque (ou du moins quelque chose de similaire).

N'utilisez pas de texte

Vous devez éviter d'utiliser du texte, car en raison de la petite taille du favicon, les inscriptions seront illisibles. Placez 1, maximum 2 lettres sur l'icône - par exemple, les premières du nom de votre entreprise ou de votre ressource Web ; dans ce cas, ils peuvent encore être distingués.

Pixelisation des favicon

Les favicons sont si petits que chaque pixel compte. Souvent, lorsque vous réduisez la taille d’un logo, l’image apparaît floue.

Il s'agit d'un fragment du logo Facebook en taille réelle après sa réduction à la taille 32x32. Il est facile de remarquer que l’image « flotte » sur les bords. Pour éviter un tel défaut, l'édition doit être effectuée au niveau du pixel.
Lorsque je travaille avec des icônes, je préfère utiliser des programmes d'édition d'images raster (tels que Photoshop ou Pixelmator). Tout d’abord, je réduis le logo en taille réelle à 64 x 64 pixels, car c’est le plus grand favicon dont j’aurai besoin. Le travail est très minutieux, cela peut prendre une heure entière, voire deux, mais le résultat est tout simplement excellent.
Si vous n'avez pas le temps et les compétences pour de telles opérations, il est préférable d'utiliser des services en ligne tels que Logotizer.ru

Taille du favicon

Ayant reçu une icône 64x64, je crée de la même manière des icônes de 32x32, 24x24 et 16x16 pixels. Chacun d'eux a son propre objectif :

– 64×64 – « Liste de lecture » dans Safari et Windows
– 24×24 – Sites épinglés dans IE9.
– 32×32 – Pour les écrans haute résolution.
– 16x16 – Généralement utilisé dans les navigateurs tels que IE, Safari, Chrome, etc.

Mais la création de favicons plus petits ne s'arrête pas là : des modifications supplémentaires sont souvent nécessaires au niveau des pixels. Vous pouvez également ajouter un canal alpha si bon vous semble. Si cela posait auparavant des difficultés, presque tous les navigateurs prennent désormais en charge la transparence dans les favicons.

Formats de favicon

Auparavant, lorsque seuls les fichiers Windows ICO étaient pris en charge, nous pouvions gagner du temps en enregistrant le favicon 16x16 au format GIF et en lui attribuant l'extension .ico. Cette technique a parfaitement fonctionné ! Mais désormais, cette méthode n'est plus nécessaire car les outils permettant de créer des fichiers ICO peuvent être facilement trouvés sur Internet. De plus, et sont désormais utilisés pour les favicons, mais les plus courants ne sont encore que les deux suivants.

OIC

Le palmier appartient au format ICO. Contrairement aux fichiers PNG, les fichiers ICO peuvent être disponibles dans différentes résolutions et profondeurs de bits (ce qui est idéal pour Windows). Internet Explorer utilise des favicons de différentes tailles (par exemple, des icônes de barre des tâches de 32 pixels dans Windows 7), et le format ICO est donc la seule option dans ce cas.

Les fichiers PNG sont très pratiques car vous n’avez besoin d’aucun outil spécial pour les créer. Ce format prend en charge un canal alpha et vous permet de créer de très petits fichiers. Le seul inconvénient du format PNG est peut-être qu'il n'est pas pris en charge dans le navigateur Internet Explorer.

Il existe d'autres options :

– Les formats GIF et GIF animés n’ont pas d’avantages autres que la compatibilité avec les très anciens navigateurs.
– Le format JPG n’est pas recommandé, même si l’image se présente sous forme de photographie. Ce format n'a pas la netteté du PNG et son seul avantage réside dans des transitions plus douces entre les couleurs - une nuance totalement imperceptible dans une très petite image.
– SVG pourrait être une excellente option si davantage de navigateurs prenaient en charge les favicons dans ce format. Pour l'instant, il n'y a qu'une compatibilité avec Opera.
– Il existe également un « sous-format » de PNG – APNG (PNG animé), qui est pris en charge dans Firefox et Opera. Cependant, la faisabilité de son utilisation reste discutable. Un favicon animé peut être distrayant et même ennuyeux pour l'utilisateur.

Créer un favicon en ligne – outils et services en ligne

Nous avons sélectionné pour vous les services les plus utiles qui vous aideront à créer un favicon en ligne.

Logotiseur

Logotizer est un nouveau service simple et pratique permettant de créer un favicon et un logo pour votre site Web.
Avec ce créateur en ligne, vous pouvez créer un favicon à partir de zéro. Le service s'adresse aux débutants, il ne sera donc pas difficile de développer un bon design.

Comment créer un favicon à l'aide du générateur en ligne Logotizer

La zone de travail principale se trouve à gauche. Sur la droite, vous pouvez voir à quoi ressemblera le favicon sur différents supports : un onglet de navigateur, la barre des tâches d'un ordinateur ou l'écran d'un smartphone. Très pratique et clair.

Tout d’abord, vous devez choisir une forme pour le favicon. Il y en a beaucoup, plus de 50. Nous vous conseillons de choisir des formes simples et simples pour rendre le favicon facile à percevoir et à mémoriser.

A ce stade, vous déterminez également la couleur du formulaire, qui sert d'arrière-plan au favicon, et sélectionnez un cadre. Regardez quelle couleur domine votre logo (si vous en avez un) et quelles sont les couleurs principales de votre site Web. C'est dans cette plage que nous recommandons de créer un design de favicon.

Sous le bloc « Forme » se trouve une collection de formes (symboles). Il n'y en a pas beaucoup, c'est dommage que vous ne puissiez pas télécharger vos propres options ; mais le choix reste quand même assez intéressant.

Changez la couleur, la taille, l'emplacement des figurines ! En un mot, expérimentez, heureusement, le service vous permet de le faire.

Une fois la forme sélectionnée, vous pouvez ajouter votre texte. Comme je l'ai écrit plus tôt, il vaut mieux utiliser 1 ou 2 lettres, pas plus.

Il existe une vaste sélection de polices. C'est certainement un plus. Comme pour les formes, vous pouvez modifier la couleur, la taille et l’emplacement du texte.

Si vous décidez qu'une couche de favicon vous dérange temporairement ou n'est pas du tout nécessaire, vous pouvez simplement la masquer.

Après avoir créé une favicon, le service proposera de la sauvegarder. Créez un compte (en 2017, il n'y a aucun moyen sans inscription), et vous pourrez ensuite télécharger des fichiers pour une somme modique - 199 roubles.

Le site contient également de petites instructions sur la façon d'ajouter une favicon au site, vous ne devriez donc avoir aucun problème à ajouter une favicon au site. Des recommandations similaires sont également fournies ci-dessous dans cet article.

Après paiement, l'utilisateur reçoit immédiatement 10 favicons de différentes tailles pour tous les appareils dont il a besoin aujourd'hui (icône tactile Apple, icônes d'application Microsoft et autres).

Le fichier favicon.ico lui-même est multi-tailles et contient des icônes de 4 tailles dans 1 fichier (16px, 24px, 32px, 64px). Ainsi, si vous ajoutez un site aux favoris de votre navigateur ou ouvrez votre historique, vous pourrez voir des icônes de différentes tailles, mais elles s'afficheront clairement et sans flou.

Dans l'ensemble, le service est bon. Simple, pratique, rien de superflu.

RealFaviconGenerator.net

est un générateur de favicon plus simple qui vous permet de créer des favicons pour n'importe quelle plateforme. De plus, vous pouvez tester le favicon sur la ressource. Entrez l'URL de votre site et vous verrez à quoi ressemble votre favicon sur chaque navigateur et système d'exploitation. Real Favicon Generator vous indiquera également comment corriger les défauts et rendre votre favicon encore meilleur.

Favicon.par

Favicon.par est un autre générateur de favicon gratuit et facile à utiliser qui convertit les fichiers PNG, JPG et GIF au format .ico. Téléchargez une image depuis votre ordinateur, sélectionnez une taille (16x16px ou 32x32px) et cliquez sur le bouton « Créer ». Pour enregistrer le favicon obtenu sur votre site Web, suivez les instructions.

Le service permet également de dessiner un logo pixel par pixel, mais, pour être honnête, tout le monde ne peut pas le faire. Par exemple, je ne pouvais pas. C'est à quel point je suis tordu :)

Comment ajouter une favicon à un site Web

Vous pouvez ajouter un favicon à votre site en apportant plusieurs modifications au code HTML de la page du site.

Étape 1 : Téléchargez le fichier « favicon.ico » sur votre serveur d'hébergement.

Pour cela, rendez-vous sur votre serveur FTP en utilisant ce lien :
ftp:// [email protégé]
Entrez votre nom d'utilisateur et votre mot de passe. Ceux-ci peuvent être obtenus à partir du panneau d'administration de votre société d'hébergement.
Téléchargez les fichiers favicon dans le répertoire racine. Le répertoire racine est généralement appelé « public_html » ou « www ».

Étape 2 : Ajoutez une favicon au HTML.

En gardant la fenêtre du serveur FTP ouverte, téléchargez le fichier « index.html » ou « header.php ».
Ensuite, vous devez télécharger le code. Le code que vous téléchargez dépend de votre site Web.
Si votre site est HTML, recherchez la zone HEAD dans le fichier index.html et collez le code suivant :

Si votre site est sur WordPress, recherchez la zone HEAD dans le fichier header.php et collez le code suivant :

/favicon.ico" />

Grâce à ces codes, les navigateurs pourront trouver vos favicons.
Voilà, vous avez installé votre favicon !

Comment ajouter un Favicon sur WordPress et d'autres plateformes

Si votre ressource est basée sur WordPress ou un autre CMS, alors ajouter un favicon au site est très simple. En général, l'algorithme d'ajout d'un favicon pour différentes plateformes sera le même.
1. Vous devez accéder à la console du site.
2. Recherchez la section « Conception » ou « Apparence ».

3. Accédez à la section « Paramètres du thème » et recherchez-y « Favicon ».

4. Téléchargez le favicon depuis votre ordinateur.

5. Enregistrez et actualisez la page.

Comment créer des favicons plus complexes

Cet article explique des moyens simples et rapides de créer des favicons compatibles avec presque tous les navigateurs et systèmes d'exploitation. Mais lorsqu’il s’agit de conception et de développement Web, il n’y a aucune limite. Si vous souhaitez apprendre à créer des favicons plus complexes, des icônes tactiles pour les écrans d'accueil iOS, des icônes pour l'interface Metro sous Windows, des icônes pour Google TV et bien plus encore, je vous recommande de consulter ces documents : aide-mémoire pour les favicon. Il contient des informations complètes sur le sujet et fournit de bonnes sources. C'est une excellente option pour les concepteurs et les développeurs (moi y compris) qui cherchent constamment à élargir leurs connaissances.

Avec Favico.js, vous pouvez créer des favicons dynamiques avec des chiffres.

Vous aurez peut-être également besoin d'une favicon dynamique, comportant une icône avec un numéro changeant. Pour créer de tels favicons, je recommande d'utiliser le service favico.js, disponible sur Github. Les favicons dynamiques ne sont pas encore compatibles avec tous les navigateurs. Mais pour les navigateurs qui les prennent en charge, ces icônes peuvent constituer un ajout intéressant et utile.

Si vous souhaitez ajouter une autre astuce à cet article ou si vous avez une question, veuillez laisser un commentaire ci-dessous !

Structure: Un favicon est une petite icône utilisée pour identifier visuellement votre site dans les favoris, et c'est également ce que vous voyez à côté du nom de votre site ou de votre page dans les onglets du navigateur. Généralement, un favicon est un carré de 16 x 16 pixels au format favicon.ico. Dans cet article, nous expliquerons de quelle « base » vous avez besoin pour commencer, vous aiderons à créer un favicon à l'aide d'éditeurs graphiques et parlerons des moyens d'ajouter un favicon à votre site. De quoi avez-vous besoin pour commencer ?

  1. Votre logo doit faire au moins 512x512 pixels (doit être carré) ;
  2. Format d'image .PNG ;
  3. Éditeur graphique Adobe Photoshop ou GIMP.

Créer une favicon à l'aide d'Adobe Photoshop

Favicon sur fond transparent :

1) Ouvrez le logo au format PNG sur fond transparent dans l'éditeur en cliquant sur : "Fichier" - "Ouvrir" et sélectionnez une image sur votre ordinateur. 2) Supprimez le nom de l'entreprise du logo pour utiliser uniquement l'icône en sélectionnant l'outil "Gomme" et changer la couleur principale en blanc.
3) Maintenant, changez la taille du logo en 16x16 pixels en cliquant sur : "Image" - "Taille de l'image".
4) Et changez les dimensions en 16x16 pixels. Votre favicon vous semblera très petite, mais ne vous inquiétez pas, tout est comme il se doit.
5) Enregistrez l'image en cliquant sur "Fichier" - "Enregistrer sous" et sélectionnez le type de fichier "PNG".
Si votre logo est superbe, passez à l'étape 4.

Favicon sur fond avec une couleur corporate :

1) Comme dans la première option, ouvrez le fichier au format PNG, mais pas sur un fond transparent, mais sur un fond aux couleurs de l'entreprise. 2) Supprimez le texte et ne laissez que l'icône : utilisez l'outil "Pipette" pour sélectionner une couleur en fonction de l'arrière-plan - la couleur dans la palette passera automatiquement à celle souhaitée. Maintenant, cliquez sur l’outil « Pinceau » et peignez sur le texte.
3) Changez la taille en cliquant "Image" - "Redimensionner", et entrez 16x16 pixels dans le champ approprié. Si l'image semble proportionnelle, enregistrez-la au format .PNG et passez à l'étape 4.

Créer un favicon à l'aide de GIMP - GNU Image Manipulation Program

GIMP est un éditeur graphique qui permet aux utilisateurs de travailler avec des graphiques vectoriels. L'avantage de ce programme est que vous pouvez créer un favicon au format .ICO et que vous n'avez pas besoin d'utiliser de convertisseurs d'images, comme c'est le cas avec Adobe Photosop. 1) Ouvrez le fichier dans le programme en cliquant sur "Fichier" - "Ouvrir" et en sélectionnant l'image souhaitée sur votre ordinateur.
2) Vous devez maintenant supprimer le texte pour qu'il ne reste que l'icône : cliquez sur la palette de couleurs et précisez le code couleur de l'arrière-plan de l'entreprise. Si vous ne le savez pas, cliquez simplement sur l'outil "Pipette", pointez-le sur l'arrière-plan du logo et faites un clic gauche - la couleur sera définie automatiquement. Maintenant, en utilisant l'outil "Brosse", esquissez le texte inutile.
3) Réduisez la taille du logo à la taille standard du favicon - 16x16 pixels en cliquant sur : "Image" - "Redimensionner l'image".
4) Exportez le logo en cliquant "Fichier" - "Exporter sous...".
5) Et sélectionnez le type de fichier à exporter – icône Microsoft Windows avec extension ICO. et cliquez "Exporter".
Prêt! Désormais, vous pouvez utiliser une favicon sur votre site Web !

Avantages de l'utilisation de .ICO par rapport à .PNG ou .GIF

  1. Compatibilité : Tous les navigateurs, y compris IE 5.0, prennent en charge le format .ico.
  2. Éviter les erreurs de serveur 404 : tous les navigateurs modernes (testés avec Chrome 4, Firefox 3.5, IE8, Opera 10 et Safari 4) demanderont toujours un fichier favicon.ico, il est donc préférable de toujours avoir un fichier favicon.ico.
  3. Un fichier .ico peut contenir plusieurs icônes, vous n'avez donc pas besoin de créer plusieurs fichiers pour les icônes de 16 x 16 et 48 x 48 pixels.

Convertissez .PNG en .ICO avec des convertisseurs en ligne

Afin de convertir un fichier .PNG en .ICO, vous pouvez utiliser des convertisseurs en ligne. Par exemple, nous avons choisi online-convert.com, mais vous pouvez en choisir un autre dans les résultats de recherche, leur principe de fonctionnement est à peu près le même. Donc : 1) Connectez-vous au site et dans la barre latérale gauche, sélectionnez : "Convertisseur d'image" - "Convertir en ISO".
2) Sélectionnez les fichiers à convertir sur votre ordinateur en cliquant sur le bouton "Sélectionnez les fichiers", ou en faisant glisser les fichiers dans le champ approprié et en cliquant sur le bouton « Démarrer la conversion ».
3) Maintenant, cliquez sur "Télécharger" pour télécharger votre fichier .ico sur votre ordinateur. Il est également possible de télécharger le fichier sur le stockage cloud ou de télécharger le fichier au format ZIP.

Comment installer une favicon sur WordPress ?

Téléchargez votre favicon (favicon.ico) dans le répertoire principal (racine) du site. Le répertoire racine est le dossier principal où se trouvent tous vos fichiers WP, tels que index.php et les dossiers wp-admin, wp-content + wp-includes. Assurez-vous de placer favicon.ico au même niveau que ces dossiers et index.php. 1) Sur WordPress, ouvrez « Panneau administratif ».
2) Entrez dans la rubrique
3) Cliquez sur
4) Cliquez sur le fichier appelé "Entête" ou, pour modifier.
5) Trouvez la ligne de code qui commence par et se termine par /favicon.ico "/>. Modifiez-le s'il existe ou ajoutez le code suivant sous la balise HTML . Dans l'exemple, nous utilisons le nom du favicon comme « favicon.ico ». Vous pouvez nommer votre favicon comme vous le souhaitez. Code: /favicon.ico"/>; 6) Enregistrez les modifications. conclusions: Lors de la conception de votre site Web, vous devez être sûr de ne pas manquer de détails importants, même les plus petits comme le favicon. Ajouter une icône n’est vraiment pas difficile. Mais cette petite chose montre que vous avez beaucoup réfléchi à votre conception et que vous vous souciez des détails. Avez-vous des questions ou souhaitez-vous partager votre expérience de création d'un favicon pour votre site Web ? Bienvenue dans les commentaires.

Favicon - (de l'anglais FAVorites ICON, traduit par « icône des favoris ») - une icône de site Web de taille 16x16px ou 32x32px, qui est affichée par le navigateur dans la barre d'adresse ou à côté d'un signet enregistré. Traditionnellement, le nom et l'extension de l'icône sont favicon.ico.

Notre service est capable de convertir l'image de votre choix (jusqu'à 175 Ko) en une icône pour l'icône du site (taille 16x16px ou 32x32px). Après génération, il vous suffit de télécharger favicon.ico dans le répertoire d'hébergement du site souhaité.

L'absence d'icône est une erreur technique d'optimisation d'une ressource ; elle réduit la notoriété de la marque, réduit le CTR des extraits de recherche, aggrave la recherche d'une ressource Web à l'aide des favoris du navigateur, etc.

Yandex dispose d'un robot spécial qui indexe individuellement le favicon de tous les sites. La fréquence d'ajout de nouvelles icônes à la recherche varie d'environ deux semaines à un mois.

Où puis-je télécharger une favicon pour l'avoir en ligne ?

Pour afficher le favicon.ico que vous avez créé en tant qu'icône de site, vous devez le télécharger dans le répertoire racine du site (ou dans n'importe quel répertoire) et spécifier le chemin absolu ou relatif vers celui-ci dans le code du modèle de site (), exemple de code :

Pourquoi spécifier le chemin d'accès au Favicon ?

Lorsque vous utilisez une icône de site sur l'ensemble du site, si favicon.ico se trouve dans le dossier racine, vous n'avez pas besoin de spécifier le chemin d'accès - les navigateurs le trouveront eux-mêmes et l'afficheront sous forme d'icône de site. Les ressources volumineuses ou uniques utilisent différentes icônes de site pour chacune de leurs catégories. Pour ce faire, les chemins vers les différents favicon.ico sont précisés dans les modèles correspondants.

gastrogourou 2017