7 conseils d'experts sur l'utilisation et les avantages des icônes Web



Vous vous demandez comment utiliser un jeu d'icônes pour votre site Web et lequel choisir? Ces conseils d'experts pourraient vous convaincre de ce que de nombreux développeurs Web professionnels savent déjà: il est beaucoup plus facile de rechercher des icônes à partir d'un jeu d'icônes inclus, que de trouver des icônes une par une et de trouver un moyen de les rendre cohérentes.

Nous avons demandé à la communauté ses meilleurs conseils sur l'utilisation des jeux d'icônes, et beaucoup d'entre eux sont d'accord sur l'utilisation du populaire jeu d'icônes Font Awesome, mais ce n'est pas le seul jeu d'icônes disponible sur le marché.

Quel jeu d'icônes utilisez-vous? Faites-nous savoir dans les commentaires!

 Utilisez-vous un jeu d'icônes spécifique pour votre site Web? Utilisez-vous Font Awesome pour un usage spécifique (c'est-à-dire avec Shopify, pour une newsletter, ...)? Si tel est le cas, pourquoi l'utilisez-vous et quelle est votre expérience avec le jeu d'icônes? Avez-vous utilisé leur CDN, avez-vous remarqué une amélioration de votre utilisation?

Jeff Roscher: il ajoute un style simple et agréable que les clients trouvent moderne et attrayant

Nous utilisons Font Awesome sur eWorkOrders.com. Il fait partie à la fois de notre site marketing et de notre offre de logiciel en tant que service (SAAS), un système informatisé de gestion de la maintenance (GMAO). Sur notre site de marketing, il ajoute un style simple et agréable que les clients potentiels trouvent moderne et attrayant. Nous avons ajouté des bordures intéressantes et des événements de survol de la souris pour les rendre plus interactifs et excitants. Pour nos clients, les icônes Font Awesome sont utilisées comme repère visuel à l'intérieur des champs de saisie pour aider à identifier le type de données à saisir, comme une icône de calendrier dans un champ de date, une enveloppe dans un champ d'adresse e-mail ou une icône de téléphone dans un champ pour un numéro de téléphone. Ils sont utilisés sur des boutons fonctionnels, tels que modifier, copier et imprimer.

Les icônes sont utilisées pour donner des informations visuelles rapides sur les données, comme une icône d'exclamation rouge à côté d'un bon de travail en retard ou lorsqu'un élément nécessite une attention particulière. Ils sont également à quelques autres endroits pour rendre le programme plus agréable.

Font Awesome a été génial! Leur CDN est rapide et il existe de nombreuses options pour chaque type d'icône dont nous avons besoin. Nous n'avons jamais été déçus.

Jeff est le président d'eWorkOrders.com. eWorkOrders est une GMAO basée sur le Web facile à utiliser qui aide les clients à gérer les demandes de service, les bons de travail, les actifs, la maintenance préventive, etc.
Jeff est le président d'eWorkOrders.com. eWorkOrders est une GMAO basée sur le Web facile à utiliser qui aide les clients à gérer les demandes de service, les bons de travail, les actifs, la maintenance préventive, etc.

Rachel Foley: un moyen abordable d'accéder facilement à une énorme bibliothèque d'icônes

Chez Map My Clients, nous nous appuyons entièrement sur Font Awesome pour notre iconographie sur tous les canaux marketing et notre produit, y compris notre:

  • Site Internet
  • E-mails
  • Des médias sociaux
  • Graphiques personnalisés
  • Application mobile
  • Application Web

Nous utilisons Font Awesome car c'est un moyen abordable d'accéder facilement à une énorme bibliothèque d'icônes. Le style est plus du côté ludique qui s'aligne avec notre marque; De plus, la possibilité pour nous d'utiliser différents poids et styles d'icônes nous donne la liberté.

Nous utilisons le CDN pour nos applications, ce qui permet une sensation très cohérente dans toute l'expérience utilisateur du produit. De plus, il est très simple de mettre à niveau lorsque nous en avons besoin. Avec les supports marketing, nous sommes un peu plus flexibles et utilisons un mélange de CDN, nos versions d'installation locale et vectorielles.

FA a toujours été fiable pour nous depuis que nous l'avons entièrement adopté en janvier.

Rachel est une designer Web et une professionnelle du marketing de contenu basée à New York, qui cherche à améliorer les marques B2B en croissance et à créer un succès marketing à long terme grâce à une stratégie de référencement. Elle travaille actuellement chez Cartographier mes clients, une société de logiciels de vente B2B qui crée des solutions pour les équipes de vente sur le terrain.
Rachel est une designer Web et une professionnelle du marketing de contenu basée à New York, qui cherche à améliorer les marques B2B en croissance et à créer un succès marketing à long terme grâce à une stratégie de référencement. Elle travaille actuellement chez Cartographier mes clients, une société de logiciels de vente B2B qui crée des solutions pour les équipes de vente sur le terrain.

Andrew Ruditser: au fur et à mesure de la mise à niveau de Font Awesome, nous

Font Awesome is used on all our sites since the dawn of time. When we first started working with Font Awesome, it was mainly used for their Des médias sociaux Icons. As Font Awesome upgraded, so did we. Not only are their phone icons fantastic, we enjoy the comical icons that they offer. As of recent, Font Awesome announced their version 6 icons. To us, this shows that Font Awesome cares for their users, and want to keep their system up to date with recent code.

Font Awesome propose désormais un large choix d'icônes. Nous trouvons que cette flexibilité nous est utile de la phase de conception à notre phase de développement. Pour Font Awesome, leur plate-forme offre deux options à leurs utilisateurs. The First Options est un service gratuit, qui offre un choix de 1588 icônes gratuites. La deuxième option est un abonnement Pro, qui propose 7842 icônes. Cette société a également ce que nous appelons une feuille de triche Icon. Cette liste affiche toutes leurs icônes proposées par Font Awesome, ce qui nous informe si elles font partie du package gratuit ou du package pro.

Pour ajouter, Font Awesome propose également une option pour extraire leur code de leur CDN. Nous vous recommandons vivement de suivre leur itinéraire. Leur CDN a un temps de réponse rapide, et nous avons peu ou pas de «décalage» entre notre site et leur plate-forme.

Andrew Ruditser, coordonnateur principal de la technologie
Andrew Ruditser, coordonnateur principal de la technologie

Jeff Romero: cela rend la vitesse de la page beaucoup plus rapide

Nous développons des sites Web personnalisés sur Wordpress pour les petites et moyennes entreprises. Nous avons toujours utilisé des images pour représenter diverses icônes sur nos sites Web, allant des profils de médias sociaux aux icônes de téléphone et de courrier électronique. Le processus d'utilisation d'une image pour les icônes nécessite de trouver un ensemble cohérent d'icônes, de les télécharger, puis de les redimensionner pour s'assurer qu'elles correspondent au site.

Bien qu'il s'agisse d'un petit fichier image, c'est un peu un processus pour obtenir un ensemble cohérent d'icônes et les faire correspondre au modèle du site. Maintenant, en utilisant Font Awesome et son plugin Wordpress, nous pouvons remplacer les icônes par un ensemble cohérent de médias qui nécessite simplement de copier / coller une ligne de HTML. Mieux encore, les icônes peuvent être redimensionnées avec une petite quantité de CSS (en utilisant la propriété font-size). Les icônes s'affichent mieux qu'une icône basée sur une image et sont clairement visibles sur les appareils mobiles. Enfin, comme il s'agit d'une ligne HTML plutôt que d'un fichier image, cela accélère considérablement la vitesse de la page.

Jeff Romero est le co-fondateur d'Octiv numérique, une agence de marketing numérique spécialisée dans la stratégie de référencement local et d'entreprise, la gestion de la publicité pay-per-click, la conception / développement Web et les services d'analyse marketing.
Jeff Romero est le co-fondateur d'Octiv numérique, une agence de marketing numérique spécialisée dans la stratégie de référencement local et d'entreprise, la gestion de la publicité pay-per-click, la conception / développement Web et les services d'analyse marketing.

Vance: particulièrement bien lorsque vous n'avez pas de designer dans votre équipe

En tant que développeur Web, j'utilise Font Awesome comme solution rapide pour de nombreuses icônes intéressantes. Cela étant dit, Font Awesome est particulièrement utile lorsque vous n'avez pas de concepteur dans votre équipe de développement. C'est pratique pour développer des plugins Wordpress car les développeurs peuvent les intégrer dans leurs plugins en utilisant les CDN de Font Awesome en un rien de temps.

Mon expérience avec Font Awesome est bonne jusqu'à présent. Mais cela ne veut pas dire qu'il n'a aucun inconvénient. L'un des inconvénients évidents est la vitesse de chargement de la page (performances). Puisqu'il s'agit d'une solution rapide, vous devez intégrer tout un ensemble d'icônes même si vous n'utilisez que quelques icônes. Cela pourrait réduire la vitesse de chargement du site Web et les scores de vitesse de page Google (PSI).

Vance, développeur Web et propriétaire Web.
Vance, développeur Web et propriétaire Web.

Sunny Ashley: simple, propre et immédiatement reconnaissable pour les nouveaux visiteurs

Nous utilisons les icônes Font Awesome dans le pied de page de notre site Web. Plus précisément, nous utilisons les icônes Facebook, Twitter et LinkedIn pour référencer nos canaux de médias sociaux. Ils sont simples, propres et immédiatement reconnaissables pour les nouveaux visiteurs. Comme le savent les autres utilisateurs de Font Awesome, ils étaient également très rapides et faciles à configurer.

Sunny Ashley, fondateur et PDG d'Facture Autoshop. Facture Autoshop fournit un logiciel de gestion de magasin pour les ateliers de réparation automobile indépendants et les garages.
Sunny Ashley, fondateur et PDG d'Facture Autoshop. Facture Autoshop fournit un logiciel de gestion de magasin pour les ateliers de réparation automobile indépendants et les garages.

Burak Özdemir: les icônes de plumes ne causent pas une taille de DOM excessive

Feather Icons est une collection d'icônes open source lisibles et visuellement agréables, conçues et maintenues par Cole Bemis. En juin 2020, plus de 280 icônes sont disponibles. Toutes les icônes fournies par les icônes de plumes sont sous licence MIT et téléchargeables séparément en tant que fichiers SVG. Vous pouvez personnaliser la taille de l'icône, la couleur du trait de l'icône et la largeur du trait sur le site Web de l'icône de plume avant de les télécharger.

Les icônes de plumes peuvent être un excellent choix pour votre site Web ou votre projet si vous êtes un développeur ou savez comment gérer certaines tâches frontales de base. Comme ces icônes légères peuvent également être rendues avec une bibliothèque JavaScript modulaire, elles ne causent pas une taille DOM excessive, une métrique qui peut nuire aux performances de votre page Web. Ainsi, en utilisant les icônes de plumes, vous pouvez réduire davantage la vitesse de chargement des pages par rapport aux autres packages disponibles sur le marché. Le seul inconvénient de l'utilisation de ce jeu d'icônes est que vous ne pouvez pas trouver la plupart des icônes de marque.

Icônes de plumes
Burak Özdemir est un développeur Web de Turquie. Il se spécialise dans la création d'applications Web.
Burak Özdemir est un développeur Web de Turquie. Il se spécialise dans la création d'applications Web.

Michel Pinson
A propos de l'auteur - Michel Pinson
Michel Pinson est un passionné de voyage et créateur de contenu. Fusionnant la passion pour l'éducation et l'exploration, il est engagé à partager les connaissances et à inspirer les autres grâce à un contenu éducatif captivant. Rapprocher le monde en permettant aux individus avec une expertise mondiale et un sentiment de voyager.




commentaires (0)

laissez un commentaire