Wanneer gebruik je een icoon en wanneer niet?
Je gebruikt een icoon als het begrip universeel herkenbaar is: een winkelmandje, een telefoon, een envelop, een vergrootglas.
Voor alles wat abstracter is, werkt een woord beter. Dat is de hele regel.
De test is eenvoudig: kun je het icoon in één woord benoemen zonder context?
Wat wel werkt
Iconen die iedereen al tientallen keren heeft gezien. Die worden sneller herkend dan tekst en nemen minder ruimte in.
In een menubalk of bij een formulier scheelt dat echt. Meer daarover lees je bij design system.
Wat niet werkt
Iconen voor kwaliteit, betrouwbaarheid, samenwerking of innovatie. Daar bestaat geen herkenbaar beeld voor.
Je krijgt dan drie handdrukken en twee gloeilampen die niemand iets zeggen.
Dat is geen ontwerpfout maar een denkfout: er bestaat simpelweg geen beeld dat iedereen als samenwerking leest.
De twijfelgevallen
Een hamburgermenu, een deelpictogram, een hartje voor favorieten. Die zijn ingeburgerd maar niet voor iedereen.
Zet er in die gevallen een woord bij. Meer daarover lees je bij of er tekst bij een icoon hoort.
Mijn vuistregels
- Kun je het icoon in één woord benoemen zonder context? Dan mag het.
- Twijfel je? Zet er tekst bij.
- Geen iconen voor abstracte begrippen.
- Gebruik nooit een icoon als enige aanduiding van een belangrijke actie.
Die laatste is een toegankelijkheidsregel en tegelijk gewoon verstandig.
Bij opsommingen
Drie diensten met elk een icoon erboven: dat oogt aardig en voegt zelden iets toe.
Als de iconen niets verduidelijken, laat ze dan weg en geef de tekst meer ruimte. Meer daarover lees je bij pagespeed.
Hoe je het test
Laat iemand die je site niet kent naar het icoon kijken en vragen wat het betekent.
Twijfelt hij, dan is het antwoord duidelijk. Meer daarover lees je bij accessibility.