10 gratis tips voor afbeeldingen op een website

10 gratis tips voor afbeeldingen op een website
3
apr

Afbeeldingen zijn heel belangrijk voor websites. Niet alleen maken ze een tekst vaak duidelijker en prettiger leesbaar, ook zorgen afbeeldingen voor een betere vindbaarheid van uw website, mits goed toegepast. Omdat we veel met afbeeldingen werken hebben we hieronder de 10 beste tips genoteerd waarmee u rekening kunt houden.

Vind u dit artikel interessant of heeft u goede suggesties of opmerkingen? We zien uw reactie graag tegemoet onderaan, en we stellen het op prijs als u dit artikel deelt wanneer u het interessant vind!

De onderwerpen die hieronder zijn toegelicht zijn:

  1. Grootte van de afbeeldingen (laadtijd)
  2. Naam (SEO)
  3. Alt tags (SEO)
  4. Het type (jpg – png)
  5. Locatie (uitlijnen tov tekst)
  6. Copyright
  7. Stock afbeeldingen
  8. Zelf afbeeldingen maken met Canva
  9. Uitgelichte afbeeldingen
  10. Meerdere afbeeldingen gebruiken

 

Tip 1: grootte van de afbeeldingen

Afbeeldingen vergroten / verkleinenDe grootte van een afbeelding is erg belangrijk voor uw website. Uiteraard wilt u dat de bezoeker uw afbeelding goed kan zien. De afbeelding moet dus niet te klein zijn, maar ook zeker niet te groot. Grote afbeeldingen zorgen namelijk voor een langere laadtijd van uw website. Dit is nadelig voor de waardering door Google en dus de vindbaarheid van uw website. Ook duurt het langer voordat uw bezoeker de volledige inhoud ziet en dit is vervelend.

Binnen WordPress (het CMS waar wij veel mee werken) worden afbeeldingen automatisch in diverse grootten opgeslagen in uw website, zodat u kunt kiezen welk formaat u wilt gebruiken. Ook kunt u zelf de afbeelding schalen en bijwerken, zodat u volledige controle heeft. Het is echter wel aan te bevelen om de afbeelding niet te groot te maken voordat u ze upload. Dit kost u extra tijd voor het uploaden en extra ruimte op uw webhosting. Wij gebruiken zelf XnView onder andere om afbeeldingen te verkleinen. XnView bied ook de mogelijkheid om in 1 keer heel veel afbeeldingen te verkleinen. XnView is gratis voor particulieren.

Het is met WordPress ook mogelijk om kleine afbeeldingen te linken naar de grote afbeelding en ze te laten openen in een zogenaamde ‘lightbox’. Hiermee wordt de afbeelding groot weergegeven maar kan men makkelijk weer terug naar de website. Een voorbeeld van een gratis plugin die dit goed regelt is Responsive Lightbox.

Tip 2: de naam van de afbeeldingen

Afbeeldingen hernoemenCamera’s slaan een naam vaak in een bepaald formaat op. Dit kan bijvoorbeeld zijn “IMG0001” etc. Dit is geen duidelijke naam voor een afbeelding. U herkent de afbeelding op deze manier niet en kunt ook niet gevonden worden op deze naam. U kunt daarom beter een duidelijke naam aan de afbeelding geven waarin u ook woorden plaatst waarop u gevonden wilt worden in zoekmachines.

Binnen WordPress wordt de naam van de afbeelding automatisch overgenomen in de titel. U kunt de zoekwoorden vervolgens ook in de alt tags van uw afbeeling verwerken, hierover meer bij de volgende tip.

Tot slot worden titels (namen) van de afbeelding vaak weergegeven in uw website. Daarmee ziet ook uw bezoeker ze. Belangrijk dus dat deze goed staat. Mocht u veel foto’s hebben dan bestaan er programma’s waarmee u in 1 keer veel bestanden in een bepaald formaat kunt hernoemen.

Tip 3: Alt-tags

Alt-tags zijn belangrijk voor de vindbaarheid van uw website. Bij het ‘scannen’ van websites kijken zoekmachines naar de alt tags van afbeeldingen, omdat deze de afbeelding zelf niet kunnen zien. Het is dus belangrijk dat u woorden waarop u gevonden wil worden als alt-tags bij afbeeldingen plaatst.

In WordPress kunt u afbeeldingen eenvoudig voorzien van afbeeldingen wanneer u deze upload naar uw website. Rechts van het overzicht van afbeeldingen kunt u per afbeelding zelf een titel, beschrijving, alt tags en onderschrift plaatsen.

Tip 4: het type afbeelding

Soorten afbeeldingenEr zijn diverse bestandsformaten waarin u afbeeldingen kunt opslaan als u deze bewerkt of gemaakt heeft. Veelvoorkomende zijn JPG (of JPEG) en PNG.

  • BMP (bitmap) is een oud formaat en wordt niet of nauwelijks meer gebruikt, voornamelijk omdat dit zorgt voor grote afbeeldingen.
  • JPG wordt het meest gebruikt. Dit formaat ‘comprimeert’ de afbeelding waardoor deze minder ruimte inneemt. Er zijn diverse kwaliteiten waarin JPG kan worden opgeslagen, let erop hier niet een te lage waarde te kiezen, dit zorgt voor een slechtere weergave.
  • PNG wordt ook veel gebruikt, maar voornamelijk bij afbeeldingen met transparantie. Dit ondersteunt JPG niet.
  • GIF wordt eigenlijk alleen gebruikt bij bewegende afbeeldingen
  • SVG is relatief nieuw en zorgt voor afbeeldingen die schaalbaar zijn, dus ook groot goed worden weergegeven met beperkte bestandsgrootte.

Tip 5: afbeeldingen uitlijnen ten opzichte van tekst

Het uitlijnen van afbeeldingen betekent het plaatsen van de afbeelding waarbij de tekst rondom de afbeelding staat. Binnen WordPress zijn 4 opties mogelijk voor uitlijnen. Bij geen uitlijning komt er geen tekst rondom de afbeelding te staan en zal dus een lege ruimte naast de afbeelding ontstaan. Ook bij het centreren van afbeeldingen wordt geen tekst links en rechts weergegeven. Links uitlijnen zorgt voor tekst rechts en rechts uitlijnen uiteraard voor tekst links van de afbeelding.

Door uw afbeeldingen een bepaalde uitlijning te geven kunt u de layout van uw website bepalen. Uiteraard is een goede uitlijning afhankelijk van het soort afbeelding en de grootte van de afbeelding. Grote afbeeldingen zullen vaak kleiner worden geplaatst met een link naar het grote formaat. Dit kan bijvoorbeeld, zoals bij punt 1 reeds vermeld, in een lightbox.

Tip 6: let op copyright

Copyright van afbeeldingenWanneer iemand een afbeelding of foto heeft gemaakt heeft diegene de rechten van deze afbeelding. Een ander mag deze afbeelding dus niet zomaar zonder toestemming gebruiken. Een goede manier om zeker te weten dat u recht heeft om een afbeelding te gebruiken is om voor stock afbeeldingen te kiezen.

Het zomaar gebruiken van afbeeldingen zonder daarvoor de rechten te hebben kan zorgen voor flinke problemen en claims van fotografen / makers van afbeeldingen. Zorg dus altijd dat u zeker weet dat de u de afbeeldingen op uw website mag gebruiken!

Tip 7: stock afbeeldingen

Stock afbeeldingen zijn zowel gratis als betaald verkrijgbaar. Er zijn op internet veel websites te vinden waar stock afbeeldingen kunnen worden aangeschaft. Een voorbeeld van een gratis stock foto website is Pixabay.com, een voorbeeld van een website met betaalde stock foto’s is shutterstock.com.

Eén nadeel aan stock afbeeldingen is dat iedereen deze kan downloaden / aanschaffen en gebruiken. Het kan dus zijn dat u niet de enige bent met een bepaalde afbeelding. Ook zijn stock foto’s uiteraard niet persoonlijk.

Tip 8: zelf afbeeldingen maken met Canva

Canva: zelf afbeeldingen makenAls u zelf afbeeldingen wilt maken met persoonlijke teksten of een bepaalde layout kunt u hiervoor natuurlijk uitgebreide programma’s aanschaffen zoals bijvoorbeeld Photoshop, maar u kunt ook online uw afbeelding maken. Uiteraard biedt dit niet zoveel opties als een uitgebreid programma, maar toch zijn ook online mooie afbeeldingen te maken.

Canva is een website waar u zelf een formaat kiest en vervolgens tekst, afbeeldingen en andere items kunt toevoegen. Deze afbeeldingen kunt u vervolgens opslaan binnen Canva, downloaden, delen via social media, per email sturen etc. Canva is gratis te gebruiken en de afbeeldingen die u maakt mag u gebruiken. Ook komt er geen reclame op afbeeldingen.

Waaraan verdient Canva dan hoor ik u denken. Canva biedt ook betaalde afbeeldingen die u kunt aanschaffen, maar die keuze is aan u. Er zijn ook voldoende gratis afbeeldingen en u kunt natuurlijk altijd uw eigen afbeeldingen uploaden en gebruiken / bewerken. Daarom kan Canva veel diensten gratis aanbieden.

Tip 9: uitgelichte afbeeldingen

In WordPress kunt u afbeeldingen in een bericht of pagina zetten, alleen of in een overzicht. Maar u kunt ook afbeelding als uitgelichte afbeelding gebruiken. Bij een overzicht van pagina’s of berichten krijgt u dan bij de titel en samenvatting de uitgelichte afbeelding te zien. Wanneer is dit dan interessant? Bij bijvoorbeeld blogs, archief pagina’s of wanneer iemand zoekt naar informatie. Afhankelijk van het thema van uw website worden deze afbeeldingen dus op een bepaalde manier weergegeven bij uw berichten en pagina’s.

Tip 10: meerdere afbeeldingen gebruiken

Zoals hierboven al vermeld kunt u afbeeldingen alleen plaatsen of als uitgelichte afbeelding, maar u kunt ook afbeeldingen bij elkaar in een ‘verzameling’ plaatsen. Met WordPress is het eenvoudig om een ‘galerij’ aan te maken met de standaard methode om media toe te voegen aan berichten of pagina’s. Hiermee kunt u zelf afbeeldingen selecteren die u bij elkaar wil plaatsen en vervolgens de eigenschappen bepalen.

Het plaatsen van een galerij kan interessant zijn als u meerdere afbeeldingen over een bepaald onderwerp bij elkaar wilt plaatsen.

Heeft u vragen over afbeeldingen op websites?

Heeft u naar aanleiding van bovenstaande informatie nog vragen over afbeeldingen? We zien deze vragen graag tegemoet via onderstaand reactieformulier en zullen hier zo snel en goed mogelijk op reageren. Abonneer u op reacties om automatisch melding te krijgen bij nieuwe reacties.

Wilt u meer informatie?

Wilt u meer informatie over afbeeldingen? Neem dan contact met ons op per mail (info@compasscreations.nl) of telefonisch via 0182-769190. Uiteraard ontvangen we ook graag uw reactie via onderstaand reactieformulier.

Over Compass Creations

Compass Creations is een webdesign bureau uit Gouda dat zich richt op het totale aspect van het maken van websites. Van het technische deel en grafisch ontwerp tot hostingonderhoud en advisering: bij ons bent u aan het goede adres voor alles wat er komt kijken bij een website.

Daarnaast vinden we het belangrijk dat al onze websites voldoen aan de hoge eisen van vandaag de dag, dat u zelf uw website kunt bijhouden en dat u bij ons terecht kunt met uw vragen.

We zijn bereikbaar, houden van eerlijk zaken doen en hanteren aantrekkelijke tarieven, omdat we vinden dat een goede website voor iedereen mogelijk moet zijn.

Neem contact met ons op of bekijk onze portfolio.

Compass Creations webdesign Gouda

The following two tabs change content below.
Compass Creations specialiseert zich in het maken en onderhouden van websites en webshops. Voor elk type website kunt u bij ons terecht, maar ook staan we voor u klaar als het gaat om ondersteuning of advies voor grafisch ontwerp, social media, nieuwsbrieven en meer. | info@compasscreations.nl | www.compasscreations.nl | Compass Creations webdesign Tilburg

Laatste berichten van Marcel Oerlemans - Compass Creations webdesign Tilburg (toon alles)

Comments

  • Michael
    3 april 2015

    Leuke tips Marcel, thx

    • 3 april 2015

      Dank je wel voor je reactie Michael, fijn te horen dat je mijn tips goed vind!
      Mocht je nog vragen hebben over afbeeldingen op websites dan hoor ik het graag 😉

  • Fred Boot
    4 april 2015

    Leuk om te merken dat in een moeilijke tijd je het nog steeds red

    • 4 april 2015

      Hoi Fred, dank voor je reactie! Hoe gaat het met jou? Gelukkig gaat het inderdaad goed, websites zijn natuurlijk ook (of vooral) nu belangrijk voor bedrijven en ZZP’ers, vandaar dat er voor webdesigners genoeg te doen is. En met alle ontwikkelingen in de markt (responsive webdesign, SEO, etc) blijft dat ook wel zo verwacht ik.

  • Lizet van Triet
    6 april 2015

    Hoi Marcel, leuk, je blog met al die tips. Heel herkenbaar. Zeker nadat jij me daarmee ook geholpen hebt!

Plaats een reactie

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

* Copy This Password *

* Type Or Paste Password Here *