Les icônes doivent toujours illustrer les concepts de façon claire et universelle. Elles doivent aussi être utilisées avec parcimonie pour éviter d'alourdir l'interface inutilement.

Par souci de cohérence, la même icône doit toujours être utilisée pour communiquer la même information.

Types d'icônes

Nous utilisons principalement deux types d'icônes dans le site Web. 

Icônes informatives

Elles servent à communiquer une information importante et incitent, la plupart du temps, à passer à l'action.

Icônes décoratives

Elles sont uniquement utilisées d'un point de vue esthétique. Elles renforcent la signification du texte adjacent, mais n'ajoutent aucune information.

Librairie d'icônes disponibles

Voici un aperçu de la librairie d'icônes utilisées dans le site Web informationnel de Revenu Québec.

Visualiser la librairie complète

États

L'état des icônes varie en fonction de leur contexte d'utilisation. Par exemple, une icône utilisée avec un hyperlien n'aura pas le même état qu'une icône utilisée avec un bouton d'action.

Pour en savoir plus à ce sujet, consultez la base ou le composant qui accompagne l'icône.

Accessibilité

En tout temps, une icône informative utilisée seule doit être accompagnée d'un attribut ALT (texte de remplacement). Cela permet aux personnes qui ne perçoivent pas l'icône de comprendre sa fonction.

Au contraire, les icônes décoratives doivent être ignorées par les lecteurs d'écran. Pour ce faire, vous devez utiliser un attribut ALT vide.