Did you know that 53% of users will leave a mobile site if it takes longer than three seconds to load?
THE 3 SECOND RULE!
53% of users will leave a site that take > 3 secs to load. – Google
AND GUESS WHAT HAPPENS IF YOUR SITE TAKES EVEN 1 SECOND LONGER TO LOAD…
3.5% decrease in conversion rate
9.4% decrease in page views
WHAT ARE THE TOP 5 FACTORS THAT SLOW DOWN YOUR SITE SPEED?
63% of average pages total weight.
Solution: Always Compress. Avoid images that are bigger than 100K in file size. And don’t load too many images on a page/site.
Most of the times this is because the images are in the wrong format or in the wrong.
If you don’t have a tool in your CMS to do this automatically, use https://smaller-pictures.appspot.com/ to compress your images.
50% of mobile pages use custom fonts slowing down a mobile site.
Solution: Disable custom fonts for smartphones
20% of pages have 5+ redirects. Mobile users do not like redirects. They don’t want to see interstitial ads or subscription forms, unless that was what they were looking for.
Solution: Identify redirects and minimise them as much as possible.
It’s always too short.
Solution: Leveraging your cache browser data is very important. Allow your server to cache resources for as long as possible. You do not want resources to get reloaded unnecessarily on repeat visits.
20% of pages have over 100+ resource requests. This has almost double since 2011 where websites would have just around 50 requests. And without a good 3g connections, websites are getting harder to load.
With increased complexity of websites, latency is becoming a massive performance killer in the UK.
Solution: Reduce server response times by combining many small resources into fewer large ones.
- PRO TIP
Prioritise content that’s above the fold.
Download the things that the user would like to see first; the hero image/call to action and make sure if loads & renders as early as possible
Often sites that have a Hero image suffer from Hero Image Delay (HID) and primarily due to other resources & scripts that are blocking it.
Optimisation Best Practices
- Avoid landing page redirects
- Compress & select efficient images
- Prioritise download of content above the fold
- Use inline & internal CSS & JS
On the server side of things
- Enable HTTPS
- Enable HTTP/2
- If on HTTP/1, concatenate resources
- Leverage browser caching
And for content delivery
- Reduce server response time
- Compress using GZIP
- Minify resources
- Refactor CSS declarations & JS logic routinely