My website relaunch with an amazing score (0.1g CO2/page view)

I really tried a lot. But it was worth it. The website is now down to 0.1g CO2/page view and in comparison really far ahead. Even though my friends just roll their eyes when I say “I’m going to redesign my website. Again.”. But hey. With redesigning again and again, I’ve learned so much. So much of what works for me and with WordPress. So let’s see what and how.

My technical base

Hosting

Hosting on renewable energy makes a huge difference in comparison to electricity from other sources. According to current studies, standard electricity emits 475g CO2e/kWh and electricity from renewable resources emits only 33.4g CO2e/kWh (of course with many many dependencies).^[1]

How green a hoster is depends on many factors. The most important components are the purchase of 100% (traceable, at best local) green electricity and high energy efficiency.

I initially decided to go with Manitu. In the selection were also Biohost, Raidboxes and greensta (*this is not an advertisement and not a complete list of recommendations) and I continue to monitor the market for myself and of course for recommendations. You can find more green hosters at the Green Web Foundation directory and by browsing through web articles.

WordPress and the theme

Since I am not a web developer, the choice fell on a CMS. Namely WordPress. Why? Because for me it’s the easiest to manage and there are many good resources for it. Yes, WordPress itself adds some data weight compared to programming the website yourself. But honestly not as much as I always thought.

On top of the CMS comes the theme. I did a lot of research on themes, their performance, weight and requests. The result was Neve, which was the best fit for my case and became a loyal companion. You can easily search for other lightweight themes on the web, for example in this article about The 14 fastest WordPress Themes.

Editor

The Editor. My biggest question mark. The default editor of WordPress was just not effective enough for me. I wanted more. So I first worked with Elementor, an editor that performs quite ok compared to others. This way my website was already at 0.4g CO2/page view (measured with Websitecarbon.com). Not bad, but still not super duper.

Additionally, Elementor caused problems again and again. It just didn’t click between us. So I went on a loooong search for the right tool. What came out? The WordPress default editor in combination with GenerateBlocks.

And you know what? Just by switching from Elementor to GenerateBlocks, my Website Carbon CO2 score dropped from 0.4g CO2/page view to 0.1g CO2/page view. Yippee yeah!

Plugins

To optimize WordPress a bit, there are thousands of plugins that help to reduce the page weight. I definitely recommend plugins for caching, CSS and JavaScript compression, carbon tracking, lazy loading and image optimization and compression.

Other than that, I try to limit the number of plugins I install so they don’t slow down my sites and make them unnecessarily heavy. You can find my favorite tools in my tool list.

Next to that, you won’t find any other data-hungry and cookie-setting third-party providers on my site. The only cookie on my site is from my language switch. And my analytics tool is WithCabin. A tool that neither sets cookies, nor intercepts personal data of visitors in any form.

To keep the general data load small, it also helps to regularly delete post revisions and the trash bin.

What did I do differently with the content?

I wanted to create a sleek, balanced and a tiny bit edgy website. Not too many images. Not too many animations. So I decided to work with colors and shapes. Dark colors indeed, since I read so much about increasing accessibility and, for devices with OLED screens, reducing energy consumption with dark colors. ^[2]

What else? Wherever possible, I try to use (my own) icons and make all UX principles as happy as if they were at a kid’s birthday party. You won’t find full-width images or endless “have you seen this offer from me” funnels on my site. I reuse modules, elements, CSS and other types of design principles to save data weight. Reuse things instead of always implementing new elements. There’s also no Instagram plugin that loads new posts from the platform. Instead, I’m using an image of some of my posts as a teaser.

The result

The result is a CO2 score I never would have imagined with WordPress. With 0.1g CO2/page view (measured with Website Carbon and Beacon) the site is greener than over 90% of all tested sites. That sounds awesome! The size of my website is at 175kb with 18 requests and a Google PageSpeed score of over 90.

What’s still on my list

There is still so much to learn and so much to try. I would like to implement a dark theme that you can switch back and forth from. Depending on what’s more readable for you. I also want to tell you more about my personal and business sustainability habits. This includes offsetting remaining CO2 emissions to a carbon-neutral or even climate-positive level. For that, I’ll just have to sit down and look through what I’m already doing (without really calling it carbon offsetting) and what more I can do to make that happen. On top of that there is a further increase in accessibility, SEO and server speed. Oh, and beyond that, there are many many more ideas. You see, it never gets boring and I’m absolutely sure there will be more ideas and tweeks to come. I’m looking forward to it!

And what’s that supposed to tell you now?

Everything is possible, even with WordPress as Content Management System.

And: Websites don’t have to look dull to be green.

Let me know on LinkedIn or Instagram what your favorite green websites are and feel free to share the post with colleagues, co-workers and friends.

Have a wonderful week!

Sandy