Comparaison de quatre générateurs de polices d'icônes personnalisés

Les polices d'icônes font fureur en ce moment. Il est donc très facile d’incorporer des graphiques vectoriels dans une page que les concepteurs du monde entier se tournent vers eux comme moyen principal de gérer les icônes.

Le problème est bien sûr que nous avons besoin de plus de contrôle sur les icônes que nous intégrons. Parfois, nous nous appuyons sur diverses sources, y compris sur notre propre travail, et nous avons besoin d’un bon moyen de les réunir. Entrez les générateurs de polices d'icône. 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 figurant dans l'ensemble que vous avez téléchargé. Si vous souhaitez inclure trois icônes différentes appartenant à trois ensembles différents, vous devez charger trois polices différentes, ce qui peut signifier en réalité un chargement dans des centaines d'icônes dont vous n'avez simplement pas besoin.

Évidemment, si vous optez pour un site maigre et mesquin sans ressources superflues et sans délais de chargement inutiles, ce n’est pas la meilleure façon d’incorporer des 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, vous les jetez dans une seule police construite sur mesure et vous l’incorporez dans votre page.

Malheureusement, nous n’avons pas tous les connaissances ni les ressources nécessaires pour créer nos propres polices. Ne vous inquiétez pas cependant, ces générateurs de polices d'icônes personnalisés vous ont couvert. Que vous souhaitiez utiliser vos propres icônes ou exploiter les jeux d'icônes existants, un outil ci-dessous vous permet d'accomplir votre travail.

Fontello

Le premier générateur que nous allons vérifier est Fontello. Cette application est super lisse, très facile à utiliser et a onze jeux d'icônes gratuits, dont Font Awesome et Iconic. Il n'y a pas de milliers d'icônes parmi lesquelles choisir, mais il y en a suffisamment 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 situé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 soit chargée avec vos résultats de recherche.

Choisir des icônes pour votre police personnalisée est aussi simple que de cliquer dessus. Une fois que vous avez trouvé et sélectionné les icônes à inclure, passez au deuxième onglet où vous pouvez modifier le nom de chaque icône. Ce sont ces petites options de personnalisation qui rendent Fontello si formidable.

La prochaine étape consiste à vérifier les? Modifier les codes? afin que vous puissiez personnaliser les caractères associés à chaque icône. Faire cela est assez facile, utilisez simplement les champs fournis.

Après avoir terminé les étapes ci-dessus, vous êtes tous prêts à partir. Tapez 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 quatorze fichiers répartis sur plusieurs dossiers. L'empreinte de chaque fichier est minuscule, mais le nombre d'éléments que vous recevez peut sembler écrasant pour quelqu'un qui cherchait une solution simple. Cela étant dit, il est vraiment agréable de disposer d'un exemple pleinement fonctionnel, et ils ont déployé de nombreux efforts pour s'assurer que tout est compatible avec le navigateur le plus possible.

IcoMoon

La prochaine application que nous allons examiner est IcoMoon. En toute honnêteté, cela ressemble beaucoup à Fontello, mais certaines différences essentielles méritent d’être examinées.

Comme avec Fontello, vous pouvez parcourir les icônes en les 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 ce que vous voyez par défaut. Pour consulter le reste, cliquez sur? Bibliothèque? bouton près du haut de l'écran.

Cela vous mènera à une page qui propose actuellement seize collections différentes, dont la plupart sont gratuites, tandis que d'autres doivent être achetées.

Importation d'autres ressources

L'une des meilleures fonctionnalités d'IcoMoon est la possibilité d'importer d'autres ressources à inclure dans votre construction personnalisée. 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 formidable ressource pour ceux qui cherchent à créer leur propre police d'icônes à partir de rien.

Générer la police

Une fois que vous avez sélectionné 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).

Comme avec Fontello, avant le téléchargement, vous avez quelques options pour modifier les paramètres et le codage 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 alors qu'IcoMoon le condense en un seul. Cela rend tout beaucoup plus facile à parcourir et la page de démonstration est un peu plus agréable aussi.

Pictonic

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 tarif de 0,59 USD par icône ou bénéficier d'un accès illimité à 199 USD.

Ici, nous voyons le même exercice qu'auparavant, utilisez la fonctionnalité de recherche en direct ou parcourez les icônes disponibles en faisant défiler et en cliquant sur celles que vous souhaitez.

Un menu déroulant vous permet également de filtrer facilement les résultats par catégorie. C'est également un bon moyen de jeter un coup d'œil aux 320 icônes gratuites (qui sont principalement des logos de réseaux sociaux et de logiciels).

Télécharger

Cette fois-ci, je ne vois pas vraiment d'options pour personnaliser votre téléchargement, il vous suffit de cliquer sur? Continuer? alors? 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 toutes les manières possibles: fichiers de polices, fichiers PNG et SVG. Le nombre de fichiers que vous recevez dépend du nombre d’icônes que vous avez choisi.J'aime avoir toutes ces options, mais j'aimerais choisir ce que je veux faire et ce que je ne veux pas avant le téléchargement.

Serveur Pictos

J'ai sauvé la valeur aberrante pour la fin. Pictos Server aborde les choses un peu différemment des autres sites. Au lieu de créer une police personnalisée que vous avez téléchargée et intégrée sur votre propre serveur, Pictos héberge les icônes pour vous. Il est généralement connu sous le nom de "Typekit of icons", une description décente de ce que vous pouvez attendre du service.

D'après mes calculs, il y a actuellement environ 338 icônes parmi lesquelles choisir. Vous pouvez affiner l’offre en choisissant l’un des ensembles Pictos ou en recherchant un élément spécifique.

Une fois que vous avez choisi les icônes, vous pouvez taper les caractères pour lesquels vous souhaitez représenter chaque icône. À partir de là, il vous suffit de cliquer sur le bouton? Générer le code? bouton, qui vous donne un lien CSS incorporé que vous jetez simplement dans votre fichier.

Prix

Pictos étant un service d'hébergement, il y a évidemment des frais mensuels. Les prix des forfaits sont définis en fonction des pages vues, en commençant par 0 $ pour un maximum de 25 000 vues mensuelles jusqu'à 50 $ pour un maximum de 4 000 000 vues mensuelles.

Il est également important de noter que le plan gratuit semble être limité à douze icônes par police.

Comment comparent-ils?

Évidemment, 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 d'icônes est un jeu d'enfant.

Si vous recherchez une tonne de polices gratuites sans devoir vous créer un compte, visitez Fontello. C'est un excellent service avec de nombreuses options et qui sera probablement tout ce dont vous avez besoin.

En termes de fonctionnalités et d'options, IcoMoon est difficile à battre. J'aime que cela vous permette 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 mettre en œuvre.

Globalement, Pictonic était probablement le moins préféré de ce groupe. La sélection d'icônes gratuites n'était pas si géniale et vous n'avez pas les options de personnalisation des autres services. Le système de tarification simple pour les icônes premium est une chose qui me plaît chez Pictonic: 0,59 USD par icône ou 199 USD pour un accès illimité. Sympa et simple!

Quel est le générateur de polices d'icônes préféré?

Dans l’ensemble, ces quatre services méritent d’être vérifiés. Ils sont tous très faciles à utiliser et riches en 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 ce que vous pensez. Avez-vous utilisé l'un de ces services dans des projets antérieurs? Lequel recommandez-vous? Quelles sont les autres options qui me manquent?