How in the world do I make my website more sustainable?
Hosting
Images and videos
Font
Code
Navigation
What's the point of making my website more sustainable?
Making a website more sustainable helps cut its environmental footprint. The internet accounts for roughly 3–4% of global CO₂ emissions, similar to the airline industry. Every unnecessary image, video, or poorly optimized page means more data to transfer, which requires more electricity from servers and user devices. By streamlining code, compressing files, and optimizing hosting, you can reduce energy use, speed up load times, lower costs, and make the site more accessible, benefiting both the planet and your audience.
Of course the most sustainable website of them all is no website at all 🙂
Then you might think “alright I’d love to do that but… how do iI even know where my website it at now?”
Well dont’t you worry! There’s many websites that can help you figure that out!
https://www.websitecarbon.com
https://ecograder.com
It’s always great to know where you’re staring from so you can see the improvement you’ve made.
1. Hosting
Well! To start off with it’s always great to make sure you have a green host. This simply means the hosting service is running on green energy.
2. Images and videos
Images and videos can be heavy on a website. Then you might think “well yeah but how do I fix that? I can’t just remove every image and video!” and tthats true! Removing all images and videos would often compromise the websites design, luckily theres many ways to optimise images and videos!
To optimise images you can size them down so they’re only the size used on the website, no need to have an image be 1000px when you only use it in 200px. Another good way to optimise images is by switching the format. Often images are PNG or JPEG but did you know about WEBP? WEBP is a way better format for website sustainability! You can use online tools such as https://tinify.com/web or https://imagecompressor.com.
You can also make sure all your images and videos are using lazy loading. This may sound like the images and videos would just rather stay in bed but it’s not exactly that. Lazy loading just means the images wont load until you’ve scrolled down far enough to see them. Not only does this make the website more sustainable it even makes it faster!
3. Font
Do you know what fonts you’re using and where they’re sourced from? Often fonts are sourced from google fonts. This means every time the website is visited it needs to ge those fonts from google fonts! This is easily fixable! By just using local fonts you’re able to make your website more sustainable. This may mean compromising the design a little but it’s always great to consider if using a local font is possible.
4. Code
It’s a good idea to look through your code to see if theres any unused code, this could be animations or other code that was just never used. By removing these lines of code there’s less information to be loaded when people visit your website!
That all sounds great but I’m using WordPres(or another website builder)…
WELL! Don’t you worry! Even if youre not comfortable messing with the code of your website all is not lost! You can download plugins for code optimisation.
5. Navigation
Even the way you have users navigate your website counts! By having an easy and intuative navigation system you reduce the amount of clicks your users go through to find their desired page. This can be done by making sure the navigation bar is easy to understand but not only that. You can also make sure all navigation on other pages, such as buttons, are easy to udnerstand.