Afbeeldingen voor websites: enkele tips

27 okt 2016 | webdesign

Je neemt fantastische foto’s voor je website.  Met je smartphone, of met een hele goede camera. Of wie weet laat je ze wel nemen door een professionele fotograaf! Eender hoe, die foto’s kan je niet zomaar op je website gebruiken…. Hier geef ik enkele tips zodat je er wel mee aan de slag kan!

Hoe groot is jouw foto?

De grootte van een foto of een bestand, drukken we uit in “kilobytes (KB)”, “megabytes (MB)” of zelfs “gigabytes (GB)”.

Idealiter is een foto voor een website niet groter dan 200 KB.  En dat is écht niet veel!

Wanneer je met een smartphone een foto neemt, heb je al gauw een bestand van 11 MB, dat is ongeveer 11.264 KB!

Een foto van je smartphone is dus veel te ‘groot’ om rechtstreeks op je website te plaatsen. Het zou veel te lang duren voor hij op het scherm van je bezoeker staat.  Je hebt ze vast al gezien, website waar de foto’s in stukjes te voorschijn komen. Absoluut niet aangenaam om naar te kijken!

Hoe kan je zien hoe groot je foto is?

Dit kan je zien in de verkenner of via de eigenschappen van je foto.

Waarom zijn jouw foto’s zo groot?

Wanneer je een ‘goede’ foto neemt, gebruik je hiervoor een fototoestel met hoge resolutie.  Dat is vooral belangrijk wanneer je je foto op een groot doek wil laten afdrukken om in je living te hangen. Of wanneer je er je eigen behangpapier van wil laten maken. (Of wanneer je je foto op een creatieve manier in het interieur van je zaak wil gebruiken!)

Maar voor op je website, is dat helemaal niet nodig.  Voor op je website heb je lang genoeg met een resolutie van 72 dpi.  En dat is helemaal niet veel!  Met die kwaliteit kan je een foto niet in het groot laten afdrukken. Daarom zijn de foto’s die je neemt altijd extreem groot. Want: verkleinen kan altijd. Maar vergroten niet…

Waarom mag je foto niet te groot zijn?

Elke foto die jij op je website plaatst, moet over de internet-verbinding naar je bezoeker worden gestuurd.  Gelukkig hebben we tegenwoordig allemaal een snelle verbinding!

Maar ben je zeker dat AL je klanten een snelle verbinding hebben?

En wat als ze via 3G (of 4G) je website bekijken?

Als je foto’s heel groot zijn, duurt het heel erg lang voor ze allemaal op het scherm van je bezoeker staan. En wachten is voor niemand leuk!

Dus moet je de foto’s kleiner maken. Maar hoe?

Hoe kan je je foto’s verkleinen?

Je kan hiervoor fotobewerkingsprogramma’s gebruiken. Maar gelukkig bestaan er ook alternatieven!

Een eerste alternatief is “Change DPI of image”.

DPI staat voor “dots per inch” en is een meeteenheid om de resolutie uit te drukken.  Voor een website is een resolutie van 72 dpi zeker voldoende. Dus kan je via deze website je afbeelding ‘verkleinen’ naar 72 dpi.

https://convert.town/image-dpi

Let op de afmeting van je afbeelding

Een doorsnee desktop-scherm is tegenwoordig 1280 pixels breed en 768 pixels hoog. Grote gangbare schermen zitten op 1920 pixels breed en 1080 pixels hoog.

Je afbeelding moet dus zeker niet groter zijn, want dan past ze toch niet op een gewoon scherm!

Een afbeelding is al gauw 11.000 pixels breed.  Véél te breed dus voor een gewoon computerscherm!

Als je een afbeelding als achtergrond wil gebruiken, is 1920 pixels zeker goed.

Wil je de afbeelding gewoon in de tekst plaatsen, dan maak ik ze meestal 800 pixels breed.

Via de website https://picresize.com/ kan je afbeeldingen makkelijk van formaat wijzigen.

Je kan je foto’s ook bijsnijden, draaien of zelfs een speciaal effect toepassen!

Maar vooral optie 2 is dus belangrijk: Resize Your Picture.

Ik duid meestal “custom size” aan en geef dan de gewenste breedte in (800 px). Aan de rechter kant zie je dan dat de afmeting van de hoogte zich vanzelf aanpast.

De afbeelding downloaden en dan merk je dat ze véél kleiner is geworden dan het oorspronkelijke bestand! En toch blijft ze kwalitatief voldoende.

Laat je niet vangen, de grote groene “Download”-knop is niet degene die je nodig heb! Je moet “Save to Disk” kiezen.

Tenslotte nog de magic trick

Via de website https://tinypng.com/ kan je uiteindelijk de grootte van je afbeelding nog een laatste keer optimaliseren.  De website haalt alle “overbodige” informatie uit het bestand en zo wordt je afbeelding nog eens vele keren efficiënter!

Veel succes ermee!

27 okt 2016 | webdesign

Small meer info

Graag meer info?

Breng variatie in je tekst

Heb je veel te vertellen? Dan kan je website er al gauw als een saaie encyclopedie gaan uitzien.  Met de tips in dit bericht zorg je ervoor dat...

Wat is linkbuilding?

Linkbuilding is het bouwen van een netwerk van zoveel mogelijk linken naar jouw website. We geven je enkele tips!

Begin vandaag aan jouw nieuwe website

Expert zijn in ons vak. Daar gaan wij voor. Als webdesigner, grafisch ontwerper, fotograaf of copywriter. Wij leggen onze lat hoog zodat jouw huisstijl en website tot in de puntjes verzorgd zijn.

Wil je ons leren kennen? Vraag dan een afspraak en wij maken graag tijd voor jou!

Inschrijven netwerkevent

Yes! Je hebt gelijk, netwerken kan je bedrijf écht een boost geven! Connecteren met gedreven netwerkers, mensen die jouw bedrijf graag willen ondersteunen en vooruit helpen.  Dat is wat een goede ondernemer doet!

Vul hieronder jouw gegevens in en dan zorgen wij dat je warm onthaald wordt!

Tot snel!

Inschrijven Netwerkevent

Inschrijven Netwerkevent