Favicon maken

Hoe je dit gebruikt Favicon maken

1. Kies een vierkante afbeelding, bij voorkeur 512 bij 512 pixels of groter.
2. Bekijk de voorbeelden op verschillende maten.
3. Download de set en plak de HTML in je head.

Welke bestanden je nodig hebt

De set is in de loop der jaren gegroeid; dit is wat een gewone site nodig heeft.

De SVG is de nieuwste toevoeging en de handigste: één bestand dat op elke maat scherp is. Ondersteuning is inmiddels breed, maar lever de PNG's erbij voor wat het niet aankan.

Het manifestbestand hoort erbij zodra je wilt dat de site als app op een beginscherm kan worden gezet. Daarin staan de naam, de kleuren en de verwijzingen naar de grote iconen.

Ontwerpen voor 16 pixels

Een favicon wordt vaak op zestien bij zestien pixels getoond. Dat is minder ruimte dan een letter in deze zin.

Een logo dat op een website goed werkt, is daar vrijwel altijd onleesbaar. Fijne lijnen verdwijnen, tekst wordt een grijze veeg, en een complex beeldmerk wordt een vlek.

Wat wel werkt: één letter, een sterk vereenvoudigd beeldmerk, of een enkele duidelijke vorm. Veel grote merken gebruiken alleen hun eerste letter.

Zorg voor contrast met beide tabbladachtergronden. Een donker icoon verdwijnt in een donker thema, een licht icoon in een licht thema. Een gekleurde achtergrond in het icoon zelf lost dat op.

Test op ware grootte, niet op het voorbeeld van 512 pixels. Dat is de fout die vrijwel iedereen maakt.

Veelgestelde vragen