Auparavant, lors de la création de sites, vous deviez utiliser des icônes bitmap. C'était beau, mais peu pratique pour diverses raisons. Aujourd'hui, les icônes vectorielles ont remplacé les icônes raster. C'est une solution originale et élégante qui saura décorer et rafraîchir votre site.
Instructions
Étape 1
Il existe un bon service Web pour créer des polices à partir d'icônes. Il s'appelle Fontastic. Il est entièrement gratuit et sans publicité. La première étape consiste à s'inscrire sur le site Web du service. Rendez-vous sur le site fontastic.me, saisissez votre adresse e-mail dans les champs de saisie et créez un mot de passe, puis cliquez sur le gros bouton jaune "Créez votre Icon Font". Parfois, il arrive qu'aucune information confirmant la réussite de l'enregistrement ne s'affiche. Ne vous inquiétez pas, passez à l'étape suivante.
Étape 2
Cliquez maintenant sur le bouton "Connexion" situé dans le coin supérieur droit. Sur la page qui s'ouvre, entrez à nouveau votre e-mail et votre mot de passe, appuyez sur le bouton "Connexion".
Après avoir attendu quelques secondes, le panneau de création de polices à partir d'icônes s'ouvrira.
Étape 3
Voici une large sélection d'icônes. En cliquant sur les icônes que vous aimez avec la souris, sélectionnez autant d'icônes que vous le souhaitez. En haut, après le mot « PUBLIER », le nombre d'icônes sélectionnées est indiqué.
Étape 4
Si vous n'avez pas assez d'icônes parmi le numéro présenté, faites défiler vers le bas de la page et trouvez le bouton qui dit "Ajouter plus d'icônes". Clique dessus.
Étape 5
Une page avec des packs d'icônes supplémentaires s'ouvrira. Certains d'entre eux sont payants (labellisés "Premium"), d'autres sont gratuits. Pour activer des icônes supplémentaires, appuyez sur le bouton « ACTIVER » sur les forfaits sélectionnés. Désormais, elles apparaîtront dans la liste générale des icônes disponibles lorsque vous commencerez à utiliser le panneau de configuration en cliquant sur le bouton « Accueil » dans le menu du haut.
Étape 6
Si vous devez ajouter vos propres icônes, alors sur la même page en haut à droite, cliquez sur le bouton "IMPORTER LES ICNES". Vous pouvez maintenant télécharger vos propres icônes. Veuillez noter que seul le format vectoriel SVG est pris en charge.
Étape 7
Après avoir sélectionné le nombre d'icônes requis, appuyez sur le bouton "PERSONNALISER". Ici, vous verrez toutes les icônes sélectionnées et vous pouvez leur attribuer des noms de classe arbitraires, par lesquels vous vous y référerez dans les styles CSS. Ou vous pouvez laisser les noms par défaut que le système a attribués aux icônes.
Étape 8
Appuyez sur le bouton « PUBLIER ». Ici, vous pouvez télécharger la police d'icône vectorielle créée (bouton "TÉLÉCHARGER"). Téléchargez l'archive de polices créée par le service sur votre ordinateur.
Étape 9
L'archive téléchargée contient le fichier de style CSS, le fichier HTML avec les noms des classes d'icônes et le dossier "fonts" avec les polices. Cette police d'icône peut être utilisée sur votre site Web.
Étape 10
Pour utiliser la police d'icône créée, vous devez procéder comme suit:
- décompressez le contenu de l'archive et téléchargez-le sur votre site dans le répertoire avec styles;
- insérer un lien vers un fichier CSS dans la section HEAD de toutes les pages du site qui fonctionneront avec cette police d'icônes;
- dans le code de la page, nous utilisons le nom des classes précédemment créées pour utiliser la police d'icône nouvellement créée.
