Download speed matters. And it is time to get serious about it. A one-second delay could result in 7 percent fewer conversions, 11 percent fewer page views, or even a 16 percent decrease in customer satisfaction. Over the last 15 years, I’ve told that to clients and it’s been confirmed by third-party research. So if speed affects business results, then why would you add a second to a page’s load time?
The Google +1 button and the Facebook Like button add over one second of load time to your page, according to a recent research study by TagMan, a tag management and acceleration company. Of course, visitors clicking on +1s will impact rankings. That’s why you’ll want to add the code to your website.
To complicate things further, Google for years has been telling anyone who will listen that website speed is as an important factor in determining rankings. “One of the 10 things we hold to be true here at Google is that fast is better than slow. We keep speed in mind in all things that we do, and the +1 button is no exception,” according to a post published this week on Google’s Webmaster Central Blog.
It’s not just buttons. There are many other things affecting load times on your website. It doesn’t matter if you are an e-commerce website, a major publisher, blogger, or a straightforward lead generation site. Site speed increasingly has an impact on your business, especially as the share of mobile traffic increases as a percent of visitors to your website.
Several influential people (SEOs and marketing execs) have shared with me that getting load time under the two-second load time mark, as Google recommends, has improved rankings significantly. So it’s bewildering that nearly half (49 percent) of the top 500 online retailers have page-load times exceeding three seconds, according to Internet Retailer.
So how do you get your site and these plug-ins to load faster?
First, ensure that your organization is tracking and caring about site speed.
Google Analytics offers the ability to track actual site load times directly into Google Analytics. However, few sites add the simple line of code that enables them to add the data into their analytics report. All that needs to be done is:
Where you have your Google Analytics code (most probably in your header file), insert the code
_gaq.push(['_trackPageLoadTime']);
under the line
_gaq.push(['_trackPageview']);
If your Google Analytics code is in the footer you are most likely slowing your performance as Google Analytics released new code optimized to run asynchronously.
You can also use external tools to measure individual page load time. My favorites include:
a. The Web Page Speed report, developed by Andy King, a friend and author of Website Optimization (you should own a copy). This calculates the speed based on all the objects referenced on your page and provides you results and recommendations as well.
b. Yahoo’s YSlow plugin: This will be essential if you want to check out more dynamic pages.
c. Google’s own Page Speed plug-in.
d. Loads.In: This tool lets you see actual load times from various locations and with different browsers.
e. WebPagetest: An open source tool that provides detailed waterfall charts to identify third-party performance issues
As the popularity of the Google +1 plugin grows, even Google made sure to tweak it to load faster this week.
There are many things you can do to optimize your web pages and this list is far from exhaustive but it should get you started.
Redoing CSS and JavaScript
Andy King devoted an entire chapter on how to optimize CSS and another on JavaScript. However, for a quick fix you can use an online CSS compressor tool to shrink the code and shave off some time.
TagMan CEO Paul Cook said there are many things you can do to optimize JavaScript. “Converting page-blocking synchronous scripts to execute asynchronously is the cornerstone to improving performance at the JavaScript layer. This minimizes scenarios where the entire browser is waiting for scripts to download and unable to continue rendering the rest of the page. All scripts should be minimized using a compressor like Google’s Closure Compiler and script headers should be set to cacheable in most circumstances. TagMan provides a script loader that can accelerate both synchronous and asynchronous scripts and there are several free open source script loading frameworks such as LABjs. Steve Souders’ blog is a good place to start for further tips around how and where to position JavaScript and CSS.”
Optimizing Images
When you get your report from one of the page speed tools above, copy the list of all the images and paste the urls into Smush.It (for bloggers there is even a WordPress plug-in version). Of course it would be better if you could also minimize the number of graphics called and use the right graphic format for the type of images. Also be advised of Flash load time issues.
Optimizing Your Code
To speed up HTML you can make sure your code validates, minimize the amount of code and stay away from tables and iframes if possible. You should also enable gzip compression. Of course this can be handle as part of the W3 Total Cache WordPress plug-in. You can also leverage a content delivery network (CDN) like Akamai, Amazon cloud services, and yesterday Google just got in the business to speed up your pages. A content delivery network is a system of servers placed strategically around the world which host many of your site’s files. Here is a fantastic walk through for every blogger on how to use the W3 Total Cache plug-in and Amazon’s free S3 CDN.
You should obsess over how long it takes your cart and checkout pages to load. How long it takes tools to return search results, or key functionality. There are so many more opportunities to optimize your page speed.
For some additional tips check out the Yahoo Developer Network’s best practices and make sure to read through the Website Optimization book for more technical enhancements.
Adding Hardware
If you don’t have the time or resources to get your code optimized, you can install a hardware appliance available from several companies that can optimize your code for your website or mobile application or website in real-time using the above techniques and more.
How fast can you make your pages go?
P.S. Infographics courtesy of Strangeloop Networks.
I agree with you Bryan. If a site, loads too slowly no doubt, you will loose your potential customers as these days people are impatient. This is will lead to higher bounce rate too but I feel CMS based sites loads bit slowly rather they are on dedicated or shared servers.
Hi Bhrat – You should find that many of the major CMS vendors support 1st or 3rd party plugins that will automatically implement many of the best practices to ensure the site loads as fast as it can. Of course, none of this matters if you’re hosting it on a ZX Spectrum as you point out
I agree as well. I’ve attended the Internet Retailer Design this past year and heard the CEO from Medical Supply Depot speak in this regard. It was from the top 5 presentations I’ve heard at the conference. When I got back to my office, I sat down with the team and discussed things and was able to make some immediate improvements to our page load speeds which increased our sales pretty much immediately. We now continue to focus on page speed before any other “conversion optimization” testing. It’s MUCH cheaper – practically free. I am surprised the exports have only realized this now. This to us became conversion optimization 101. Thank you Medical Supply Depot!
http://www.internetretailer.com/2011/02/24/themedicalsupplydepotcom-streamlines-speed
Melvin,
I agree and I have been harping on this issue for almost 10 years. Here are a few oldie but goodie articles:
http://www.clickz.com/clickz/column/1692681/are-we-there-yet
http://www.clickz.com/clickz/column/1692479/conversion-rate-basics
http://www.grokdotcom.com/2009/09/03/make-your-images-load-faster/
Thanks to Meir for helping to share the gospel.
Best wishes,
Bryan
Hi Bryan, one small question. Which data for site speed optimization we should use or to trust? For example, if you use pingdom tool, you get very different site load speed than when you use Google Analytics tool for measurement. Thanks, Jan.
Great question! It really depends on what you are planning to do with the data. Google’s data is taken from real people experiencing your pages. Websiteoptimization speed services is measuring the size of all objects and calculating expected load time and a tool like firebug/yslow and pingdom are also looking at server calls, etc.
Since page load time is a ranking factor it’s extremely important to pay attention to it. There are numerous tools that you can use to check the speed of your pages. Culprits for slow load time are usually graphics. Sometimes a lot of graphics aren’t needed, so remove any that don’t have a specific purpose.
Hi Nick – If you think images are bad (optimised or not) you’d be amazed at how poorly placed CSS and JS can affect the users experience and page rendering times.
I’d be curious to see research on the difference in load time between CMS based sites and sites using their own/dedicated server… what do you think? The numbers are staggering, but obviously true! As a user, I’ve found myself frustrated plenty of times because of load speed. Thanks for sharing, Brian. I particularly like the infographics. I’m going to encourage our production team to do some of their own research and write a reaction post on http://www.searchinfluence.com/blog
Timely piece Bryan. I just did a similar post on why removing social media buttons altogether can boost conversions.
http://makethemclick.com.au/library/conversion-rates/speed-traps-remove-social-buttons
Sites like Smashing Magazine have done it and boast that their sharing actually went up because of it.
When I tried it on my own site, I saw an 70% drop in load time.
It’s hard to give up those social buttons though.
Hi Mark – Don’t ignore the dangers of a frontend SPOF tho (http://www.stevesouders.com/blog/2012/03/28/frontend-spof-in-beijing/). Always load them async if you absolutely have to include them!