Conserving energy, recycling and doing our bit for the environment is drummed into us all – and rightly so. We all have to start thinking more about our planet’s resources and how we are using energy.
Does ‘doing our bit’ extend to web design? Should we be making energy efficient websites? Can you make a website more energy efficient? Should we bother? How do we do it?
All valid questions that deserve some thought…
The answer to this question is influenced by a number of factors. For example, we are not only dealing with the energy being used by the device rendering your website, but also the server hosting your website. If you were being really pedantic, you could also argue the energy used in the production of the website – all those Apple Macs and PCs burning away, late into the night.
For now, let’s just consider the core components: the website and the hosting.
It is technically possible to get low carbon hosting, where the energy used to power the servers is generated by renewable means. Solar, wind or water powered generators that are generating the electricity to run the servers. However, most data centres require massive amounts of power to run, cool, backup and protect the servers, so expecting carbon neutral is probably unlikely at this stage. Whilst considering the overall carbon footprint of the hosting service, you could also include the power and resources required to build the servers and their components – obviously recovering that over the life cycle of the server is possible, but let’s face it, it’s unlikely. There are a number of hosting firms who claim to be environmentally friendly or carbon neutral – doing so by planting trees to offset their carbon usage. Perhaps the ideal combination would be offsetting the carbon by planting a tree or trees for each server and also using recovered energy to power, cool and protect the data centre.
But does such a hosting firm exist? Answers on a postcard, please!
Another fairly easy ‘win’ is to keep the server software up-to-date. For example, huge efficiency and performance gains are reported when upgrading from PHP 5.3 to 5.5 – greater efficiency requires less resources and energy, so keep upgrading that server!
You only have to spend a long train journey browsing a particularly image heavy or interaction-laden website to realise it’s sapping juice from your smart phone. The harder the phone works to process your web pages or download those images, the more energy it’s using. The same principles apply to a desktop PC too, albeit a lot less noticeable.
There has been lots of discussion over the years concerning energy use on dark background or light background websites. For example, blackle.com – the “energy efficient version of Google” – has a black background, rather than white and claims to have saved billions of watts in energy.
The short answer is it depends on the type of screen. With an LCD screen, it makes very little difference, indeed in some instances black uses more energy. However, with old CRT screens and newer AMOLED screens, as found in many Android devices, they do actually use more energy to deliver white pixels. (This site has some nice work on the subject.)
So, it’s fair to say that, yes it can have an effect, but we are talking about small returns and there are easier ways to make a difference.
At the recent and excellent Responsive Day Out, Stephanie Rieger (@stephaniereiger) talked about ‘The Future of Media Queries’. Of particular interest was the light-level media query that is in the v4 spec for CSS(http://dev.w3.org/csswg/mediaqueries-4/#light-level) – which could be used to dynamically turn down or change colours depending on light levels in the surrounding environment – so your website could swap to a dark background with white text if the room is dark etc. Perhaps, this could be manipulated to help preserve some energy when browsing late into the night or in low light situations?
Alternatively we could start to offer a battery saving mode on our websites, where non essential images or functionality is removed, so that just core content is displayed, on dark backgrounds. Saving bandwidth, saving energy, making your phone last that final 20 minutes of your train ride…
From an on-page point of view, the real benefits are had in optimising your website code, minifying JavaScript and CSS, optimising images and pushing fewer bytes over the air and down the wires. Not only will your users thank you for faster load speeds, but they could eek out prolonged browsing times. However, the real cherry on the top is that Google will also reward you for a faster site by improving your search engine performance. Google provides the excellent Page Speed service to help you to optimise your website. (A note worthy point here is that achieving a 100 is very, very hard – anything over 95 is pretty good. It also means running caching and minifying all code, which is fine, but can sometimes be impractical.)
In August 2013 MOZ software did some great work on the correlation between site speed and search engine performance – however it’s worth conceding that they found a greater correlation between the “Time to first byte” and search engine position than the rendering speed, so using CDNs and ensuring maximum response times from your server is a vital part of overall page speed (There is a nice argument not to use that cheap hosting!). But please remember, this is one set of research in an ever changing landscape and it’s well documented that Google are now penalising websites that are slow loading on mobile devices – which leads me to the conclusion that contrary to MOZfindings, page rendering must be also be an influencing factor in how Google is indexing websites.
So, from a fairly high level, there are a few key things to consider when creating an energy efficient website:
In conclusion, it’s fair to say there are a number of possibilities in creating a ‘green’ website. No single thing is going to get you the energy saver of the year award (if such a thing exists?), but as with most things web related, the cumulative effect of all of these steps is undoubtedly going to offer genuine, tangible benefits to you, your users and your websites performance on the search engines. So get out there, optimise and start saving some energy!