The key principles for sustainable web design

Running the internet and the global World Wide Web comes at the cost of producing roughly 2% of the world’s total emissions, accounting for 10% of global electricity demand. To reduce this carbon footprint, what can be done as a webmaster and a site owner?

It might come as a surprise, but using the internet and, better yet, building the internet is a burden for our climate.

It is estimated that billions of websites are running on the internet, and if you think about it, all these billions of websites require energy.

Whenever you access the internet - be it the Facebook feed, Google Search, Google Maps, or your favorite blog, there is a piece of hardware that handles the request and uses energy to deliver documents or content for you.

As developed countries are leading the way to a more sustainable world by taking action on fighting climate change, internet usage needs to be thought about as well.

So, what is to be done as a webmaster, blogger, and website owner to ensure you are doing what is to be done to make the internet more green and sustainable?

Getting rid of code bloat

The Internet is getting quite bloated as more and more people are being introduced to building and creating websites with bloated ecosystems.

When a website is bloated, there is a lot of unnecessary code loaded by the web browser, such as plugins and themes, which are not used at all by the website.

It might seem like nothing to add a small plugin to your WordPress website, but it does bring unnecessary overhead for the website, and every time visitors load a page and have to download code that does nothing, there is wasted energy.

This usually happens on a tiny scale, like kilobytes, but it keeps adding up as your site grows and gets millions of visits. Over time, you might force visitors to download megabytes and gigabytes of unnecessary data, which, again, requires energy to do so.

It takes conscious efforts to build websites with efficient code coverage and only run code necessary for the end-users. If you are using or thinking of using WordPress for building your blog, you should first read why using WordPress might not be such a good idea.

Avoiding unnecessary servers and databases

Running a server is like running a printer in a library - every time someone requests a book from the library, the printer prints you a new copy of your asked text. The printer might be old and inefficient and contain bugs and other security vulnerabilities that could be used for malicious activities.

Suppose your website only serves static documents, and there isn’t heavy reasoning, like lots of business logic, to run a web server. Then, from a sustainability perspective, it makes more sense to get rid of the webserver.

The same thing goes for databases. If there is no heavy reason to run a database, it is encouraged to get rid of the database as well.

Texts, headings, links, lists, images, etc., do not require you to run a web server or a database. These contents can be wrapped into a single document that can be served to visitors from buckets or edge servers.

Think of it as getting rid of the printer that always prints the same piece of document for everyone who requests it. Instead, there is one copy of the document, which can be served infinite times without using unnecessary energy to produce the same document repeatedly.

Building static websites

A static website is a perfect eco-friendly, lightweight and secure alternative for running a blog or any other kind of website where there is no need for a web server or a database.

Hosting a static website is cheaper than running a dedicated or shared server because fewer resources are needed to serve static content.

Today, there are many great static website generators for building static websites. Some of these are the likes of Hugo, Ghost, and Jekyll.

Optimizing systems for speed and performance

When optimizing website speed and performance, developers try to eliminate unnecessary code and libraries or minimize them to be more lightweight.

There are many ways website owners can optimize their websites for page speed and performance, such as image optimization, getting rid of code bloat, optimizing DNS, using the cache, etc.

Optimizing a website for page speed and performance is also a ranking factor for Google Search. PageSpeed Insights is a tool developed by Google that gives you good hints and suggestions on how to improve website speed and performance to improve your website’s SEO and make it more sustainable.

Google’s Core Web Vitals is also a great metric to get a good sense of what things are essential with page speed for the end-user.

Preferring green hosting

Renewable energy hosting, also known as green hosting, means that the service provider hosting your website or service does so in a carbon-neutral way.

This means that all the energy used for running your website or service is either from a renewable energy source or is offset by other carbon-neutral activities.

List of green hosting providers

The Green Web Foundation is a not-for-profit organization that helps people understand the sustainable aspect of running services across the internet.

The Green Web Foundation hosting directory is a list of hosting providers worldwide where you can find providers using renewable energy for running their services.

You can also find a Green Web Checker -tool from the Green Web Foundation website to see if your website or blog is run by renewable energy.

Running the Green Web Checker -tool on your website gives you a nice little certificate if your website uses renewable energy.

Optimizing your website to be more sustainable is better for the end-user; it is also better for our planet.

Software development Web design Sustainability Design Programming

Related contents

  1. Starting a new blog using Hugo static site generator
  2. 31 ways to improve website speed and performance
  3. Cons of using WordPress for an online business
  4. Getting started with building static websites
  5. Understanding fonts in web design: web fonts, web-safe fonts, and system fonts