Webmentor's How To Guides

Webmentor's How To Guides are written in plain english so that ordinary business folk can understand important stuff about their websites.

Your consent to the use of Cookies

Your consent to the use of cookies on this site is determined by your current browser settings. Learn about the cookies we use here.

Webmentor's Webhosting Tables

Compare Irish Web Hosts in an easy to read table. Vote and leave a comment, or read what others have to say. Take me to the Webhosting Tables.

How Fast is Your Website?

A couple of years ago, Google made it known that site speed could be a factor in search engine page rankings. But is it? And is it worth investing a few bob to see your website loading faster? The short answer is that if speed tests put you into the "80% slower than all tested websites" category, then you will almost certainly benefit from a ranking boost, more visitors and a reduction in bounce rates.

Test your Website Speed (and get your grades)

There are 2 free tests out there, and we recommend both.

  • YSlow
  • Pingdom

Both tools will provide you with plenty of advice as to how you can speed up your site. Unfortunately this involves a staggering amount of technical jargon like compressing and minifying scripts and stylesheets or using a CDN to serve static content (images and so on). You’ll almost certainly need a technical person to implement the suggestions for you.

Don’t be put off if you don’t understand it!

The most important and gratifying step is to do the test, get the grades and decide if it’s worth spending money on an expert to get your site speeding.

YSlow

YSlow, from Yahoo, gives each page that you test a grade from A for Amazing to F for Flop. We like the simplicity! The downer is that you have to install it as an add-on to the Firefox browser. After that, you can use it whenever you like providing you’re viewing the page on the Firefox browser (one of the greats in the browser world).

How to Install YSlow
  1. If you don't already have the Firefox browser, get it from here and install it (http://www.mozilla.org/en-US/firefox/new/)
  2. With Firefox open, go to this site to get Add Ons for Firefox: https://addons.mozilla.org/en-US/firefox/?application=firefox
  3. You need to install Firebug before you install YSlow. To do this, search for Firebug
    search for firebug
  4. Once its found, click the green Add to Firefox button and sit back while Firebug gets installed into Firefox
    install firebug into firefox
  5. Once this is done, use the search facility from step 2 and this time enter YSlow
    search for yslow
  6. Again, once it is found, click the green Add to Firefox button and follow instructions
    install yslow into firefox
How to Use YSlow
  1. Open your Firefox browser and go to the webpage you want to test
  2. Once you're on the webpage, hit the F12 button on your keyboard to bring up Firebug. It'll open as a pane on the bottom of the web page you're looking at. Just ensure the YSlow tab is selected in case what you see doesn't match the image below
    Open YSlow in Firebug
  3. Hit the Run Test button and sit back
  4. When it's finished you should get a score from A to F for the page you're viewing
    Rated A by YSlow

Pingdom

Pingdom will tell you what percentile the web page falls into – eg 75% slower than all tested websites (that would be an E or F grade from YSlow), or Faster than 90% of all tested websites (about an A from YSlow). Pingdom is online so you don’t need to install anything. Just type in the url of the page you’re testing and it does the rest.

How to Use Pingdom
  1. Head over to the Tools section of pingdom.com (http://tools.pingdom.com/fpt/)
  2. Type in the url of the webpage you want to test (you can omit the http:// bit) and hit the Test Now button
    Test page speed in pingdom
  3. When it's finished you should get a rating for the page you're viewing like the one circled in red in the image below.
    Page speed rated by pingdom
  4. Notice that the page was tested from New York. There is a tiny Settings button, if you can spot it you can change your tests to simulate a server closer to home (eg Netherlands). That will improve your scores a bit.

What Pages on my Website should I Test for Speed?

The short answer is your most popular pages - the ones most visited (or the ones that should be most visited) - which you can identify if you use Google Analytics or a similar program. If you're happy with that you can skip the rest of this article.

Danger!

You are entering a Geek Zone. You too can turn back if you possess the will...

Understanding Some of the Technicalities Behind the Testing

Test the Home Page

On most websites the home page is the one most of your visitors will land on first.

Speed matters here the most.

The first page is often the slowest to load because all the resources required to display the webpage on your visitor's device (images, scripts, stylesheets, text etc) must each be downloaded from the server where your website resides. Once this webpage is displayed, these resources get stuffed into a small piece of memory on the visitor’s PC called the browser cache (pronounced "cash").

So while it takes time to download all these resources initially, like on your home page, it's going to get faster as the Visitor goes through your site - all thanks to the browser cache.

Quite a few resources will be re-used from page to page (eg the logo image, certain scripts, images used in your template). The browser is smart enough to know that if this stuff is already in the browser cache of your Visitor's PC, it doesn't need to waste time requesting it again from the server.

Something to know about the browser cache is that it's kinda on the small side, so if the same Visitor re-visits 2 months later, chances are there won’t be any resources from your site left in her cache. (The cache operates like a pipe – to get a new resource in, the oldest resource has to be dumped out.)

Test Important Pages that have High Bounce Rates

If you think your home page, or some other important page on your website, is very slow, AND you’re getting a D-F score from YSlow for that page AND you’re seeing a big bounce rate (like 80% or more) – then you’re probably not insane to wonder if slow page loading is playing a part in the process of turning your visitors off.

What is Bounce Rate?

Let’s say you notice a 90% Bounce Rate for a certain page on your site. That is a huge and significant figure. That means 90% of visitors LANDED on this page and visited NO OTHER page on your site (for at least 30 minutes, to be precise). Let’s say this page was the bus timetable from Limerick to Cork. Well you might expect a high bounce rate right? People are looking for exact information. They landed on this page exactly and visited no other on your website. Why would they? They realised the bus was leaving in 15 minutes. They slammed closed the lid of their laptop and bounded off to catch the bus. Yup, that’s a bounce, and they're not always a bad thing.

A high bounce rate **MIGHT** also mean that your page loaded so slowly that the visitor just hit the back button and went to some other website instead.  So you can see that common sense is needed when trying to make sense of bounce rates and whether or not you should get yourself exercised.

How to find the Bounce Rate

To find bounce rates, you’ll need to log in to your Google Analytics account and examine the traffic reports.  Go to the section called Content and click on Site Content and then on All Pages. You'll see the Bounce Rate listed for every page on your website.

bounce rateBounce rates of web pages in Google Analytics

Test Pages that are Media Rich

Again, every web page is crammed full of resources - images, videos, scripts, stylesheets - and each of these has to travel from the server the website is on and get downloaded onto the visitors PC. The browser uses the code instructions of the webpage to put all these resources into the right place and that all takes time before the visitor can see or interact with the page itself. It's not uncommon to see upwards of 60+ requests to the server to get all this downloaded, and yet your average visitor wants that page in their sights in under a second.

If a webpage has 27 images on it, that means 27 separate requests to the web hosting server for each of the images. Apart from the sheer number of requests, the size of each image also plays a part in slowing down the website as it appears in your visitor's browser. Of all the resources on a webpage, images are usually a double whammy in that i. there's lots of them and ii. they can be very large. Videos, on the other hand, are usually few though very large, scripts are usually many, though very small and stylesheets are usually both few and small.

Therefore any page with loads of images on it has the odds stacked against it. Don't forget most of the design on older webpages consists of images too, even if it's not immediately obvious to the eye. YSlow and Pingdom will tell you how many images each page is loading. So you can imagine the extra slowness when that page also includes a slideshow, image gallery or lightbox of product images.

If these pages are an important part of the trail through your website, then be sure and test them with YSlow or Pingdom.

There’s quite a lot that can be done to optimise images (and other media that is stored on your webhost's server)

  1. You can get about a 20% reduction in image size using Yahoo’s free SmushIt tool.
  2. If you know and love a good graphics program, you can optimise the images yourself. Try Gimp, it's free.
  1. You can serve up any/all resources from a CDN like Amazon CloudFront. What's a CDN?
    A CDN, or Content Delivery Network, is a distributed server system. When you upload resources to them they get distributed on servers all over the world. That means if someone is downloading your page from South America, and your server is in Ireland – then by using a CDN a copy of those resources will also be placed on servers in South America making those images/videos/etc download a lot faster for those in that locale. The CDN approach is effective if your audience lives outside where your server is housed AND they are an important audience for you. CDNs aren’t free – but they’re usually cheap – read the small print.
  1. You can use image sprites. Consult your developer.
    As I've already said, if there are 27 images on your page, that would mean 27 requests to the server to get them downloading onto your visitor's device. A sprite is one large image where every other image is stashed into (like a photo album). We use code to tell the browser which part of the sprite to show depending on which image is required on the page. The great advantage is now just one call to the server to download the sprite (inside which are all of your images). The great disadvantage is that in the wrong hands, this one file would obviously be the size of a MASTODON. This is not an ok method except for designers who know what they’re doing. The whole yada yada about sprites is that it’s just the one call to the server which WILL improve your YSlow score – demonstrating yet again the foolishness of trying to cheat the system to improve your YSlow score at the expense of your visitors who, 2 days later, are still waiting for this giant sprite to download. (And just watch your Bounce Rate go up…)

Test Landing Pages

Like home pages, you should test Landing Pages for speed. A Landing Page is usually a page that Visitors are directed to from a campaign. For example, let's say you are running an email campaign and you include a link to a particular page on your website offering 20% off your product. If that page is loading slowly, because of images or slow loading scripts, then you could potentially lose out on that hard-earned click.

Watch Out for those Third Party Scripts

Third party scripts end up on your website because you’ve asked the developer to include Facebook Like buttons, Twitter shares, a Google map, Google Analytics code and 15 videos from your YouTube account.

These companies provide cut and paste code which goes into your website. The code that gets installed calls on scripts which must also be downloaded in order that your Visitors can easily share your content or watch your great marketing videos. Nothing wrong with that, except you have no control over them. Third party scripts do not come from your server. They're being supplied by these other companies. While some of them are optimised and (hopefully) delivered from CDNs, many aren't and will slow down your website. And some of these scripts are just so much worse than others. I've even seen scripts from Company A, we'll say, that are calling scripts from Companies B and C for the purposes of tracking. That's not just a big increase in page load time, it's also how Company A is funding that free functionality for your website. The cure can often be as simple as finding a different vendor to provide that same functionality in a more optimised and less compromising way.