why brands need to focus on site speed in a mobile first world

@petecampbell https://www.kaizensearch.co.uk

Why Brands Need to Focus on Site Speed In a Mobile-First World


47% OF CONSUMERS EXPECT WEB PAGES TO LOAD IN 2 SECONDS

Credit: https://blog.kissmetrics.com/loading-time/


THE AVERAGE RETAIL SITE LOADS IN 10 SECONDS

Credit: Strangeloop Study of Top 2,000 Alexa Rankings for US


MOBILE USAGE OVERTOOK DESKTOP IN 2014

Credit: Morgan Stanley Research


UK RETAILERS SPEED OPTIMISATION ON MOBILE IS WORSE THAN DESKTOP

Credit: Kaizen eCommerce Site Speed Study (Jan 2017)


IT’S NOT ALL BAD NEWS


24mbps

40mbps

18% Y.O.Y. CHANGE 38% Y.O.Y. CHANGE

DESKTOP MOBILE

Credit: http://www.speedtest.net/reports/united-kingdom/


NEW DEVELOPMENTS IN SPEED TECH

HTTP/2 AMP PROJECT INSTANT APPS


Using a CDN Tag ‘Bloat’ Image

Optimisation

Minification In-Line Code Usage Internal & External Script Handling

TONS OF WAYS TO IMPROVE SITE SPEED


Why Brands Need to Focus on Site Speed In a Mobile-First World


PETE CAMPBELL / KAIZEN •  Founder / Managing Director

•  Kaizen works with leading global brands on Content Marketing & Technical SEO

•  Clients include 888.com, River Island & TravelSupermarket.com

•  8+ Years Agency & In-House Experience

•  Coding since 11 but turning grey now

•  Proud owner of a Game Boy Colour & NES


Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/

DOWNLOAD THESE SLIDES kaizensearch.co.uk/speed-deck/


WHY IT ALL MATTERS


SLOW LOADING WEBSITES COST RETAILERS £1.73BN IN LOST SALES PER YEAR



79% OF SHOPPERS WHO DISLIKE YOUR SITE’S PERFORMANCE WOULDN’T BUY AGAIN



PAGES THAT ARE 1 SECOND FASTER EXPERIENCE 27% INCREASE IN CONVERSION RATE

Credit: h"ps://www.soasta.com/blog/mobile-web-performance-monitoring-conversion-rate/


A FASTER FULL-SITE LOAD LEADS TO A 34% LOWER BOUNCE RATE



“Like us, our users place a lot of value in speed — that's why we've decided to take [desktop] site speed into account in our search rankings.”

SITE SPEED HAS BEEN A GOOGLE SEARCH RANKING FACTOR SINCE 2010

Credit: Google Webmaster Blog April 2010


INTRODUCING OUR STUDY


HOW FAST ARE THE TOP 700 ECOMMERCE SITES IN THE UK?


PageSpeed Insights Score

Homepage Size (MB)

HTTP/2 or Nope?

20 POINTS

5 POINTS

1 POINT

Homepage Loading Time 5

POINTS


# Website Desktop

Page Speed (/100)

Mobile Page Speed

(/100)

H.P. Size (MB)

H.P. Loading Time

(Per MB) HTTP/2 Final Score

1 TM Lewin 97 95 2.6 1.4 N 9.05 2 Find Me a Gift 92 85 0.6 2.1 N 9.01 3 Vodafone UK 83 99 1.2 2.2 N 8.97 4 Ikea 95 88 1.2 2.9 N 8.89

5 Mulberry 88 86 1.2 1.2 N 8.86 6 Wynsors 89 88 0.8 3.1 N 8.84 7 Sofasworld 90 86 0.9 2.7 N 8.84 8 WorldStores 89 85 1 1.9 N 8.81 9 Vans 82 79 1.3 1.4 Y 8.76

10 Console Deals 74 90 1.3 2.0 Y 8.75 11 Brantano 87 82 1.2 3.5 Y 8.74 12 Spreadshirt 88 81 1.2 1.1 N 8.72

13 SmileBox 87 82 1.7 0.9 N 8.68 14 Forbidden Planet 90 84 1.7 1.8 N 8.64 15 Bedroom World 79 86 0.9 1.6 N 8.63 16 Blinds 2 Go 82 85 1.7 0.9 N 8.62 17 Russell Hobbs 88 76 1.6 0.9 N 8.53 18 BAX Shop 86 84 1.5 2.2 N 8.51 19 G Star 90 81 5 0.4 N 8.5

20 Oliver Bonas 87 67 1.2 2.0 Y 8.48


54/100 59/100

8.5% SLOWER

DESKTOP MOBILE

Credit: https://developers.google.com/speed/pagespeed/insights/

AVERAGE SCORES


DEBENHAMS RANKED WORST FOR MOBILE PAGE SPEED 64% OF THEIR WEB TRAFFIC IS MOBILE #HIREUS

Credit: SimilarWeb Jan 13th 2017 * 50 sites only based on IMRG Ranking


100% OF RETAILERS HAVE MOBILE SITES BUT ONLY 76% ARE RESPONSIVE (IMO BEST PRACTICE)*

* 50 sites only based on IMRG Ranking

76%

24% Responsive

Mobile Site


UK RETAILERS HOMEPAGES ARE 25% LARGER (3MB) THAN THE AVERAGE WEB PAGE (2.4MB)

Credit: HTTPArchive Dec 2nd 2016


7.9% OF TOP UK RETAILERS USE HTTP/2 ELSEWHERE, 12% OF THE WEB BENEFITS

Credit: W3C Techs Feb 2017

12.1% ADOPTION


LATEST VERSION

OF HTTP PROTOCOL

DECREASED LOAD TIME BY 52% FOR CLOUDFLARE CUSTOMERS

UTILISED BY 12% OF THE WEB

WHY YOU NEED TO SWITCH TO HTTP/2


STEPS TO IMPLEMENTING HTTP/2

Check % of Visits via HTTP/2 Browsers Google Analytics > Audience > Technology > Browser & OS report.

Check Your Server’s Operating System Use BuiltWith to identify Apache 2.4..17+ or NGINX 1.9.5 OS

Do You Have an SSL Certificate? Most browsers will ignore HTTP/2 requests on non-secure sites

Read Our In-Depth Guide: http://www.stateofdigital.com/every-brand-needs-migrate-http2/

Credit: Kaizen May 2016


SITE SPEED TACTICS


Google PageInsights Tool https://developers.google.com/speed/pagespeed/insights/


WARNING: THESE TOOLS ARE PRONE TO GIVING DUMB ADVICE


Using a CDN Tag ‘Bloat’ Image Optimisation


RECURRING SITE SPEED SUGGESTIONS


COMBINE / REDUCE JS & CSS FILES

CSS 3 PRESENTATION

JAVASCRIPT LOGIC & DATA

JS & CSS Libraries jQuery, D3, Bootstrap, Web Fonts

Files to Avoid

Files Generated via CMS Plugins Sign-Up Forms, A/B Testing

Analytics Tracking


MINIFICATION

HTML5 PAGE STRUCTURE

JAVASCRIPT LOGIC & DATA

Google JS Closure Compiler https://developers.google.com/closure/compiler/

Scaling It Up

HTML Minifier http://kangax.github.io/html-minifier/

Minify.org for CSS & JS http://www.minifier.org/


DEALING WITH TAG ‘BLOAT’

Build List of All ‘Firing’ Tags Use Google Tag Assistant http://bit.ly/1fhsls5

Identify Duplicate/Redundant Tags e.g. Classic Google Analytics

Remove Useless Tags = Profit


INLINE CODE – JUST DON’T DO IT!


INLINE CODE – JUST DON’T DO IT!

Hard to Maintain

Results in Unused Code

Overwrites Default Styles


IMAGE COMPRESSION

Google’s Open-Source Lossless .WebP Image Format

<26% Smaller than PNG

<25-34% Smaller than JPEG

Credit: http://www.webmproject.org/

Alternative PNG/JPG Compression https://compressor.io/


HTTP/2 ELIMINATES THE NEED FOR SOME TYPICAL SITE SPEED HACKS

Image Sprites


Switch to Smart Domain Sharding

‘Master’ CSS / JavaScript Files


CDNFinder https://www.cdnfinder.com/content-delivery-network-comparison/


GOOGLE AMP


ACCELERATED MOBILE PAGES PROJECT (AMP)

•  Mobile Optimised Content

•  Pre-Fetched by Google •  Loads Instantly •  Used on 600m Pages

across 700k Domains

https://www.ampproject.org/


AMP SUPPORT HAS EXPANDED

Articles & News Content

Recipe Cards


eCommerce Products

Property Listings


EBAY IS NOW SERVING 8 MILLION URLS IN AMP

Credit: http://searchengineland.com/ebay-goes-amp-sign-might-break-past-news-253254


NORMAL


AMP VERSION


NORMAL

AMP VERSION

71% FASTER


INTRODUCING ACCELARATED MOBILE LINKS

Credit:https://amphtml.wordpress.com/2017/01/12/introducing-accelerated-mobile-links-making-the-mobile-web-app-quick/

LOADS THE NEXT PAGE IN ‘AMP’ MODE IF AVAILABLE


HOW TO IMPLEMENT GOOGLE AMP

https://wordpress.org/plugins/glue-for-yoast-seo-amp/

https://wordpress.org/plugins/amp/


HOW TO IMPLEMENT GOOGLE AMP

https://www.ampproject.org/docs/get_started/create_page.html


INSTALL FREE GOOGLE PAGESPEED MODULE


Google PageSpeed Module https://developers.google.com/speed/pagespeed/module/

Combine & Minify CSS/JS

Optimise Images

Extend Browser Cache


FREE WORDPRESS PLUGINS FOR PAGE SPEED

WPSmush: Compress & Optimise Images http://wordpress.org/plugins/wp-smushit/

W3Total Cache: Page Caching & Minify https://wordpress.org/plugins/w3-total-cache/OS

Google PageSpeed Insights https://en-gb.wordpress.org/plugins/google-pagespeed-insights/



Pingdom Tools (Free Account) https://tools.pingdom.com/


View How a Website Actually Loads, Scripts, Renders & Paints

Right Click in Chrome > Inspect > Timeline & Hit Refresh


POST-WEBSITE ERA


MOBILE USERS PREFER APPS OVER BROWSERS


OPENS PAGE IN THE APP

‘Install App’ Button Fallback

APP INDEXING & DEEP-LINKING


Access Apps from Anywhere

Run Android Apps without Installation

INSTANT APPS WILL DOMINATE (ONE DAY)


NEW DEVELOPMENTS IN SPEED TECH

HTTP/2 AMP PROJECT INSTANT APPS


Using a CDN Tag ‘Bloat’ Image Handling


TONS OF WAYS TO IMPROVE SITE SPEED


SLOW LOADING WEBSITES COST RETAILERS £1.73BN IN LOST SALES PER YEAR



PAGES THAT ARE 1 SECOND FASTER EXPERIENCE 27% INCREASE IN CONVERSION RATE



DOWNLOAD THESE SLIDES kaizensearch.co.uk/speed-deck/

Thank You! Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/


THE END


Signup for a 5-Min Site Speed Clinic

http://bit.ly/2jJJLGU * First Come, First Serve