Je beelden internet-proof maken

Je beelden internet-proof maken is super belangrijk.
Beelden op internet plaatsen is iets waar veel mensen in het begin tegen aan lopen.
De kleuren zijn anders dan print of zoals je de beelden aangeleverd hebt gekregen, in deze blog neem ik je mee hoe je kan zorgen dat je beelden er hetzelfde uitzien als print.

In deze blog zal ik gebruik maken van Photoshop om de stappen uit te leggen, maar volgens mij heb je tegenwoordig veel online tools om dit ook te doen.
Als blogger en als fotograaf kunnen onderstaande dingen ontzettend belangrijk zijn en je website/portfolio of blog een boost geven.

Waarom zijn de beelden op print anders dan op de pc.

Iets waar helaas niks aan te doen is, maar op elk beeldscherm zal je beeld er anders uitzien.
Vaak werken fotografen met beeldschermen die gekalibreerd zijn (gekalibreerd = het beeldscherm kleurecht maken door middel van bepaald apparaat i.c.m. software)
Hierdoor weet je als je met een fotograaf werkt dat de beelden op print er precies uit komt te zien zoals op de computer. De kleurruimte van een computer is namelijk anders dan die van een printer.
De meest gebruikte kleurruimtes zijn Adobe RGB en sRGB, nu hebben printers vaak ook nog een eigen kleurprofiel. Deze kan je vaak bij de drukker opvragen, zodat je 100% zeker weet dat de beelden er precies uitkomen zoals jij ze op je pc zag.

Waarom wil je je beelden internet-proof maken?

Een van de redenen om je beelden internet-proof te maken is om te zorgen dat je website sneller laad, en dat de kleuren die jij ziet ook zo op internet komen.
Sommige websites stellen zelfs een maximaal aantal mb’s in die je kan gebruiken. Dus het is soms handig als je voor een bepaald soort platform je beelden wilt gebruiken kijkt wat de verplichtingen zijn.
Zo weet ik dat sommige thema’s van blogs/websites maar een bepaald formaat aankunnen, als een opdrachtgever dit niet op tijd doorgeeft kan het zijn dat delen van een foto moeten worden uitgerekt, dit wil je natuurlijk voorkomen, dus probeer dit altijd van tevoren te peilen.
Maar ook als je blogs schrijft wil je graag dat je foto’s zo klein mogelijk zijn, maar wel van goede kwaliteit. Hiervoor is het ontzettend handig om het te verkleinen

Waarom moeten beelden 72DPI zijn voor internet gebruik?

Dpi betekend dots per inch, maar eigenlijk is dit niet bedoeld voor online termen.
Officieel is het namelijk ppi (pixel per inch) alleen is het de afgelopen jaren zo gegroeid dat iedereen het dots per inch noemt, maar dit zijn officieel waarde voor de printer.
Waarom beelden voor je blog maar 72dpi hoeven te zijn? Deze foto’s zijn bedoeld om te showen op het web, en waarschijnlijk wil je niet dat jou beelden straks mega groot bij iemand thuis hangen.
Dit is eigenlijk de voornaamste reden om je beelden 72 dpi te maken, maar eigenlijk is een belangrijke reden, namelijk je website snel laten laden.
Door minder pixels per inch/cm te gebruiken wordt het beeld optisch kleiner zonder zijn kwaliteit te verliezen, maar wordt wel een stuk kleiner in mb’s.

Opslaan voor web, en wat is er anders dan normaal opslaan?

Opslaan voor web verkleind de bestanden voornamelijk, je kan in het functie scherm een aantal opties invullen.
Ik hou hier zelf eigenlijk altijd aan dat het beeld 100% moet blijven, zo gaat er geen kwaliteit verloren, maar wordt het beeld wel optimaal verkleind.

Met “normaal” opslaan maakt hij het bestand niet persé kleiner, maar hij “merged” de bewerking die je hebt gedaan samen, hierdoor wordt het bestand kleiner dan een psd.
Het verschil zit hem vooral in de kleurruimte, bij normaal opslaan houd hij rekening met print, waarbij hij met save voor web rekening houdt met de kleuren die onze beeldschermen kennen.
Dus zorg dat je je beeld internet-proof maakt door gebruik te maken van je de goede kleurruimte, wat je kan doen door onderstaande stappen te volgen.

Hoe zorg je dat je je beeld optimaal verkleind? (Zo doe ik het!)

Open in Photoshop het beeld dat je graag zou willen verkleinen.
Zorg er wel voor dat je de normale versie wel opslaat, zelf doe ik het altijd achteraf en sla ik de psd na de volgende handelingen niet op.
Ga naar: Image > Image Size…
Vul vervolgens bij Resolution 72 in, hierachter moet Pixels/Inch staan.
Druk vervolgens op opslaan.

Ga hierna naar: File > Export > Save for web (Legacy)…
In het scherm ga je in de rechterkant naar het formaat dat je wilt gebruiken, in mijn geval is het JPG. (Wist je dat ze in het begin van het internet tijdperk afbeeldingen opsloegen via gif’s?)
Vervolgens kies ik bij de kwaliteit voor maximum en dan bij Quality voor 100.
Ook vink ik optimized nog aan, en voeg ik in de metadata mijn copyright & contact info toe.
Druk vervolgens op save… En kies de locatie waar je hem wilt hebben.

Sluit vervolgens je document af, maar druk niet op save!
Anders als je in de toekomst nog aanpassingen wilt doen in je psd bestand zal hij niet meer geschikt zijn voor print en moet je alles opnieuw bewerken.
Je jpg is nu internet-proof!

Sloeg jij je beelden al kleiner op voor je blogs? Of ga je dit vanaf nu doen (En je oude foto’s aanpassen om je website sneller te maken)

P.s. Door de corona crisis kan je momenteel je abonnement voor 2 maanden gratis gebruiken. Even googlen hoe je dit precies doet en het scheelt toch weer twee maanden membership betalen.