Wat is een favicon

Een favicon is niets meer dan een 16×16-pixel pictogram in een speciaal bestand met een .ico extensie, je kunt dus niet zomaar gebruik maken van een bestaande jpg-afbeelding. Favicons helpen gebruikers te identificeren op welke website ze zijn. Ze worden door vrijwel alle moderne browsers ondesteund en vaak gebruikt door andere diensten, zoals RSS-lezers en bladwijzertoepassingen.

Je vindt ze op de volgende plaatsen:

  • tabbladen van de browser
  • bookmarks
  • favorieten
  • geschiedenis

Is het gebruik van een favicon absoluut noodzakelijk?

Natuurlijk is het niet essentiëel, maar het opnemen ervan in jouw ontwerp is één van de details in een lange weg naar het verbeteren van de algehele kwaliteit van een website. Het maakt, dat je site er beter en professioneler uitziet en kan het aantal bezoekers naar je site wat verbeteren. Dus, gebruik een favicon.

Wat doe het voor jouw site?

Hoewel een favicon het verkeer naar je website niet drastisch zal veranderen heeft het wel een positief effect op de uitstraling van die site. Het toevoegen van een uniek pictogram zorgt ervoor dat een bezoeker jouw site in een bookmark-lijst gemakkelijker kan vinden. Als je naar een webpagina kijkt, valt je oog het eerst op de afbeeldingen, daarna pas op de teksten eromheen.

Ook goed voor bezoekers

Het heeft ook een voordeel voor je bezoekers. De favicon is er niet alleen voor de show. Het heeft een subtiele, maar belangrijke, functie in het opbouwen van een identiteit op het internet. Als een bezoeker het op je website ziet, geeft dit een gevoel van herkenning en een aanwijzing, dat ze hier op de juiste plaats zijn. Zie het als een soort geruststelling. Dit symbool identificeert hij dan met een specifieke site. Een goed ontworpen favicon trekt de aandacht en maakt het waarschijnlijker dat hij op die koppeling in plaats van op de andere neutrale link zonder favicon klikt.

Een favicon maken

Favicons zijn 16×16 tot 256×256 pixels in afmeting. Bij het ontwerpen van een favicon kies je eenvoudige afbeeldingen of letters. Je kunt je voorstellen dat het vrij moeilijk is om in zo’n kleine ruimte een complexe afbeelding te krijgen. Zorg ervoor dat de kleur van de favicon een afspiegeling is van de kleur van je website, zodat lezer in staat is om het pictogram te associëren met die site. Je wilt er zeker van zijn dat wanneer je er één maakt, hij ook goed herkenbaar is. Dit is de reden waarom veel favicons het logo van het bedrijf zijn.

Een logo omzetten

Je kunt het ontwerp van je eigen logo gebruiken en die vervolgens via een website de laten omzetten in een favicon. Op de volgende sites kun je hiervoor terecht:

Maken met Photoshop

Je kunt met Adobe Photoshop ook zelf een favicon maken. Photoshop kan normaal het .ico formaat niet bewerken, maar wel als je een plugin installeert.

  1. download the plugin bijvoorbeeld op http://www.telegraphics.com.au/sw/
  2. je krijgt een file IcoFormat.8BI (de naam kan iets afwijken)
  3. kopiëer die file naar de directory “\Plug-ins\File Formats” onder de installatie-directory van Photoshop

Nadat je de plugin hebt geïnstalleerd kun je het best een canvas van 64×64-pixels gebruiken, 16×16 is in de praktijk te klein om mee te werken, en het ontwerp maken.

Als het ontwerp klaar is, moet je nog het formaat wijzigen. Ga naar het Image Size-menu en klik op “Resample Image” of “Nieuwe beeldpixels berekenen”. Dit proces zorgt ervoor dat het beeld minder zal vervagen als je het verkleint. Tenslotte sla je de file op als een 16×16-pixel “Windows.ico” of “favicon.ico”.

Het uploaden van de favicon

Zodra de favicon klaar is, moet je het bestand uploaden naar je site. Zet het in de root directory, dat is de map waar de index-bestand zich bevindt. Bij sommige systemen, zoals Joomla en WordPress wordt het meestal in de template- of themadirectory gezet.

Het wijzigen van uw header

De laatste stap is de header aan te passen, dat is de code die staat tussen de <head> en </head> tags. Voeg hier de volgende regel toe:
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
Merk op dat deze code alleen werkt als de favicon.ico in de root directory gezet is. Bij WordPress vind je <head> en </head> tags in het “header.php” bestand, bij Joomla in de template directory in index.php.

Testen

Alles staat nu op zijn plaats, open je browser en ga naar je website om te controleren of de favicon wordt weergegeven. Bookmark de site en open een paar tabs om te zien hoe het pictogram eruit ziet, als het je niet bevalt begin je gewoon opnieuw.

Geef een reactie

Het e-mailadres wordt niet gepubliceerd.

Je mag deze HTML tags en attributen gebruiken:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Meer artikelen over 'usability'

Zelf moeten zoeken

Vervelend Het is vervelend, als je na een goede zoekopdracht bij een zoekmachine, niet op de juiste plaats aankomt. Een voorbeeld: Ik zoek de LP “Help” van the Beatles. Ik zoek bij een zoekmachine, die me verwijst naar mediagigant.com. Daar kom ik op de homepagina in een keuzemenu: Boeken | Muziek | Films LP’s | […]
Lees verder

Layout tabellen niet gebruiken

Geen layout tabellen gebruiken Maak de layout op de juiste manier In het begin van het internet tijdperk was het onmogelijk om eenvoudig een layout voor een pagina te maken. Een aantal jaren later ontdekte iemand, dat je met html tables eenvoudig een blokstructuur kunt maken. Er werd gretig gebruik van layout tabellen gemaakt, je […]
Lees verder

De homepagina heet ‘Home’

Standaards, we zijn eraan gewend Gebruik de naam ‘Home’ voor de homepagina, niet ‘Start’, ‘Begin’ of iets dergelijks. Bezoekers zijn dit zo gewend en het kan verwarring veroorzaken. Niet iedereen komt via de homepagina op jouw site. Zorg er ook voor dat de knop ‘Home’ verwijst naar www.voorbeeld.com/ en niet naar www.voorbeeld.com/home. Het lijkt dan […]
Lees verder

Heb je een splash- of intropagina

Laat de show beginnen Splash- of intropagina’s zijn slecht. Je toont ze aan gebruikers, die al op een link hebben geklikt en al hebben gekozen om jouw site te bezoeken. Ze hoeven niet te worden getracteerd op een mooi beeld dat hen alleen maar vertelt: “Klik hier om verder te gaan!” en zij zullen het […]
Lees verder

Gebruik geen paginavullers

Wat zijn paginavullers Soms zie je op websites informatie die niet erg relevant is. Dat kan gaan om nieuws-items, een klok, weerrapporten, beurskoersen en dergelijke. Dit zijn paginavullers, ze leiden de aandacht af van de eigenlijke inhoud. Dan zegt men, dat de bezoeker die informatie wel interessant zal vinden. Als ik nieuws wil, ga ik […]
Lees verder

Foto formaat

Kies voor foto’s het juiste formaat Er worden veel foto’s op websites geplaatst. Ze worden alleen niet altijd op het juiste formaat aangemaakt. Je ziet vaak foto’s, die zo van een digitale camera worden gecopiëerd op een formaat van bijvoorbeeld 3360×1600 pixels en vervolgens staat in de html width="168" height="80". De foto ziet er goed […]
Lees verder

Een website met maar één pagina

Scrollende websites Soms zie je een websites met met maar één pagina. Die pagina is veel groter dan op een normaal scherm past en bevat de hele website. Als je een menukeuze maakt, scrolt de site zichtbaar in de breedte of hoogte, wat de nieuwe pagina zichtbaar maakt. Technisch is dit meestal best goed uitgevoerd, […]
Lees verder

Contactformulier te uitgebreid

Vraag minder, krijg meer Op veel websites is het contactformulier te uitgebreid. Sommige van die formulieren bevatten erg veel onnodige vragen en een hoop zijn er “verplicht”. Een contact­formulier is een medium om een snelle vraag aan de onderneming te stellen. Hiervoor is eigenlijk alleen een emailadres nodig en een veld, waar je de vraag […]
Lees verder

Bezoekerstellers geven inzicht

Tellen van bezoekers Het bijhouden van het aantal unieke bezoekers en bekeken pagina’s geeft een goed inzicht in het gebruik van de website. Je kunt hiermee behalve het aantal bezoekers ook bepalen, welke weg die bezoeker door de website aflegt. Met de informatie van de bezoekerstellers kun je de structuur van de site zonodig aanpassen. […]
Lees verder

Over mij, begin er niet mee

Het gaat niet ‘over mij’ Vaak zie je op sites op de homepagina of bij de 2e menuknop ‘Over mij’. Ik zie dat liever later in het menu, bijvoorbeeld net vóór ‘Contact’. Waar gaat het de klant om? De bezoeker geeft vermoedelijk geen klap om wie jij bent. Hij wil weten, of jouw product of […]
Lees verder

Mystery Meat

Wat is mystery meat Mystery meat is een soort vlees, waarvan de oorsprong niet duidelijk is. Het is met het oog niet te herkennen. Als je ervan proeft, weet je misschien wel wat het is, misschien ook niet. Zou jij het risico aandurven? Ook op websites Op websites vind je een soortgelijk verschijnsel. Er staat […]
Lees verder

Test ook op een andere computer en browser

Browsers en computersystemen Niet alle browsers en computersystemen tonen een website op dezelfde manier. Dit geldt zeker voor speciale functies. Het is belangrijk om te weten, hoe jouw site er op de verschillende systemen uitziet, zeker als je veel (nieuwe) functies gebruikt. Met name als je website is gemaakt met programma’s als Microsoft Front Page […]
Lees verder

Kun je meteen zien wat jij doet

Wees duidelijk Als iemand op jouw site komt, is het hem dan meteen duidelijk op welke site hij is en wat jouw business is. En natuurlijk zonder te hoeven scrollen. Dit is vooral belangrijk bij sites als “Jansen b.v.” Gebruik hier een tag-line, die bijvoorbeeld zegt “Herenmode” of “Freelance secretaresse”. Wees hierin zo duidelijk mogelijk, […]
Lees verder

Is het belangrijkste zonder scrollen zichtbaar

Waar gaat het om Veel sites, vooral de CMS-sites, hebben een standaard layout. We zien van boven naar beneden een lege ruimte van één centimeter, de naam van de site, een enorm grote bannerfoto en een menu. Dit alles neemt op mijn laptop samen 9 van de beschikbare 15 cm in beslag. Dat is 60% […]
Lees verder

Welkom, zijn we dat ook op jouw site?

Welkom? Verspil geen ruimte! Op veel sites kom je nog steeds de kreet “Welkom op onze site” tegen, dit is verspilde ruimte. Ik weet al, dat ik op “onze site” ben, ik heb daar zelf voor gekozen. Ook heb ik nog nooit een site gezien, waar stond, dat ik niet welkom was. “Kijk rustig even […]
Lees verder

Vraag kritiek op jouw website

Maak duidelijk wat je wilt Als je de testgebruikers om kritiek vraagt, zijn de meesten geneigd om aardige dingen te zeggen. De meeste mensen zijn aardig en willen niets negatiefs over je werk zeggen. Als je een persoonlijke relatie met de testers hebt en ze weten dat je hard aan dit project hebt gewerkt, geven […]
Lees verder