Afbeelding perfect maken voor WordPress met Photoshop

Het is voor je WordPress site cruciaal dat je afbeeldingen de juiste resolutie hebben en zo licht mogelijk zijn. In deze handleiding lees je waar je foto- en beeldmateriaal aan moet voldoen en wat je moet doen om je afbeeldingen geschikt te maken met Adobe Photoshop.

Adobe Photoshop beste programma voor foto’s

Er zijn vele fotobewerkingsprogramma’s. In dit geval gaan we uit van Adobe Photoshop omdat dit het meest gebruikte en beste programma is om foto’s te bewerken en geschikt te maken voor WordPress. Helaas is het nogal prijzig. Het programma Affinity Photo is een goed en betaalbaar alternatief voor Photoshop en doet niet of nauwelijks onder.

Wanneer je met Photoshop een afbeelding wilt opslaan voor het web voor je WordPress website dan kun het beste de volgende stappen uitvoeren. Soortgelijke stappen gelden ook voor andere programma’s als Paint.

---

Fout: Hoe je afbeeldingen niet moet opslaan

Dit is hoe je je afbeeldingen niet moet opslaan.
Veel mensen doen het onderstaande fout:

Je afbeeldingen als JPG opslaan met:
Save as of
Opslaan als
Zie hieronder:

Doe dit nooit voor websites! Ga nooit naar gewoon opslaan en dan opslaan als JPG. Je bestand wordt dan niet efficient gecomprimeerd en veel te groot voor WordPress. Doe het altijd de onderstaande manier!

Afbeelding exporteren naar JPG (Opslaan voor web)

Ga naar ‘bestand’ (file) en klik in het menu dat te voorschijn komt op ‘exporteren’ of ‘opslaan voor web’ of ‘save for web and devices’ bij oudere versies van Photoshop.

Videos voor Opslaan voor web

Bekijk onderstaande videos voor Opslaan voor web in 2025.

Exporteren naar JPG met Adobe Photoshop (2021)

Het bovenstaande staat ook nog uitgelegd in deze video:

---

Beste Photoshop instellingen voor WordPress

Je komt dan in het volgende scherm:

Er zijn verschillende instellingen in dit scherm, zie de nummertjes bij de belangrijkste instellingen.

1. de fotopreview zoals de foto eruit komt te zien zodra je hem opslaat
2. Kies het soort bestand. Bijna altijd JPG. Alleen voor logo’s en transparante afbeeldingen PNG.
3. Je kan invloed uitoefenen op de kwaliteit van de foto. Ik geef meestal 60 in. Je ziet de kwaliteit van de foto op de foto zelf bij nummer 1.
4. In dit scherm kun je de breedte instellen. Voor een standaardafbeelding neem ik meestal 900 pixels breed. De hoogte gaat vanzelf mee.
   In pricipe is alles tussen de 800 en 1000 pizels breed voldoende voor afbeeldingen in berichten. In geval van beeldvullende afbeeldingen, bijvoorbeeld in een header of slider, is soms een bredere afbeelding gewenst, bijvoorbeeld 1200 pixels breed.
   TIP: Maak voor portfolios staande afbeeldingen 800 pixels breed en liggende afbeeldingen 1000 pixels breed.
5. Ik gebruik deze optie om foto’s procentueel te verkleinen, bijvoorbeeld 50% van de originele grootte.
6. Hier lees je af welk formaat de afbeelding wordt opgeslagen en hoe groot de afbeelding is in kb’s of mb’s. Voor WordPress Google is het het beste om onder de 100kb te blijven. Ietsje meer mag. Maar bv 300 kb is echt te veel. Het duurt dan te lang voordat een foto in de webbrowser geladen is.
7. Opslaan met een goede SEO-naam. Een goede omschrijving wat de photo voorstelt, bv: ‘sinterklaas-groep-kinderen.jpg’ en niet ‘DCN012345678.jpg’

Klaar. Je kunt de afbeelding nu in je media-bibliotheek in WordPress zetten.

Bestandsgroottte afbeeldingen extra verkleinen

De voorgaande stappen zijn al voldoende voor je WordPress-website. Als je het extra goed wilt doen, kun je de foto’s nog 5-20% extra verkleinen. Alle meta-data (cameragegevens, fotograaf, datum, e.d.) worden dan nog eens verwijderd zonder kwaliteitsverlies van de foto. Bekijk dan de handleiding afbeeldingen en bestandsgrootte verkleinen voor WordPress.

Succes!

---

Meer handleidingen afbeeldingen en foto’s

Meer handleidingen over foto’s, afbeeldingen en Photoshop

Cursus Photoshop afbeeldingen en beeldbewerking

Wil je een Photoshop cursus of training volgen om afbeeldingen en foto’s te bewerken? Dat kan. Lees meer over de cursus Photoshop en beeldbewerking
Cursus Adobe Photoshop en beeldbewerking