Les icônes, ou pictogrammes, se retrouvent absolument partout sur Internet: sur les sites web, dans les applis, dans les chats, et sur les boutiques en ligne. Ces petits symboles viennent agrémenter le texte, rendent la navigation plus facile pour l’utilisateur et ont souvent une fonction explicative. Les multiples possibilités d’utilisation qu’elles offrent en font un outil de communication visuelle sans pareil.
Un créateur de site web à la recherche d’icônes trouve rapidement son bonheur. Il faut dire que de nombreux sites proposent des pictogrammes aux designs variés. On distingue alors généralement les icônes pleines et les icônes de contour. Deux autres catégories récurrentes sont celles des icônes monochromes et multicolores. Généralement, ces sites laissent la possibilité de télécharger gratuitement une partie de leur sélection, sous réserve que les spécifications de la licence soient respectées. À l’inverse, certaines icônes sont payantes.
Nous vous présentons succinctement dans cet article quelques-uns de ces sites et répondons à diverses questions que vous êtes susceptibles de vous poser, telles que: que sont les polices d’icônes? Comment fonctionnent les licences d’icônes? Comment intégrer des icônes sur mon site?
Les polices d’icônes sont répandues, ajustables et intuitives
Les pictogrammes téléchargeables sont le plus souvent des polices d’icônes, le type d’icônes le plus fréquent aujourd’hui. En substance, il s’agit de simples polices numériques, à ceci près qu’elles utilisent des symboles au lieu de caractères alphanumériques. D’un point de vue technique, elles sont toutefois intégrées comme des polices standard. Elles sont généralement construites sur une base vectorielle, ce qui permet de les mettre à l’échelle. Il est ainsi possible d’agrandir ou de réduire les caractères sans perte de résolution, de modifier leurs couleurs, et même de les faire pivoter. Les polices d’icônes sont insérées dans le texte source via CSS.
Faciles à moduler, ces polices sont idéales pour les sites Internet mobiles. Autre atout, et non des moindres: les sites qui les utilisent sont plus rapides à charger. En effet, avec les polices d’icônes, il n’y a pas d’illustrations entières ou de gros symboles à charger, le jeu de caractères et les fichiers CSS correspondants suffisent. Le serveur reçoit donc moins de requêtes et le temps de chargement du site diminue en conséquence.
En revanche, comme cela peut parfois être le cas pour beaucoup d’autres polices, la qualité de la présentation des polices d’icônes peut fluctuer selon le navigateur utilisé, tout particulièrement lorsque les pictogrammes sont de petite taille ou très détaillés. Il est certes possible de modifier la couleur des icônes, mais la création d’icônes multicolores est souvent compliquée pour les designers.
Info:
Où trouver de bonnes images et des polices attractives sur Internet pour votre site? Nous vous conseillons deux de nos articles sur ce sujet:
Besoin d’images pour votre site Web? Voici les offres incontournables
Pour que votre site web soit bien lisible: vous trouverez des polices ici
Où trouver des icônes téléchargeables gratuitement
Nous vous avons préparé un aperçu de quelques banques d’icônes connues. Les sites de ce type sont légion. Nombre d’entre eux proposent à la fois des pictogrammes payants et gratuits. La plupart du temps, les icônes sont mises à disposition dans des packs, mais il est aussi possible de n’en télécharger qu’une à la fois.
- The Noun Project
The Noun Project est un site basé à Los Angeles qui propose plus de trois millions de symboles de toutes sortes au téléchargement. Son large panel d’icônes est sous une licence Creative Commons. - flaticon
La collection de flaticon compte environ 3,5 millions de pictogrammes d’une grande variété. Un bémol toutefois: une licence gratuite n’autorise qu’une utilisation limitée du site. À titre d’exemple, les icônes gratuites ne peuvent être téléchargées qu’au format PNG. Les utilisateurs non professionnels devraient néanmoins y trouver leur compte. - Dribble
Bien plus qu’une banque d’icônes, Dribble offre la possibilité aux designers du monde entier de présenter leurs œuvres et de s’inspirer les uns les autres. Le site permet aussi de télécharger des icônes, des polices et d’autres objets graphiques. Il n’est certes pas gratuit mais la visite vaut clairement le coup. - Font Awesome
À l’inverse, Font Awesome est réputé non seulement pour sa collection d’icônes gratuites, mais aussi pour son réseau de diffusion de contenu (RDC) d’une très grande ergonomie, qui permet d’intégrer facilement des icônes dans des pages web. - iconmonstr
Fondé et opéré par le designer allemand Alexander Kahlkopf, iconmonstr propose quelques milliers d’icônes sous sa propre licence en téléchargement gratuit et ne cesse de croître. - ICONS8
ICONS8 propose plusieurs dizaines de milliers d’icônes à ses utilisateurs. Le téléchargement est gratuit à condition qu’un lien renvoie au site. À noter que l’offre comprend, outre des pictogrammes, également des photos, des illustrations et même de la musique. - Vecteezy
Vecteezy est une autre source de choix pour les designers. Elle met à la disposition des utilisateurs de nombreuses images et des films en téléchargement gratuit. - GraphicRiver
Graphicriver est membre d’Envato, un réseau australien de designers et de créateurs multimédia qui gère de nombreuses places de marché numériques (dont codecanyon.net ou themeforest.net). Des designers du monde entier utilisent le site pour proposer non seulement des icônes mais aussi des illustrations. Graphicriver se démarque des autres sites en ceci qu’il est payant. - Linearicons
Fondé par un designer de polices d’icônes connu sous le pseudonyme de «Perxis», ce site propose un pack d’icônes sous licence Creative Commons en téléchargement. Une seule condition: un lien doit renvoyer à la banque et à son opérateur. - Streamline
Sur Streamline, les designers ont le choix entre plus de 100 000 icônes, émojis et autres images. Toutefois, seule une partie d’entre eux est gratuite.
Au niveau des droits d’auteur, qu’en est-il des icônes prises sur Internet?
En principe, tous les contenus sur Internet sont protégés par les droits d’auteur. Cela vaut aussi bien pour les photos que pour les polices et la musique. En Suisse, la protection par le droit d’auteur expire 50 à 70 ans après la mort du créateur.
En Suisse, le téléchargement de contenus sous droit d’auteur pour un usage exclusivement privé est légalement autorisé, même si le site de téléchargement est en principe illégal. En revanche, téléverser des contenus protégés est interdit, y compris pour un usage privé, avec ou sans but lucratif.
Par ailleurs, pour télécharger un pack d’icônes et les téléverser sur son site personnel, l’autorisation du créateur (dans le cas des pictogrammes, c’est généralement le designer) est normalement requise. Cette autorisation, c’est la licence. Le plus souvent, le téléchargement de packs d’icônes implique des licences standard. Celles-ci encadrent les modalités d’exploitation des icônes et fixent leur prix. Par exemple, elles autorisent, ou pas, une utilisation commerciale.
Pour utiliser une icône à une fin autre que celle définie dans les licences standard, une autre licence est requise dans laquelle ces types d’utilisation supplémentaires sont détaillés. Les licences standards sont souvent gratuites. En revanche, les licences étendues sont généralement payantes. Bon nombre des banques d’icônes évoquées ci-dessus proposent ces deux types d’usage, et la licence correspondante.
Comment intégrer sur mon site des icônes téléchargées?
Sur la plupart des sites présentés, ce sont des fichiers SVG à base vectorielle qui sont téléchargés, ou bien des fichiers images PNG. Ces deux types de fichiers peuvent normalement être intégrés par les systèmes de gestion de contenu (CMS – Content Management System) ordinaires. Les fichiers SVG sont généralement de meilleure qualité, mais les fichiers PNG font souvent l’affaire aussi. Certains sites permettent en outre de donner aux icônes la couleur de son choix avant téléchargement grâce aux codes couleur en hexadécimal. Une bonne façon de vérifier que leur couleur est assortie au design du site.
L’intégration dans un site web se fait soit manuellement soit via un plug-in. Certaines banques d’icônes, comme Font Awesome, fournissent leur propre plugin, qui permet de copier très facilement des icônes dans le code source. Cette procédure va modifier le code, aussi est-il important de le sauvegarder au préalable. Notre conseil: certains CMS, tels que WordPress, mettent à disposition un petit nombre d’icônes qu’il est très facile d’intégrer à son site. Si vous voulez créer votre site avec WordPress, sachez que vous aurez alors accès à des pictogrammes.
Hostpoint gère très facilement les projets web, qu’ils utilisent WordPress ou d’autres CMS.