—
Insights
Are You Making These Common Mistakes That Increase Your Website Carbon Emissions?
12 September 2024
When it comes to minimising our carbon footprint, most of us will think about such things as using the car less or using the recycling bin more frequently. However, you may not be aware that your website also plays a part in your carbon footprint. Surprisingly, websites can consume a significant amount of energy and therefore have a large carbon footprint if not well designed and managed. The good news is that by avoiding common mistakes and making small adjustments, you can decrease your website’s carbon footprint and help make the internet greener. Now, let’s look at the most frequent mistakes that contribute to high website carbon emissions and how to avoid them.
Using Unoptimised Images and Videos
The first common mistake is that full size images and videos are usually not optimised for web display and thus take longer to load and consume more data which leads to more carbon emissions.
An example of this, is when a webpage with several large, high-resolution images such as those that are 5MB in size each will take a long time to load and will use more energy as data is transferred from the server to the user’s browser.
How Can You Solve This? 💡
Ensure you compress all images uploaded to your site using tools like TinyPNG or ImageOptim to compress images without sacrificing quality. Aim for image sizes under 500KB when possible.
Choosing the right file format is also important. Using modern formats like WebP or AVIF, which provide better compression and quality compared to older formats like JPEG and PNG can really reduce your sites emissions.
Implementing lazy loading defers the loading of images and videos until they are needed (i.e., when they come into the user’s view). This reduces initial page load time and data usage.
By optimising images and videos, you can reduce your website’s carbon footprint while also enhancing user experience with faster load times.
Neglecting Website Caching
The second common mistake is failing to implement proper caching strategies can cause your website to use more server resources and energy every time a user accesses your site.
For example, a website that doesn't use browser caching will force users to download all site resources (images, CSS files, JavaScript, etc.) every time they visit, even if those resources haven't changed since their last visit. This increases data transfer and server load unnecessarily.
How Can You Solve This? 💡
Enabling browser caching by configuring your server to allow browsers to store static resources locally, so they don’t have to be re-downloaded on every visit. This can be set through HTTP headers like Cache-Control and Expires.
A CDN caches your content on multiple servers around the world, reducing the distance data must travel and improving load times, which reduces energy consumption. Popular CDNs include Cloudflare, Akamai, and AWS CloudFront.
By implementing caching strategies, you can reduce the number of server requests and the energy needed to deliver your website to users.
Overusing JavaScript and Heavy Plugins
Another mistake is using excessive JavaScript libraries and heavy plugins can make your website slower and more resource-intensive, leading to higher carbon emissions.
For example, using multiple JavaScript frameworks (like jQuery, React, and Angular) or heavy plugins for functionalities that could be achieved with simpler solutions. This not only increases the file size of your pages but also requires more processing power on the client side.
How Can You Solve This? 💡
Audit your javaScript by regularly review your JavaScript to remove unnecessary libraries and plugins. Use lighter, more efficient code when possible. You can use platforms like Biosites to monitor your website's file sizes and carbon emissions.
Minimise plugin usage by limiting the number of plugins you use and disable or remove any that are not essential. Look for lightweight alternatives that perform the same function.
Defer non-essential Scripts by using the defer or async attribute to load non-essential JavaScript after the main content has loaded, reducing initial load time and improving performance.
Optimising javaScript and minimising plugin usage can significantly reduce your website’s carbon emissions while enhancing overall performance.
Failing to Optimise for Mobile Devices
Not optimising your website for mobile devices can lead to longer load times and increased data usage, especially since mobile connections often have higher latency and lower speeds compared to desktop connections.
An example would be, a desktop-only website that serves the same large images and resources to mobile users will consume more data and energy, especially if the images are not scaled down appropriately for smaller screens.
How Can You Solve This? 💡
Use responsive design and ensure your website uses responsive design techniques to adapt the layout and content to different screen sizes, which helps reduce data usage on mobile devices.
Serve optimised resources for Mobile by using CSS media queries or JavaScript to detect the device type and serve appropriately sized images and resources.
Implement mobile-first practices and design your website with mobile users in mind first, ensuring it is lightweight and efficient on smaller, less powerful devices.
By optimising for mobile, you can ensure a faster, more efficient experience for mobile users while reducing your website’s carbon footprint.
Choosing Inefficient Hosting Providers
Hosting your website with providers that rely heavily on non-renewable energy sources contributes significantly to carbon emissions.
Many traditional hosting providers use data centres powered by coal or natural gas, leading to higher carbon emissions for every server request.
How Can You Solve This? 💡
Choose hosting providers that use renewable energy to power their data centres. Providers like GreenGeeks, SiteGround, and A2 Hosting offer green hosting options.
Optimise server resources by choosing a hosting plan that suits your website’s needs without over-provisioning. Reducing the number of unnecessary server resources reduces energy consumption.
Use efficient server technologies and implement technologies like HTTP/2 or HTTP/3, which offer more efficient data transfer, reducing energy consumption and improving user experience.
By selecting a green hosting provider and optimising server resources, you can significantly cut down on your website’s carbon emissions.
Conclusion
It is not only beneficial for the environment to minimise your website’s carbon footprint but also beneficial for the users and can even help to optimise your site for search engines. If you do not want your online presence to be a part of these mistakes, then you should follow the solutions given above. As you can see, even the slightest changes make a big difference in the end!