Explain Like I'm Five: Website speed

Why website speed matters

A fast website encourages users to stay long enough to purchase products or consider getting in touch.

How to measure website speed

To get quantifiable metrics, we use Google Lighthouse. Let's look at the most important metrics:

TTFB (Time to First Byte)

• When you type "tinloof.com" on the address bar and hit ENTER, the browser will ask for the page content from tinloof's servers.
• The Time to First Byte is the time it takes for tinloof's servers to send the first byte (tiny piece of data) to the browser.

First Contentful Paint (FCP)

• Once the browser receives the page content, it starts painting it. The First Contentful Paint is the time it takes the browser to paint the first chunk of text or image of the website.

Largest Contentful Paint (LCP)

• The Largest Contentful Paint is the time it takes the browser to paint the largest visible block of content. In the case of Intoteq homepage, the largest visible block of content is the 3D illustration.

Time to Interactive (TTI)

• The Time to Interactive is the time it takes for the website to become fully interactive (e.g. you can click on buttons and links).

Perceived website speed

• The previous metrics are quite helpful but they only exist to guide us towards our end goal: provide a good user experience. In fact, there are some tricks we can do that improve this perceived website speed without affecting the metrics.
• While loading an image, we first show a blurry version of it. The HD image then replaces the blurry one once it's ready. Although the final image takes the same time to load without this trick, progressively loading the image gives users the impression it loads faster.

How to improve website speed

• There isn't a magical forumla that will make any website fast. If there was, we wouldn't be writing this article. However, we'll share two tips that are quite effective in making any website faster.
• Keep it simple : The most effective way to make a website faster is to keep it as simple as possible. Why? Because a simple website makes the browser process less code.

Set a speed budget

• To determine a website speed budget, we ask ourselves: what's an acceptable speed for our site? It's fine to exceed this budget during the implementation phase because the main focus is to make things work ahead of deadlines.
• That's when optimizations come into place: we first audit the website speed, identify issues causing the website to be slow, and then do our best to solve them.
• If you read the performance section of our illuminem case study, you'll see that although we initially exceeded the speed budget, we were able to optimize illuminem to only take 1.3 seconds to load.

Need help with your business growth?

Reach out to Intoteq today! we are technology and brand building experts. We are always happy to be of service!