WordPress quick tips for a greener website
Show notes
Let's have a look at ways you can make every WordPress website more ecologically sustainable. We will discuss hosting, themes, page builders and plugins. What to look out for, what are challenges and how WordPress can support us on our journey.
Mentioned links
👉 Find greener hosting with The Green Web Foundation
👉 Choose a fast and lightweight theme such as Kadence, Neve, Astra, GeneratePress
👉 Choose a block plugin such as Kadence Blocks, Generate Blocks, Otter Blocks
👉 Optimize and compress JavaScript and CSS with plugins such as Autoptimize, Hummingbird, WP Rocket
👉 Integrate caching with plugins such as WP Fastest Cache, W3 Total Cache, Hummingbird
👉 Integrate lazy loading with plugins such as Smush, Autoptimize, Hummingbird
👉 Compress images with plugins such as Smush, Shortpixel
Love, Sandy
……………………..
❤️ Subscribe to the podcast to get all juicy new episodes! ❤️ Share the love with your friends and colleagues. ❤️ Leave a review and rating. It helps soooo much and lets others know this podcast exists.
……………………..
You'd like to learn more about Green UX/UI Design? Check out the Green UX/UI Design course.
You don't want to miss any updates? Join me on Instagram @greentheweb, connect on LinkedIn or sign up for my newsletter.
Check out the free resources, blog posts and best practices on my website.
You want to work with me? Have a look at my UX/UI design services, workshops, User Research and other possibilities to work together.
Feedback, wishes or questions? Send a message to hello@greentheweb.com. I'm always happy to hear from you!
Show transcript
Welcome everyone to today's episode of the Green the Web podcast, a podcast about ecologically and socially sustainable design. I'm your host as usual, Sandy Dähnert, a UX UI researcher and designer myself.
In today's podcast I want to talk with you about WordPress. WordPress as a content management system, its goodies, its bad things as well as what to look out for to create a greener website with WordPress. So first of all, WordPress is a content management system such as Drupal and Joomla and Squarespace and Wixs and all the other content management systems that are out there. It's a CMS, so a content management system will use CMS from now on in this podcast episode that has good and bad reputation and I'm still wondering why. Of course coding a website can be more efficient than using a CMS, but it very much depends on the coding language that is used, the quality of the coding and how clean the code is in the end. So it's not just a one answer that you can give whether WordPress is worse or better than a coded website. It depends as usual and content management systems offer a better entrance into web design for especially small businesses and personal websites. It's easy to work with. For most people it's quite intuitive and with WordPress you don't need any coding skills for most of the things that you might want to do with your website. There's definitely things that it's very handy to have a web developer at hand as well, but a lot of the things can be done without as well. So it's an easy entrance and there is a couple of goodies when it comes to ecological sustainability as well. I actually do use WordPress for my own websites. So for example for the GreentheWeb.com website, it's based on WordPress and WordPress is one of the most lightweight CMS compared to Wix to Squarespace to Web flow and other CMS. And when I say wait, I mean the base weight of the scripts and HTML, the code that the CMS comes with initially without even touching it, without having uploaded any text image or whatsoever every CMS has a base weight, so WordPress has one of the lightest ones depending also on what you choose for the theme and the page builder and the plugins, we will get to that in a second. And the WordPress base weight therefore very much depends on what you do with it. In the end it can start as minimal as 40kB which is super super small or go up to a couple of hundreds of kilobytes. So we need to have an eye on a couple of different things and that's like the most important ones when you just talk about WordPress and the technical basics of it. We talk about the hosting provider, the theme, the page builder and the plugins that we use. Of course the content is very important, but that's not dependent on WordPress or any other CMS. You would have the same content probably on the on any CMS that you're using. So we just want to talk about the technical basics or the technical possibilities and opportunities that you have with WordPress that are different to others. So let's talk very briefly about the first part hosting providers. This is a huge topic, so I will just scratch on it very briefly here with WordPress, the biggest possibility is that you can choose it yourself. You can choose the hosting provider yourself. So definitely do so and use that privilege that you won't have with other content management systems because some of them you aren't allowed to say which hosting provider you want to be at or on. So select a green hosting provider that is really based on renewable energies, not just green certificates but really on renewable energies. You can find out more about that topic with the Green Web Foundation. I will link that down below. They have a directory also of hosting providers that have. Some level of more ecological sustainability. As I said, it's a huge topic to go into. It's about the energy that is used for the data centers. So really being based on renewable energies or seeing whether there's green certificates used, green energy certificates used, whether they are very efficient in how they are processing everything, how they are data servers are efficient, what's their water usage to cool down the heat of the data servers, what to do with the energy that comes from the data centers. So all of the heat that is produced, is that also being used further on to heat houses, to heat public spaces or whatever. So there is a huge topic with hosting providers. I just want to briefly go into that here. You can choose it yourself, which is a huge plus. Second part in WordPress Possibilities is choosing the theme. So the WordPress CMS comes with this shell and you have to install a theme on top of that shell. A theme has somewhat of you can code it yourself of course as well if you're into that or you're able to do that and have the skill set for it. But you can just choose ones that are out there already and there's different kinds of themes and they come with a couple of restrictions, regulations, but also options that you can use for your website. There's constantly new ones that are out there. Check whether there are better ones out there already than the ones that I'm seeing in a second. And I'm always looking for WordPress best performance themes or WordPress fastest themes. So WordPress themes that are really well done, have a clean code, have limited or very reduced initial scripts and requests and all kinds of data is stripped down to the bare minimum and is very high quality. That's what I'm always looking for. So if you're looking for a best performance very fast then usually that's in there already. They are made up for speed. So definitely data reduced, which is what we're looking for. And the WordPress themes that I've been using a lot is Kadence, Neve, Astra and Generatepress. They all do have very efficient data usage of the theme itself, very clean code. So they come with a very small base weight of the theme itself. So it can do later on much more with my content on the website than having a huge theme that might look like having thousands of possibilities but you won't even use them in the end. So you definitely don't need that. Just choose one that has a very good user friendliness in itself and has a clean code and high quality. So we do have a renewable energy hosting provider. We do have a very great, awesome fast theme and data reduced theme installed next comes up page builders or as I would say using no page builders. So there is many, many people working with page builders like Elementor, Divi. There's a couple of different ones out there. Those are definitely the two biggest ones or most popular ones and I would say don't use any of them. I know that it seems like then it's easier to use or easier to build and create pages, but in my opinion and my experience, it's usually worse. I know a lot of those page builders come with a couple of opportunities, options and building blocks that you can use. Most of them you will probably never actually use. And having a page builder comes with a lot of extra page weight. Yes, I've done websites with Elementor and Divi that are still very good in terms of data, so it's not an absolute no go. It's still possible to create green websites with them. Yes, but it's way more possible to do that with. Out using a page builder and uses a lot less data. So my pledge is don't use any page builder. So you might ask what do I use? Then you can use just the Gutenberg shell that comes with WordPress itself and then integrate some additional block plugins. For example, there is a Kadence blocks, Generate blocks, Otter blocks. There is different very small lightweight block plugins that you can use. For example, of course if you're using the Kadence theme, it makes sense to also use the Kadence blocks because they really work well together. If you use the Generatepress theme then also it should be the Generate Blocks plugin that comes together and works together really well, but you can use all kinds of block plugins for different kinds of themes. It's not prohibited to use the Generatepress theme with the Kadence blocks for example. Those block plugins definitely add a lot less data weight than using a page builder like Elementor or Divi and they come with a lot more ease in creating pages with them. They are really well designed, really performance driven so really fast in building with them but also in getting them to the user in the end. And it makes so much more fun to build websites with them. I don't even know why I would ever use any page builder over a blog plugin. So we do have our hosting provider. We do have our theme. We don't have any page builder, but we do have some kind of additional block plugin to enhance our content on the website. Awesome. That's a great setup to have already and that's really the most reduced version that you can have for or in terms of data. Great. Awesome. So let's have a look at what plugins we can use for even more ecological sustainability. First of all, use as few plugins as possible because every plugin adds data to your website, even if it's just in the back end. When you're using a plugin, you're using additional data. There is a couple of plugins that I definitely suggest to use or some topics that I definitely suggest to use plugins for. The first one is optimizing and compressing JavaScript and CSS to significantly reduce data. Definitely for sure. And you can use either WordPress plugins like Autoptimize Hummingbird, WP Rocket or even your own scripts if you're familiar with your own JavaScript and CSS scripts. But yeah, using I'm linking them all down below using WordPress plugins for JavaScript and CSS optimization and compression is definitely worth it to have a look into and to activate. Second topic is caching. Caching temporarily saves your website as a static page and thus reduces a lot of data and code to use. For example WP fastest cache, W3 total cache or hummingbird as WordPress caching plugins and achieve way better results in performance and data load because caching definitely does that. Again linked all of them down below. Third topic is using lazy loading, so only loading images and other bigger content snippets outside the viewport when they are needed. So the first thing that you see on a device, whether that's a smartphone laptop, that's the first viewport that the user sees and then everything that is below that viewport is not loaded yet. Therefore add some kind of either that's a script to your page that does lazy loading or use WordPress plugins like Smush or auto optimize or hummingbird that have those have this option included in their settings. Then the fourth topic is image compression and there is a couple of different image compression tools out there for WordPress. One is for example Shortpixel, another one is Smush. Both of them are highly rated from thousands of users and you can compress lots of images for free. It's very easy to use both of them and there is also additional pro versions that you can pay for. So there's a lot of options out there for that. And with those tools compressing your images, it reduces heavily the data on your website and some of them even have the conversion to WebP image formats. That's even less data per image and therefore even greener for your website. And then last but not least, in the category of plug ins is website carbon, the topic of website calm. And there is a plugin called Website Calm that measures the carbon emissions of your website right inside WordPress. So you have a list of all your pages and you can see the different CO2 emissions per page and you can easily spot the pages that have high emissions and you can get to work on them and see what they are about. Maybe you have third party tools in them, a lot of images, maybe a video or whatever, but you can easily spot that with the website calm plugin highly recommended to install. So you might wonder how do I usually work with those plug ins or those settings that I just talked about? What I actually do is I test every website theme with the different plugins because each plugin works differently with each website theme. So one plugin might perform better with a certain theme than with another one. So test it out. I know it's a little bit tedious, but testing it out definitely helps a lot in getting the best performance and getting the best results and then constantly check which plugins are actually needed and which can be replaced or just deleted in your back end. And that leads me to please, please, please clean up your WordPress backend once in a while, clean up your outdated images duplicates that you have blog articles that never got posted, articles that are in the trash pages that aren't used anymore. If you use a backup plugin, do you really need 20 different backups on your server from the past or can it be just the last three backups that you're saving? Cleaning up your WordPress backend definitely saves a lot of data on the servers as well as in having things on the website that are definitely not needed anymore. So just declutter, declutter everything that is outdated, duplicated or just not needed anymore by anyone. And that leads me to obstacles that may come up in working with WordPress. It can be that there is a lot of clutter laying around in your WordPress backend and you need to have some processes at hand to actually conquer that. That's definitely one of the obstacles that I see a lot in forgetting about content, forgetting about those 1000 blog articles that are just laying around, just do it. Set up your own reminders and then you will be fine for that. Plus an obstacle that I see a lot is that many people use or are used to page builders. And really I tried them and I actually hated them. I worked with especially Elementor and Divi. But there is so much more ease with those blog plugins that it's absolutely worth it to go through changing the content from page builders to blog plugins. I know changing the content is a toughie. I've been there, I've done that. But it is so worth it for your own sake of mind and for Mother Nature will definitely thank you a lot for that move as well. And the benefits of working with WordPress is definitely a you have the possibility to have a super lightweight design in the end. I do have pages that are down to 0.1g of CO2 per page view. I have pages that are down at 0.03g of CO2 per page view and that is very, very, very little. So it's absolutely possible to do that with WordPress really depending on the things that I talked about beforehand and having the chance to choose a hosting provider, integrating plugins that are helpful, that is a difference to other CMS. Not all CMS have that included. So you have a lot of freedom to decide what you want to bring into your website and what not. And that freedom I definitely highly value in working with WordPress. So if you ever have to decide on what content management system you want to work with, definitely give WordPress at least a chance or think about using it. And as I said, going through the hosting provider, the theme, the page builders or no page builders and the plug ins can help you a lot in setting up a really well done lightweight green website that is a little bit more carbon aware than it might have been before. And most of those things that I talked about can be done really easily, especially the plug ins and installing those plug ins. So just test it out, try it out and give it a go. Let me know what you tried and what worked for you or what you also have in additional resources, tips, advice to make a WordPress website a lot greener. Then you can let me know in today's posts on LinkedIn, on Instagram or just sending me an email or message on any kind of social media platform that I'm at. I'm really looking forward to that because I want to make this a two way conversation. I love getting your feedback, your additional thoughts on podcast episodes that I'm releasing.
Other than that I can just say subscribe to the podcast as usual. If you haven't, so have a look through the other podcast episodes from the last year that this podcast has been out already and share this episode with everyone you feel like they would definitely benefit from hearing all of those tips and have maybe even a WordPress website that they can create an even greener way. Leave me a podcast review on Apple Podcasts or give me a five star rating on Apple Podcasts or Spotify. It definitely helps a lot more than you think in sharing this podcast with even more people that are like minded and have the same values as we do. And then other than that, follow on Instagram and Green the Web follow on LinkedIn at Green the Web, check out the free resources on my website. There's lots to uncover. A couple of free templates for you to use, blog posts and much, much more. And if you ever have a wish for a next podcast episode, let me know as well to send me a message and I will definitely try to build that into this podcast. And then see you in the next episode.
New comment