09-07-19

Afbeeldingen optimaliseren

Voorbereiden voor plaatsen op je website

De afbeeldingen voor je website optimaliseren

Voor elke website blijft dit een punt van aandacht bij je webdesign: de afbeeldingen in de juiste verhoudingen en in de juiste bestandsgrootte plaatsen.

Samenvatting:

  • Zorg dat je afbeeldingen een bestandsgrootte hebben die in kb wordt aangegeven. Zie je ergens mb, dan weet je dat het veel te groot is voor een afbeelding op een website.
  • Als je de afbeeldingen in de juiste verhoudingen gebruikt, voorkom je verschillen in bijv. kolomhoogtes naast elkaar.

Hoe doe je dat?
Bereid je afbeeldingen voor. Upload geen .jpg’s die zo van de camera komen. Photoshop, evt Gimp, is een bijzonder prettig tool om je afbeeldingen voor te bereiden. Hiermee kun je je afbeeldingen op het juiste formaat maken, de juiste verhoudingen in pixels breed x hoog, en tevens opslaan in een compactere kwaliteit .jpg.

Bestandsformaten:

  • .tif: veelal door fotografen gebruikt om afbeeldingen zonder kwaliteitsverlies op te slaan
  • .psd: het bestandsformaat van Photoshop, waarin evt vele lagen aanwezig zijn
  • .png: een bestandsformaat dat het mogelijk maakt om transparantie in een afbeelding te gebruiken
  • .gif: een compact bestandsformaat dat animaties mogelijk maakt, met een beperkt aantal kleuren of grijstinten in je afbeelding. Evt ook geschikt om een afbeelding met een beperkt aantal tinten als een nog kleiner bestand op te slaan
  • .jpg het meest gebruikte bestandsformaat waarbij de ene .jpg de andere niet is. Hierover later meer.

Check-up

Laat je WooCommerce installatie controleren:

  • Is de opbouw zoals die hoort te zijn?
  • Is alles up-to-date?
  • Is het thema goed geïmplementeerd?
  • Is de site snel genoeg?
  • Is de backup goed geregeld?
  • Is de shop SEO-technisch goed ingericht?

Verwarrend begrip:
grootte of bestandsgrootte of grote van je afbeelding.

Een afbeelding heeft zowel fysieke afmetingen die voor beeldschermtoepassingen in pixels wordt gerbuikt. je hebt dan bijv. een afbeelding die 200 pixels hoog is en 300 pixels breed. Deze afbeelding is dus kleiner dan eentje van 2500 hoog x 3500 breed.

Als je een afbeelding opslaat

Verdere mogelijkheden voor optimalisatie:

  • Caching gebruiken (let op: de ene caching is de andere niet!)
  • Teveel afbeeldingen zoals voor bijv. een slider voorkomen

Wat kunnen we nog toevoegen aan dit artikel?

Blog formulier

Contact informatie

Montix, Internetbureau
Rigtersbleek Aalten 4 – 108
7521 RB Enschede

Voor vragen, vrijblijvende offertes en advies:
E-mail: support@montix.nl
Tel: +31 (0)53 750 30 30

foto nora montix 2023

Marko van den Berg