Un tutoriel pour avoir un joli blog ! avoir un favicon.

jan 2, 2013 by www.natacha-birds.fr

Posted under: Blog, DIY & téléchargement

Avoir un joli blog ce n’est pas si simple, pas toujours donné à tout le monde, les logiciels sont souvent bien trop compliqués ou alors pas accessible du tout ! Pourtant avoir un joli blog quand on est une blogueuse c’est important, oui car un blog ce n’est pas seulement une page à remplir de mots ou de photos, c’est aussi une page à décorer, à décorer à son goût, comme on pourrait le faire pour une maison. Avoir un joli blog c’est inviter les gens à y entrer, à poser leurs bagages dans un coins de notre salon et à s’y sentir bien. Et avoir une jolie maison ça commence par avoir un joli paillasson, pour les blogs c’est pareil ! pour avoir un joli blog ça commence par un joli favicon. Un favicon ? oui ! Les favicons ce sont les petits symboles qui s’affichent dans votre navigateur juste à côté de l’url du site, dans la barre d’adresse tout là-haut, mais aussi au niveau des onglets et des favoris,et cette petite image va vous permettre de donner une identité visuelle à votre blog et ainsi être retrouvée plus facilement dans les tas de site mis en favoris dans notre navigateur. Quand on crée un site votre favicon est vierge, bien souvent c’est l’icône de votre hébergeur ou bien un espace vide qui se met automatiquement à cet emplacement. Aujourd’hui je vais vous expliquer comment décorer votre paillasson !
Mais attention pour pouvoir personnaliser son favicon il faut avoir accès au serveur sur lequel est hébergé votre site web ou blog. (il faut avoir un blog .fr ou .com en gros)

1) choisir son favicon ! il devra être obligatoirement être de forme carré de dimension 16*16 pixels ou de 32*32 pixels et il faudra l’enregistrer en .GIF .PNG ou .JPG ! le favicon peuvent être crées avec des logiciels comme illustrator ou photoshop ! pour ceux et celles qui n’ont pas ce logiciel ou tout simplement pas d’inspirations je vous ai fait, en fin d’article, un petit catalogue de favicon créé tout spécialement pour vous, dont vous pouvez vous servir ! (et qui vont permettent aussi de sauter l’étape 2 et 3 de ce tutoriel)
Pour ceux qui préfère faire eux-même leurs favicons n’oubliez pas de prendre en compte le petit format du favicon qui rend la tache du graphisme un peu compliqué, car il est assez difficile de faire tenir un graphisme dans un si petit format. Il faudra donc opter pour un favicon avec un graphisme simple, sans trop de détail, avec une couleur dominante.

2) Une fois le favicon choisi/crée et enregistrer sur son ordinateur, renommez le au nom de votre choix, ici pour ce tutoriel afin que cela soit clair pour tout le monde je vais nommer mon favicon comme ceci : favicon.png

3) Ensuite il va falloir mettre son favicon sur son serveur, l’envoyer sur le site web ! Pour cela il faut se rendre chez son hébergeur (1&1, OVH, Amen…) et charger son favicon dans le dossier racine de votre hébergeur (dossier racine = le tout premier, l’index) ! si cela vous semble trop compliqué vous pouvez tout simplement charger votre image dans votre bibliothèque dans wordpress, ou n’importe où ailleurs temps que vous rendez votre favicon accessible via le web ! en gros il faut l’héberger.
Pour ceux qui veulent prendre un de mes favicons, alors pas besoin de faire cela, car ils sont déjà hébergé chez moi ! pour récupérer leurs adresses ils vous suffit juste de cliquer dessus et de copier l’adresse url de la page dans laquelle le favicon choisi s’ouvre et de coller cette adresse dans le morceaux de code (voir étape 4).

4) Maintenant que votre favicon est hébergé, il ne reste plus qu’à entrer un petit morceau de code !
pour cela il faut se rendre dans votre fichier HTML, et placer cette ligne de code :

« …/favicon.png » est le petit morceaux de code à changer, à la place de cela mettez le chemin de votre favicon hébergé, l’adresse de votre image.
Et voilà ! votre maison à un joli paillasson ! Attention le favicon peux mettre un peu de temps à s’afficher, il faut souvent rafraichir ou vérifier sur un autre navigateur !

Et pour finir voici quelques petits favicon pour vous :

Le sac d Elo

Merci pour ces petits favicon tout mignons!
Bises
Mélanie L

Merci pour ces favicons et ce post Natacha !
Aerysbis

Oh parfait! Je n’avais aucune idée de comment faire. Je cours m’en fabriquer un et je suis ton tuto pour pas me planter dans les lignes de codes. Merci merci!
Laurie darbanville

Merci à toi pour cette article♥
une idée des bons logiciels à avoir?
Merciiii
Junkan

Merci pour ce tutoriel, mis en application immédiatement! C’est vrai que c’est tout de même plus sympa!
appearblog

Merci pour ce tutoriel super cool ! Je t’ai pris le favicon avec le coeur, merci beaucoup !
Celest-in

Merci à toi pour tout ces conseils ! J’ai pris le favicon « pissenlit »
J’ai encore beaucoup de chose à apprendre
Voici mon petit blog qui fête aujourd’hui ces 1 an ! http://www.celest-in.fr
Des biz et bonne année à to
Sabrina

Merci merci pour ce tuto et ces favicon tous mignons surtout le 1er
Mila

Pas moyen chez moi,je ne comprends pas,pourtant je suis tout à la lettre
Isa A

Effectivement , pour tenir un blog , il faut savoir mettre un peu les mains dans la technique mais bon, à l’occasion , ça ne me déplait pas.
J’ai bien aimé personnaliser le mien au fil des mois et à quelque part, je me sens bien chez moi aujourd’hui !
Pauline

N’ayant absoolument pas le temps de m’attarder à la décoration de mon blog c’est vraiment gentil à toi de nous avoir proposé de jolies favicons. Bon maintenant je vais hésiter 100 ans, changer 30 fois mais bref, encore merci
adeline L

ahhh c’est trop dur mdr,j’adore ton petit noeud mais je ne sais pas si sur overblog c’est possible de le faire, je compte prendre un compte premium pour pouvoir mieux le personnaliser mais je suis super nulle! avant j’avais un chéri informaticien donc c’était plus simple lol mais maintenant
http://twitter.com/NailArtisEasy Nail Art is Easy

Je t’en ai piqué un ! merci pour tes supers conseils
Pauline Steiner

Merci pour ce joli favicon! (Depuis que j’ai un blog, je découvre sans cesse de nouveaux mots…) J’ai choisi la théière, elle va très bien avec mon blog et ma birdy. Et aussi je te remercie pour ces explications, je suis une quiche en informatique (mais je fais des efforts pour m’en sortir!). Maintenant j’ai un joli paillasson!
BleuPaillette

Merci pour ces jolies petites créa !
Pour ma part, je suis sous wordpress, alors je ne sais pas si il m’est possible d’en utiliser :s
bise
Lude

Merci Natacha!
Cindy B

Merci pour ces Favicons, ils sont tous plus mignons les uns des autres. <3