Originele afbeelding voor WordPress te groot

Ik adviseer je altijd de foto’s op het juiste formaat te maken alvorens je ze in WordPress plaatst. Je WordPress mediabibliotheek blijft dan mooi op orde en je website blijft optimaal en snel draaien.

Je originele foto’s en afbeeldingen van een camera of telefoon zijn vaak veel te groot, bijvoorbeeld 3000 pixels breed. Je website is doorgaans niet breder dan 1200 pixels. Alles groter dan dit is dus te groot waardoor je website onnodig belast wordt en je website trager wordt.
Zorg dat de foto’s en afbeeldingen het juiste formaat hebben voordat je ze in WordPress zet.

Resolutie, pixels, afmeting afbeelding site

Maximum grootte en resolutie foto’s en afbeeldingen

Voor standaard afbeeldingen in berichten en pagina’s:

Maximum grootte voor beeldvullende afbeeldingen

Voor achtergrondafbeeldingen en beeldvullende (parallax) afbeeldingen en sliders:

De hoogte van de afbeeldingen is minder van belang. WordPress zal de afbeelding alleen maar in de breedte aanpassen aan het kader waarin het geplaatst wordt. De hoogte maakt dus niet uit.

Tip voor bewerken foto’s en afbeeldingen voor WordPress

Maak je afbeeldingen geschikt voor WordPress en hanteer hiervoor de bovengenoemde resoluties als richtlijn. Vrijwel alle afbeeldingen kun je bewaren als JPG-bestand. Bewaar naast dit bestand altijd je origineel op een hogere resolutie.

---

Gratis programma afbeelding kleiner maken

Welke programma’s kun je het beste gebruiken om je afbeeldingen en photo’s kleiner te maken? Het mooiste is als je Adobe Photoshop gebruikt. Het gebruik van Photoshop voor WordPress heb ik hier uitgelegd. Helaas is Photoshop nogal prijzig. Als alternatief kun je ook prima de onderstaande programma’s gebruiken:

Gratis fotobewerkingsprogramma voor Apple Mac

Ik adviseer het volgende programma:

iResize (gratis programma)

Je kan iResize hier gratis downloaden:
https://www.macupdate.com/app/mac/13039/iresize

Als je het op je mac wilt installeren geeft je Mac de melding dat je een programma wilt downloaden dat niet via de Apple-store aangeschaft is. Ga na de systeemvoorkeuren en dan naar Privacy en klik op accoord dat je toch het programma wilt installeren. Tijdens de cursus kan ik uitleggen hoe iResize werkt.

Extra tip verkleinen bestandsgrootte

Als je je foto’s hebt bewaard op de juiste resolutie kun je de bestandsgrootte van de afbeeldingen ook nog eens verkleinen met het gratis programma ImageOptim (Mac Download) of Pinga (PC/Windows download), Alle technische gegevens (metadata), bijvoorbeeld welke camera en sluitertijd worden dan verwijderd. Je afbeeldingen worden dan doorgaans nog eens 5-20% kleiner waardoor je site sneller wordt.
Download ImageOptim
Je kan de metadata ook online verwijderen op verexif.com: www.verexif.com

Gratis fotobewerkingsprogramma voor PC Windows

Ik adviseer het volgende programma:

Irfanview (Windows)

Het programma is heel old-school maar werkt prima. Gebruik voor het exporteren altijd de functie ‘Bestand > Opslaan voor het web’. Je krijgt dan de melding dat een plugin vereist is. Installeer deze plugin ook.
Download Irfanview

Paint (Windows)

Je kan je afbeeldingen ook opslaan met Paint. De compressie is alleen wat minder.

Betaalde programma’s beeldbewerking en foto’s

Dit zijn de 2 beste maar betaalde programma’s om afbeeldingen mee te bewerken:

---

Online programma foto verkleinen (Croppola)

Online programma’s bijsnijden foto’s en afbeeldingen

Geen Photoshop of een ander programma? Geen nood. Je kan ook andere online programma’s gebruiken. Croppola is mijn favoriet, maar je kan ook de andere online tools proberen.

Croppola | aanbevolen voor cursisten!

Croppola werkt echt fantastisch. Simpeler dan photoshop. Handig voor iedere cursist.

Tip van Arthur: Kies bij voorkeur een vaste verhouding, bijvoorbeeld 4×3 of 9×16, of voor grote liggende afbeeldingen 24×9. Dit zorgt voor een evenwichtig beeld in je WordPress website. De verhoudingen vind je in Croppola terug onder het kopje ‘auto’.

Ga naar Croppola

Afbeelding of foto uitsnijden met Croppola

Vul de verhouding van je afbeelding in under de button ‘auto’ en vul onder het kopje ‘crop’ de maximale breedte in voor je afbeelding. Alleen nog downloaden en klaar. Voor de liefhebbers heb ik een aardig artikel geschreven over beeldverhoudingen en welke beeldverhoudingen het beste scoren in zoekmachines en Google. Lees meer over verhoudingen in de onderstaande handleiding:
verhoudingen van afbeeldingen voor webdesign en WordPress

Blij met deze design tip? Heb je een training gevolgd en tevreden over de handleidingen en tips? Laat dan een review achter. Je helpt Arthur dan zijn werk sustainabel te maken. Bekijk ter inspiratie de reviews: Bekijk reviews

---

Verhouding afbeelding (staand, liggend)

Het is handig om een vaste verhouding te kiezen voor je afbeeldingen. In de praktijk zijn de onderstaande verhoudingen het meest praktisch en esthetisch verantwoord.

Verhouding 16×9

Breedte	Hoogte
1600 pixels	900 pixels
1200 pixels (aanbevolen)	675 pixels (aanbevolen)
900 pixels	506 pixels

Verhouding 4×3

Breedte	Hoogte
1600 pixels	1200 pixels
1200 pixels	900 pixels
900 pixels	675 pixels

Verhouding 3×4 (staande afbeeldingen, portretten)

Voor staande afbeeldingen (niet liggend) is de verhouding 16×9 nogal erg langwerpig. Beter om dan altijd 3×4 te gebruiken.

Breedte	Hoogte
1200 pixels	900 pixels
900 pixels	675 pixels
600 pixels (aanbevolen)	450 pixels (aanbevolen)

Voorbeeld foto met verhouding 16×9

Om een indruk te geven hoe een verhouding eruit ziet, geef ik hieronder een voorbeeld van een foto met de verhouding 16×9 (900×506 pixels):

Meer online fotobewerkingsprogramma’s

Bekijk meer gratis fotobewerkingsprogramma’s

---

Afbeelding automatisch verkleinen upload WP

Je kan ook je foto’s of afbeeldingen automatisch laten verkleinen bij het uploaden in WordPress. Je dient dan een WordPress plugin te installeren. Je kan het beste de volgende WordPress plugin gebruiken uit de volgende handleiding over het automatisch kleiner maken bij uploaden in WordPress:
Handleiding Automatisch grote afbeeldingen verkleinen in WordPress met plugin

---

Handleidingen over afbeeldingen en WordPress

Meer tips en handleidingen over fotografie en afbeeldingen voor WordPress: