Skip to content

Added WebP Images

Ollie requested to merge ojdon/postmarketos.org:master into master

I'm trying to get into contributing back to open source projects using my knowledge in Web Development... I thought I would take a look at the PostmarketOS website via Google Lighthouse reports and see if I could improve the score in any way.

As suspected it's in decent shape already, the only suggestion from the performance report was to introduce using WebP images over jpg or png.

I went through using this command to convert the existing images using the cwebp command via:

find <INSERT SOURCE DIRECTORY> -type f -name "*.jpg" -exec sh -c 'dir="$(dirname "{}")"; mkdir -p "$dir/webp"; cwebp -q 80 "{}" -o "$dir/webp/$(basename "{}" .jpg).webp"' \;

Then I wrapped the webp images in a <picture> tag so I can still use jpgs as fallback. I also did the same for background images in CSS.

Let me know what you think, if it's all good, I'll take a look at a few more minor accessibility and semantic fixes.

Merge request reports