Digitale merkidentiteit

Favicon, profielfoto en bannerafbeelding: hoe je ze merksterk maakt

Lotte van Dijk Lotte van Dijk
· · 5 min leestijd

Stel je voor: iemand ziet je merk voor het eerst. Niet op een groot scherm, niet in een mooie presentatie. Nee.

Inhoudsopgave
  1. De favicon: klein formaat, grote impact
  2. De profielfoto: jij als merk, in één rondje
  3. De bannerafbeelding: je digitale voorkant
  4. Het samenspel: waarom samenhang ertoe doet

Een piepklein vierkantje in een browsertab. Of een miniatuur rondje tussen tientjes berichten.

Of een smalle banner bovensite op een social platform. Die eerste milliseconden? Die bepalen of iemand klikt, scrollt of gewoon verdergaat. En dan hebben we het nog niet eens over je website zelf.

Favicons, profielfoto's en bannerafbeeldingen zijn de kleine helden van je merkidentiteit. Ze zijn vaak over het hoofd gezien, maar precies daarom maken ze het verschil tussen een merk dat professioneel overkomt en er eentje die eruitziet alsof het in vijf minuten in Canva is gebakt. Laten we ze één voor één bekijken.

De favicon: klein formaat, grote impact

Je favicon is het kleinste visuele element van je merk, en tegelijk een van de meest herhaalde. Iemand die je site heeft geopend, ziet die kleine afbeelding elke keer als hij of zij terugkeert naar de tab.

Wat werkt en wat niet

Het is herkenning op zijn puurst. Een goede favicon is simpel, herkenbaar en werkt op 16×16 pixels. Ja, je leest het goed: zestien bij zestien pixels.

Dat betekent: geen details, geen tekst, geen ingewikkelde illustraties. Kies één sterk element uit je logo of merkidentiteit.

Denk aan de bijl van het Apple-logo, de vleug van Twitter of de rode play-knop van YouTube. Die werken omdat ze op elk formaat herkenbaar blijven. Technisch gezien raad ik aan om je favicon op te slaan als een SVG-bestand waar mogelijk, of als PNG in meerdere formaten: 16×16, 32×32 en 180×180 pixels (voor Apple touch icons).

Zorg er ook voor dat je een favicon.ico bestand in de root van je website plaatst, zodat oudere browsers het ook kunnen lezen. En vergeet manifest.json niet als je een Progressive Web App ondersteunt.

Veelgemaakte fouten

De grootste fout? Je volledige logo erin proppen.

Op 16 pixels is dat een onherkenbare brij. Een andere veelgemaakte blunder: een favicon kiezen die niet past bij je merkleur of -stijl. Als je merk zwart-wit minimalistisch is, maar je favicon is een kleurrijke illustratie, dan creëer je ruis. En ruis is precies wat je niet wilt.

De profielfoto: jij als merk, in één rondje

Of het nu gaat om je LinkedIn-profiel, je Instagram-account of je Slack-avatar: je profielfoto is vaak het eerste gezichtspunt dat mensen hebben van jou of je merk.

De ideale profielfoto

En ja, mensen beoordelen daar echt op. Onderzoek van de universiteit van Princeton toont aan dat we binnen honderd milliseconden een oordeel vormen over iets of iemand op basis van uiterlijk alleen. Voor platforms als LinkedIn geldt een aanbevolen formaat van 400×400 pixels, maar het wordt weergegeven als een cirkel van ongeveer 160 pixels doorsnede. Instagram gebruikt 320×320 pixels, weergegeven als cirkel.

Facebook toont het als 170×170 op desktop en 128×128 op mobiel. Het punt is: je afbeelding moet werken als cirkel, dus zorg dat het belangrijkste in het midden zit.

Gebruik een foto met goede belichting, een neutrale of merkgerelateerde achtergrond, en zorg dat je gezicht minstens zestig procent van het frame beslaat.

Consistentie is koning

Geen groepsfoto's, geen zelfie met een filter, geen foto van vakantie 2019. Kies iets dat past bij de professionaliteit die je wilt uitstralen. Gebruik overal dezelfde profielfoto.

Of in ieder geval dezelfde stijl. Als je op LinkedIn een zakelijke portretfoto hebt, maar op Instagram een cartoon-avatar, dan breekt de herkenbaarheid. En herkenbaarheid is precies waar het om draait.

De bannerafbeelding: je digitale voorkant

De banner, of cover image, is het grote panorama bovenaan je profiel of pagina. Het is het eerste wat mensen zien als ze je Twitter-profiel, LinkedIn-pagina of YouTube-kanaal bezoeken. En het is verrassend vaak verwaarloosd.

De juiste afmetingen per platform

Elk platform heeft zijn eigen ideale afmetingen, en die veranderen trouwens regelmatig.

Maar op het moment van schrijven gelden deze richtlijnen: LinkedIn bedrijfspagina's werken het beste met 1128×191 pixels, Twitter (nu X) gebruikt 1500×500 pixels, YouTube-kanaalbanners zijn 2560×1440 pixels (met een veilige zone van 1546×423 pixels voor mobiel), en Facebook-pagina's tonen de coverfoto als 820×312 pixels op desktop en 640×360 op mobiel. Die veilige zone is belangrijk.

Wat maakt een banner echt sterk?

YouTube toont op mobiel namelijk alleen het middelste gedeelte van je banner. Dus als je belangrijke tekst of logo's aan de randen zet, zien ze simpelweg niet op een telefoon. Een goede banner vertelt in één oogopslag wie je bent en wat je doet.

Gebruik je merkleuren, je typografie en maximaal één of twee krachtige woorden of een slogan. Niet meer.

De banner is geen flyer, geen menu en zeker geen curriculum vitae. Denk aan hoe merken als Apple, Nike of Spotify hun banners gebruiken. Apple houdt het minimalistisch met productfoto's op een schone achtergrond. Nike gebruikt krachtige beelden met een duidelijke call-to-action.

Spotify combineert hun groene huisstijl met pakkende tekst. Het werkt omdat het consistent is met hun totale merkidentiteit.

Een praktische tip: maak je banner aan in het dubbele formaat (retina-kwaliteit) en exporteer als PNG voor scherpte of JPEG voor foto's.

Houd het bestand onder de 8 megabyte, want veel platforms comprimeren hard en dan verlies je kwaliteit dubbel.

Het samenspel: waarom samenhang ertoe doet

Hier wordt het echt interessant. Je favicon, profielfoto en banner zijn los gezien al belangrijk.

Maar samen vormen ze een visueel ecosysteem dat je merk herkenbaar, betrouwbaar en professioneel maakt.

Stel: iemand ziet je banner op LinkedIn, klikt door naar je website, en ziet dezelfde kleuren en stijl terug in je favicon. Dan opent hij je Instagram en herkent hij je direct aan je profielfoto. Dat is merksterkte. Niet omdat elk element op zichzelf perfect is, maar omdat ze samen één coherent verhaal vertellen.

Begin met je merkidentiteit. Kies je kleuren, je lettertype, je toon. Pas dat vervolgens consequent toe op elk element, van het kleinste icoontje tot de grootste banner. Maak een stijlgids, hoe klein ook.

Zelfs een A4'tje met daarop je kleuren, logo-varianten en richtlijnen voor beeldgebruik maakt een wereld van verschil.

Want uiteindelijk gaat het niet om pixels en bestandsformaten. Het gaat om vertrouwen. En vertrouwen bouw je op met consistentie, professionaliteit en aandacht voor details die anderen over het hoofd zien.


Lotte van Dijk
Lotte van Dijk
Expert in Duurzaam Visueel Ontwerp

Lotte helpt merken met een krachtige visuele identiteit en duurzaam design.

Meer over Digitale merkidentiteit

Bekijk alle 44 artikelen in deze categorie.

Naar categorie →
Lees volgende
Hoe je merkidentiteit consequent toepast op je website als productmerk
Lees verder →