Op Mastodon zag ik een aankondiging met daarin aandacht voor de energie die het ophalen van een website kost, en daarmee het volume van de CO2 die in de lucht wordt geblazen bij de stroomopwekking. Dat schijnt men tot achter de komma te kunnen berekenen. Slim hoor. Ik was benieuwd hoe de kleine website die ik onderhoud het zou doen. Vast goed, want het is toch maar een kleine website?

Niet dus. Dat is even schrikken. Ik had al mijn foto's toch in webp-formaat omgezet? Kennelijk maakt dat dus niet veel verschil uit. Nu wist ik wel dat ik al de foto's op de site nog eens zou moeten bekijken, en het aantal pixels flink moest gaan verkleinen. Maar ik wist niet wat een goede resolutie zou zijn. Niet te veel pixels want dat kost dus energie en snelheid bij het inladen van de pagina, maar ook niet te laag zodat de scherpte van de foto te laag wordt en alles er erg lelijk zou uitzien. Eerlijk gezegd was ik een beetje lui, want ik vond dat allemaal maar een gedoe. En eigenlijk ook een beetje dom (om onze koningin maar eens een keer te citeren), want ik had niet gedacht dat die kleine pixeltjes zoveel zouden uitmaken.

Gelukkig geeft de website veel tips om je site te verbeteren. Voor mij was van belang dus om die foto's kleiner te krijgen, zonder dat je te veel aan kwaliteit inlevert. De gouden tip:

Dus ga naar de website Bulk Resize kies voor de optie “longest side” van 1920 pixels en een kwaliteit van 80%. Dat is makkelijk! Hoef ik niet na te denken, en dat zonder AI. Geen gewik en geweeg over hoeveel pixeltjes meer of minder bij iedere foto. Stel het zo in, en converteer alle foto's in één keer. Poef!

En als je vaker foto's op deze manier wil behandelen, dan kun je de url waar die opties in verwerkt staan kopiëren en in de toekomst gebruiken. https://bulkresizephotos.com/en?type=longestSide&longest=1920&format=webp&quality=80 Even een terzijde: zo kun je dus andere websites met carbonfooter testen, en de eigenaren van slecht presterende websites opbellen met de mededeling dat je voor een klein bedrag hun website flink kunt verbeteren. 't Is maar een tip voor wie nu even geen werk heeft.

Het energielabel is in ieder geval flink verbeterd, maar nog niet optimaal.

Ik heb nog een drietal png-bestanden die ik eerder niet omgezet heb naar webp. Als ik die in de converteermachine stop met dezelfde parameters, dan gaat het helemaal fout: ze worden dus groot en rafelig. Precies waar ik bang voor was. Die hebben dus een persoonlijke behandeling nodig, en daarom komen die voorlopig in de wachtrij te staan. Of ik zal ze eens met andere parameters converteren. Ik probeer gewoon de compressie-optie. Die brengt je naar een andere website. Dat gaat beter. De bestanden zijn stukken kleiner geworden. Helaas is de score van de CO2 footprint nog ongeveer hetzelfde. De enige optie die ik nog zie is om de foto's door tekst te vervangen, zoals wordt geopperd op Carbonfooter.

Sommigen zeggen “Een afbeelding zegt meer dan duizend woorden”, maar wij zeggen liever: “Zeg het met woorden en bespaar duizend bytes.”

Maar dan schieten we het doel van de website zelf voorbij, vind ik. De iIllustraties geven mensen een indruk van de omgeving waar ze mogelijk naar toe gaan om van de aangeboden diensten gebruik te maken. Deze website mistynotes.nl is een blog, en heeft niet veel illustraties nodig. Zo heeft die moeiteloos een A-label.

In ieder geval is het optimaliseren van afbeeldingen door die bulkresize-website een fluitje van een cent, en omdat er niks wordt ge-upload ook nog privé. Geen idee waar die site van betaald wordt, maar hopelijk volgt die niet dezelfde weg van platformverval als zoveel andere leuke initiatieven zijn gegaan.

Tja, lui ben ik dus wel gebleven door al dat gemak, maar ik ben wel weer een heel klein beetje slimmer geworden, want ik heb alweer wat geleerd over kleine pixels die toch wel erg belangrijk kunnen zijn.

Foto via Robert Zunikoff op Unsplash

#website #webp

Discuss...

Laatst was ik op zoek naar een bedrijf dat hulp of begeleiding biedt met hosting voor onze website kantamassage.nl. Het leuke is, dat je dan meteen ook blogjes leest om een indruk te krijgen van dat bedrijf. En ik las dit blogje over het voordeel van het webp-formaat voor afbeeldingen. Nu had ik er al eerder aan gedacht om al de jpg afbeeldingen om te zetten, en één afbeelding had ik al in webp formaat gezet, maar ik vond het steeds veel te veel werk om al die afbeeldingen te converteren. En... dat is het eigenlijk helemaal niet!

Want er is een heel oud en uitgebreid converteerprogramma beschikbaar: Imagemagick. Dit programma biedt via de commandline de mogelijkheid om een heleboel bestanden ineens te verwerken. Als je Imagemagick installeert heb je, naast het commando imagemagick, de beschikking over een aantal commando's die je in een terminalvenster kunt gebruiken. Eén ervan, convert, had ik al gebruikt, om pdf bestanden om te zetten in een jpg bestand, zonder dat je er een screenshot of een andere work-around voor hoeft te gebruiken.

convert -density 300 -quality 100 filenaam.pdf filenaam.jpg

Dat ging heel snel en makkelijk, daarom dacht ik dat die magie ook gebruikt zou kunnen worden om snel webp-bestanden aan te maken. Ik moest er wel even voor zitten. Het commando is kennelijk mogrify.

mogrify -format webp *.jpg

Het resultaat levert inderdaad een aantal bestanden op die een stuk kleiner zijn dan hun jpg-versie. In een enkel geval zag ik dat het verschil niet zo groot was. Waar dat aan ligt, weet ik niet en laat ik nu maar even voor wat het is.

Daarna hoef je alleen nog een zoek- en vervang-opdracht in je html uit te voeren (alleen de index.html bij ons), waarbij alle .jpg vervangen wordt door .webp en je bent klaar. Natuurlijk ga je dat wel even testen. Het kan namelijk zijn dat de oriëntatie van de illustratie is veranderd. Althans, nadat ik het mogrify-commando had uitgevoerd was daar bij twee foto's wel sprake van. Maar iedereen test natuurlijk zijn website voordat hij hem online zet.

Simpel en stom

Voor mij is het alweer een bevestiging dat het KISS principe werkt. Had ik een ingewikkelde wp-site gemaakt, dan had ik al die foto's waarschijnlijk één voor één moeten uploaden. Misschien is er een tooltje waarmee je dat op een ftp-manier kunt doen, maar dat moet je volgens mij extra aanschaffen. En bovendien zul je op al die plekken de verwijzingen naar de illustraties moeten zoeken en de extensie in de naam handmatig aanpassen. Dat zoek- en prutswerk hoef ik gelukkig niet te doen. Jeyj!

#website #kiss #imagemagick #pdf #jpg #webp

Discuss...