Make your website use less water

Why a website uses water

Every page you send goes through servers and networks. They use electricity and get hot. Many data centres are cooled with water, and making electricity uses water too. Sending less data means less energy and less water.

Ten simple, free steps

1. Lighter images: WebP or AVIF, at the right size, with srcset so phones get a small version.
2. Lazy loading: loading="lazy" and decoding="async" for images below the fold.
3. Long cache: Cache-Control: max-age=31536000, immutable for files whose name changes with each version.
4. Static site and CDN: fixed pages, served close to the visitor, with no work on each visit.
5. No autoplay video or audio: only play when the person clicks.
6. Less JavaScript: remove what is unused, load the rest only on the page that needs it.
7. Honour prefers-reduced-motion and pause animations when the tab is hidden.
8. Few third-party scripts: no trackers or needless widgets.
9. Fonts: few weights, WOFF2, split by alphabet.
10. Measure: test your pages with a tool like EcoIndex, before and after.

What Lapis does

• Static pages on a CDN, with no database and no live AI.
• WebP images in three sizes (srcset), lazy-loaded below the first screen.
• WOFF2 fonts split by alphabet: only the needed alphabet is downloaded.
• No trackers, no ads, no autoplay video.
• Game animations pause when the tab is hidden, and “reduce motion” is respected.

Weight measured at first load (390 px phone)

Page	Before	After
Accueil /fr/	486 KB	487 KB
Jeu /fr/jeu/	381 KB	382 KB
Musique /fr/musique/	217 KB	218 KB

Sources

• W3C — Web Sustainability Guidelines
• Green Web Foundation
• GreenIT.fr — EcoIndex
• MDN — Lazy loading

This guide is free. It recommends no product.

Free tool: Lean site checker

All our free tools →