WordPress Image Sizes

WordPress beeldformaten: Hoe afbeeldingen in WordPress werken & best practices voor je website

Met WordPress is het eenvoudig om afbeeldingen aan je blogberichten en -pagina's toe te voegen. Maar om deze afbeeldingen er goed uit te laten zien, moet je de juiste afbeeldingsgrootte kiezen. Dat is waar we het vandaag over hebben: WordPress beeldformaten.

Het is belangrijk om te weten hoe afbeeldingsformaten op WordPress websites werken en hoe je aangepaste beeldformaten aan je website kunt toevoegen. Dan kun je het meest geschikte afbeeldingsbestandstype in de juiste grootte en op de juiste plek gebruiken. 

De juiste afbeeldingsgrootte zorgt er niet alleen voor dat je website er samenhangender uitziet, het maakt je blogberichten ook gemakkelijker om te delen. Leer in dit artikel hoe je de juiste afbeeldingsformaten voor je WordPress website gebruikt.

We behandelen de volgende onderwerpen: 

  • Hoe WordPress de afbeeldingen beheert die je uploadt
  • Afbeeldingen verkleinen en bewerken in WordPress
  • De beste afbeeldingsformaten voor WordPress
  • Best practices voor WordPress beeldformaten
  • Hoe je aangepaste WordPress beeldformaten toevoegt
  • Conclusie over WordPress beeldformaten en algemene best practices

Hoe WordPress de afbeeldingen beheert die je uploadt

Zoals al gezegd, is de grootte van de afbeelding belangrijk voor WordPress. Als je het verkeerde formaat kiest, zullen je foto's er wazig uitzien. Erger nog, als je afbeeldingen te groot zijn, kunnen ze je website vertragen.

Verkeerde afbeeldingsformaten kunnen ook de lay-out van je pagina of blogbericht door elkaar brengen en en onnodig horizontaal scrollen veroorzaken. Het goede nieuws is dat WordPress een ingebouwde instelling heeft zodat je deze problemen kunt voorkomen

WordPress beeldformaten

  • Thumbnail formaat: 150 x 150 pixels
  • Medium formaat: 300 x 300 pixels 
  • Grootste formaat: 1024 x 1024 pixel
  • Volledig formaat: komt standaard overeen met het originele formaat van de geüploade afbeelding.

Wanneer je een afbeelding in WordPress uploadt, worden deze vier verschillende afbeeldingsformaten standaard aangemaakt. 

De reden waarom WordPress deze beeldformaten creëert is tweeledig. Ten eerste hoef je de afbeeldingen niet handmatig te verkleinen. Ten tweede zorgt het ervoor dat het juiste afbeeldingsformaat wordt gekozen voor verschillende plaatsen op je website. 

WordPress zal bijvoorbeeld de thumpnails in een blogpostlijst in een zijbalk of footer widget weergeven. Maar een afbeelding die in de koptekst of in het artikel zelf moet komen, moet groter zijn. Daarom kiest WordPress een van de grotere beeldformaten om ervoor te zorgen dat de afbeelding duidelijk en herkenbaar is. 

Dus als je dezelfde afbeelding op verschillende plaatsen op je website wilt gebruiken, hoef je geen tijd te verspillen aan het handmatig aanpassen van de grootte of te onthouden welke afbeeldingsgrootte je nodig hebt. Upload gewoon een afbeelding – WordPress zorgt voor de rest.

Afbeeldingen verkleinen en bewerken in WordPress

Met WordPress kun je de grootte van de standaardafbeeldingen binnen WordPress wijzigen. Je hoeft maar een paar keer te klikken en je hebt de afbeeldingsformaten in een mum van tijd ingesteld. 

Om de standaardafbeeldingsformaten te wijzigen, ga je naar Instellingen > Media. Zoals je in de schermafbeelding kunt zien, staan alle standaard afbeeldingsformaten daar vermeld. Je kunt ze gemakkelijk aanpassen door de gewenste afmetingen in te voeren.

WordPress Images Sizes Settings
Standaard afbeeldingsformaten in WordPress

Wanneer je de standaardgrootte van de WordPress afbeeldingen hebt aangepast aan je gewenste afmetingen, klik je op Wijzigingen opslaan. In de toekomst zullen alle afbeeldingen die je op je website uploadt, worden aangepast aan de nieuwe afmetingen. 

Wanneer moet je de standaardafmetingen van WordPress afbeeldingen wijzigen?

Er zijn een paar situaties waarin je de standaardmaten voor WordPress foto's moet wijzigen. Als je bijvoorbeeld een WordPress theme hebt gekocht die aangepaste afbeeldingsformaten gebruikt en je wilt ervoor zorgen dat WordPress je geüploade afbeeldingen aanpast aan die afmetingen. 

Een ander voorbeeld is een fotograaf of een andere creatieveling die specifieke afbeeldingsformaten nodig heeft om het werk te laten zien. Het wijzigen van de standaard afbeeldingsformaten kan ook nodig zijn als je een onlinewinkel hebt en specifieke beeldformaten nodig hebt voor je productafbeeldingen.

Best practices voor WordPress beeldformaten

Naast de juiste afbeeldingsformaten zijn er nog een paar andere best practices voor WordPress afbeeldingsformaten. 

Optimaliseer de bestandsgrootte van afbeeldingen

Afbeeldingen zijn vaak een van de hoofdoorzaken van trage laadtijden. Als jouw afbeeldingsbestanden te groot zijn, zal je publiek lang moeten wachten tot de browser ze heeft gedownload en zichtbaar heeft gemaakt. 

Dus voordat je foto's uploadt naar je website, moet je hun bestandsgrootte verkleinen. In het algemeen moet je streven naar een bestandsgrootte van 150 KB of minder als het gaat om afbeeldingen. Je kunt de bestandsgrootte verkleinen door de afbeelding met een lagere kwaliteit op te slaan. 

Voor grote foto's, zoals wallpapers, moet je een goed evenwicht vinden tussen bestandsgrootte en kwaliteit. Met andere woorden: je wilt de bestandsgrootte verkleinen maar voorkomen dat de afbeelding pixelig wordt.

Afbeeldingen optimaliseren voor WordPress: de 6 populairste plugins voor beeldcompressie

Je kunt ook tools voor beeldcompressie gebruiken. Deze helpen je om de bestandsgrootte te verkleinen zonder afbreuk te doen aan de kwaliteit. Wij stellen je 5 plugins voor om afbeeldingen te optimaliseren.

WordPress Images Sizes TinyPNG
TinyPNG, een beeldcompressietool

TinyJPG is een online beeldcompressieprogramma waarmee je de grootte van je afbeeldingen aanzienlijk kunt verkleinen, zelfs tot 70 procent, zonder afbreuk te doen aan de kwaliteit. 

Je kunt tot 20 afbeeldingen met een grootte van maximaal 5 MB in één keer gratis comprimeren. Je kunt je ook aanmelden voor het Pro-plan van TinyJPG, dat begint bij $25/jaar per gebruiker. Met het Pro-abonnement kun je meer dan 20 afbeeldingen tegelijk comprimeren en vervalt de limiet van 5 MB voor WordPress afbeeldingen.  

TinyJPG is een geweldige oplossing voor afbeeldingen die je wilt uploaden naar je website. Maar hoe zit het met afbeeldingen die al op je website staan? Dit is waar een plugin zoals ShortPixel in het spel komt. 

WordPress Images Sizes Shortpixel
ShortPixel Image Optimizer plugin voor WordPress

De plugin helpt je om afbeeldingen te comprimeren die je al naar je website hebt geüpload. Het verwerkt en comprimeert ook alle toekomstige uploads van afbeeldingen. Het vermindert de bestandsgrootte met maximaal 75 procent zonder merkbaar kwaliteitsverlies. 

Bovendien kun je de plugin gebruiken om alle JPG, PNG en GIF beeldformaten te converteren naar WebP en AVIF formaten, die expliciet zijn ontwikkeld voor lossless en lossy compressie van afbeeldingen op het internet en in je mediabibliotheek.

ShortPixel is gratis voor maximaal 100 afbeeldingen/maand. Je kunt extra beeldcredits kopen vanaf $4.99 voor 7.000 beeldcredits.

Gebruik het juiste type afbeelding

Met WordPress kun je foto's in verschillende formaten uploaden. Normaal gesproken worden afbeeldingen opgeslagen als JPG, PNG of GIF. Elk van deze formaten heeft echter zijn eigen voor- en nadelen. 

Hier volgt een overzicht van de verschillende soorten afbeeldingen :

  • JPG (JPEG) staat voor Joint Photographic Experts Group. Dit bestandstype ondersteunt 16 miljoen kleuren en heeft gewoonlijk de kleinste bestandsgrootte voor foto's. Dit bestandstype is ideaal voor achtergrondafbeeldingen, productfoto's, uitgelichte afbeeldingen en in het algemeen alle afbeeldingen of foto's die je op je website wilt gebruiken. 
  • PNG staat voor Portable Network Graphic. Dit afbeeldingsformaat ondersteunt minder kleuren dan JPG. Je kunt echter wel afbeeldingen opslaan met een transparante achtergrond. Het is een goede keuze voor logoafbeeldingen, achtergrondpatronen, decoratieve websiteafbeeldingen, pictogrammen voor sociale media en dergelijke. Afbeeldingen opgeslagen als PNG kunnen resulteren in grotere bestanden als de afbeeldingen veel details bevatten. 
  • GIF staat voor Graphics Interchange Format en ondersteunt 256 kleuren en transparantie. GIF's kunnen ook geanimeerd zijn. GIF's kunnen klein zijn, maar ze kunnen ook grotere bestanden opleveren als ze complexe animaties bevatten. 

Houd de beeldresolutie in de gaten

Een ander aspect waarmee je rekening moet houden bij het optimaliseren van afbeeldingen voor het internet is de beeldresolutie. De beeldresolutie wordt gemeten in dots per inch (DPI) en bepaalt de kwaliteit van de afbeelding. Hoe hoger de DPI-waarde, hoe hoger de beeldresolutie. 

Voor webdoeleinden moet de beeldresolutie worden ingesteld op 72 DPI, aangezien dit de standaardinstelling is. Een hogere resolutie resulteert in een grote omvang en draagt ertoe bij dat je website traag laadt.

"*" geeft verplichte velden aan

Ik wil me abonneren op de nieuwsbrief om op de hoogte te blijven van nieuwe blogartikelen, ebooks, features en nieuws over WordPress. Ik kan mijn toestemming te allen tijde intrekken. Bekijk ons Privacybeleid.
Dit veld dient ter validatie en mag niet worden gewijzigd.

Zo voeg je aangepaste afbeeldingsformaten toe aan WordPress

Je kunt aangepaste afbeeldingsformaten toevoegen door je functions.php bestand te bewerken. Laten we zeggen dat je een aangepaste afbeeldingsgrootte wilt toevoegen voor je featured image. 

Om ze toe te voegen aan je theme hoef je alleen maar het volgende te doen:

Ga in je WordPress dashboard naar Weergave > Editor. Open het functions.php bestand en zoek naar de volgende regel code:

add_theme_support( ‚post thumbnails‘ );

Als je het daar niet vindt, voeg dan deze regel toe en klik dan op de knop "bestand bijwerken". Voeg dan de volgende regel toe aan het functions.php bestand: 

add_image_size( ‚blog featured image‘, 1280, 630 );

De bovenstaande regel voegt de aangepaste grootte toe aan je thema en specificeert de breedte en hoogte van de nieuwe afbeeldingsgrootte. Werk het bestand bij om de wijzigingen op te slaan. 

Dan moet je de code in je theme actualiseren om de nieuwe aangepaste afbeeldingsgrootte weer te geven die je kunt selecteren bij het uploaden. Open deze keer het bestand index.php en voeg de volgende regel code in: 

the_post_thumbnail( ‚blog featured image‘ ); 

WordPress Images Sizes Image Regenerate Select Crop
Image Regenerate & Select Crop plugin voor WordPress

Werk vervolgens het bestand bij om de wijzigingen op te slaan. Vergeet niet dat je aangepaste afbeeldingsgrootte bij elke update van het theme wordt overschreven als je de handmatige methode gebruikt. 

Daarom raden wij je aan om een Child Theme te gebruiken of aangepaste afbeeldingsformaten toe te voegen met de plugin Image Regenerate & Select Crop. Met deze plugin kun je gemakkelijk nieuwe aangepaste afbeeldingsformaten registreren en de thumpnails volgens de nieuwe afbeeldingsformaten genereren. 

Conclusie: WordPress beeldformaten en algemene best practices

Afbeeldingen helpen om je verhaal te vertellen en maken het gemakkelijker voor je lezers om zich in je artikelen te verplaatsen en hun interesse te wekken. 

Daarom is het belangrijk dat je het juiste formaat kiest voor je website. Met de tips in dit artikel kun je de juiste grootte voor de afbeeldingen instellen en aangepaste afbeeldingsformaten toevoegen aan WordPress. 

Om ervoor te zorgen dat jouw inspanningen om de afbeeldingsgrootte te optimaliseren in WordPress zijn vruchten afwerpt, moet je je website bij een betrouwbare hoster onderbrengen. Het heeft geen zin om je website te versnellen als hij gebonden is aan inferieure webhosting. 

Probeer WordPress hosting met Raidboxes om je website de snelle laadtijden te geven die je publiek verdient. Je kunt contact met ons opnemen als je meer wilt weten over de voordelen van Managed WordPress hosting

Jouw vragen over WordPress afbeeldingsformaten

Welke vragen heb je over WordPress afbeeldingsformaten? We kijken uit naar je reactie. Ben je geïnteresseerd in actuele onderwerpen rond WordPress en webdesign? Volg Raidboxes dan op Twitter, Facebook, LinkedIn of via onze nieuwsbrief.

Vond je het artikel leuk?

Met jouw beoordeling help je ons om onze inhoud nog verder te verbeteren.

2 Reacties op"WordPress Afbeelding Formaten: Hoe afbeeldingen werken in WordPress & de best practices voor je website"

  1. Ich habe es eben ausprobiert und ein Foto mit 240 dpi und das Gleiche mit 72 dpi exportiert. Die Dateigröße ist dabei die gleiche geblieben. Also macht es keinen Unterschied und spare nichts ein.

  2. Ein Pixel ist ein Pixel. Außer bei Retina-Displays interessiert es auf Websites schlicht absolut gar nicht, was für eine Auflösung die Bilder haben. Die Auflösung ist nur dann interessant, wenn das Bild gedruckt werden sollte. Ich frage mich, wann dieser blödsinnige Mythos endlich stirbt.

Laat een reactie achter

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