085 130 0595
info@web-wings.nl
Terug naar overzicht

Wat is het verschil tussen JPG, PNG en GIF?

JPG, JPEG, PNG, GIF. Allemaal verschillende bestandstypes, maar wat betekenen ze nu eigenlijk en welk type is het beste voor het gebruik op jouw website? Dit zijn vragen die regelmatig naar boven komen op het moment dat je aan de slag gaat met het online beter op de markt zetten van jouw eigen bedrijf.

In deze blog zal ik het verschil toelichten tussen JPG, PNG en GIF. Daarnaast zal ik ook toelichten welk bestandtype je in welke situatie het beste kan gebruiken. Laten we eerst starten met een korte richtlijn. Meer weten over de camera zelf? Lees dan eens onze blog over het verschil tussen een spiegelreflexcamera en een systeemcamera.

  • PNG is het meest ideaal voor het gebruik van afbeeldingen met een transparante achtergrond.
  • JPG komt het best tot zijn recht bij foto’s met veel kleur en detail.
  • GIF wordt toegepast bij abstracte afbeeldingen zoals logo’s, grafische tekeningen, tekst afbeeldingen ect.

Wat is een JPG bestand?

JPG staat afgekort voor Joint Photographic Group en is het meest gebruikte bestandtype voor foto’s. JPG is een gecomprimeerd beeld wat ervoor zorgt dat de bestandsgrootte wordt verkleind.
Dit heeft als voordeel dat een JPG bestand sneller kan worden geladen. Het nadeel daar tegen over is wel dat het bestand wat kwaliteit verliest. Dit neemt toe naarmate je de compressie hoogte vergroot. Voor online gebruik is dit geen probleem. Wil je deze gecomprimeerde afbeelding offline gebruiken of laten afdrukken, dan zal het kwaliteitsverlies zichtbaar worden.

Daarnaast zijn JPG afbeeldingen ook geschikt voor op social media. Deze kanalen hanteren namelijk strenge regels m.b.t. de bestandsgrootte.

Wanneer gebruik je een JPG op je website?

JPG-bestanden zijn geschikt voor gebruik op websites voor afbeeldingen met veel kleurinformatie en kleurovergangen. Het bestandstype is ideaal voor grote afbeeldingen zoals afbeeldingen die op de gehele breedte van de pagina worden geplaatst. Zoals we hierboven al vertelde, zorgt de compressie van de afbeelding ervoor dat de laadtijd wordt verkort.

Wat is het verschil tussen JPG en JPEG?

Laten we je maar meteen even uit de verwarring halen. JPEG en JPG zijn namelijk precies hetzelfde. Waar JPG afgekort staat voor ‘Joint Photographic Group’, staat JPEG afgekort voor ‘Joint Photographic Expert Group’. Dit is de officiële benaming van het bestandstype. Echter konden de computer systemen van vroeger nog niet overweg met extensie benamingen van 4 letters. Om deze reden is JPEG toen afgekort naar JPG.

Google mijn bedrijf toegang

Wat is een PNG bestand?

PNG is een bestandstype dat eigenschappen van JPG en GIF combineert. PNG is het meest geschikt voor als je een afbeelding zonder achtergrond wilt plaatsen op je website. Doordat je de achtergrond van een afbeelding weg haalt, zal de afbeelding kleiner worden qua bestandsgrootte. Ideaal dus voor online gebruik. Je website zal er een stuk sneller op worden en het bevordert zo ook je SEO prestatie. Heb je een afbeelding met veel kleur en een mooie achtergrond die je graag wilt behouden? Dan moet PNG je toch teleurstellen. In dit geval is de bestandstype namelijk groter dan een JPG-formaat. Je vraagt je nu vast af hoe dit mogelijk is. Het zit namelijk zo. Een PNG bestand wordt net als een JPG bestand gecomprimeerd. Echter heeft een PNG bestand geen beeldkwaliteit verlies, wat betekent dat hij niet zo ver comprimeert als een JPG bestand. In dit geval kan je dus beter voor een JPG bestand kiezen.

Lees meer  5 User centered design tips voor je website!

Wanneer gebruik je een PNG op je website?

Een PNG is vooral geschikt voor logo's, pictogrammen, infographics en illustraties. Ook voor afbeeldingen zonder achtergrond wordt het PNG formaat gebruikt. Dit bestandstype zorgt er namelijk voor dat er geen kwaliteit verloren gaat bij een transparante achtergrond. Maar houd er wel rekening mee dat PNG bestanden vaak groter zijn dan bijvoorbeeld JPG, dit kan namelijk zorgen voor een langere laadtijd van je website.

Hoe zet je een PNG om maar een JPG, en andersom?

Er zijn verschillende manieren om een PNG bestand om te zetten naar een JPG bestand en andersom. Hierbij moet je er wel rekening mee houden dat het omzetten van bestanden van het ene naar het andere formaat, kan zorgen voor kwaliteitsverlies. Controleer de bestanden die je hebt omgezet dus altijd voor je ze gebruikt.

PNG naar JPG

  1. Open het PNG bestand in een beeldbewerkingsprogramma. (Adobe Photoshop)
  2. Klik op 'bestand' in de menubalk en selecteer 'opslaan als'.
  3. Kies 'JPG' als bestandstype en geef de nieuwe bestandsnaam op.
  4. Klik op 'opslaan' en kies de gewenste compressie-instellingen voor het JPG bestand.

JPG naar PNG

  1. Open het JPG bestand in een beeldbewerkingsprogramma. (Adobe Photoshop)
  2. Klik op 'bestand' in de menubalk en selecteer 'opslaan als'.
  3. Kies 'PNG' als bestandstype en geef de nieuwe bestandsnaam op.
  4. Klik op 'opslaan' en kies de gewenste compressie-instellingen voor het PNG bestand.

Wat is een GIF bestand?

Een GIF bestand bevat weinig gekleurde pixels wat er voor zorgt dat de bestandsgrootte ook beperkt blijft. Hierdoor is het geschikt voor strakke lijnen, logo’s en tekstafbeeldingen, maar niet voor foto’s. Foto’s zullen hierdoor zichtbaar sterk in kwaliteit dalen. Oké, een hoop informatie om te verwerken. Laten we even praktisch kijken naar wat dit betekent voor SEO.

WebWings Logo PNG

Afbeelding type bij SEO

Je wilt natuurlijk zo hoog mogelijke SEO prestaties leveren.  Daarnaast is het ook wel zo prettig wanneer je website van hoge snelheid is, zodat je bezoekers niet snel afhaken. Het is dus belangrijk om vooraf na te denken over met welk bestandstype je te werk gaat op je website.

Selecteren van het juiste bestandstype

Stel jezelf vragen over het type en doeleinde van de afbeelding/illustratie. Een aantal voorbeeld vragen zijn: Is het een afbeelding of een illustratie?  Laat je de achtergrond transparant?  Wil je een logo plaatsen met mooie strakke lijnen?  Aan de hand van al deze overwegingen bepaal je welk bestandstype je het beste kunt kiezen. Een handige tool is het volgen van het onderstaand schema.

Over de auteur

Laura Gorissen

Hi! Ik ben Laura Gorissen en ben Projectmanager Webdesign bij Web Wings. Tijdens mijn studie Ondernemerschap & Retailmanagement startte ik als Trainee Marketing en SEO bij Web Wings, waar ik een brede basis leerde op het gebied van…

Meer lezen...

Recent nieuws

24 september 2024

DNS en NS: Wat is het verschil en hoe gebruik je het?

17 september 2024

Wat is reCAPTCHA

4 augustus 2024

9 SEO tips om je website te laten ranken in 2024

29 juli 2024

Wat zijn orphan pages en welk effect hebben ze op SEO?

18 juli 2024

Een over ons-pagina schrijven? Dit zijn de do's en don'ts

arrow-right