Een favicon maken & toevoegen aan je WordPress website

Een favicon maken & toevoegen aan je WordPress website

Had je er al weleens van gehoord? Van een favicon? Gekke naam eigenlijk hè? Het is een samentreksel van de woorden ‘favorite’ en ‘icon’. Favicon dus… Je hebt hem al wel vaak gezien. Het is namelijk dat kleine icoontje dat je links in een browser tabblad ziet staan als je een webpagina opent. Je ziet ze ook staan in je favorietenlijst of op de voorpagina van je browser.

Een favicon zorgt voor herkenbaarheid en professionaliteit. Als je hem niet in je WordPress website hebt staan, dan laat hij in het tabblad het icoontje van WordPress zien. En dát wil je natuurlijk niet. In dit artikel leg ik je uit hoe je een favicon maakt en waar je hem importeert in je website.

YouTube

Ben jij meer een kijker & luisteraar dan een lezer? Je kunt deze tutorial ook bekijken op mijn YouTube kanaal.

Wat zijn de specificaties van een favicon?

Een favicon is een afbeelding met een grootte van 512 bij 512 pixels. Het bestandsformaat dat hiervoor gebruikt kan worden is .jpg, .png en .gif. Meestal wordt voor een favicon het beeldmerk van je logo gebruikt. Omdat je beperkt bent met de ruimte, het een vierkant betreft èn omdat een favicon maar heel klein vertoont wordt, is het vaak niet mogelijk, om je hele logo te gebruiken. Mijn eigen logo is bijvoorbeeld liggend en onmogelijk om in een vierkant te krijgen. De Q in mijn logo springt eruit door de afwijkende kleur en grootte en was daarom een logische keuze om die als favicon te gebruiken.

Hoe maak je een favicon?

Een favicon maak je in een programma waar je in ieder geval een fotobestand kunt maken van 512×512 pixels, zoals een fotobewerkingsprogramma.

Programma’s die je zou kunnen gebruiken zijn:

Adobe Photoshop
Photoshop is een fotobewerkingsprogramma waar je zeer uitgebreide fotobewerkingen mee kunt doen. Het wordt veel gebruikt in de creatieve sector door bijvoorbeeld fotografen, grafisch vormgevers, dtp-ers, (web)designers en illustratoren. Photoshop is onderdeel van de Adobe Creative Cloud en je betaalt hiervoor met een jaar- of maandlidmaatschap. Een lidmaatschap is niet goedkoop; de prijzen gaan vanaf ongeveer €30,- per maand.

Affinity Photo
Een supergoed alternatief voor Photoshop is Affinity Photo.. De mogelijkheden zijn net zo uitgebreid maar de prijs ligt echt een flink stuk lager (€54,99 éénmalig). Dit programma is absoluut een aanrader voor als je je wat meer wil bekwamen in fotobewerking. Zelf ben ik onlangs overgestapt na jarenlang Adobe en ik ben er erg over te spreken.

Ze hebben overigens ook Affinity Designer (alternatief voor Adobe Illustrator en Affinity Publisher (alternatief voor Adobe Indesign).

Meer info vind je op de website van Affinity.

Favicon maken in Canva

Een favicon kan ook gemaakt worden in de zo’n-beetje-alleskunner Canva.

Favivon maken in Canva
  • Maak een nieuw document aan van 512x512px
  • Upload de afbeelding die je wil gebruiken of ontwerp zelf een favicon met bijv. elementen.
  • Download je afbeelding als .png. Let op! Met de gratis versie van Canva kun je je afbeelding niet downloaden met een transparante achtergrond, die wordt dus wit. Met Canva Premium is dit wel mogelijk.
  • Comprimeer je bestand met tinypng.com om hem wat kleiner (minder zwaar) te maken.

Waar plaats je een favicon in WordPress?

Om je favicon in je WordPress website te plaatsen log je in en ga je naar je dashboard.

  • Kies voor Weergave > Customizer
  • Ga naar Algemene Instellingen
  • Kies voor Site Identiteit
  • Onderaan zie je dan ‘Site pictogram’ staan
  • Kies voor ‘Site pictogram selecteren’
  • Laad je afbeelding in via de Mediatheek
  • Klik vervolgens bovenin de Customizer op ‘Publiceren’

Gefeliciteerd! Je hebt zojuist je favicon in je website gezet. Bovenin de browsertab zie je het resulltaat.

Zeg eens… Wist jij al wat een favicon was?

0 reacties

Een reactie versturen

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

Verder lezen?

5 belangrijke plugins voor je WordPress website

Een belangrijke reden dat WordPress zo flexibel is, is de enorme keuze uit diverse plugins. Heel kort gezegd is een plugin een pakketje code dat je toe kunt voegen aan je WordPress installatie, zodat je extra functionaliteiten krijgt. Klinkt een beetje eng misschien,...

Waarom het opbouwen van een mailinglijst zo belangrijk is

Veel ondernemers realiseren zich niet hoe belangrijk het opbouwen van een mailinglijst is als ze beginnen met hun bedrijf. Meestal ga je er pas over denken als je al een tijdje bezig bent en ziet hoeveel impact het bij anderen heeft op de groei van hun bedrijf. In dit...

De 3 populairste Page Builders voor WordPress

Als je zelf een WordPress website wil maken en niets van code weet, dan is het gebruik van een Page Builder om je website vorm te geven een goede oplossing. Zelf maak ik ook gebruik van een Page Builder om mijn websites te maken en wel de DIVI Visual Builder. De...

Laposta of Mailchimp: welke kies jij om gratis nieuwsbrieven te versturen?

Laposta of Mailchimp? That's the question.. Al eerder schreef ik over het belang van het opbouwen van een e-maillijst. Met een e-maillijst heb je toegang tot contacten die zich zelf ingeschreven hebben op jouw lijst. Ze zijn al nieuwsgierig naar je bedrijf en de...

Maak een plan voor je website, dan ga je zeker goed van start!

Voordat je begint met het maken of laten maken van een website is het belangrijk dat je een goed plan hebt, een goede fundering waarop je website gebouwd kan worden. Als je al een website hebt en deze nog niet zo succesvol is als je gehoopt had, is het aan te raden om...

De veranderingen van Mailchimp en de gevolgen voor je gratis account

Mailchimp heeft besloten om per 15 mei 2019 veranderingen aan te brengen in de abonnementen. Dit heeft voornamelijk voor de gratis versie best wel wat consequenties. Toen ik startte met mijn bedrijf heb ik voor het opbouwen van mijn e-maillijst en het versturen van...

Welke bestandsformaten voor afbeeldingen zijn er, en hoe gebruik je ze op je website?

Zie je ze weleens voorbij komen? JPG, PDF, PNG, GIF, EPS, AI, TIFF, PSD? Allemaal verschillende bestandsformaten voor afbeeldingen. Wat de verschillen zijn en hoe je ze gebruikt lees je hieronder. (Er zijn ook nog andere bestandstypen, maar dit zijn de meest...

Zo werk je aan een succesvolle website! 15+ acties waar je direct mee kan starten

Als je ondernemer bent wil je uiteraard een succesvolle website! Een website die veel bezoekers trekt en die van deze bezoekers vervolgens klanten of leads kan maken. Om dit voor elkaar te krijgen zul je regelmatig tijd moeten besteden aan het nóg beter maken van je...

Tips voor een goed gebruik van afbeeldingen op je website

Een goed gebruik van afbeeldingen op je website is belangrijk. In "Goede foto’s zijn belangrijk; ze maken je website" vertel ik over het belang van plaatsen van goede foto's. Maar als je dan de goede foto's hebt gevonden, dan is het ook nog belangrijk hoe je ze op je...

Blogpost publiceren? Loop hem nog even na met deze checklist

Als je een blogpost geschreven hebt en de afbeeldingen geplaatst zijn, is het tijd om op ”publiceren” te drukken. Zelf voel ik dan altijd nog een lichte aarzeling. Is het nu echt wel goed zo? Is dit voor jou herkenbaar? Voor mezelf heb ik inmiddels een handige...

7 Stappen Voor Een Goede Voorbereiding Van Je Website

Schrijf je in om waardevolle tips & inspiratie te ontvangen. Je krijgt van mij de 7 stappen voor een goede voorbereiding cadeau!

7 stappen voor een goede voorbereiding van je website