3 Nov 2021

Top tips for a ‘greener’ website

Top tips and tools to help your team create a lighter, faster and more energy efficient website.

With the internet contributing around 3.8% of global emissions - the creation and management of websites has its role to play in the effort to tackle climate change. 

What you add to web pages affects their size. The lighter the page weight, the quicker the load time and less energy is used to store and serve them.  

There are simple actions that you can take to make your website lighter, faster and more energy efficient. Your members will also have a better online experience as a result. To measure how your website performs right now, check out our list of useful tools below.

Tips for your team

Pixl8 Creative Director Luke Holderness and Head of Delivery Andy Lee share their top tips on how to create greener (and better) web pages:

Luke.png 1
andyleecutout.png 1

1. Create lighter content

  • Use rich media content sparingly - don’t embellish pages with videos or heavy files that add little value.
  • Write succinct copy. Shorter copy makes for lighter pages and is more engaging.
  • Create pages with a user-first approach. Give members the content they need, not what reflects your organogram.
    Our experts can help you identify the content your members will value. 

2. Delete dead content

  • Do you have pages with low visits and short dwell time? Have you identified the content isn’t being read?
    This could be because it is out of date or focused on internal needs rather than your audience. 
  • Remove obsolete pages and content sections to lighten your website and deliver a better experience by enabling content to be discovered more easily, relevant and useful. 

3. Run a regular content audit

  • When we build a new website we challenge our clients to audit their existing content. Content that isn’t being read or has a high bounce rate should be removed on a regular basis. Our experts can help you identify which content you should retain or revise.
  • Migrating existing content to a new website? Don’t just lift and shift content - rewrite and reshape it so it is more effective, useful and takes up less space. To coin a sustainability phrase: reduce, recycle and reuse your content. 

4. Reduce image file sizes

  • Large images make up the majority of heavy files on websites across devices. Don’t add images bigger than you need to.
  • ‘Lossless’ image compression can reduce large image size significantly - from megabytes to kilobytes. 
  • There are many open source or free compression tools available including Squoosh from Google Chrome Labs, ImageOptim and Caesium.
  • Pixl8’s Preside platform imaging tools auto-scales images and optimises them for the web.

5. Remove heavy files

  • Get rid of heavy PDFs and create longform HTML pieces instead. By removing heavy files you will see a data saving benefit and lower bandwidth. Alternatively, saving pdfs as a Reduced Size PDF can reduce their size.
  • Our longform report feature in Preside can help you do this. See how the NUJ are using it on their website.

  • In 2014 a report by the World Bank highlighted that a third of its pdfs had never been downloaded. Do you really need all your pdfs?

6. De-dupe your data

  • Duplicate, incomplete or out of date CRM records take up unnecessary space. If you have a new CRM integration or are moving to Preside CRM our team can advise on what you should move across.

7. Cut down on custom fonts

  • Custom font files can significantly increase the file size of web pages. A typical custom font file can be over 200kb and may only include a single weight. Multiple typefaces and multiple font weights can add up quickly, increasing energy use and causing slow performance. 

8. Deploy lazy loading

This practice delays loading images and other website assets until they are needed by the user as they scroll down a page. The benefits include:

  • Reducing page weight so there is a quicker initial load time
  • Conserving bandwidth by delivering content to users only if it’s requested
  • Conserving both server and client resources, as only some of the images or code need to be rendered or executed

9. Optimise your user journey UX & design

  • Shorter user journeys not only deliver a better online member experience but also saves energy. The amount of time spent online is reduced along with the number of pages that users need to access to accomplish their goals.
  • Remove barriers such as pop-up banners and avoid ‘dark patterns’ that intentionally trick or divert people. 
  • Eliminate proprietary technologies that require a user to install additional software before they can use your digital product or service.

10. Sustainable systems

  • At Pixl8, we are always optimising Preside - our platform for developing, building and maintaining websites. We actively move our clients to the latest version so that their websites perform at the highest level. 
These tips are all things that you and your team can do lower your live website carbon usage. The technology used to develop, deploy and run websites also involves energy use.  Discover what we’re doing to make our technical systems more environmentally-friendly in our next feature.  See all the articles in this series here.
Keep in touch with our monthly newsletter The Forward

Keep in touch with our monthly newsletter The Forward

Sign up now

More One Step Greener resources

PIxl8greenertechheader2880x1100v2.png

10 top tips for greener web tech

Get top tips for technology that can help greener web development.

GreenWebsiteHeaderImage.png

Our steps to be greener

Find out more about our SME Climate Commitment and what we are doing to reduce our energy consumption.

GreenWebsiteHeaderImage-2.png

One step greener

As COP26 starts, we share top tips on sustainable website design, insights into greener web development and explain the steps that we're taking to reduce energy consumption.

Related topics