"Patience is a virtue" does not apply to ecommerce website performance.
In fact, quite the opposite is true. Page speed is essential to converting a visitor to a buyer, and to keep them on your website long enough, you have to cater to their impatience – which has grown thinner and thinner every year.
Image via Radware
In 1999, when people were still converting from dial-up to high speed internet connections, page speed wasn't a huge factor - consumers said that they would be willing to wait up to 8 seconds for a page to load. In 2010, that number, as reported by Radware, accelerated to 3 seconds.
Today, according to Google, page speed should be around 400 milliseconds - about the speed of the blink of an eye - before users start getting impatient. Harry Shum, head of AI and former speed specialist researcher at Microsoft suggests it's even faster that makes a difference.
“Two hundred fifty milliseconds, either slower or faster, is close to the magic number now for competitive advantage on the Web"
Harry Shum, Head of AI, Microsoft
If you are having a hard time trying to convince your boss or dev team to invest in optimizing your website for a faster user experience, we want to make your life easier. We’ve gathered some useful data, tools and resources to help you plead your case.
Slow Speeds Can Also Kill Your Mobile Website’s Mojo
According to data from by Akamai and Gomez.com, “79% of online shoppers said they would not return to a website to make another purchase” because of poor performance during their last visit. Likewise, “44% said they would tell a friend” about their bad online experience.
So, “if your [ecommerce] site is making $100,000 per day, you could lose up to $2.5 million in sales every year for just a 1-second page delay.”
And the impact can be just as bad for mobile website users. You've probably felt first-hand how waiting for a slow loading website can feel like an eternity when you’re trying to multi-task and/or accomplish something online while in line at a coffee shop or waiting for the bus.
It’s especially annoying because smartphones are supposed to make our lives easier by giving us quick access to the world’s information in the palm of our hands.
And 58% of mobile users say they expect their mobile website to load almost as fast to even faster than the experience they get on their desktop browser.
Image via KISSmetrics
As the chart above illustrates, “60% of mobile users say that they have encountered at least one problem while browsing online in the past year” – the issues they faced range from websites loading too slow, crashing or not being available to be viewed at all.
It’s also necessary to note that a poor mobile website experience can impact your customers’ perception of and loyalty to your brand. So, it’s very important to look at load speed issues specifically for mobile – especially now that mobile usage exceeds desktop usage (and is still growing at a faster rate overall).
Shopify Plus customers have the freedom to create mobile-first websites which are distinct mobile experiences (not to be confused with mobile responsive, which simply scales a site down) that are optimized to perform well over data connections.
We’ll get into some overall tips and tricks that your dev team can use to improve your ecommerce website speeds later. But first, let’s talk about something a little more tangible you can bring to the boss if you’ve already been fighting a losing battle trying to get your site speeds improved.
Google Penalizes Poor User Experiences
Your page speed impacts a new visitor’s ability to find your ecommerce website through search engines and PPC channels.
See, Google evaluates your website landing pages to determine your website’s Quality Score and Ad Rank. So, if your landing page experience is sub-par for online users, you get a lower Quality Score from Google, your ads will likely rank lower in paid search results, and you’ll have a harder time climbing rank for organic search terms.
Or, you’ll just have to bid super high to compete with better quality ads and landing pages. That’s because your Quality Score is tied to the cost-per-click (CPC) that you will have to pay for your ads to display beside Google search results. So, a faster loading speed can also indirectly help to drive down your advertising costs.
Google even went on record back in 2010 saying site speed was used as a ranking factor, saying:
“...faster sites don't just improve user experience; recent data shows that improving site speed also reduces operating costs. Like us, our users place a lot of value in speed — that's why we've decided to take site speed into account in our search rankings”
So, if you’ve been implementing other SEO and paid search best practices and are still having a difficult time getting certain pages to climb the search rankings, or are trying to drive down your advertising costs, you might want to factor in page load speed as part of an great landing page user experience.
Some Analytics Tools To Help You Emphasize the Need for Speed
Another tool you can use to make make the argument to your boss or dev team, is your web analytics data.
Sharon Hurley Hall does a great job outlining your options for Google Analytics on The Daily Egg, and provided additional tools here. I’ve also added the highlights from her post below as well.
If you have a Google Analytics account, look for a tab called ‘Behavior,’ then select ‘Site Speed.’ Finally, click on ‘Overview.’
This page will give you some important stats that you’ll need to monitor including your average user’s download time, domain look-up time, and average server response time.
Next, check out the ‘Page Timings’ section which gives you a breakdown of your website by pages, plus an overall loading rate for each page – and even each browser.
A red box will indicate any lagging and slow pages.
Image via Practical Ecommerce
Sharon suggests to also check out the ‘Speed Suggestions’ section of Google analytics to learn how to increase your page load speed.
She says that if a page receives a score of less than 80, there are likely some issues that you need to resolve. What’s really handy is that Google Analytics tells you how to fix those page-specific problems.
Below is a list of a few other tools that Sharon suggests to help you identify and troubleshoot important website speed issues.1
- If you don’t have Google Analytics installed on your website, you can still use PageSpeed Insights which is a web-based tool that can be accessed via Google Labs. You can use this test to identify any problem areas on your website. Similar to the Google Analytics version of the tool, it also gives you suggestions on how to improve speed performance.
The added bonus is that if you go to PageSpeed Insights and enter the URL for any competitive retailer, the website will not only tell you their page speed score for its desktop site but also its mobile version.
Knowing what’s wrong with your competitors’ sites could help you avoid making the same mistakes with your on ecommerce website.
Image via Google
This tool gives your website a grade from A to F in terms of speed by merging data from Yslow and PageSpeed Insights. It also offers a performance report which helps you to analyze key issues to that require optimizations.
Image via GTMetrix
At Pingdom.com, you can also get a site performance grade (ranging from 0 to 100%), plus page speed analysis. It also has a useful “waterfall analysis” feature that helps you identify other major problem areas.
Image via Pingdom.com
Hopefully, your analytics data, plus the stats and Google penalties we outlined earlier will provide you with a good argument to demonstrate your ecommerce site’s need for urgent optimizations.
5 Page Load Optimization Tips to Do Yourself or Share with Your Dev Team
Below are some key areas of focus that you can propose to your boss or dev team for achieving a faster user experience.
If they still aren’t convinced that they need to allocate the money or resources, some of these optimizations are easy enough to do yourself.
If you have added a lot of marketing tags to your site recently (for analytics, conversion tracking, behavioral retargeting, etc.) they can eventually slow your website down.
So, if you are no longer using one of these tags, say because you don’t have an ad campaign running right now, you can use Google Tag Manager to remove the tag yourself – without always having to bug your dev team.
All you need to do is add one snippet of code to your site and you can manage all of your tags in one place. Within your Shopify theme, you can add the code just after thetag.
2. Consider measuring and improving your time to interact (TTI) speed
In addition to looking at page load speeds, it is extremely valuable to measure how long it takes for a page to deliver a specific experience that your customer is seeking.
According to Dotcom-Monitor (which has a tool that enables retailers to measure this website performance metric), “time to Interact (TTI) pinpoints the most critical moment in a page load—the moment the page’s primary interactive content is displayed and becomes interactive –from the end user’s perspective.”
In this case, “users do not need to wait until the entire page loads to begin to interact with the site. Ideally their experience with a website using TTI as an indicator would be better than using TTL (Time to Load).
3. Optimize your images
According to recent stats from Radware, “images account for 50% to 60% of your web pages’ total weight.”
In other words, large image files can make your pages take forever to load. Mark Hayes wrote this guide to image optimization to help you along.
A great tool you can use to reduce file sizes without losing quality is ImageOptim. It was created by developers for developers. But it is super easy to use – even if you don’t have advanced coding skills. Once you download the app and open it, you can drag your Shopify theme’s “assets” folder into the application and it will trim the image weight for you!
4. Use fast and reliable hosting servers
Web hosting services play a crucial role in your overall website experience.
For example, Best Buy had to eat a lot of humble pie on Black Friday in 2014 because their site didn’t just act slowly for customers – it actually went down (because of heavy traffic) during one of the biggest shopping days of the year. Not only was the situation damaging for the brand, the company also lost out on a ton of sales.
So, it’s important to invest in a reliable hosting server. And you need to maintain the size of your hosting server as your website traffic needs increase. Some factors that you need to consider when increasing your server size are memory requirements, projected traffic growth and peak user load.
Luckily, the Shopify hosting servers are extremely reliable. During all of the peak traffic, on all of the Shopify retailer sites last Black Friday, the Shopify servers had a 99.99% up time.
5. Include breakpoints for mobile
A breakpoint is the point at which your mobile website will resize or respond to suit the best browsing configuration for the screen that your customer is viewing.
If a mobile webpage doesn’t offer multiple breakpoints for different screen configurations, the speed at which a customer’s site might load on their smartphone or tablet, plus the viewing quality of the site will be impacted. Thankfully, Shopify allows you to choose from a variety of breakpoint sizes via your design theme.
For example, the Timber theme has four default breakpoints: 'small', 'medium', 'medium-down', and 'large'. And for any screen sizes below those breakpoints, the responsive theme will default to (mobile first) 100%.
The data and tools we’ve shared so far should be enough to get you started in building a case for website speed optimization. If you need additional support to make your argument, please share your requests for more information in the comments section below.