Google announced the move to a mobile-first index last year, Pete Campbell gives a great insight on how site performance can help you get ready for this switch.
Site Speed
Pete Campbell from Kaizen kicks off talking about the site speed element of the mobile first algorithm, which was actually only announced 6-8 weeks ago as being part of the algorithm.
47% of consumers expect web pages to load in 2 seconds or less, average retailer loads in 10 seconds. This highlights a huge difference in what people expect to what they are actually getting. On average retailers mobile sites are slower than desktop, this could be due to different speeds on desktop and mobile. Brands can implement new things such as HTTP2, AMP and HTTPs.
Why does site speed matter?
Kissmetrics carried out a study which found retailers lose 1.73bn in sales due to site speed, with 79% percent of users not buying again if the website’s performance is poor. This amount of lost opportunity shows the need for a fast site. They found that a 1 second faster site can increase conversion rate by 27%. A faster full site load also leads to a 34% lower bounce rate.
How fast are UK ecommerce sites?
Kaizen undertook a study of the top 700 ecommerce sites in the UK and look at four metrics:
- PageSpeed Score
- Homepage Size
- Loading time
- HTTP2 usage
They automated this process as doing this manually for 700 sites would be an absolute nightmare. TMLewin is an absolute boss along with Jack Wills with some less known brands such as Triton Cycles in the top 5.
Looking through these results they made a list of the top 10 recurring PageSpeed Insight Tool issues with some surprising results.
- 93% are not optimising images
- Many had poor minification
- 60/100 average desktop speed and 50/100 average mobile. This represents an 8.5% slower speed on mobile, which in a mobile-first world is questionable at best.
He highlights that some large websites don’t seem to get it right, Debenhams did rank well for mobile page speed even though 64% of their traffic is mobile. This represents a challenge to big brands who need to rethink their mobile strategy.
100% of the 700 retailers had mobile sites but only 80% are responsive rather with many being user agent redirects, this is an old technique which is outdated and should look at being moved away from. They found that UK retailers homepages are 35% larger than other pages across the web.
HTTP2
Only 14.5% of top UK retailers user http2, although this is higher than the web average (13.5%).
HTTP2 is the latest version of HTTP protocol, Kaizen found that HTTP2 decreased load time by 52% for CloudFlare customers which utilised by 13.5% of the web. He goes on to say how hugely underutilised this technology is, and this is something that should be implemented on your retailer sites.
How do I implement HTTP2?
First, you need to understand how many users have HTTP2 capable browsers, if you’re serving enterprise clients these can often be on old browsers that aren’t capable of it. Also look at your server’s OS to make sure this can handle HTTP2. There is a plugin called BuiltWith to look at this. You need an SSL Certificate! Most browsers won’t serve HTTP2 unless you have this implemented.
Site speed tactics
Pete goes on to say that while the PageSpeed Insights Tool gives good data, it can also give dumb advice as it doesn’t understand the context of how the website was built. Things like combining all your JS & CSS doesn’t always make sense and if you have things like web fonts it’s always best to keep these pointing to the latest version. Similar to this, CMS plugins should be left to point to their CDN’s rather than putting this on your own server.
With the above said, here are some great tactics you can use to increase site speed:
Anything outside of the above is what you want to use.
- Minification
- Tag Bloat
- Inline Code
- Image Compression
- CDN
Minification – This is the process of removing whitespace from code. Google offer a JS Closure compiler along with a HTML minifier. If you’re only looking to minify a small amount use minify.org.
Tag Bloat – Google Tag Manager can be implemented but over time can cause tag bloat. Use google tag assistant to review this and make sure these are used and not artificially adding to load time. Removing redundant tags can make a big difference to your page load times which means more money!
Inline Code – Don’t do it! Inline code creates a codebase that’s hard to maintain. It can create unused code and can override default styles. This makes it difficult to work with devs on any changes if your rolling back changes with inline styles.
Image Compression – Use Web.p which is Google’s format and can deliver 30% faster load times in terms of how it’s compressed. Available as server side plugin so it can be automated and added to photoshop. Moving forward this can be interesting. Compressor.io is similar if you don’t want to use Google’s own format.
HTTP2 eliminates the need for some typical site speed hacks:
- Image Sprites are redundant
- Domain Sharding is defunct with HTTP2
- Master CSS/JS files no longer needed as they can be rendered on the fly dynamically with HTTP2
CDN – There are so many options for a CDN these days, Pete advises using https://www.cdnfinder.com/ to find the one that fits your business needs.
Google AMP
Whilst Google AMP is nothing hot off the press, the options for implementation have expanded recently. Over the past few months, Property Listings and Ecommerce products have been added. A great example of this is eBay now using AMP to serve products, they have got in on the ground floor so are seeing some fantastic benefits from this.
Accelerated Mobile Links can load the next page in AMP if available, gives the user a seamless AMP experience. Can use a WordPress plugin to do this.
Conclusion
All of the above items can help prepare your site for a mobile first index, it’s something you should be doing now so you are proactive rather than reactive.
