A study of 700 top ecommerce brands found that the majority are underperforming when it comes to optimizing their sites for speed. Find out how you can avoid the same mistakes.
Web users are not patient. The speed of your site can make a massive difference to whether people will visit your site, whether they’ll stay on it, and whether they will come back. Not to mention whether they’ll make a purchase.
A massive 79% of shoppers who have been disappointed by a site’s performance say that they’re less likely to use the site again. But what constitutes ‘disappointed’?
We’re only human after all
Kissmetrics research on customer reactions to site speed has resounded across the industry, but it’s not something that should be forgotten:
“If an e-commerce site is making $100,000 per day, a 1 second page delay could potentially cost you $2.5 million in lost sales every year.”
That’s a 7% reduction in your conversion rate, and 52% of customers say site speed is a big factor in their site loyalty. A one second delay is bad – a two second delay is worse. 47% of consumers expect web pages to load within two seconds.
But based on the same research, a faster full-site load leads to a 34% lower bounce rate, and an improvement by just one second results in a 27% conversion rate increase.
It’s because site speed is such a vital part of building a successful ecommerce site that my team and I conducted a study into 700 top UK ecommerce sites, analyzing various aspects of their site speed performance.
What we found is that the biggest brands have some of the poorest optimization, with outdated web protocols, unresponsive pages, and bloated page size.
The average web page size is now 2.3MB (that’s the size of the shareware version of the classic game Doom), so we wanted to see whether the ecommerce industry is any better – since their businesses are directly dependent on their website performance.
Surprisingly, we have found that the web page size of the top UK ecommerce sites is 30% larger on average than standard websites – at 2.98 MB.
Average webpage size according to HTTPArchive
However, the web page size isn’t the only factor impacting the site speed. Even larger sites load and render quickly if they’re smart about how they deliver.
My team and I picked the top 700 UK ecommerce sites, based on their estimated monthly traffic with data kindly supplied by SimilarWeb. For each, we analysed them using Google’s PageSpeed Insights API, checked their page size and loading time on Pingdom, and verified their HTTP protocol using https://http2.pro/.
From this, we found the following data, and used it to determine which websites are best optimised for speed:
- PageSpeed Insights Desktop Score (not considering third party data)
- PageSpeed Insights Mobile Score (not considering third party data)
- HTTP/2
- Web page size
- Loading Time
- Loading Time per MB
Desktop vs mobile
Mobile connections are usually slower than desktop to begin with, so further delays are felt even more keenly. This, together with the fact that Google’s latest mobile update now factors site speed into mobile page ranking, makes it a high value consideration to ensure mobile pages are sufficiently optimized.
This becomes even more of a consideration when you factor in how much of ecommerce traffic is now mobile – for example Vodafone, the third top-scoring website in our recent research, receives only 20% of their traffic from desktop, with 80% coming from mobile devices.
Make your site work for you
Your site speed isn’t simply a dial you can turn up in your page settings; there are a number of factors which contribute to it. here’s what they are, and how you can start making your site one of the fastest out there.
Protocol power
HTTP/1.1 isn’t SPDY enough
Network protocols are the rules and standards that govern the end points in a telecommunication connection – how data is transmitted over the web. Common examples include IP – Internet Protocol – and HTTP – Hypertext Transfer Protocol.
The HTTP/1.1 protocol is decades old and doesn’t make full use of newer technologies. Its main downside is it doesn’t allow you to download files in parallel. For each file (or request), the server needs a separate connection.
HTTP/1.1 enables only one request per connection, while browsers now support a maximum of 6 connections per domain. This means that the number of files which can be downloaded and rendered simultaneously is limited – and that costs time.
Since the time of HTTP/1.1, Google has developed a newer version of the protocol, SPDY (“Speedy”), which allows simultaneous connections to be opened, and means it can serve multiple parts of the website (JavaScript, HTML, images, etc.) in parallel.
But SPDY isn’t the latest protocol developed by Google. Working closely with W3C (World Wide Web Consortium), they’ve developed the new HTTP/2 protocol. HTTP/2 has roughly the same characteristics as SPDY, but is also binary, and allows the server to ‘push’ information to the requester, with better HPACK compression.
Despite the clear advantages of the HTTP/2 protocol, only a few websites have made use of it. Our recent research discovered that only 7.87% of the top 700 ecommerce sites use the technology – compared to 11.3% of sites overall. Some examples of websites using HTTP/2 are https://www.vans.co.uk/, https://www.paperchase.co.uk/ or https://www.expedia.co.uk/.
According to Cloudflare.com, when they implemented HTTP/2, they saw customers’ average page load time nearly halved – from 9.07 seconds for HTTP/1.X falling to 4.27 seconds for HTTP/2. That’s a significant improvement in a key area of website efficiency.
However, HTTP/2 doesn’t solve everything, and in some cases the results can be disappointing. In our research, many websites achieved only very small speed gains in their loading times when served over HTTP/2 instead of HTTP/1.1.
Switching to HTTP/2 isn’t enough by itself – many websites fail to optimize for the change and lose out on the maximum speed gains.
Old-school techniques, such as domain sharding or sprites, can be counter-productive. And using huge CSS or JavaScript files where less than 10% of the rules and code is relevant to pages likely to be visited is a waste of both your user’s time and your server’s time.
Screenshot from Dareboost comparison analysis of Oliver Bonas’ loading performance
Even our own measurements showed that the average loading time per 1 MB for websites supporting HTTP/2 was 1.74s, compared to 1.44s for websites not supporting HTTP/2.
A nice example of a successful HTTP/2 optimisation is Paperchase, who saved a full second of time necessary to load their website, as is shown here:
Screenshot from Dareboost comparison analysis of Paperchase loading performance
How To Tackle Protocols – HTTP/2 and you
If you want to be at the forefront of network protocols – and at the top of the list of faster sites – get an HTTP/2 protocol in place.
While HTTP/2 only requires the server to support the new protocol (many now do, though Microsoft’s IIS has no plans yet), the browsers need a TLS connection. This means every connection over HTTP/2 will be safe and secure, adding an extra layer of security to the internet.
For more information on how you can get started with HTTP/2, have a look at the Kaizen in-depth article here.
It’s all about size
The smaller, the better
If you’re trying to get speed up, you need to keep size down. The less there is to move from the Internet to the user, the less time it takes.
As I mentioned earlier in this article, the ecommerce sites looked at in our study were bigger on average than other webpages out there – 30% bigger, at 2.98 MB, compared to a global standard of 2.3MB.
Format, compress, minify
One of the biggest issues on plus-sized websites is pictures. Unless they’re compressed and resized to suitable formats, they can be over-large and slow page speed to a crawl.
The solution to that problem explains itself – compress and resize – but less obvious fixes can be found in using the appropriate file type. The .png format makes files smaller if they’re in block coloring and simple – like infographics, illustrations and icons.
But for photographs, with a wide number of colors and much finer details, .png can compromise the quality of the image. You might consider using .jpg files instead, or .WebP, an open source image type format from Google, which supports both lossy and lossless compression.
Using correctly sized, unscaled images manually can be quite a daunting task for web developers. PageSpeed modules from Google can come in handy, automating many of the tasks necessary for site speed optimization.
You can also minify the source codes. CSS and JavaScript resources could be minified using tools like http://javascript-minifier.com/ and http://cssminifier.com/ – and should save kilobytes otherwise spent on whitespace.
The HTML should be also as compact as possible. We recommend stripping out all the unnecessary whitespace and empty lines.
Time to go mobile
Not very responsive
Most retailers in the study had mobile-optimized sites, but 24% of them served their mobile users a separate mobile site – usually on a separate sub domain. While this approach improves UX, it can be inconvenient for two reasons:
1) Google handles subdomains as separate domains.
2) Depending on how the redirects based on viewport are set up, in the new, mobile-first index world, this can mean that the Googlebot (visiting with smartphone user agent) will have troubles reaching the desktop version of the site.
A safer solution can be to use a responsive site that delivers the same HTML code to all devices, but adapts to the size and shape of the device used. We found that this had representation on only 76% of the sites.
Alarmingly, mobile sites themselves were largely poorly-optimized for mobile; the average mobile site scored 53.9/100 for speed, as opposed to the average desktop score of 59.4/100.
Hewlett Packard had a massive difference of 29 points between their desktop score (at 77/100) and their mobile (48/100), while the worst offenders were Carat London, who scored zero for both mobile and desktop score.
Here is the list of the top 10 websites based on Google’s Page Speed Insights:
| URL | Desktop Score | Mobile Score | Total PageSpeed Score |
| http://www.tmlewin.co.uk/ | 97 | 95 | 192 |
| http://www.ikea.com | 95 | 88 | 183 |
| http://www.vodafone.co.uk | 83 | 99 | 182 |
| http://www.findmeagift.co.uk/ | 92 | 85 | 177 |
| http://www.wynsors.com/ | 89 | 88 | 177 |
| http://www.sofasworld.co.uk/ | 90 | 86 | 176 |
| http://www.americangolf.co.uk/ | 80 | 95 | 175 |
| http://www.mulberry.com/ | 88 | 86 | 174 |
| http://www.worldstores.co.uk/ | 89 | 85 | 174 |
| https://forbiddenplanet.com/ | 90 | 84 | 174 |
Mobile management
Much of the mobile optimization requires coding and/or web development skills, but worry not – Google have created a guide to delivering a mobile page in under a second.
AMP it up
AMP – Accelerated Mobile Pages – is Google’s initiative for producing more efficient webpages for mobile. It’s a work-in-progress, but every day brings new developments and more support, customization and stability.
AMP pages have a number of benefits for all sites, including being preferred by Google in search rankings, and being faster to load. For ecommerce it’s a technology to implement ASAP, or at least keep an eye on.
While AMP debuted for publishing sites, recent updates have brought ecommerce sites into the fold, and eBay in particular have been quick on the uptake, now serving over eight million pages through the AMP system. Google is also working with eBay on things like A/B testing and smart buttons.
“With items like these in place, AMP for ecommerce will soon start surfacing,” says Senthil Padmanabhan, the principal engineer of eBay.
Customization on ecommerce AMP pages is currently low, but it’s an ideal technology for the industry, allowing customers quicker transitions between products – improving conversion rates and making the website easy to use.
During testing on the websites in our study, AMP was found to have a 71% faster load speed for blog posts, and a reduced page size from 2.3MB to 632kB.
Onwards and upwards
Site speed isn’t a problem that’s going to go away. As time goes by, the technology improves – AMP and HTTP/2 are just the latest steps on the road to real-time loading. 5G is on the horizon, and customers are only going to become less patient with slow-loading pages.
As a result, it’s increasingly necessary to keep an eye on your site analytics and your customer behavior. A speed improvement of just one second can improve your conversion rate by 27% – and a delay of one second can cost you millions a year.
Make sure you’re on top of bringing your ecommerce business and site into the modern era with the tips I’ve listed here.
source https://searchenginewatch.com/2017/04/04/site-speed-tactics-in-a-mobile-first-world-why-ecommerce-brands-need-to-step-up-their-site-speed-game/
No comments:
Post a Comment