In 2025, websites, apps and online services consume more energy than ever, with the average website producing as much as 1.76g of CO₂ per page view. This makes websites a significant contributor to global carbon emissions. While digital may seem intangible, its impact on the environment is very real.
As designers, this presents both a challenge and an opportunity. By making intentional choices in how we design websites, we can reduce energy use and support a more sustainable web. Let’s explore how we can make a difference.
Understanding sustainable web design in 2025
As of 2025, the internet is responsible for approximately 3.7% of global carbon emissions. This is more than aviation. These emissions stem from the energy demands of data centres that power servers and networks required for hosting and browsing websites.
Sustainable web design is an approach that focuses on reducing the environmental impact of websites through efficient, intentional choices. It emphasises efficiency, cleaner energy use and thoughtful design choices to minimise energy consumption and associated carbon emissions.
Why sustainability matters in web design
Sustainability matters in web design because it helps reduce the environmental impact of digital experiences. By integrating sustainable practices, designers and developers can:
- Reduce energy consumption.
- Optimise resource usage.
- Promote a more responsible approach to digital development.
Embracing sustainability not only benefits the planet but also often leads to faster, more efficient websites that enhance user experience.
Practical steps designers can take for greener websites
Designers play a key role in reducing the environmental footprint of websites. Here are some practical steps designers can take to create a more sustainable digital experience:
1. Optimise images
One of the most important steps you can take to improve web sustainability is ensuring images are compressed and appropriately sized. This not only improves load speed but also reduces energy consumption.
At Bigger Picture, we use Imgix to handle image optimisation. This allows us to automatically compress and resize images based on device size and screen resolution. Images are served in modern formats like WebP or AVIF and delivered via a CDN to reduce latency.
We also carefully manage how many images are loaded on each page. Above-the-fold content is prioritised while the rest is lazy-loaded only when needed.
We routinely audit the waterfall of requests in our performance tools to ensure only the essentials load. If we spot any images tucked away in CSS background-image properties, which can’t be lazy-loaded, we rewrite them using <img> elements with proper lazy loading attributes.
2. Write clean, efficient code
Using clean code can reduce unnecessary processing and bandwidth usage. In many cases, the same user experience can be achieved with smaller script. Efficient code can also increase load speeds and help with your SEO efforts.
Our development team takes this a step further by engineering code that loads only when it is needed. We favour on-demand JavaScript execution, loading and running scripts only after a user interacts with specific elements.
This contributes to sustainable web design as it:
- Reduces initial payload
- Speeds up render time
- Lowers energy use
3. Implement dark mode options
Dark modes can save energy, as well as reducing eye strain. By opting for darker colour palettes which reduce screen brightness requirements, you can reduce power consumption by 63%.
4. Choose greener hosting providers
Selecting web hosts that run on renewable energy or have strong sustainability practices can help this effort. Most reputable providers will have a sustainability policy, which you can use to compare the environmental factors before deciding on who to use.
At Bigger Picture, we host the majority of our sites with DigitalOcean. They are a leading cloud infrastructure provider who have made significant commitments to sustainability. Their key sustainability features include:
- 100% renewable energy in London: DigitalOcean’s London data centre operates on 100% renewable energy. This ensures that the electricity powering hosted websites and applications is sourced from clean, sustainable sources.
- Green data centre partnerships: They collaborate with global data centre providers who are recognised for their environmental practices, including energy-efficient infrastructure and reducing carbon footprints.
- Transparency: DigitalOcean provide a detailed power usage report and certification for each data centre. This offers transparency to their customers about the environmental impact of their hosting.
5. Use lazy load when appropriate
Lazy loading is a technique where images, videos and other heavy assets are only loaded when they are needed. This reduces the initial load time of a webpage, leading to a faster and more energy-efficient user experience.
In our projects, we rely heavily on native lazy loading but also develop custom lazy load logic where necessary. If a site includes a mega menu or interactive tabbed interface that contains images or video thumbnails, we delay their loading until a user opens the section. This avoids loading hidden assets that may never be viewed, saving bandwidth and energy.
6. Make navigation easy
Clear navigation helps users find what they are looking for quickly and with minimal clicks. This means fewer pages need to be loaded, reducing resource usage and energy consumption.
To make navigation easy, we:
- Limit the number of primary menu items, ideally between 5-7, to avoid overwhelming users and to reduce cognitive load.
- Group related items logically, helping users quickly locate the information they are looking for.
- Use clear, descriptive labels to make it easier for users to find what they need quickly.
- Prioritise essential pages in the main navigation to help users achieve their goals in as few clicks as possible. This also reduces any unnecessary page loads and energy use.
We aim to follow this approach, minimising the number of pages to avoid choice fatigue and enhance intuitive user journeys (UJs).
7. Have a caching solution
By using caching effectively, you can reduce the number of requests made to the web server by people who view several pages. This reduces both server energy usage and emissions from data transfer.
At Bigger Picture, we implement multi-layer caching strategies to enable advanced offline support and instant reloads, including:
- Edge caching with Cloudflare
- Static asset caching via HTTP headers
- Custom service workers
We also consider the browser’s back/forward cache (bfcache), which allows previously visited pages to load instantly when users navigate using their browser buttons. This eliminates the need for reprocessing and reducing CPU cycles.
8. Carry out regular website housekeeping
Over time, websites accumulate unnecessary or outdated files, content, plugins and scripts. This digital clutter increases page weight and server load. This can lead to longer load times and higher energy consumption.
Regular audits of your website not only improve the speed and usability but also ensure you are not wasting resources delivering content that is no longer relevant.
Measuring your website’s sustainability
Once you’ve implemented sustainable design practices, the next step is measuring their effectiveness. Fortunately, several tools are available to help assess how efficiently your site uses resources:
- Website Carbon Calculator: Estimates the carbon emissions per page view and provides suggestions for reducing your site’s footprint.
- Ecograder: Evaluates your website’s performance across several sustainability factors, including energy usage, page speed and best practices.
Regularly monitoring your site with these tools helps track progress, identify problem areas and ensure your design choices align with sustainability goals.
Sustainable web design with Bigger Picture
At Bigger Picture, sustainability is built into the way we design and develop websites. We believe digital experiences should not only be fast and user-friendly but also environmentally responsible.
If you’re ready to reduce your website’s environmental impact, we would love to help. Get in touch with Bigger Picture and start your sustainability journey today.