Product Type:
Website Design
Customer Type:
B2B
Industry:
Marketing
Niche:
Sustainability
Year:
2023 - Ongoing
Overview
In 2023, I wanted to go even further in my business in terms of improving my eco-credentials and ensuring that I reduced my impact on the environment and improved it where possible. I always have ethical and eco-friendly processes in the forefront of my mind when working on clients’ websites, but as is often the case with marketing agencies, your own website doesn’t get quite as much attention. So, to ensure that I am practising what I preach, I rebuilt my website to ensure it was faster, using less energy and, therefore carbon, while improving the usability and accessibility of the brand as a whole. I wanted to write this case study as a showcase of the progress I’ve made as a company but also to be transparent in my work. If you are familiar with my business, you’ll know that honesty is part of my ethos. If we can’t be honest about our own business, how can clients trust us with their own site?
Challenges
While I hadn’t built my original website with the environment in mind, I believed it to be a pretty slimline build already. It had minimal plugins, a well-rated parent theme for speed and no animations or video. But, when comparing my site using the Website Carbon Calculator, I realised the site was not as green as I would have hoped. Sadly, It scored 67% dirtier than other sites tested. This was the drive for things to change.
Objectives
Speed was the biggest consideration when it came to improving the site. Carbon used is directly linked to the size and speed of your web pages, so we needed to tackle this head-on. However, I still wanted to be true to the brand of Middleton Marketing and our emphasis on accessibility and inclusivity. Therefore, I wanted to consider a redesign from both making it environmentally friendly and socially conscious whilst still appealing to my clients.
Suggested Solutions
Recreate my site using a theme and building style that were all optimised for speeds. I researched a variety of technologies to ensure I selected themes, plugins and building styles which scored well for speed and further researched how design elements could impact speeds, carbon usage and accessibility.
Implementation
As with all projects, it needed to start with thorough research and a plan of action. Looking at a range of speed metrics and technical crawls, I determined the main issues with the site were heavy use of Images without good optimisations and overuse of JavaScript and CSS, which was tied to the theme and some plugins. The site also didn’t score well in terms of accessibility, and there were UX improvements I wanted to include in this rebuild too.After researching a range of options, I selected a parent theme which was rated highly for speed. I also removed a large number of images from the site, with a plan to recreate imagery that was still relevant for context but optimised for speed and accessibility. Plugins were the next to be culled, with research on smaller, more efficient plugins which could do double duty. I also made the switch to Fathom Analytics as an alternative to Google Analytics. While there were ethical reasons I did this, it also meant I could remove Google’s scripts and a cookie-compliant popup.In terms of improving the site’s usability, I looked at two key areas, brand colours and navigation. I updated my brand colours very slightly to improve contrast and readability throughout the site. Looking at fonts, I rolled back to some old-school fonts of Times and Arial to improve speed and make the text more readable on all devices. The biggest change was switching to a predominately dark theme. While I have plans to make a light theme which can be switched to in the future, at the moment, evidence suggests that darker themes use less energy, especially on more modern screens.
Results
The results have been fantastic in terms of speed, accessibility and eco-credentials. The stats below come from the site’s homepage, but the rest of the website’s pages tell a similar story.
Carbon Usage Decreased by 97%
The homepage was 67% dirtier than all sites tested prior to improvements; the homepage is now 98% cleaner than all sites testedWhen tested on GMetrix, the site improved from a C score to an A score.
Speeds Improvements of 170%
Desktop Scores – Old Vs New SiteSpeed 69 Vs 100 Accessibility 94 vs 100 SEO 92 vs 100Mobile Scores – Old Vs New SiteSpeed 37 Vs 100 Accessibility 94 vs 100 SEO 91 vs 100
Technical Site Score Improvements
Technical Crawl score improved from 83 out of 100 to 93 out of 100Bounce Rate improved from 69% to 44%