Het logo • Favicon en Twibbon, wat zijn het en wat heb je eraan?
De favicon, Twibbon en de avatar (profielfoto) lijken momenteel de kleinste – en tegelijk ook de zwaarstwegende – eisen gesteld aan het logo. Als het logo hierop niet blijft staan of overeind blijft, dan is het terug naar start en dus terug naar de tekentafel.
Maar wat zijn de favicon en Twibbon nou precies en hoe kom je eraan? Een mooiere bestemming voor het uitstapje van vandaag kunnen wij ons niet bedenken. Stap je weer in?
Dit blogartikel hoort niet alleen bij ‘Het logo • Wel of geen logo? … óf liever iets dat meer van deze tijd is?’, maar ook bij de hele serie ‘Zomer van het Logo en de Huisstijl”. Het kan slim zijn om dit artikel of deze serie eerst te lezen, maar waar nodig verwijzen we sowieso met handige linkjes naar specifieke informatie in die artikelen.
Wat staat er vandaag op het reisprogramma?
De ‘Zomer van het Logo en de Huisstijl’ is een luchtige én fascinerende serie die jou deze zomer meeneemt op een reis door de boeiende wereld van visuele merkidentiteiten. We reizen via (nieuwe) inspirerende inzichten, komen langs praktische tips en delen ook nog mooie reisverhalen.
Na een uitgebreid bezoek aan Huisstijl belandden we op het wereldberoemde Logo. Daar bekeken we onder meer Beeldmerk, Woordmerk, Geschiedenis van Logo en de keuze voor wel of geen Logo. We bezochten Walt Disney, Informatie-overload, Restyling, Refresh en Redesign en waren enorm onder de indruk van Brand Signature.
Vandaag gaan we dus richting Favicon en Twibbon. Hop on!!!
Excursie of uitstapje gemist?
Dan vind je alle verslagen hier.
Of ga naar het overzicht van alle blogartikelen over branding. Als wij je op de hoogte mogen houden van nieuwe artikelen over branding en gerelateerde onderwerpen, meld je dan direct even aan voor de gratis e‑mailalert. Klik hier.
Wat is een…
Favicon
Een favicon is een belangrijk onderdeel van de branding én een onmisbaar onderdeel van een website. Het is bedoeld om het merk van de website in de (web)browser eenvoudig te herkennen tussen de merken van andere websites. Het is een zeer klein én zeer krachtig herkenningsteken.
Dankzij de favicon zie je bijvoorbeeld vrij snel welk tabblad bij welke website hoort. Kijk hierboven maar. Je ziet ons logo links in de tab.
Wat maakt een favicon tot een favicon?
De favicon is een heel klein icoontje dat kenmerkend, herkenbaar en onthoudbaar is. Het is bijna altijd gerelateerd aan het merk en kan zijn een…
- logo;
- heel herkenbaar deel van het logo;
- pictogram;
- symbool;
- embleem;
- ander beeld dat een heldere relatie met het merk heeft;
- et cetera.
Belangrijk hierbij te vermelden is, is dat hiervoor geen vaste regels of standaarden gelden. Wanneer de ‘web-protocollen’ worden gevolgd dan zijn de genoemde voorbeelden wel vaak de ‘slimsten’ om in te zetten om snel te zien bij welk merk de webpagina – tussen alle andere geopende of opgeslagen webpagina’s – behoort.
Wij weten dat je woorden als web-protocollen ook aan elkaar mag schrijven, maar doen dat ‘online’ om 2 weloverwogen redenen niet. Lees meer.
Wat bedoelen wij met web-protocol?
Hiermee bedoelen wij een soort van onderlinge ‘gebruiks-vriendelijkheid-overeenkomst’ of ‘stilzwijgend gemaakte afspraken’ voor het moeiteloos gebruikmaken van het web. Het is de norm waaraan websites en apps moeten voldoen om te voldoen aan de meest voor de hand liggende verwachtingen.
Na ruim 25 jaar internet, verwachten mensen nou eenmaal zaken op bepaalde plekken aan te treffen. Zo niet, dan raken mensen verward en zelfs gefrustreerd. Bad for business!
Om verwarring te voorkomen, is het volgen van de normen voor het web nogal belangrijk.
Zo verwacht men bijvoorbeeld dat het logo linksbovenaan op de website staat. Dat deze klikbaar is en ons zo naar homepagina leidt. Staat het logo er niet of werkt het niet, dan raken mensen de weg kwijt. Nu zal dat bij de favicon niet zo’n vaart lopen, maar mensen verwachten wel van een (web)browser dat die werkt zoals zij verwachten.
En aangezien alle browsers zoveel mogelijk gebruikers willen, moeten ze allemaal scoren op gebruiksvriendelijkheid en dus zorgen dat ze niet te veel afwijken van de rest en de algemene normen voor gebruik. De meeste browsers tonen daarom de favicon op de plekken die we hierboven noemden.
Waar zie je de favicon en wat heb je eraan?
De favicon wordt tegenwoordig in vrijwel iedere browser weergegeven in de balk (bovenaan) en staat dan links in het tabje. Vroeger stond de favicon bijna overal links van de URL, maar daar staat nu steeds vaker een veiligheidsicoontje.
Dit verschilt per browser, want ook hiervoor is geen standaard. Er is wel een soort van web-protocol. Zie bovenstaande box.
Daarnaast kenmerkt de favicon de opgeslagen ‘favoriete’ pagina’s in je browser en de pagina’s in de geschiedenis van je browser.
Naam
De term ‘favicon’ is afgeleid van ‘favorite icon’. De favicon was namelijk oorspronkelijk bedoeld om de favorieten in de lijst in de (web)browser visueel sneller doorzoekbaar te maken. Daar zijn in de loop der tijd dus functies bij gekomen.
Formaat en bestandstype
Een favicon wordt meestal gemaakt door het bureau dat het logo ontwerpt. Het is doorgaans vierkant en kan worden gebruikt in en worden getoond op verschillende kleine formaten. Het kleinste formaat waarop deze veel wordt getoond is 16 x 16 pixels, maar je kunt doorgaans tot 64 x 64 pixels gebruiken.
Uiteindelijk bepaalt de browser hoe groot – of beter: hoe klein – de favicon wordt getoond en waar deze wordt getoond.
Diverse bestandstypen zijn geschikt, maar het meestvoorkomend zijn:
- .ico;
- .jpg;
- .png;
- .gif.
Vanwege de maximale compatibiliteit was het aan te raden de favicon op te slaan in het ICO-bestandsformaat. Je hebt dan de beste weergave in verschillende webbrowsers.
Steeds vaker wordt het bestandsformaat automatisch in het Content Management Systeem (CMS) gegenereerd. Je kunt dan bijvoorbeeld een .jpg uploaden en de rest gaat vanzelf.
Iedere developer weet sowieso waar hij het bestand moet plaatsen en in WordPress kun je het vaak uploaden in de customizer (zie de volgende box). Ook daarin zit een tool waarmee het bestand automatisch wordt omgezet naar het ICO-bestandsformaat.
Toch is het beter om dit handmatig te doen. Je hebt dan meer grip op een consistente weergave in alle webbrowsers. Er zijn online tools beschikbaar waarmee je een .jpg, .png en .gif kunt converteren naar .ico. Een van de bekendste is: favicon-generator.org.
Hoe plaats je de favicon in WordPress?
Om een favicon te uploaden in WordPress, volg je de volgende stappen. Om onderstaande stappen te kunnen uitvoeren, moet je doorgaans wel de rol van ‘beheerder’ of ‘redacteur’ hebben. Als je een andere rol hebt, zie je deze optie waarschijnlijk (geheel) niet. De beheerder zou je uit de brand moeten kunnen helpen.
- Ga naar het WordPress-dashboard.
- Klik op ‘Weergave’ in het linkermenu.
- Klik op ‘Customizer’.
- Klik op ‘Site-identiteit’, ‘Site-titel en favicon’ of iets dat daarop lijkt.
- Scroll naar beneden en zoek het onderdeel ‘Site-pictogram’.
- Klik op ‘Afbeelding selecteren’ en volg de stappen.
- Sla je wijzigingen op. Opslaan gebeurt vaak met de button ‘Publiceren’ bovenin de Customizer.
Wat is een…
Twibbon
Als we het volgende over de Twibbon schrijven, weet je misschien direct al wat het is. Een Twibbon ligt over je profielfoto (avatar) op social media en wordt gebruikt om steun te betuigen aan een bepaalde zaak, campagne, merk, persoon of politieke organisatie als een liefdadigheidsinstelling.
Wat maakt een Twibbon tot een Twibbon?
Ook de Twibbon is een heel klein icoontje dat kenmerkend, herkenbaar en onthoudbaar is. Dit icoontje wordt gebruikt als overlay bovenop de profielfoto op de social-media-platformen. Het is bijna altijd gerelateerd aan het doel waarvoor het staat.
De Twibbon kan zijn een…
- vlag;
- pictogram;
- symbool;
- embleem;
- logo;
- deel van het logo;
- ander beeld dat een zeer heldere relatie met het doel heeft.
Naam
De term is afgeleid van de woorden ‘Twitter’ en ‘ribbon’.
Wat is het doel van de Twibbon?
Door met een Twibbon je steun te betuigen, worden je social-media-contacten aangemoedigd hetzelfde te doen. Je deelt zo steeds dezelfde boodschap en die boodschap komt op deze manier gemiddeld veel vaker in zicht dan via een gewone post. Zo hoop je samen de wereld voor elkaar weer wat beter of leuker te maken.
De Twibbon kan dus ook helpen om bewustzijn te creëren rondom de eerder genoemde zaken. Het is dus niet zomaar een overlay, maar staat vooral voor saamhorigheid en een community die zich inzet voor een bepaald doel. Eendracht maakt macht.
Hoe kom je eraan?
Met je profielfoto en een online tool als een Twibbon-app, is de Twibbon vaak simpel te vervaardigen en vervangt desgewenst gelijk de profielfoto. Wat de tool precies doet, verschilt uiteraard per tool en per toestemming. Vaak kun je via social media een link volgen en kom je vanzelf bij de tool.
Formaat en bestandstype
Het formaat van een Twibbon-overlay varieert. Het is afhankelijk van het platform en de grootte van de profielfoto. Doorgaans kun je uitgaan van 400 x 400 pixels, maar het moet wel goed zichtbaar blijven zo gauw als de profielfoto krimpt naar het kleinste formaat; soms kleiner dan de nagel van je pink.
Het contrast met de vaak kleurrijke profielfoto speelt voor de zichtbaarheid van de Twibbon dan ook een rol. Het bestandstype moet doorgaans .png zijn.
Onze toekomstplannen
In volgende blogartikelen in deze luchtige én fascinerende serie van de ‘Zomer van het Logo en de Huisstijl’ nemen we je verder mee op reis. We reizen steeds verder door de boeiende wereld van visuele identiteiten.
Dompel jezelf deze zomer onder in een zee van creativiteit en zet het merk in het zonnetje!
Inmiddels zijn we wel alweer dik over de helft, maar gelukkig nog lang niet uitgekeken in en rondom het wereldberoemde Logo. We gaan nog op zoek naar de 10 sleutels tot succes van een goed Logo (of Woordmerk), helpen je met de briefing en komen natuurlijk ook nog langs voldoende Inspiratie. We bekijken zelfs nog het statige Typografie en het speelse Witruimte.
Zorg ervoor dat je dit niet mist!!!
Excursie of uitstapje gemist? Of verder inzoomen?
Dan vind je het overzicht met alle verslagen hier.
Hoe zorg je dat je verder niets meer mist?
Wil je deze en andere blogartikelen om van het merk, de website en/of de app een succes te maken niet missen? Dan is het geen slecht idee om je onderaan – voorbij de volgende box – even aan te melden voor de gratis e‑mailalert. Tenminste, als je dat nóg niet gedaan hebt. Je ontvangt dan van ons een melding wanneer er een nieuw artikel online staat.
Zo mis je niets en zien we jou hier binnenkort weer terug. Tot gauw!
Wij helpen met logo’s én andere merkelementen
Je hebt een logo of een krachtig merkelement als brand signature of een twibbon nodig? Dat kan. the Content Care Company biedt logo’s, logo’s én… andere aantrekkelijke merkelementen. Maar ook voor een restyling, refresh of redesign van het logo kun je bij ons terecht, want een groot deel van onze roots liggen nog steeds in de grafische wereld en in de wereld van merken bouwen (branding).
Per merk verschilt wel onze aanpak. Wil je snel resultaat voor weinig geld? Dan kan dat. Wil je liever een logo of krachtig merkelement als onderdeel van de merkwereld en die dus geheel aansluit bij de corporate identity? Dan kan dat ook. Het resultaat is afhankelijk van de wensen, de doelen, de doelgroep(en) én natuurlijk van het budget. Wat het ook wordt, wij gaan altijd voor het beste resultaat.
Je kunt ons bereiken via: [nummer opgeheven].
Huisstijl in een dag
Wil of moet je lager inzetten? Kijk dan eens bij Dagje Huisstijl. In een dag maken we samen met jou het logo (of het beeldmerk) en pakken we ook nog andere zaken op. We werken zelfs jouw eigen ideeën uit. Je gaat nooit met lege handen naar huis.
Over de auteur
Nancy Moorman
Nancy Moorman noemt zichzelf het liefst ‘gewoon’ contentmaker of merkenbouwer, maar dit dekt niet de lading van wat ze onze klanten biedt. Ze zit al jaren in het vak en is door haar karakter zeer breed onderlegd en altijd even toegewijd. Nancy begon ooit als werktekenaar, maar schoolde al snel bij tot copywriter.
Daarna deed de Mac zijn intrede in de grafische wereld en Nancy verkende als een van de eersten de mogelijkheden. Dat doet ze eigenlijk met alles. Voor onze klanten kijkt ze ook altijd naar de beste oplossingen en is daarbij dus niet wars van innovaties. Geen detail verliest ze uit het oog en… wat beter kan, kan beter!
Mis nooit meer een artikel met onze gratis e‑mailalert
Wil jij op de hoogte blijven van het laatste nieuws, de trends, tips en andere interessante informatie op het gebied van branding, content-marketing, zakelijk bloggen, conversie-optimalisatie, SEO en alles daaromheen? Meld je dan direct even aan voor onze gratis e‑mailalert.
Ook wij gaan vertrouwelijk om met persoonsgegevens.
