Fast Pages, Fast Facts:
- 40 percent of Web users abandon a site if it >3 sec to load
- 47 percent of Web users expect a page to load in <2 sec
- 52 percent of Web users say fast load time is important to brand loyalty
Source: Google AdWords
Think back to the last time you pulled up to a drive-thru choked with cars snaking out through the parking lot and into the street. Or think about the last time you saw a long line for a food truck at a concert. Did you stay, or look for a faster option?
It probably depended on what you came for, and how quickly you hoped to get it. If you wanted to pick up a drive-thru coffee on your way to work, chances are you’d keep driving and find a shorter line down the road. But, if you wanted to take an Instagram pic of yourself holding up a taco from hottest new Tex-Mex food truck, you might brave the line because of the value you perceive in the brand. (That said, the brand probably didn’t build a name on slow service.)
Websites work the same way. If a website loads slowly, it might not be the fault of poor WiFi. If a user knows exactly where he or she is headed – say, to post an item on eBay or sell stocks on E*Trade – a slow website might get a pass – once. But major Web-based brands build reputations on good, fast Web service for customers. Because of this, web users always expect fast service. Anyone browsing the Web will notice if your Web page loads more slowly than your competitors’ – and so will Google. Your slow Web site could be costing you much more in lost revenue and brand awareness than you realize.
How slow websites lose customers and kill rankings
If you have a slow website, you’re losing customers (and sales) in two ways:
- Lower search engine rankings
Search engines like Google want to provide their customers with the very best services, just like you do. That means that the best websites shoot to the top of the search results. But how does Google pick the “best”? While valuable and relevant content is the most important criterion, Google also considers how quickly your website will load and respond for a user. If you have a slow-loading website, you’ll drop further down in search rankings. This is true for mobile websites, too.
Google will “accept” any load time under two seconds. If your site is quicker than that, good for you – but it won’t affect your rankings much. If your website is slower than that, however, expect your page rank to drop. It might not plummet – relevance is still Google’s chief concern – but speed is an undeniable factor.
- Poor user experience
UX and UI – shorthand for user experience and user interface – are becoming increasingly important to the world of Internet commerce. Web customers want more: more options, more features, more responsiveness, more opportunities to connect with your brand and with other customers, and more speed. They also want less: less visual clutter and less time wasted in navigating – they want fewer distractions and delays. And they want all this on tablets and smartphones just as much as on desktops.
Web site speed is a huge part of a user’s experience. Google’s own studies have shown that Web browsers spend less time on slow-loading sites. When Google intentionally slowed the delivery of search results – even by as little as 200 to 400 milliseconds – users performed fewer searches. The most interesting part was that users “remembered” the slower service. Even after Google brought the searches back up to normal speed, it took users an additional five weeks to return to their former number of searches.
This shows that delays even under half a second can impact the way users perceive – and use – your site in the long term. Conversely, if users experience a quick load time, studies show they’ll be readier to keep navigating through your site. The longer users interact with your site, the likelier they are to become customers. Because of that, you need to have the same concern about “customer service” online as you would in a brick-and-mortar store.
If you’re worried about your website speed, that’s a good thing: you’ve taken the first step to delivering better service to potential customers. Luckily for you, there are plenty of free tools to test website speed. (You can use these yourself, or we can help you.)
Understanding website speed
You can’t measure website speed with a stopwatch. If you want to understand how Google and other search engines will rank your page as well as how users will perceive it, you need to account for a few different metrics.
First Byte: The “Time To First Byte” (TTFB) is a measure (in microseconds) of the time between a user’s request and when the first byte of a page loads on that user’s web browser. This has more to do with search engine rankings than with the user’s experience, but there are “tricks” that programmers can use to lower TTFB for the sake of search rankings as well as for a user’s perception of a site. TTFB isn’t the best measure of website speed, though, because it’s influenced by things outside of your control. It depends to a great degree on the environment of the user: their bandwidth and usage, machine speed, etc.
First Meaningful Paint: “Painting” is basically the process of rendering a website’s pixels on a user’s screen. Users – and search engines – won’t necessarily care if a few elements on a page haven’t loaded. If most of a page has appeared, a user will generally jump right into navigation. First Meaningful Paint, then, measures the time it takes for a page’s primary content to appear. This generally means something more than just the header and navigation bar.
Load Time: Load Time is the duration between a user’s request for a webpage and when that webpage is fully loaded and usable. If only part of your web page has appeared, images are missing, or links aren’t functional, your page hasn’t loaded yet, and the load time clock is still ticking. Google breaks load time down further:
- time to above-the-fold load: Elapsed time from the moment a user requests a new page to the moment the above-the-fold content is rendered by the browser.
- time to full page load: Elapsed time from the moment a user requests a new page to the moment the page is fully rendered by the browser.
Testing your website speed
Google has used speed as a page rank factor since 2010. In the years that followed, scores of sites and other tools for measuring page speed have spread across the Web. That’s good for businesses trying to improve user experience on the Web, but you need to understand that not all site speed metrics are equal, and not all tools measure the same thing.
Google Page Speed: Page Speed is a free, basic tool for Web developers. This Google plug-in rates desktop and mobile site performance and gives you a ranking out of 100. Anything above 85 is good.
YSlow: This plug-in rates a page’s speed based on the speed-related metrics Yahoo! uses to rank search results.
GTmetrix: This website aggregates Page Speed and YSlow measurements. It delivers your “Fully Loaded Time” and compares your page to all other pages it’s analyzed, and visualizes these with easy-to-read graphs. It also offers very detailed suggestions on how to improve your page speed – things like scaling images, removing unnecessary code, and removing redirect chains.
These metrics are useful, and all offer additional resources you can explore on your own. However, they aren’t totally accurate and they aren’t terribly precise. To get the fullest picture, you’ll want to use additional resources:
Pingdom: The free service Pingdom can test your page once every minute – and it’s very accurate. It has a limited number of testing locations, but it gives streamlined and easy-to-understand suggestions for improvement. Pingdom is useful for users at all levels of computer literacy. The score is easy to understand and the suggestions are easy to implement, while experienced users and programmers will appreciate Pingdom’s deeper analysis metrics, including a waterfall display of file requests, content size by domain, and more.
WebPageTest: This website allows for the most precise measurement of website speed. With WebPageTest you can control for a wider range of test locations, browser (including mobile browsers), bandwidth, and other factors to get close to a real user’s experience. You can compare web page performance speeds with visual aids, and run other tests. Anyone can use WebPageTest, but it offers the most tools for advanced users.
It’s best to use several different measuring tools. You might use Page Speed to get a quick analysis. You’ll want to use WebPageTest and Pingdom to get an accurate page speed under different conditions, and you’ll want to use a combination of tools – like GTmetrix, Page Speed, and Pingdom – to get helpful suggestions that you can implement on your site.
But metrics aren’t everything. You can’t get a good feel for user experience based on stats and measurements alone. Take the time to load your pages manually, and imagine using your site as if you were a client or customer. Use these metrics to adjust your site for speed, but always come back to an organic, hands-on approach to designing for user experience.
Building a faster website
If you’ve employed an Internet marketing firm or a web designer to create and maintain your business site, make sure to tell them to make page speed a priority. You should be able to talk with your Web marketing team just as you would any other service provider, to optimize your Web page for the unique needs of your business and your customers. You might discuss some of the ideas for improving Web page speed below. Even if you’re designing and maintaining your own site, you should be able to implement some of these suggestions.
- Understand HTTP and identify demanding requests.
HTTP stands for “Hypertext Transfer Protocol.” Every time a computer sends a request for a file, it follows this protocol – these transactions are called HTTP requests. These take time, and some of the requests might be unnecessary, or their functions might be simplified. Use a speed testing service like Pingdom to get suggestions on how to reduce delays from HTTP requests.
- Watch image file sizes.
Massive images can have an outsize impact on your website speed – and you might not know it’s happening. That’s because massive images (on the Internet, at least) aren’t always immediately distinguishable from images with smaller file sizes.
If you’re going to print an image, you’ll want a large file size with a high resolution. Resolution is a measure of the amount of “information” an image holds. In print, we measure this in dpi (dots per inch), and on a screen we measure this in ppi (pixels per inch) – though even mainstream image-manipulation software (like Adobe products) erroneously use dpi to describe onscreen resolution.
Well, if you can’t beat them, join them: our advice is that any image over 300 dpi could noticeably impact page load time. Depending on how much screen-space the image takes up, and how users will interact with that image, you might need even less.
For example, if you’re adjusting a tiny background image that colors a page but won’t attract a user’s scrutiny, you might drop as low as 72dpi. If your image is a close-up of a product, like a clothing item, that users might zoom an examine closely, you’ll want to keep that at around 300 dpi.
- Use extra scripts sparingly.
The little boxes asking users to “Like my Facebook page” or “Follow me on Twitter” might be useful for engaging existing customers more deeply, or increasing brand awareness, but these extra lines of JavaScript code come at a cost. Analytics services (like Google Analytics), external fonts, pop-up boxes, and external commenting systems (like Gravatar and Disqus) all require additional JavaScript codes. Think about your business goals, and whether these additional features can help you meet them. If not, eliminate them.
- If you’re on WordPress, don’t add too many plug-ins.
Plug-ins count as separate files that a user’s browser has to request individually. While plug-ins can be very useful for you as well as your customers and clients, think about the costs versus benefits of plug-ins. Do a review of your WordPress site every few months. If you haven’t used a plug-in during that time, get rid of it.
- Minify HTML, JavaScript, and CSS.
HTML, JavaScript, and CSS are all computer programming languages. Well, developers debate whether any of these are full languages, like Java and C++. But for our purposes, they are: they make possible everything that your website is and does. However, poorly written, lengthy, or bug-ridden code can slow down your website. A competent programmer can remove unnecessary space and lines to shed “baggage-bytes” from your page and increase load speed.
- Understand caching.
Page caching is a tool that streamlines a repeat customer’s Web experience. Web pages cache, or store, static files (images and HTML information), which allows visitors to access that data more quickly. This is great for returning visitors, but first-time visitors don’t see any effect. WordPress offers caching plug-ins, while a competent Web designer can optimize caching for your server. Check Out Our Attorney Guide
Optimizing for smartphone speed
Today, smartphones can do many tasks that once required a desktop computer. Users can send emails, make banking transactions and purchases, use the Google and Microsoft Office Suites, and use other project management apps to run their businesses easily, from anywhere with WiFi or data. However, even as smartphones screens get bigger, the experience of carrying out tasks on a smartphone remains different from the experience of carrying out the same tasks on a desktop computer.
If you have an attractive website packed full of valuable content, that’s great. But if you shrink that site down to fit on a 4-6” screen, you might hurt sales by irritating or frustrating users.
Smartphone users usually navigate with one hand. While they’re not browsing on-the-go as much as you might think, smartphone users are probably more prone to distractions than a desktop user would be. Because of that, you can’t just rely on the fact that your customers can easily access your website on their phones: you also need to think about their experience when they get there, and design a mobile version of your site with that in mind.
Many of the same adjustments that optimize for overall user experience can also decrease load times and increase responsiveness.
- Avoid distractions.
If you’re offering a wide array of products and services, your website may be fairly complex. This is OK for desktop users: if they’re looking through your full product line to find, say, a taupe women’s purse by one of three favorite designers, not too big and not too small, and within a certain price range, they won’t mind scrolling through a sidebar of search filter options that stretches well beyond the bottom of the screen. They (probably) have two hands, a tracking mouse, and a 12” screen. But on a smartphone, all these options would require zooming; zooming means fewer options are visible on the screen at any given time; and being able to see only a few of a long list of options at any given time makes for a more confusing and frustrating user experience. If you’re offering a lot of products and services, talk with your web design team about simplifying your options and streamlining navigation. Remove services a smartphone user probably wouldn’t want. Lastly, eliminate visual distractions – you probably shouldn’t have multiple pictures displaying on a 4-6” screen at the same time.
- Streamline text.
If you’ve sweated over a beautifully written, 3,000 word business statement, proudly displayed (under your smiling picture, perhaps) on an “About” or “Philosophy” or “Who We Are” page, that’s great … for a desktop user. Make sure your mobile site has a condensed version of any long text blocks – something optimized for mobile display (requiring no zooming) and short enough that a user won’t have to make more than a few flicks to scroll to the bottom.
- Limit the need for scrolling and zooming.
We’ve covered this already, but it’s important enough to gets its own, bolded placement. Your mobile site should not look like a desktop site. Your mobile site should not respond like your desktop site. To understand how important this is, navigate to some of your competitors’ sites on your own smartphone, and click the “Request desktop site” option. Then try to navigate, the way a customer would. See the difference now
- Simplify navigation.
Give customers a navigation bar only featuring the most relevant pages. Display this prominently, in an easily clickable size, so users don’t have to zoom in or risk clicking the wrong page because of tiny text. A home link should always be easy to find if a user has navigated to the wrong page or needs to search for a new topic or item.
- Use click-to-call buttons.
Don’t make the mistake of just displaying your business phone number on your mobile web page. That’s desktop-thinking. Your smartphone user should be able to click a number or a call button to initiate a call straight to your business. Depending on your type of business, a click-to-call button could even eliminate the need for a separate contact page, and getting rid of this could increase speed and allow for a simpler navigation.
If you want to learn more about building optimal websites for smartphones, check out these additional tips from Google.
Accelerate your clients’ online experience
At Accelerate Now, we’ve built over 30 websites for our clients. Proudly based in Buffalo, NY, we’re globally minded, keeping our clients across the U.S. up-to-date with the latest developments in internet marketing best practices. We understand the importance of site load speed and responsiveness for SEO rankings as well as for user experience – and we understand the same for mobile optimization. Check Out Our Attorney Guide
If you’re interested in learning more, and seeing how website speed might be affecting your business, we offer a free, no-commitment website audit. Just call (833) 500-0000 or fill out our contact form today. We’ll get back to you within one business day to set up your free consultation.