7 Tips for Super Fast Websites

18 December 2020

For your website to be efficient and meeting all of your business needs, there are certain requirements it needs to meet. First and foremost, it needs to be fast. This is one of the only ways to meet user experience expectations, gain a better ranking on search engines, and minimise the environmental impact.

However, there are several metrics to consider when examining the speed of a website. These include:

  • TTFB - Time to First Byte
  • FCP - First Contentful Paint
  • LCP - Largest Contentful Paint
  • FID or TTI - First Input Display or Time to Interactive
  • CLS - Cumulative Layout Shift
  • Total Blocking Time

They each represent an important stage of the website loading process. Understanding how they are interconnected and the factors that weigh on them is crucial to speed up your site. Check out some best practices below.

Mind Your Images

Images are something that everybody in charge of managing the website should be mindful of, as they are often the culprits of a slow website. They impact several of the metrics seen above, including the FCP, LCP and CLS metrics.

Images on a website can come in different formats (JPGs, PNGs, SVGs, GIFs) and sizes. Optimising these images is the first step if you want to see your other efforts become fruitful.

Minimise Render Blocking

Reducing render-blocking to a minimum is an important practice that developers should keep in mind. Render blocking refers to JavaScript or CSS files that are loaded in the

element. These will require downloading before the rest of the page is accessible by the user - or rendered. This process will slow down the process of loading a page or website.

Learn About TTFB and Network Speed

TTFB (Time to First Byte) is a crucial metric when measuring the website’s speed. This metric calculates the time elapsed between the user query and the search engine’s result. The TTFB should be as low as possible, with a standard of 200 milliseconds. This metric is commonly affected by the network speed, a factor that you cannot control. However, you can check how your website performs in different conditions by running several tests.

Work With Your Developers to Minify Assets

When your developers work on your site, they should aim to minify all assets, including CSS, JavaScript, and images on the website. This eliminates any whitespace in excess, which can streamline all functions and optimise the website. This tip will influence most metrics, including FCP, LCP and FID.

Pick Your Fonts Wisely

This tip is aimed at designers and developers, especially. There are several aspects of the font chosen that can weigh on the website’s speed - in particular the FCP and LCP metrics. These include:

  • Font size
  • Number of weights
  • Variations and additional requests required
  • How the font is implemented

Ensure the font you have picked work naturally with the website and triggers minimal disruptions.

Be Mindful of Plugins and Embeds

Developers and designers should also be mindful of the embeds and plugins used. These can make the website much heavier and slower. While some plugins are necessary to enhance the user experience when on the site, third-party ones should be used in limitation. These can interfere with the website in many ways and affect most metrics, especially TTFB, LCP, and FID.

You should also be aware of embeds. Some embeds such as YouTube videos, social media widgets, and other additions are difficult to control, and they can bloat and weigh down a website.

Master Google Tag Manager

This is an especially important tip for the marketing and SEO department. Every time you decide to implement features or scripts via GMT (Google Tag Manager), it is recommendable to check the website’s speed before and after the implementation. This allows you to have full control over the changes.