IN DEZE HANDLEIDING:
- 1 Afbeelding perfect maken voor WordPress met Adobe Photoshop
- 2 Adobe Photoshop het beste programma voor foto's
- 3 Stap 1: Afbeelding exporteren naar JPG (Opslaan voor web)
- 4 Stap 2: Beste Photoshop instellingen afbeelding voor WordPress
- 5 Afbeeldingen en bestandsgroottte extra verkleinen WordPress
- 6 Meer handleidingen over foto's, afbeeldingen en Photoshop
- 7 Cursus Photoshop afbeeldingen en beeldbewerking
Afbeelding perfect maken voor WordPress met Adobe Photoshop
Het is voor je WordPress site cruciaal dat je afbeeldingen de juiste resolutie hebben. 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 het 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.
Stap 1: 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.
Let op: ga nooit naar gewoon opslaan en dan opslaan als JPG. Je bestand wordt dan niet efficient gecomprimeerd en veel te groot voor WordPress.

Exporteren naar JPG met Adobe Photoshop videohandleiding (2020)
Het bovenstaande staat ook nog uitgelegd in deze video:
Stap 2: Beste Photoshop instellingen afbeelding voor WordPress
Je komt dan in het volgende scherm:

Er zijn verschillende instellingen in dit scherm, zie de nummertjes bij de belangrijkste instellingen.
- de fotopreview zoals de foto eruit komt te zien zodra je hem opslaat
- Kies het soort bestand. Bijna altijd JPG. Alleen voor logo's en transparante afbeeldingen PNG.
- 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.
- 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.
- Ik gebruik deze optie om foto's procentueel te verkleinen, bijvoorbeeld 50% van de originele grootte.
- 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.
- 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.
Afbeeldingen en bestandsgroottte extra verkleinen WordPress
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 over foto's, afbeeldingen en Photoshop
Meer handleidingen over foto's, afbeeldingen en Photoshop
Scherpe Retina afbeeldingen voor weergave afbeeldingen tekst
Retina-schermen laten afbeeldeingen en tekst extra scherp zien. De teksten worden beter leesbaar. Ook je…
Perfect ronde afbeelding foto maken cirkel wordpress border-radius
Afgeronde afbeelding in WordPress Op zoek naar een manier om een afgeronde afbeelding te maken…
Afbeelding passend maken verhouding met html en CSS
Verhoudingen afbeelding passend maken met html en CSS Soms hebben je afbeeldingen niet allemaal dezelfde…
Tekst afbeelding uitlijnen links rechts kolom WordPress
Tekst en afbeelding goed uitlijnen, bijvoorbeeld links rechts is in WordPress vaak lastig en wordt…
Animated gif bewegende afbeelding animatie video foto maken
Beste gratis rechtenvrije foto's afbeeldingen, stockfoto's, fotografie
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