How can web developers create energy-efficient sites?

If the average Google search uses 0.3 watt-hours of electricity, then about 3 watts of electricity have been consumed just doing research for this article! 

When you have the internet at your fingertips, it’s easy to forget the immense carbon footprint left annually by the internet, data centres and telecom networks. A 2016 study from Huawei researcher Anders Andrae, estimated that the Information and Communications Technology sector produced 7.8% of the world’s global energy, taking into account the carbon footprint of production facilities, fixed access wifi use, data centres and wireless networks access. Clearly, powering our devices consumes lots of electricity and, while “global internet traffic surged by almost 40% between February and mid-April 2020”, the internet’s energy consumption is expected to grow exponentially, doubling to 4.2 trillion gigabytes by 2022.

Measuring your website’s energy use, AKA its “weight”,  can be done easily through this Website Carbon Calculator. Web developers have the opportunity to optimize their web pages to merge user-friendly experiences with eco-friendly programming. Here are some factors that can help reduce the weight of your website:

 

Optimized UX (User Experience)

The ultimate goal of a smooth-running website is an intuitive interface. A user shouldn’t have to scroll and click aimlessly to find what they’re looking for. When you optimize your hyperlinks, write clear and comprehensive copy, and improve the quality of your SEO, users will spend less time searching and more time absorbing your content. Less clicks = less energy!

 

Reduced Audio Visual Content 

Remember those old websites that would bombard you with music and videos when you entered the home page? Fortunately, that has gone out of style. Excess audiovisual content not only clutters your web pages, but also uses loads of data. Choosing smaller images, avoiding videos and opting for less data-intense vector graphics can reduce your website weight and load times.

 

Font Choice

Choosing the right font is an exciting part of a designer’s job, but sometimes simple is better. Specialty font files take more data to load than system fonts like Helvetica or Times that are commonly accessible on every platform. Specialty fonts and bolded fonts weigh more and can consume nearly 300kb. Fortunately, you can reduce the file size by as much as 75% by converting your font to a WOFF2 file

 

AMP URL Explained - optimizing the website

AMP (Accelerated Mobile Pages)

AMP, which you might recognize as a small lightning bolt icon next to Google news articles, reduces excess code and weight to provide a condensed and speedier user experience. Accelerated Mobile Pages not only load faster and are more energy efficient, they are also boosted by search engines, meaning your content is more likely to be found.