How can we green the web? Do you mean by planting digital trees? No. We tend to think of the internet as being clean and immaterial. Energy consumption and emissions from the internet are huge. In total, the global internet uses more electricity than the whole of the United Kingdom (416.2 terawatt hours of electricity per year to be precise).
An average website with 10,000 page views per month would produce 816kg of CO2 per year.
The most efficient website tested is www.muskfoundation.org, Elon and Kimbal Musk’s non-profit foundation, with emissions of just 0.009 grams of CO2 per page view.
youtube.com emits the amount of carbon that 11 trees absorb in a year.
This huge power consumption of the internet has an enormous carbon footprint, and that’s something that we need to address.
Yes, this site is very green and I tried to code a website that is both green and visually appealing.
Stats:
1. This web page is cleaner than 97% of web pages tested.
2. Only 0.02g of CO2 is produced every time someone visits this web page.
3. This web page emits the amount of carbon that less than 1 tree absorbs in a year.
What have I done to make this site green?
1. I have used no images (not even a favicon) because images are a lot of data.
2. The whole file size is 28 kB.
3. No server (because was not requires).
4. Tried to use less JS.
5. Used only one custom font and used web safe fonts.
6. Clean code
I am going to list some methods through which you can reduce your website's carbon emission.
1. Use less images: On most websites, images are the single largest contributors to page weight. The more images you use and the larger those image files, the more data needs to be transferred and the more energy is used. Only add images if they really add value to the page.
2. Use less videos: Videos are by far the most data intensive and processing intensive form of content. Use them if they really are important to add.
3. Try using more web fonts: We can minimize custom fonts, which can actually add up to a large proportion of overall page size. Considering web-safe fonts is another great option.
4. Write clean code: Keep code tidy and streamlined. This also applies to external frameworks. Avoid unnecessary plugins and try to load only the functionality you need.
5. Use less JavaScript: Javascript needs to be processed so require greater amount of energy. Look for ways to achieve front end interactions, functionality and animations using more efficient technologies like CSS, or at least use JS efficiently.
6. Build static web pages: Try to build static webpages and not use server processing when it is not really required. Server and database processing needs higher energy.
7. Use a greener web hosting service: A lot of energy is used by websites in the data centre and in the transmission of data to and from the data centre. Careful selection of web hosting services can therefore have a big impact on energy efficiency and web page speeds.