Card image cap

Slow websites suck. Don’t let your website be one of them.

By On Surfcode post tags: Performance ,

Let’s face it, no one likes a slow website. So why are so many marketers building them?

Customers don’t like slow, nor do employees, vendors and especially Google’s search ranking algorithm.

But instead, what we have found are thousands of websites, across many industries, all missing the mark on delivering fast experiences to their visitors.

We put together this guide to share our methodology for evaluating website performance. You’ll learn why page speed is important, how to measure page speed, and a few tips for improving your page load speed.


So just how important is page load speed?

Very. Google has been talking about the importance of page speed for years now. In the past two years alone they’ve rolled out a ton of content concerning page load speed, including updates to their search algorithm which directly impact slow websites.

Our team used custom-built crawlers to scan the entire Inc 5000 list in search of websites with slow page load speeds and what we found were thousands of sites with pages that take longer than 5 seconds to load.

During Google I/O ‘18 there was an entire presentation centered on web performance. One of the more interesting statistics they shared was that within a user experience hierarchy of needs Google found that 75% of users said page load speed was one of the most important aspects when interacting with a website.

It’s clear that Google is prioritizing page load speed, which is why we, as web developers, put so much emphasis on it.

Let’s walk through some of Surfcode’s methodology for evaluating web performance to help you self-diagnose your website and determine your page load speed.

Measuring your website’s performance

Let’s look at five of the actionable steps you can take to determine your website’s page load speed.

1. Run PageSpeed Insights

The first step is simple and one of the best ways to see the big picture of how your website’s speed ranks in the eyes of Google.

Go to https://developers.google.com/speed/pagespeed/insights/
Enter your domain
Hit run

You’ll be presented with scores for the desktop and mobile versions of your site along with the average CPL(first contentful print: meaning how long it takes for your site to load enough content to actually look like a website) across all pages.

If your site has low optimization scores and high CPLs— you have a performance issue. Ideally, both scores should be in the green which means your website has low CPLs and fast page load speed for mobile and desktop.

Google started using Mobile Page Load Speed as a search ranking factor in July of 2018 so having your website optimized for mobile is important.

2. Identify and optimize bulky media

The dream of many marketers is to have beautiful images and video on their website. Unfortunately, these types of designs are often the bane of performance.

Images tend to represent the majority of data being loaded on a website and if they are not optimized with techniques like image compression your page load speed will suffer.

We use image compression tools like ImageMagick and mod_pagespeed to create workflows for automatically compressing images when they are uploaded to a CMS. This enables marketers to change imagery on the fly, removing any chance for page load speed to be impacted.

3. Determine your page load size

To see how much page data is being loaded by web browsers for the desktop and mobile versions of your website you can use Google Lighthouse which is a free tool.

To do this:

Load your website within Google Chrome
Hit F5 or right-click the page and hit Inspect
Navigate to Network
Make sure to check the box labeled Disable Cache
Perform a hard refresh on the page (Ctrl+F5 for PC, ⌘ Cmd+⇧ Shift keys+R for Mac)
View your results in the lower left-hand corner of the page
#MB Transferred

Generally speaking, if the total content for a page is over 1MB in total you are loading a lot of data. If you have 5MB or greater your page is loading too much data. Reducing this will positively impact page speed.

4. Find the number of requests

Another element that impacts page load speed is the number of requests made per page. In general, you do not need more than 4 requests to load most pages (HTML, CSS, Javascript and a sprite).

Given that marketers want more and more content crammed into a screen it’s easy to add a lot more than 4 requests.

To find the number of requests per page use the same steps as with page size but you’ll be looking for a different data point.

Load your website within Google Chrome
Hit F5 or right-click the page and hit Inspect
Navigate to Network
Make sure to check the box labeled Disable Cache
Perform a hard refresh on the page (Ctrl+F5 for PC, ⌘ Cmd+⇧ Shift keys+R for Mac)
View your results in the lower left-hand corner of the page
# of Requests

To give you an idea, 40 is a subjective but reasonable number of requests. If you have under 40 don't bother looking at the total number of requests as a problem. If you have more than 40, consider reducing the number by using CSS and Javascript merge tools to aggregate and minify requests.

If your pages have more than 100 requests—something is wrong and you should seriously consider optimizing the page.

5. Listen to your visitors

If your customers, employees or otherwise are already complaining about the speed of your website, you already have a great business case for optimization. User-voice is a data point we use when prioritizing web performance and it’s one of the most important.

Consider polling your site visitors or implementing feedback mechanisms on your website to help capture this data proactively. Usabilla, for example, allows you to easily capture and manage in the moment site visitor feedback but a simple email survey works too.

Building for performance, along with implementing a sustainable workflow to manage it means your marketers can wholly focus on content and design.


How does your website’s page load speed rank?

If your website pages load in under 2 seconds, congratulations, as you represent a minority of site owners. However, if what you found is a page load speed of 4 seconds or more there is an opportunity for improvement.

Site owners with slow page load speed should start a dialogue with marketing about the ROI of performance, looking specifically at the impact slower speeds have on bounce rates. Google throws a lot of different numbers around based on whether a desktop or mobile device is the medium but they all point to one conclusion. That being—that there is a direct correlation between bounce rate and page load speed.

Have you ever searched for something on Google, clicked on the first page, waited, waited, waited, said “screw it” and then moved on to the next search? There’s no reason why your website should be the one in this scenario.

Our advice is to build your website with a performance-first mindset, prioritizing speed and making smart design decisions to support it. We will cover more on implementing a performance-first website in our next blog post.


Transforming understanding into action

The most important thing is to understand where your website stands. Knowing your current page speed and understanding which factors are impacting it makes the task of improvement goalsetting much easier.

There’s a lot of different methodologies for improving page load speed and web optimization which is why we will share our approach which *spoiler* (incorporates many of Google’s best practices) in our next post.

In our experience, if you want to win it’s always best to play by the rules of the companies writing the algorithms.


Who is Surfcode?

Surfcode is a collective of experienced developers who help marketers deliver faster, easier and more enjoyable experiences online. By definition, we are a web development agency but what drives us is the desire to create user experiences that excite people.

There’s no reason why a marketer, content creator or even a developer should struggle with their website. Building engaging web solutions is what we strive every day to do.

Latest Posts

Card image cap

Accessibility: Should We Do Anything?

By Hilton Sher On February 12, 2020

We have received a number of questions relating to ADA web compliance and would like to share some of our thoughts on this topic. Below, you can view two videos created by ...

Read More

Card image cap

Accessibility discussions to have in 2020

By Martina Lofqvist On January 4, 2020

Did you know that your website could be at risk of lawsuits for not following the Americans with Disabilities Act (ADA) of 1990?  A recent case (August 2019 case) put Domino’s pizza chain ...

Read More

Card image cap

Surfcode Recognized as a Top San Diego Web Developer on Clutch

By Hilton Sher On April 23, 2019

Websites and digital presence have quickly become some of the largest drivers of business in most industries, especially with the mobile platform gaining traction and mass popularity. But there is a massive ...

Read More