Créer un favicon personnalisé

Table des matières:

Anonim

Je vais admettre un truc de geek. J'aime beaucoup les favicons. Ils sont amusants. C’est un excellent outil de branding. Et c’est quelque chose de simple que les propriétaires de petites entreprises peuvent faire pour pimenter leurs sites et même accroître la convivialité pour les utilisateurs.

Si vous ne savez pas ce qu'est un favicon, laissez-moi vous aider:

$config[code] not found

Les favicons sont des mini-graphiques de 16 × 16 pixels représentant votre site Web dans la barre d’adresses, dans la liste des signets d’un utilisateur ou dans les onglets de son navigateur. Ils permettent à vos visiteurs de créer une connexion visuelle avec votre site.

Soigné! Comment en créez-vous un?

Concevez votre favicon:

  • Par la main: Ouvrez votre programme graphique préféré et lancez-vous. Vous voudrez soit créer un nouveau fichier de 16 × 16 pixels et effectuer un zoom avant jusqu'à ce que la zone soit exploitable OU ouvrir une zone plus grande, mais présentant une sorte de multiple de 16 × 16. Lorsque vous concevez votre favicon à la main, utilisez quelque chose qui représentera fidèlement votre marque - qu’il s’agisse d’un jeu de couleurs commun, des initiales de votre entreprise, etc. Tout ce que vous créerez devra supporter les restrictions strictes de 16 × 16 pixels.
  • Avec des outils: Si vous êtes un défi de conception (ne vous inquiétez pas, je le suis aussi), il existe de très bons outils qui permettent aux personnes comme nous de créer facilement de bonnes favicons. Par exemple, Favicon.cc vous donnera une structure et vous permettra de construire le vôtre directement à partir de leur site ou FavIcon de Pics vous permettra de télécharger une photo et de générer le favicon qui vous convient. Simple!

Enregistrez votre favicon: Lors de l’enregistrement de votre fichier, réduisez-le à 16 bits et enregistrez-le sous le nom «favicon.ico» si vous utilisez Photoshop, ou «favicon.gif» ou «favicon.png» si vous utilisez autre chose. Si vous utilisez Photoshop et souhaitez donner à votre favicon un souffle supplémentaire, il est recommandé de télécharger le plug-in de format de fichier Icône Windows afin de pouvoir l'enregistrer au format ICO.

Téléchargez votre favicon: Connectez-vous à votre serveur et chargez votre favicon dans le dossier racine de votre site. Ensuite, ajoutez le code HTML suivant à la section head de votre page Web (entre les deux balises head) (choisissez votre type de fichier):

Rafraîchir: Une fois que vous avez terminé, actualisez votre navigateur et votre favicon devrait apparaître. Sinon, donnez-lui quelques minutes. Parfois, il faut un peu pour que tout soit synchronisé.

Et c'est tout! Quatre étapes et vous obtenez un favicon génial qui aidera les utilisateurs à reconnaître votre site dans la liste des signets ou dans leur navigateur. Assez simple, non?

Juste pour le plaisir, voici quelques-uns de mes favoris préférés sur le Web:

  • Feux d'artifice du Michigan
  • Jeffrey Zeldman
  • Boing Boing
  • Encyclopédie.com
  • Fool.com
  • Blog SEO de Michael Gray

D'autres favoris personnels?

17 commentaires ▼