819 Shares 7863 views

Taille Favicon pour le site

Dans la conception web, comme vous le savez probablement, chaque détail est important. Une personne qui a passé à votre ressource ne voit pas chacun des éléments séparément, mais perçoit toute l'image sous la forme d'un paquet composé d'autres petits détails. Ainsi, si vous manquez quelque chose lors du développement de votre ressource, ce détail à l'avenir peut gâter tout le complexe, toute la composition.

Une telle bagatelle peut être, par exemple, l'arrière-plan d'un bouton, une police incorrectement sélectionnée d'un petit élément et même d'un favicon. En effet, regardez-vous, les grands sites bien connus ont une icône individuelle qui le représente dans la section "Signets" du navigateur de l'utilisateur. Sans cela, les développeurs de la ressource ne seraient pas en mesure de créer la composition à laquelle ils aspiraient initialement.

Par conséquent, vous, tout en créant un design pour votre site, devrait prendre soin de détails tels que Favicon. Dans cet article, nous allons parler de la façon de le sélectionner sous le style général de la ressource, ainsi que de la taille de cette image.

Icône du site

Tout d'abord, nous déterminons quel est cet élément. Regardez maintenant le nom de l'onglet de votre navigateur. Comme vous pouvez le voir, à gauche, il y a une petite image qui dénote une version simplifiée du logo de la ressource. La même image est également proche du nom du site affiché dans les résultats de recherche. C'est sur ce que l'utilisateur est orienté lorsqu'il voit le titre.

Beaucoup de webmasters comprennent qu'une telle image est nécessaire – mais très peu de gens savent quelle taille favicon pour le site sera le plus approprié. Par conséquent, dans cet article, nous donnons non seulement des informations sur la façon de créer une telle icône et de la façon dont vous pouvez l'installer sur votre ressource, mais aussi de vous informer de la taille de l'image.

Le but du favicon

Ainsi, la photo proche du titre du site sert à l'identification. C'est son but initial: exprimer le site, le nom de celui que nous voyons, et le distinguer aux yeux des autres. Cela se fait aussi simplement que possible en utilisant des graphiques: nous percevons intuitivement l'information dans les images beaucoup plus rapidement et plus facilement qu'en format texte. Favicons nous aide dans ce domaine. Mais n'oubliez pas que la taille du favicon est minimale aux yeux de l'utilisateur. Ce n'est pas un logo dans l'en-tête du site, qui peut contenir des informations supplémentaires sous forme d'inscriptions, des éclaircissements ou des informations de contact. Tout ce qui peut être montré dans l'icône à côté du nom devrait être aussi proche de la taille du favicon. Et il, comme déjà indiqué, n'est qu'une miniature (seulement 16 sur 16 pixels).

Comment choisir un Favicon?

Alors, comment un webmaster peut-il développer une icône pour son site web? Il convient de noter que le simple fait de presser le logo du site, le plus souvent, ne fonctionnera pas. Sur les emblèmes, qui sont mis sous la forme d'un logo d'une ressource particulière, des éléments souvent différents sont visibles, qui ne seront pas toujours affichés correctement sous une forme miniature. Il est préférable d'abandonner immédiatement une telle entreprise.

Bien sûr, la taille du favicon ne nous permet pas de simplement insérer une inscription là-bas. Tout texte sera tout simplement invisible à cette résolution. Nous devons développer une nouvelle icône qui transmettrait le style du site. Pour trouver des solutions, encore une fois, passons aux principaux sites.

Beaucoup utilisent sous la forme d'un favicon stylisé la première lettre du nom du service. C'est ce que Bing, Yahoo, Yandex, Wikipedia, Google font, par exemple. Il y a une autre approche: si vous avez un nom de site court, vous pouvez définir l'arrière-plan de votre icône. À la taille du favicon (en pixels il atteint, je le répète, 16 par 16 points) autorisé à afficher correctement cette inscription, il ne doit pas dépasser 3 lettres. C'est le cas, par exemple, du service Aol.

Comment créer un Favicon?

Vous pouvez créer une icône pour le nom d'un site Web de plusieurs façons. Bien sûr, le plus simple est de travailler avec différentes solutions prêtes à l'emploi. Il peut s'agir de tous les services ou programmes qui vous permettent de créer une icône complète à partir d'une icône en la réduisant. Cependant, je vous recommande de développer ce logo seul. Ceci, d'abord, donnera l'occasion d'apprendre quelque chose; Deuxièmement, il fournira plus d'outils. Tout ce que vous devez être capable de faire est ce qu'il faut dessiner, et aussi connaître la taille du favicon dans la version finale. À propos de la taille de l'icône du site, nous allons parler un peu plus tard, mais pour l'instant, notez certaines des subtilités de travail avec de telles images. En particulier, sans mentionner la taille du favicon pour le site, vous devez spécifier le format de cette image. Comme l'ont noté les concepteurs expérimentés, l'image doit être enregistrée en tant que .PNG (24 bits), ou en tant que fichier.

Vous pouvez enregistrer l'image, par exemple en utilisant Photoshop, où l'emblème sera dessiné.

Taille Favicon

Alors, parlons maintenant de la taille de l'image, que nous voyons à côté du nom du site dans le résultat de la recherche. Par défaut, comme déjà mentionné, sa taille est seulement de 16 pixels (de chaque côté). Cependant, si vous essayez de modifier cette image dans Photoshop, vous verrez à quel point il est gênant. Par conséquent, nous vous recommandons de travailler avec une image agrandie qui, à l'avenir, peut être simplement compressée autour des bords et enregistrée dans le format requis.

Multiplateforme

Cependant, parler de la taille du favicon devrait être sur votre site, une autre chose à retenir. Toutes les plates-formes ne affichent pas l'image de ressource de la même manière. Par exemple, les périphériques avec un affichage Retina "voir" votre favicon à un taux de 32 par 32 pixels. Et dans Safari et sur la nouvelle plate-forme Windows, et du tout, ces icônes atteignent une taille de 64 pixels.

Par conséquent, nous vous recommandons de sauvegarder différentes versions de l'icône et dans le futur, tout simplement pour la modification, selon la plate-forme de l'utilisateur. Un autre point intéressant – vous pouvez essayer de télécharger l'icône dans le format le plus grand, en attendant qu'il "réduise" selon le navigateur.

Editeurs extraterrestres

Bien sûr, il est bon que vous compreniez Photoshop et que vous savez quelle taille du favicon devrait être et comment l'atteindre, en conservant votre image. Cependant, il y a beaucoup de nouveaux arrivants qui n'ont tout simplement pas rencontré des éditeurs graphiques si bien avant, alors ils ne peuvent pas simplement dessiner l'image qu'ils souhaitent. Pour aider ces webmasters, il existe différents services qui vous permettent de créer automatiquement une icône qui vous intéresse. Beaucoup d'entre eux sont même gratuits, ce qui ne nécessite aucun investissement de l'utilisateur.

Pour le travail, parfois, il vous suffit de vous inscrire, mais, comme vous le savez, cela se fait une fois – après tout, pas si souvent, les entreprises changent le Favicon. Regardez au moins sur Google, qui change le logo tous les jours, mais ne touche pas l'icône.

Comment installer Favicon?

En général, pour personnaliser votre site de manière à afficher correctement l'image dont vous avez besoin, c'est très simple. Il suffit d'effectuer un certain nombre d'actions simples qui permettront aux moteurs de recherche, ainsi qu'aux navigateurs simples, de lire des informations.

Pour ce faire, l'image résultante doit être enregistrée avec le nom favicon.ico et placé dans la racine de sa ressource. Tout, maintenant votre image sera reconnue automatiquement et, après un certain temps, elle sera liée à votre site.

En plus de cette liaison, vous pouvez ajouter une ligne supplémentaire qui "invite" où votre icône se trouve. Cela ressemble à ceci:

Installez le code dans l'en-tête du site.

Conclusions

Ainsi, après avoir lu notre article, vous avez compris la taille du favicon pour le site et ce qu'il est. En outre, je pense que vous avez constaté que trouver l'icône appropriée pour votre ressource est un must, car cela joue entre vos mains à la fois en termes de reconnaissance croissante et en termes d'allocation supplémentaire parmi vos concurrents. Au moins, les sites les plus importants font la même chose, ce qui peut être considéré comme un exemple vif. Et puis, cela ne cause aucun effort spécial – après avoir fait Favicon une fois et l'installer correctement sur votre site, vous pouvez l'oublier pour les prochains mois.

Par conséquent, expérimentez hardiment, venez avec quelque chose de nouveau, essayez et tout se passera!