What is a sustainable climate friendly website?

Before we dive in designing and building an eco friendly Drupal website we first need to look at what exactly makes a website sustainable. Tom Greenwood has written the excellent book Sustainable Web Design which gives a great reference point on where to start.

Basically it comes down to:

1. Host your website with a service that uses renewable energy. The energy used to host your website has a big impact. Make sure your hosting party is serious about this issue.
2. Make the page size  as small as possible. The bigger the file a user has to download, the more energy is used on both sides.
3. Create a climate friendly web design. You can make smart choices about your web design which can save electricity.
4. Show only the amount of pages the user needs. Delete content that isn't relevant or useful anymore.

Now let's see how a web designer or site builder can apply this to Drupal.

Green Drupal hosting

Picking a green host can be difficult. A good starting point is this post on how to choose a green web host by Tom Greenwood, also the author of the book I've mentioned above. 

This site, for instance, runs on the servers of Digital Ocean located in a Green Data Centre owned by Equinix in Amsterdam. Which claims to run on 100% clean and renewable energy. If you think this might be a good option check out Cloudways* as the make it easy for you to deploy Drupal sites on the Digital Ocean servers. Also you can try it for free*.

How to reduce the size of your page in Drupal

1. Turn on cache. This is a no brainer because it doesn't only reduce the size of your page, but also speeds up your Drupal website. Which is also becoming an important factor on how your Drupal website is ranked in search engines such as Google. You can choose to turn on cache and enable Bandwidth Optimization under the Performance in your sites configuration. You can even go a step further and get your hands dirty with some specific cache tweaking using the Advanced CSS/JS Aggregation module.
2. Use images and video sparingly and only when needed. Media is the biggest factor when it's coming to what a user has to download. With every image or video you place you have to wonder if it is really necessary. As a web designer I do believe images are needed to give your Drupal site the desired look and feel. On the other hand video's auto playing in the background are a definite no go.
3. Use SVG where possible. If your imagery mainly consists of icons or illustrations then it's best to go with a vector based image format such as SVG.
4. Use system fonts. Or if you really want to use fancy fonts (like me) than only load the font weights and types you use. Also serve them locally without making use of a CDN.

Guidelines for a climate friendly Drupal theme

1. Use dark colours. With OLED screens becoming more popular using darker colours can help save energy. This is because when an OLED screen shows a black pixel it's turned off. Try to go with dark background colours and use a brighter colour for your text. Seeing the implementation of dark mode in browsers and mobile phones this might be an indication that users prefer darker colours.
2. Use modern CSS techniques. Using techniques such as flexbox and grid can cut down the number of lines of code you need to create your Drupal theme. These new techniques are more efficient and pretty well supported by most major browsers. 
3. Use the responsive image module. With the responsive image module you can render images based on the screen size. For instance if someone is viewing your Drupal site on a mobile phone, it probably isn't necessary to show a full width hero image picture of 1920 x 1080 pixels. You can easily do with something smaller like 600 x 400 pixels. This cuts down the file size of the images your user has to download. Greener site, happy user and you will also get a thumbs up by Google when you check your Drupal site with PageSpeed Insights.
4. Avoid unnecessary JavaScript. Cramming in different snippets of JavaScript can easily add to your page weight. Do you still have jQuery Carousel showing important content on your homepage? Dump it. Usability experts say it doesn't work. Or maybe you forgot about that tracking script of a service you don't use anymore.  Time to review all the scripts you've added to your Drupal website along the way.

Purge your content

In the end every page you serve to your visitors requires electricity. And this adds up to the carbon footprint of your website. That's why it's so important to only show content that has value to your visitors and potential customers. 

Delete useless content

Do you have pages with a high bounce rate? A visitor 'bounces' when they only view one page on your website in their session. A good example is someone who found your content through Google, clicks on the link, views your page for a few seconds and clicks back to the search results. This can be an indicator that the user didn't find the information it was looking for. 

I've once written a blog about DuckDuckGo for the web design agency I work for. Because I was one of the first in the Netherlands to do so it got huge traction on, how ironic, Google. Even placing my blog above the actual DuckDuckGo site in the search results. We got a lot of traffic, but it was all worthless. People were looking for DuckDuckGo, not a web designer writing about DuckDuckGo. And even the users who did read most of the article still bounced, because they weren't looking for a web designer. Eventually we decided to delete the blog because it was more trouble than it was worth.

Don't be too afraid to delete content. You can always unpublish in Drupal. It won't hurt your SEO and it will probably boost it as was the case with Search Engine Journal. They increased pageviews and organic traffic of up 60+ percent by 'hacking and slashing' their old content.

Onward to creating greener Drupal websites

Now you have no excuse not to create a climate friendly Drupal website. Start with the hosting, reduce your page size, create a sustainable Drupal theme and delete irrelevant content.

If you have any questions about the above, please leave a comment below. Also, if you want to stay up to date about (green) Drupal website development, please subscribe to my Drupal newsletter and receive updates about new blog posts and more.

* Note that this is an affiliate link. If you use it I will get a small fee which will go towards hosting this site.