Comparaison de quatre générateurs de polices d'icônes personnalisées
Les polices d'icônes sont à la mode en ce moment. Ils facilitent tellement l'intégration de graphiques vectoriels dans une page que les concepteurs du monde entier se tournent vers eux comme principal moyen de gérer les icônes.
Le problème est bien sûr, nous avons besoin de plus de contrôle sur les icônes que nous intégrons. Parfois, nous tirons de diverses sources, y compris notre propre travail, et nous avons besoin d'un bon moyen de rassembler tout cela. Entrez les générateurs de polices d'icônes. Suivez-nous en comparant quelques-uns de nos favoris.
Pourquoi un générateur?
L'inconvénient de l'utilisation d'une police d'icônes est que vous êtes limité par les icônes qui se trouvent dans l'ensemble que vous avez téléchargé. Si vous souhaitez inclure trois icônes différentes de trois ensembles différents, vous devrez charger dans trois polices différentes, ce qui pourrait en fait signifier le chargement de centaines d'icônes dont vous n'avez tout simplement pas besoin.
De toute évidence, si vous optez pour un site maigre et méchant sans ressources superflues et sans retards de chargement inutiles, ce n'est pas la meilleure façon de procéder à l'intégration d'icônes. C'est là que les polices d'icônes personnalisées entrent en jeu. Dans ce scénario, vous prenez vos trois icônes, les jetez dans une seule petite police personnalisée et les incorporez à votre page.
Malheureusement, nous n'avons pas tous les connaissances ou les ressources pour créer nos propres polices. Ne vous inquiétez pas, ces générateurs de polices d'icônes personnalisées sont là pour vous. Que vous souhaitiez utiliser vos propres icônes ou tirer parti des ensembles d'icônes existants, il existe un outil ci-dessous pour faire le travail.
Fontello
Le premier générateur que nous allons vérifier est Fontello. Cette application est super lisse, vraiment facile à utiliser et dispose de onze jeux d'icônes entièrement gratuits, y compris Font Awesome et Iconic. Il n'y a pas des milliers d'icônes parmi lesquelles choisir, mais il y en a certainement assez pour que vous puissiez trouver ce que vous cherchez.
En parlant de trouver ce que vous cherchez, cette tâche est simplifiée par la fonction de recherche de mise à jour instantanée en haut de la page. J'adore le filtrage en direct ici, ce qui est bien mieux que d'attendre qu'une nouvelle page se charge avec vos résultats de recherche.
Choisir des icônes pour votre police personnalisée est aussi simple que de cliquer dessus. Après avoir trouvé et sélectionné les icônes que vous souhaitez inclure, passez au deuxième onglet où vous pouvez changer les noms de chaque icône. Ce sont de petites options de personnalisation comme celle-ci qui rendent Fontello si génial.
L'étape suivante consiste à consulter l'onglet «Modifier les codes» afin de pouvoir personnaliser les caractères associés à chaque icône. Faire cela est assez simple, utilisez simplement les champs fournis.
Après avoir terminé les étapes ci-dessus, vous êtes prêt à partir. Saisissez simplement un nom de fichier et cliquez sur le lien de téléchargement pour recevoir votre police personnalisée.
Télécharger
Le téléchargement de Fontello comprend un total de quatorze fichiers répartis sur plusieurs dossiers. L'encombrement de chaque fichier est minuscule, mais le nombre d'éléments que vous recevez peut sembler écrasant pour quelqu'un qui recherchait une solution simple. Cela étant dit, c'est vraiment agréable d'avoir un exemple pleinement fonctionnel sur lequel travailler et ils ont fait beaucoup d'efforts pour s'assurer que tout est aussi compatible que possible avec le navigateur.
IcoMoon
La prochaine application que nous allons examiner est IcoMoon. En toute honnêteté, cela ressemble beaucoup à Fontello, mais il existe certaines différences clés qui méritent d'être examinées.
Tout comme avec Fontello, vous pouvez parcourir les icônes en faisant défiler ou utiliser la fonction de recherche intégrée pour trouver quelque chose de spécifique.
Il y a beaucoup plus d'icônes disponibles que vous ne le voyez par défaut. Pour vérifier le reste, appuyez sur le bouton "Bibliothèque" en haut de l'écran.
Cela vous amènera à une page qui propose actuellement seize collections différentes, dont beaucoup sont gratuites tandis que d'autres doivent être achetées.
Importer d'autres ressources
L'une des meilleures fonctionnalités d'IcoMoon est la possibilité d'importer d'autres ressources à inclure dans votre build personnalisé. Vous pouvez télécharger d'autres polices d'icônes ou même vos propres graphiques SVG personnalisés. Cela fait d'IcoMoon une ressource formidable pour quiconque cherche à créer sa propre police d'icône à partir de zéro.
Génération de la police
Une fois que vous avez choisi vos icônes, vous pouvez procéder au téléchargement de votre police via le bouton en bas de la page. Notez également que vous avez la possibilité de télécharger les icônes sous forme d'image (cela générera une page de sprite).
Tout comme avec Fontello, avant le téléchargement, vous avez la possibilité de modifier les paramètres et l'encodage de votre police.
Télécharger
Le téléchargement ici est considérablement plus petit qu'avec Fontello. Il n'y a que neuf fichiers, dont cinq sont la police réelle. Fondamentalement, Fontello vous donne un tas de fichiers CSS tandis qu'IcoMoon le condense à un. Cela rend tout plus facile à parcourir et la page de démonstration est également un peu plus agréable.
Pictonique
Le prochain sur notre liste est Pictonic. Pour utiliser ce site, vous devez créer un compte. De là, vous avez trois options. Vous pouvez utiliser les icônes gratuites, utiliser des icônes payantes au taux de 0, 59 $ par icône ou recevoir un accès illimité pour 199 $.
Ici, nous voyons le même exercice qu'auparavant, utilisez la fonction de recherche en direct ou parcourez les icônes disponibles en faisant défiler et en cliquant sur celles que vous souhaitez.
Il existe également un menu déroulant qui vous permet de filtrer facilement les résultats par catégorie. C'est également un bon moyen d'avoir un aperçu des 320 icônes gratuites (qui sont principalement des logos sociaux et logiciels).
Télécharger
Cette fois-ci, je ne vois pas vraiment d'options pour personnaliser votre téléchargement, vous cliquez simplement sur "Continuer" puis sur "Télécharger" et vous recevez ce qui s'avère être notre plus gros téléchargement à ce jour.
Avec Pictonic, vous recevez automatiquement les fichiers de la façon dont vous le souhaitez: fichiers de polices, PNG et SVG. Le nombre de fichiers que vous recevez dépend du nombre d'icônes que vous avez choisi. J'adore avoir toutes ces options, mais j'aimerais choisir ce que je fais et je ne veux pas avant le téléchargement.
Serveur Pictos
J'ai gardé la valeur aberrante pour la fin. Pictos Server fait les choses un peu différemment des autres sites. Au lieu de créer une police personnalisée que vous téléchargez et intégrez sur votre propre serveur, Pictos héberge les icônes pour vous. Il est généralement connu comme «le Typekit des icônes», qui est une description décente de ce que vous pouvez attendre du service.
D'après mes calculs, il existe actuellement environ 338 icônes parmi lesquelles choisir. Vous pouvez affiner l'offre en choisissant parmi l'un des ensembles Pictos ou en recherchant quelque chose de spécifique.
Une fois que vous avez choisi les icônes, vous pouvez taper les caractères que vous souhaitez représenter chaque icône. De là, vous cliquez simplement sur le bouton «Générer du code», qui vous donne un lien d'intégration CSS que vous jetez simplement dans votre fichier.
Tarification
Étant donné que Pictos est un service d'hébergement, il y a évidemment des frais mensuels impliqués. Les prix des plans sont fixés en fonction des pages vues, en commençant par 0 $ pour jusqu'à 25 000 vues mensuelles jusqu'à 50 $ pour jusqu'à 4 000 000 vues mensuelles.
Il est également important de noter que le plan gratuit semble être limité à douze icônes par police.
Comment se comparent-ils?
De toute évidence, la réponse à la question de savoir quel site est «le meilleur» dépend de vos besoins spécifiques. Chaque site semble exceller à sa manière. Si vous recherchez la solution la plus simple, vous ne pouvez pas battre Pictos Server. Il y a vraiment très peu de travail impliqué et l'intégration de la police de l'icône est un jeu d'enfant.
Si vous recherchez une tonne de polices gratuites sans les tracas de la création d'un compte, consultez Fontello. C'est un excellent service avec de nombreuses options et sera probablement tout ce dont vous avez besoin.
En termes de fonctionnalités et d'options, IcoMoon est difficile à battre. J'adore le fait qu'il vous permet de télécharger et d'intégrer votre propre travail ou même d'autres polices d'icônes que vous avez trouvées. Il y a aussi une tonne d'icônes gratuites ici et même des packs premium si vous voulez vraiment tout faire.
Dans l'ensemble, Pictonic était probablement mon moins préféré du groupe. La sélection gratuite d'icônes n'était pas géniale et vous n'avez pas les options de personnalisation des autres services. Une chose que j'aime chez Pictonic est le modèle de tarification simple pour les icônes premium: 0, 59 $ par icône ou 199 $ pour un accès illimité. Agréable et simple!
Quel générateur de polices d'icônes est votre favori?
Dans l'ensemble, ces quatre services méritent d'être vérifiés. Ils sont tous très faciles à utiliser et remplis de valeur.
Maintenant que vous avez vu mes pensées sur ces quatre générateurs de polices, laissez un commentaire ci-dessous et dites-moi vos pensées. Avez-vous utilisé l'un de ces services dans des projets antérieurs? Que recommandez-vous? Quelles sont les autres options que j'ai ratées?