By now, we have all seen (and heard) how Innocent Drinks have one of the best brand voices out there, but we think they’re great for another reason too – their efforts to create more sustainable website design.
Why Are Sustainable Websites Important?
Sustainable website design decreases the energy needed to load the website, and therefore decreases the carbon footprint of not only the website itself but the devices used to access it.
Sustainable Design with Innocent
Although the feature is now unfortunately unavailable, previously visiting the website showed you a little switch in the top right corner saying ‘save some juice’. Upon clicking this toggle, subtle variations happened to the website to make it more energy efficient, by removing features to decrease the carbon footprint of the website.
Upon clicking the button, the whole website design became duller, with the colours not appearing as vibrant. This is because certain colours can drain your device battery quicker than others, especially if you are using an OLED screen, and by using duller colours that allow your device to maximise battery usage, it decreases the amount of time that you have to charge your device – thus saving power.
Additionally, images were replaced with either pure text, or SVGs. SVGs are a web friendly format, and rather than being created from pixels, these vector files use formulas based on points and lines on a grid. Not only are they scalable, but they have smaller file sizes without becoming pixelated – they have enough information to display at any scale. Smaller file sizes mean that the website can load quicker, increasing performance, and means less power it takes for your device to load all content.
On the contact page, the background that usually changed colour now appeared as a simple grey background and bandwidth-intensive photos were replaced or removed.
Sustainable Website Performance
It’s important to note, that although the website looked different and no longer used images, it still performed and did what it’s supposed to do – it showcased Innocent’s products perfectly. What’s more, Innocent have developed their tone of voice so well that you can clearly recognise the brand regardless of high-res imagery and effects.
Website Design Copy
Innocent Drinks don’t stop there – they use every opportunity to reinforce their brand voice. The green switch label alone was a play on words (“save some juice”) – juice is what they’re known for, additionally ‘saving juice’ means to save energy to benefit the planet.
What’s more, they also explained what the button does wonderfully. Clicking on the ‘what’s this’ link opened up a small pop-up explanation – that provides context done with brand voice in mind. By adding the last line of making fun of designers, the feature feels relaxed and users know that what they are doing helps the planet.
Innocent Drinks Sustainability
Although the sustainable design was a step forward for Innocent Drinks, plugging their site into the Website Carbon Calculator tells us that the website is dirtier than 61% of web pages tested – meaning it isn’t as carbon friendly as they claim. It seems they still have work to do to meet their sustainability goals.
Ballyhoo Sustainable Website Design
We are in the process of updating our entire approach and designing websites with sustainability at the heart of them – even a stripped back version for brands that are able to provide this functionality. We can’t share anything just yet, but keep an eye out for updates.
In the meantime, our websites are already on the road to sustainability – they use Green hosting and are made with user experience and performance in mind. Contact us now to discuss your website requirements.
