The Environmental Cost of the Web
The internet's environmental impact is larger than many people realise. Data centres, network infrastructure, and end-user devices all consume energy, and a significant proportion of that energy globally still comes from fossil fuel sources. The digital sector's energy consumption and carbon emissions are comparable to those of the aviation industry, and both continue to grow.
Every website contributes to this consumption. Each time a page is loaded, data travels from servers through network infrastructure to the user's device, consuming electricity at every stage. Images are downloaded, scripts are executed, fonts are fetched, and third-party services are called — each action requiring energy. Multiply this by the billions of page views that occur daily, and the cumulative impact is substantial.
Sustainable web development — sometimes called green web development — aims to reduce this environmental impact through thoughtful design, development, and infrastructure decisions. The encouraging news, and what makes this discipline particularly compelling, is that many of the practices that reduce a website's carbon footprint also improve its performance, accessibility, and user experience. Lighter, faster, more efficient websites are simultaneously better for the planet and better for users and business outcomes.
Measuring Your Impact
Before optimising, it helps to understand the current state of affairs. Several tools can provide estimates of a website's carbon emissions per page view. The Website Carbon Calculator, Ecograder, and Beacon are among the more established options. Whilst these are approximations rather than precise measurements — calculating the exact carbon cost of a page view involves many variables — they provide a useful baseline and highlight the areas with the greatest potential for improvement.
Key Factors Influencing Energy Consumption
The primary factors that influence a website's energy consumption include:
- The total amount of data transferred on each page load
- The efficiency and volume of code executed on both server and client
- The energy source of the hosting provider's data centres
- How effectively caching is utilised to avoid redundant data transfers
- The number and size of third-party resources loaded
- How frequently users need to reload or re-download resources
Understanding which of these factors contributes most to your site's footprint allows you to prioritise your optimisation efforts where they will have the greatest effect.
Optimising Images and Media
Images typically account for the largest share of data transferred on most websites, often representing fifty per cent or more of total page weight. This makes image optimisation the single highest-impact area for reducing a website's carbon footprint.
Modern Image Formats
Modern image formats such as WebP and AVIF provide superior compression compared to traditional JPEG and PNG, delivering equivalent visual quality at significantly smaller file sizes. WebP is now supported by all major browsers, and AVIF support is growing rapidly. Migrating to these formats can reduce image file sizes by thirty to fifty per cent or more without perceptible quality loss.
Responsive Images
Implementing responsive images using the srcset attribute ensures that each device receives an appropriately sized image rather than downloading a large desktop image on a mobile phone. A user on a small screen does not need a 2000-pixel-wide hero image; serving a 600-pixel version saves considerable data transfer.
Lazy Loading
Lazy loading images that are not visible in the initial viewport defers their download until the user scrolls towards them. For pages with many images, this can dramatically reduce the initial page weight and the data transferred for users who do not scroll to the bottom of the page.
Questioning Necessity
Perhaps most importantly, question whether every image is genuinely necessary. Sometimes the most sustainable image is the one you do not include. Decorative images that add no informational value, oversized hero images, and autoplaying background videos all carry an environmental cost that should be weighed against their contribution to the user experience.
Efficient Code and Assets
Beyond images, the code and assets that power a website offer significant opportunities for reduction.
Minimising and Compressing
Minimising and compressing CSS, JavaScript, and HTML reduces transfer sizes and processing requirements. These are straightforward optimisations that should be part of every build process, yet many websites ship unminified assets in production.
Removing Unused Code
Many websites ship far more CSS and JavaScript than they actually use. Unused CSS rules that apply to no elements on the page, JavaScript modules that are imported but never called, and entire libraries included for a single function all contribute to unnecessary data transfer and processing. Auditing and removing unused code can yield substantial reductions.
Choosing Appropriate Technology
Consider whether heavyweight JavaScript frameworks are necessary for every project. A static site or a lighter framework might serve the same purpose with a fraction of the energy cost. A blog or brochure site that could function perfectly with minimal or no JavaScript does not need a full single-page application framework.
For projects where a framework is justified, tree-shaking, code splitting, and lazy loading of non-critical scripts all contribute to reduced energy consumption by ensuring that only the code needed for the current page is loaded and executed.
Font Optimisation
Custom web fonts are another common source of unnecessary data transfer. Subsetting fonts to include only the characters actually used, using modern font formats such as WOFF2, limiting the number of font weights and styles, and considering system font stacks where appropriate can all reduce font-related data transfer.
Green Hosting
The energy source of your hosting provider makes a significant difference to your website's carbon footprint, regardless of how well-optimised the site itself is. A growing number of hosting providers operate entirely on renewable energy or purchase verified renewable energy certificates to offset their consumption.
The Green Web Foundation maintains a directory of verified green hosting providers, making it relatively straightforward to identify options. When evaluating hosting providers, consider:
- Whether they use renewable energy directly or through offsetting
- The efficiency of their data centres, measured by Power Usage Effectiveness (PUE) ratings
- Their transparency about environmental practices and certifications
- The geographical location of their data centres relative to your primary audience
Caching and Content Delivery
Effective caching strategies reduce the need to transfer data repeatedly, which directly reduces energy consumption. Setting appropriate cache headers ensures that browsers do not re-download resources that have not changed. Using service workers enables offline capability, reducing network requests entirely for returning visitors.
Serving static assets through a CDN reduces the distance data must travel, which reduces latency, energy consumption in network infrastructure, and the load on origin servers. For websites with a geographically distributed audience, a CDN is one of the most effective sustainability improvements available.
Design Decisions Matter
Sustainable web development is not solely a technical discipline — design decisions have a profound impact on a website's environmental footprint. Simpler designs that use fewer images, rely on CSS for visual effects rather than image assets, employ thoughtful colour palettes (darker colours consume less energy on OLED screens), and prioritise content over decoration tend to be both more sustainable and more usable.
A Positive Cycle
At GRDJ Technology, we view sustainable web development not as a constraint but as a positive discipline that produces better websites. Faster load times, reduced data consumption, cleaner code, and lower hosting costs benefit users, businesses, and the environment alike. It is a rare instance where doing the right thing and doing the effective thing are entirely aligned, and we incorporate these principles into every project we undertake.