Easy ways enterprises can improve their Lighthouse Score

With every business that discovers the magic of digital experiences, another is hitting the wall of site performance. It's a rude awakening: how do you create an experience that your users will love enough to stay, get comfortable, and convert if your site is slow? How can you measure the effectiveness of your current efforts to optimize performance?

One invaluable site tool is Google Lighthouse, an open-source, automated tool used to audit and improve web pages. If you're stuck on the next steps for your site, Lighthouse is one of two excellent places to start to figure it out (Core Web Vitals being the other). 

Unfortunately, Lighthouse Scores are technical by nature - it's hard to break down methods to improve without diving into technical-speak and donning your developer hat. You're going to wade through terms like 'unload event listeners' and 'Minify Javascript' and 'avoid enormous network payloads.' These are all terms that you can learn (and should), but if you have a dev team to help, there are other things you can do to improve your scores without diving into the technical side. 

Well, stop twiddling your thumbs! This article will go over a few steps you can take to help improve your site metrics without leaning on your development team. The aim here isn't to teach you to use Lighthouse. The goal is to give content teams (and general marketing teams) simple ways to improve their Lighthouse scores. As the dev team dives deeper into the most technical parts of the process, help improve your site with a few best practices.

We'll cover two high-level topics in this article: 

• A brief overview of what Lighthouse Scores are and what they measure
• Easy ways to improve metrics that don't involve in-depth technical work
  

By the end, you'll have a short list of steps to take to improve your Lighthouse Performance Scores!

What is a Lighthouse Score?

If you're here, chances are you already know what a Lighthouse score is and are more interested in ways to optimize your site on a non-technical level. Feel free to jump down to the optimization suggestions. With that in mind, here are the cliff notes as a refresher:

According to Google: "Lighthouse is an open-source, automated tool for improving the quality of web pages. You can run it against any web page, public or requiring authentication."

Lighthouse uses Chromium to rebuild web pages and then generates reports to help users improve issues discovered during the process. 

These reports give you detailed advice on what to optimize (and how) to create a better site experience in the form of audits. Once finished, it provides an overall performance score:

• 0 to 49 (red): Poor
• 50 to 89 (orange): Needs Improvement
• 90 to 100 (green): Good

The tool can access pages whether they require authentication or are open to the public - pop in your URL and watch it go! PageSpeed Insights goes over performance specifically. 

Each audit delivers incredibly detailed diagnostics providing actions that you can take to optimize speed, performance, accessibility, and more. There's not much left to the imagination here: your Lighthouse reports will mention everything on your site that needs attention.

Five key metrics combine to calculate an overall Lighthouse Score:

• Performance
• Accessibility
• Best Practices
• SEO
• PWA (Progressive Web Apps)

Since we're focusing on non-technical steps you can take to improve your scores, we're going to break things down more generally. If the tips below look, feel, and smell like Search Engine Optimization (SEO), it's because they are wholly related. Often, metrics see the best boost through general best practices that every marketing team can benefit from implementing!

Focus on improving performance with SEO Best Practices

Your task is simple: do what you do best. While your dev team tackles the technical issues, you should focus on high-level optimizations that make a big difference in the long run. 

Optimize every image on your site

Images are often the first hello your users get from you. From sliders to headers to logos, images have the power to make or break your site.

Optimize your images by compressing every photo that touches your site. Images should be responsive, scaling with screen size. Ideally, they should be less than 100kb (if possible), and they should have:

• Alt descriptions
• Alt text
• SEO-friendly titles
  

Follow accessibility guidelines for your alt descriptions. 

Use the correct image format for the situation. JPEG gives you the most options for compression, keeping image quality at smaller file sizes. PNG formats are required for transparency, but try to keep their usage to a minimum - they come at the cost of larger file sizes. Keep in mind that JPEG compression isn't great for images mainly composed of lines (such as icons).

Compression is your friend when it comes to online imagery. A great site to bookmark for image optimization is Tiny PNG. If you're not great with manual photo optimization, it's a quick copy/paste to better file sizes. If image editing in Photoshop is out of your skill range, try an easy-to-use image SaaS like Canva or Piktochart for quicker, more manageable learning curves. 

Image optimization makes a huge difference for performance metrics, especially on legacy CMS sites. Headless CMS will prove forgiving for huge photo sizes and detailed imagery, but understanding image optimization will still give you an advantage.

Add alt texts and descriptions to all images on your site

While this is part of image optimization, it's important to flag this task as an essential step for Lighthouse Scores. Alt text and image descriptions aren't just there for show. They give screen readers an easy way to describe imagery for sight-impaired people. This functionality adds them to a long list of audits done for Lighthouse's Accessibility score, and getting familiar with adding alt text should be high in your priorities. 

They also provide context to site crawlers, so this optimization improves both SEO and Accessibility scores.

Use accurate file names

Filenames might not seem like the biggest deal, but context means a lot for both accessibility and image optimization. Use dashes instead of spaces (A-picture-of-a-lightbulb instead of 'a picture of a lightbulb'). Try to keep names relevant to the imagery.

Reduce the number of plugins on your site

Plugins and widgets can seriously slow down your site. Stick to plugins essential to your site needs and keep them updated. Delete any plugins that are no longer in use.

This advice goes for anything on your site that isn't necessary or isn't in use. Remove unused plugins, code, and ads. 

Optimize with Largest Contentful Paint in mind 

Lighthouse Performance 

Most marketing teams are already aware of methods to tackle page load speeds, so Largest Contentful Paint (LCP) is a great place to optimize. It measures perceived load speed, a metric that shows when the main content on the page has loaded. It helps demystify how long it takes for your user to see the content you've carefully prepared for them. 

Some steps you can take to optimize your LCP score:

• Shrink your video sizes
• Be mindful of the size of your background images
• Optimize your text as much as possible (more on text optimization in the accessibility section).

Your dev team will spend a good amount of time here, so get to work with the simple stuff! We talk about the importance of page speeds in this article, and some of our tips here will help you continue your performance optimizations. 

Improve your website accessibility

The Accessibility test contains the highest number of audits, but many of the solutions are doable by a non-technical team. It checks to see how usable your content is for everyone, including users of assistive technology and others needing accessible content. Describe and tag images and other visual aspects clearly, correctly structure pages, and your site should be overall searchable. There are plenty of tools dedicated to improving web accessibility. 

In general, you want to keep a few things in mind. Users should be able to:

• Easily navigate and browse your site for what they need
• Experience mobile-friendly pages
• Read the text and see images clearly
• Skim your text
• Browse without auto-playing video or audio

An article written by Holly Tuke from Big Hack showcases her experience as a blind screen reader user on the web, and it's a wake-up call for anyone running a site. It also goes over ways to fix the errors, so it's a great article to read and break down.

Optimize your site text

One of the most important aspects of sharing content online is to make sure that people can engage with it. If you have tiny text, jarring color combinations, and badly broken-up sentences, you're offering up a terrible user experience. 

Use proper page structure

Unsurprisingly, Google Lighthouse loves it when you follow Google's best practices. The Best Practices section of Lighthouse tests your web design for modern usability expectations and overall performance.

• Heading structure: Headings should nest logically, with one H1 header per page and then properly nested H2 - H6 headers. Accessibility programs use headers to figure out the importance of different parts of your page, so keep everything neat. Spiders also crawl based on heading structure. 
• Text Readability: Break up text for readability, avoiding large chunks of text without breaks. 
• Keep links to a reasonable amount.
• Use text instead of images for important links, names, and content.

Check for broken links

While it can seem daunting to check every link on your site, you're in the modern era! Tools like Google Analytics will give you an excellent overview of broken links on your site. You can also use marketing tools like Site Checker, SEMRush, and Ahrefs to get the job done quickly. Screaming Frog SEO Spider will also do the trick if you're more of a spider lover. 

Improve your Lighthouse Scores with general best practices

Of course, there are more technical solutions you can use to improve your site metrics (and Lighthouse will give you plenty of ideas), but your dev team can handle those. On your end, improve the site through your general SEO best practices. You know how to create a good website, though you might not have realized how valuable your marketing skills are! You're probably already creating alt descriptions and meta descriptions for your photos in your day-to-day work. 

The information in this article is only the tip of the Lighthouse iceberg! While your dev teams dive deeper into the optimization suggestions, your content or marketing team can tackle these easy optimizations listed above:

• Images
• File names
• Alt Text and Descriptions
• Plugins
• LCP
• Accessibility
• Text
• Page Structure
• Links

Remember, at the end of the day, Lighthouse Scores give you plainly stated ways to improve the user-friendliness of your site. Marketing teams are made up of professionals who hone their skills in these very practices. Want to know the best way to enhance Lighthouse scores for non-technical teams? Do what you do best: optimize!