Over WebP en WebM

Aangepast op 11-8-2024.

Inleiding

Het internet kent verschillende standaarden voor plaatjes en films.
Bekende zijn:

Wanneer gebruik je wat - plaatjes

JPG

JPG gebruik je voor foto's. Vrijwel iedere digitale camera slaat de foto's op in JPG-formaat.

JPG is een goede belans tussen detail, kleur en dynamiek. JPG is kleiner dan het oorspronkelijke RAW-formaat dat de camerasensor levert. De computer in de camera bewerkt de RAW-versie tot een mooi(er) plaatje: het is scherper en heeft betere kleuren.

PNG

PNG gebruik je voor kleurenplaatjes die minder complex zijn dan foto's.
Voorbeelden zijn schermafdrukken.
PNG is klein en bevat genoeg gegevens om een mooi plaatje te laten zien.
Je kunt PNG heel goed op websites en in documenten gebruiken.

GIF

GIF-bestanden bevatten maximaal 246 kleuren.
Een GIF-plaatje is groter dan hetzelfde plaatje in PNG-formaat en toont minder details en nuances.
GIF gebruik je dus niet.

WebP

WebP is de nieuwe plaatjesstandaard.
Google heeft de standaard ontworpen rond 2010.
WebP is gebaseerd op html-5, de huidige standaard voor internet.
Het comprimeert meer dan png en jpg, 
De meeste browsers en mediaspelers kunnen er goed mee overweg, maar niet allemaal.

WebP levert het kleinste formaat op, dus als formaat belangrijk is, kun je dit overwegen (en testen!).

Conclusie

Als het kan, gebruik dan het WebP-formaat.

Tip: comprimeer plaatjes en/of sla ze op in een ander formaat Squoosh

Als je plaatjes aan een website of document toevoegt, wil je graag dat het bestand zo klein mogelijk is: dan laadt de pagina sneller in de browser van de bezoeker.

Hiervoor kun je de (gratis) PWA Squoosh van Google gebruiken.

Met Squoosh kun je naar keuze plaatjes:

De mate van compressie hangt van het plaatje en de instellingen af.
In het voorbeeld hieronder is het resultaat (WebP) een kwart van het origineel (PNG).

Originele schermafdruk in png-formaat (432 KB):

In Squoosh gecomprimeerd en als WebP-bestand opgeslagen (129 KB):

Wanneer gebruik je wat - filmpjes

WebM

WebM is gebaseerd op html-5, de huidige standaard voor internet. De meeste browsers en mediaspelers kunnen er goed mee overweg. Lukt het niet, dan kan dit (Nederlandstalige) artikel in All Things IT je misschien helpen. Youtube maakt gebruik van WebM.

MP4

MP4 is een al langer bestaande standaard. Hij ondersteunt meer technieken en is zonder problemen met elke computer af te spelen. 

GIF

GIF-filmpjes spelen meestal automatisch af en beginnen steeds opnieuw.
Sommige mensen vinden dat zijn, andere ergeren zich daaraan.

Conclusie

Maak van een filmpje als het even kan een WebM-bestand. Hierdoor wordt het bestand ongeveer 5 keer kleiner.

Let op: als je een link in beeld hebt staan, werkt de link niet in een WebM-bestand.

Ondersteuning voor WebM (situatie maart 2023):

Het WebM-bestand is bijna 5x kleiner dan de MP4-versie:

Een ietwat technisch verhaal om de verschillen tussen WebM en MP4 uit te leggen (bron: ChatGPT):


MP4 en WebM zijn beide videocontainerformaten die worden gebruikt om video-inhoud op het web op te slaan en af te spelen, maar er zijn enkele belangrijke verschillen tussen deze twee formaten.
MP4 (MPEG-4 Part 14) is een populair containerformaat dat wordt ondersteund door de meeste webbrowsers en apparaten. Het is ontworpen om video, audio en ondertitels op te slaan in één bestand. MP4 ondersteunt een breed scala aan codecs voor compressie van video en audio, zoals H.264 voor video en AAC voor audio.
WebM is een open-source containerformaat dat is ontwikkeld door Google en dat is gebaseerd op de VP8-videocodec. Het is ontworpen om video-inhoud op het web te leveren met een hogere kwaliteit en kleinere bestandsgrootte dan andere formaten. WebM wordt ondersteund door de meeste moderne webbrowsers, waaronder Google Chrome, Mozilla Firefox en Opera.
Het belangrijkste verschil tussen MP4 en WebM is de codec die ze gebruiken. MP4 ondersteunt een breed scala aan codecs, terwijl WebM alleen de VP8- en VP9-codecs ondersteunt. VP8 en VP9 zijn open-source en bieden over het algemeen een betere beeldkwaliteit dan H.264, wat vaak wordt gebruikt in MP4-bestanden. Bovendien is WebM over het algemeen efficiënter in het comprimeren van video dan MP4, waardoor kleinere bestandsgroottes worden geproduceerd zonder verlies van kwaliteit.
In het algemeen wordt MP4 aanbevolen voor algemene compatibiliteit en het afspelen van video op oudere apparaten, terwijl WebM wordt aanbevolen voor hogere kwaliteit en kleinere bestandsgroottes op moderne apparaten.

Google's Gemini zegt er dit over:


De keuze tussen MP4 en WebM hangt af van wat je met de video wilt doen:MP4
  • Voordelen:
    • Bredere compatibiliteit: MP4 wordt vrijwel overal ondersteund, van computers en telefoons tot smart-tv's en oudere mediaspelers.
    • Hogere kwaliteit bij dezelfde bestandsgrootte: Over het algemeen biedt MP4 iets betere beeldkwaliteit dan WebM bij vergelijkbare bestandsgroottes.
    • Beter voor offline gebruik: Als je video's wilt opslaan en afspelen op apparaten die mogelijk geen internetverbinding hebben, is MP4 de veilige keuze.
  • Nadelen:
    • Minder geschikt voor streaming: Hoewel MP4 kan worden gestreamd, is WebM over het algemeen efficiënter voor online videoweergave.
    • Mogelijk licentiekosten: Voor commercieel gebruik van bepaalde MP4-codecs kunnen licentiekosten van toepassing zijn.
WebM
  • Voordelen:
    • Uitstekend voor streaming: WebM is speciaal ontworpen voor online video en biedt snelle laadtijden en soepele weergave in webbrowsers.
    • Kleinere bestandsgrootte: WebM-bestanden zijn vaak iets kleiner dan MP4-bestanden bij vergelijkbare kwaliteit, wat bandbreedte bespaart.
    • Open en royalty-vrij: WebM maakt gebruik van open-source codecs, dus er zijn geen licentiekosten verbonden aan het gebruik ervan.
  • Nadelen:
    • Beperkte compatibiliteit: Hoewel WebM steeds meer ondersteund wordt, is het nog niet zo universeel als MP4, vooral op oudere apparaten.
    • Iets lagere kwaliteit: Bij dezelfde bestandsgrootte kan WebM een iets lagere beeldkwaliteit hebben dan MP4.
Conclusie
  • Gebruik MP4 als je de video op verschillende apparaten wilt afspelen, de beste kwaliteit wilt of als je de video offline wilt gebruiken.
  • Gebruik WebM als je de video voornamelijk online wilt streamen of als bestandsgrootte een belangrijke factor is.
Extra tip: Als je video's bewerkt, is het vaak handig om in een verliesloos formaat te werken (zoals ProRes of DNxHD) en pas aan het einde naar MP4 of WebM te exporteren voor het gewenste doel.