Understanding your website’s performance and accessibility: A guide for charities using Google Lighthouse

Google Lighthouse is a free tool that can help you understand how your website performs and how accessible it is. But its reports are often full of technical terms that can feel like a barrier, especially if you don’t have a digital background.

We’ve created this guide to break down some key terms and explain the most common issues we see. Our goal is to help charities understand what Google Lighthouse audit results actually mean and what can be done to make your website faster and more inclusive. This could include all different areas of your charity’s work from fundraising and service delivery to spreading awareness.

Many of the solutions we cover will need support from a developer, especially when it comes to things like image optimisation, code improvements or fixing accessibility issues. But it’s still useful to understand what these terms mean and why they matter, then you can decide your next steps. It gives you the confidence to ask the right questions and work more effectively with your developers or digital partners.

What does ‘Performance’ mean in Google Lighthouse?

Performance is about how quickly your website loads and how smoothly it runs. The faster your site is, the more likely people are to stay, explore and take action. This could be donating, signing up for an event or simply reading about your work.

Google Lighthouse provides a Performance score that ranges from 0 to 100 and it is grouped into these bands:

0 to 49: Poor

50 to 89: Needs Improvement

90 to 100: Good

Common Google Lighthouse performance issues explained

Google term: Improve image delivery

This is more commonly known as image optimisation. It is the most common and biggest issue that we see with websites which have poor performance. The larger the image in terms of file size, the longer it takes to load, increasing the load time of the web page it is on. Image optimisation is about making the file sizes as small as possible without detracting from the visible quality of the image.

Three ways to optimise images:

• Resize images based on screen width
  Mobile users shouldn’t have to load large desktop images. Images should match the size they appear on each device.
• Convert images to next-gen formats like WebP
  WebP images are smaller in file size but keep the visual quality. They load faster without compromising how your site looks.
• Load images only when they’re needed
  This is known as ‘lazy loading’. Images that appear further down the page don’t need to load right away. Loading them as the user scrolls helps your page load faster.

Google term: Reduce JavaScript execution time

JavaScript is code that makes websites interactive. It powers things like donation pop-ups, embedded videos and menus. When JavaScript files are large or not optimised, they slow down how quickly your content loads. This is especially noticeable on mobile devices or slower connections.

You can improve performance by reducing the number of JavaScript files, deferring non-essential scripts so the most important content loads first and keeping file sizes as small as possible. One common recommendation you’ll see in your audit is to minify JavaScript. This means removing anything in the code that isn’t needed such as spaces, line breaks or comments. It reduces file size without changing how your site behaves. 

Together, these changes help your site feel faster and more responsive for every user.

Google term: Remove unused CSS

CSS controls how your website looks. It handles everything from layout and spacing to colours and fonts. But if your site loads more CSS than it needs, it can slow things down.
Often, websites load one large CSS file that includes styles for every page on the site. Each page usually only needs a small portion of those styles. Loading everything, even the parts that aren’t used, adds unnecessary weight and increases load time.

You can improve performance by removing unused styles and by splitting CSS files so each page only loads the styles it actually needs.

Google term: Minify CSS

Minifying CSS is a simple way to reduce file size without affecting how your site looks. It removes unnecessary characters from the code such as spaces, line breaks or comments. This helps your pages load faster and can contribute to a better performance score.

What does ‘Accessibility’ mean in Google Lighthouse?

Accessibility is about making your website inclusive and usable to as many people as possible, including those with disabilities. It means making sure your site isn’t digitally excluding anyone who may access content in a different way. This involves supporting the various ways of using a website, such as navigating with a keyboard, using a screen reader, or reading content with enough contrast to see it clearly.

Google Lighthouse checks your site against a number of accessibility criteria, which are mostly either a pass or fail. Scores are grouped as:

0 to 49: Significant barriers

50 to 89: Needs improvement

90 to 100: High level of accessibility

A high score means fewer barriers for users and a more inclusive experience overall.

Common Google Lighthouse accessibility issues explained

Google term: Heading elements are not in a sequentially descending order

Headings help structure your content and make it easier for everyone to understand the flow of your page. For people using screen readers, headings act as navigation points. They allow users to move quickly between sections or bring up a list of all headings on the page.

To support this, headings need to follow a logical order. For example, a main section should use a level-two heading (H2) under a level-one heading (H1), and any sub-sections should use H3. Skipping heading levels – like having an H4 follow an H2 – can confuse screen readers and make your content harder to follow. This can lead to frustrations for the user who may end up leaving the site.

Keeping your headings in the correct order improves accessibility and helps all users navigate your content more easily.

Google term: Missing alt text

Alt text is a written description of an image that screen readers can read aloud. It helps users who can’t see the image understand what it shows and why it’s there. Every image should have alt text unless it’s purely decorative, such as a background pattern or a visual spacer that adds no meaning.

This is especially important for charities where images often support storytelling or campaign messages. This is key for communicating your story and case for support, which builds engagement and inspires action.

Read more: How to write accessible content that works for everyone

Google term: Background and foreground colours do not have a sufficient contrast ratio

Text needs to stand out clearly from its background so everyone can read it comfortably, including users with visual impairments or colour blindness. Google flags any text that doesn’t meet recommended contrast ratios.

If you’re unsure if your brand colours are accessible, you can test your colours using our brand colour palette accessibility checker, which shows whether your text and background combinations meet accessibility standards.

It’s also important not to rely on colour alone to show meaning. For example, avoid using just red text to show an error message without a label or icon.

Google term: Touch targets do not have sufficient size or spacing

Touch targets are features such as buttons, links and other interactive elements. These need to be large enough and spaced far enough apart so people can tap them easily on a touchscreen. If they’re too small or too close together, it becomes harder for people to use your site and cause frustrations if people can’t access the intended feature. This is especially true on mobile devices or for users with limited dexterity.

Best practice is a minimum target size of 44px. This meets AAA, the highest level of accessibility under the current Web Content Accessibility Guidelines (WCAG) standards. These are internationally recognised standards for making websites more accessible to people with disabilities.

Google term: Links do not have a discernible name

Every link on your site should have a clear, descriptive label so screen readers can explain its purpose to the user. If the label isn’t visible, it can be added in a way that’s hidden visually but still accessible to assistive technology. This includes links shown as icons or images, such as social media icons or a clickable logo which can be easily recognised.

Summary

Through small, practical changes, you can enhance the performance and accessibility of your charity’s website by utilising the insights of the Google Lighthouse audit. By tackling barriers and enhancing your website’s usability, you can make your site more inclusive and help it better amplify your charity’s purpose.

If you’d like support turning your audit results into action, we’re here to help. Get in touch to see how we can work together on levelling up your charity’s digital journey.