Ich durfte einen Vortrag von Tom Greenwood @eatwholegrain zu seinem gleichnamigen Buch hören und habe ihn in dieser Sketchnote zusammengefasst:
Inhalt des Bildes
Sustainable WebDesign by Tom Greenwood
The Problem (big red exclamation mark)
The internet uses 700 million tons CO2 per year. That's the same amount as Germany. That's also the same amount global aviation produces.
Using websitecarbon.com you can measure your website's CO2 consumption.
Don't drug the user!
There's a person in front of a game machine. The person is expecting more likes and looks drowsy.
First: Streamline user journeys
You see a person that clicks very often on a website and is getting frustrated.
Then you see a person that clicks only three times on a website and is done and very happy.
Fewer images are better than a lot of images.
A smaller image size reduces traffic on websites.
image file type
choose image formats from one of these: JPG, webp, avif. They are smaller than the original.
An image with blurred edges looks almost the same but is smaller than the original.
black & white
An image that is monochrome is often smaller than a colourful one.
Use them carfully!
Turn autoplay off by default.
Reduce time of the video.
Use lower resolution videos.
An arrow leads to the next section, saying "better":
more accessbily (a11y)
use less data. An animation can save about 90% of the data compared to a video.
System Fonts are the most efficient fonts you can use.
If you have your own: optimse custom fonts.
Use less font weights. Only provide characters you use.
"What's good for performance is usually good for the environment."
‒ Tom Greenwood ‒
Sustainable Web Manifesto
Darker colours are more energy efficient. Think about providing a dark mode in your software.
Efficient Coding Languages
There are ratings that show energy efficiency of coding languages.
Ranking from better to worse:
- C, Rust, C++
- Ruby, Perl, Python
Less priveledged people often have cheap phones and less bandwidth. Also accessibilty reaches more people.
0,5 MB is enough for an average website.
‒ Alex Russel, Google ‒
Copyright @frie321984 07/2021