Afbeeldingen wil meestal zeggen: foto's. En iedereen kan foto's maken, toch? Fout.

Althans: ja, natuurlijk kan iedereen foto's maken, maar op je website wil je bij voorkeur mooie, aansprekende foto's gebruiken. Niet ieder kiekje voldoet daaraan.
Belangrijker is, dat foto's geschikt gemaakt moeten worden voor gebruik op een website. Oftewel: geoptimaliseerd voor web

Optimaliseren

Zelfs mijn telefoon maakt al foto's van 8 Mb of nog groter. Dat kost veel opslagruimte (en opslagruimte kost geld), maar wat erger is: het kost "laadtijd". Het "binnenhalen" van zo'n grote foto kost tijd, zeker voor iemand die met een langzame verbinding moet werken. Het kan zoveel tijd kosten, dan mensen domweg afhaken. Hopelijk doen ze dat bij deze pagina niet...

Dus: foto's moeten kleiner gemaakt worden.

Om te beginnen kun je ze bijsnijden - bijna iedere foto wordt beter van het verwijderen van overbodige informatie in het beeld. Foto's op je website hebben meestal een maximaal benodigde breedte in pixels, daar kun je bij het bijsnijden al rekening mee houden.

Bij het opslaan moet er rekening mee worden gehouden dat de foto "voor web" is en een resolutie van maximaal 96 pixels per inch heeft. Meer is zinloos, want een beeldscherm heeft ook maar maximaal 96 pixels per inch. (Behalve de fraaie "retina" schermen van Apple, daarvoor gelden andere regels). 

Tenslotte bereik je de kleinste bestandsgrootte door op te slaan als .jpg. Een kwaliteit van 75% is daarbij al voldoende voor doorsnee webgebruik.

Hoe

Photoshoppen

De makkelijkste manier om foto's te optimaliseren is leren werken met Photoshop. Dat hoeft niet de grote, dure Photoshop te zijn, met Photoshop Elements (kost rond de 100 euro) gaat het prima. Ik gebruik zelf de Open Source tegenhanger van Photoshop: Gimp

Online

Er zijn ook allerlei online toepassingen te vinden voor het aanpassen van foto's. Zoals bijvoorbeeld Squoosh.

Via Flickr

Je kunt er ook voor kiezen om je foto's op de (gratis) foto-opslag-website Flickr te zetten. 

Daar heb je de mogelijkheid om je foto's bij te snijden en enigszins te bewerken, er is een ingebouwde fotobewerker die dat prima kan. En je kunt je foto vervolgens weer downloaden vanaf Flickr in een formaat naar keuze, dat geschikt is voor gebruik op je website.

Met gebruik van de (niet gratis) Nederlandse Joomla extensie och Responsive Images kun je de foto's binnen in je website automatisch op allerlei manieren en in allerlei formaten in je artikelen opnemen.

Voorbeeld

De eerste foto komt zo uit mijn telefoon: 5520x4140 pixels groot, en een bestandsgrootte van maar liefst 12 Mb!
Daaronder hoe ik 'm online zou gebruiken, bijgesneden, iets bewerkt, en geoptimaliseerd voor web: 360 x 360 pixels, bestandsgrootte 54 Kb. Dat scheelt nogal!


 

En zo niet?

Als je foto's gebruikt op je site, moeten ze echt geoptimaliseerd worden. Anders haken je bezoekers af, omdat het laden van de pagina te lang duurt. En je betaalt voor een hoop schijfruimte, terwijl het nergens voor nodig is. Trouwens... je kunt, met een beetje creativiteit, ook prima een pagina zonder foto's maken.

Wat kan ik voor je doen?

Als ik de website maak of beheer, optimaliseer ik ook de foto's. Als je het beheer zelf doet, kan ik altijd foto's voor je optimaliseren. Tegen uurtarief, maar ik kan het heel snel.

Wil je dat alle foto's geschikt zijn voor Retina schermen? Dat kan, maar het is wel wat meer werk.