Upload
pete-campbell
View
463
Download
1
Embed Size (px)
Citation preview
@petecampbell https://www.kaizensearch.co.uk
Why Brands Need to Focus on Site Speed In a Mobile-First World
@petecampbell https://www.kaizensearch.co.uk
47% OF CONSUMERS EXPECT WEB PAGES TO LOAD IN 2 SECONDS
Credit: https://blog.kissmetrics.com/loading-time/
@petecampbell https://www.kaizensearch.co.uk
THE AVERAGE RETAIL SITE LOADS IN 10 SECONDS
Credit: Strangeloop Study of Top 2,000 Alexa Rankings for US
@petecampbell https://www.kaizensearch.co.uk
MOBILE USAGE OVERTOOK DESKTOP IN 2014
Credit: Morgan Stanley Research
@petecampbell https://www.kaizensearch.co.uk
UK RETAILERS SPEED OPTIMISATION ON MOBILE IS WORSE THAN DESKTOP
Credit: Kaizen eCommerce Site Speed Study (Jan 2017)
@petecampbell https://www.kaizensearch.co.uk
IT’S NOT ALL BAD NEWS
@petecampbell https://www.kaizensearch.co.uk
24mbps
40mbps
18% Y.O.Y. CHANGE 38% Y.O.Y. CHANGE
DESKTOP MOBILE
Credit: http://www.speedtest.net/reports/united-kingdom/
@petecampbell https://www.kaizensearch.co.uk
NEW DEVELOPMENTS IN SPEED TECH
HTTP/2 AMP PROJECT INSTANT APPS
@petecampbell https://www.kaizensearch.co.uk
Using a CDN Tag ‘Bloat’ Image
Optimisation
Minification In-Line Code Usage Internal & External Script Handling
TONS OF WAYS TO IMPROVE SITE SPEED
@petecampbell https://www.kaizensearch.co.uk
Why Brands Need to Focus on Site Speed In a Mobile-First World
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/
DOWNLOAD THESE SLIDES kaizensearch.co.uk/speed-deck/
@petecampbell https://www.kaizensearch.co.uk
WHY IT ALL MATTERS
@petecampbell https://www.kaizensearch.co.uk
SLOW LOADING WEBSITES COST RETAILERS £1.73BN IN LOST SALES PER YEAR
Credit: https://blog.kissmetrics.com/loading-time/
@petecampbell https://www.kaizensearch.co.uk
79% OF SHOPPERS WHO DISLIKE YOUR SITE’S PERFORMANCE WOULDN’T BUY AGAIN
Credit: https://blog.kissmetrics.com/loading-time/
@petecampbell https://www.kaizensearch.co.uk
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/
@petecampbell https://www.kaizensearch.co.uk
A FASTER FULL-SITE LOAD LEADS TO A 34% LOWER BOUNCE RATE
Credit: h"ps://www.soasta.com/blog/mobile-web-performance-monitoring-conversion-rate/
@petecampbell https://www.kaizensearch.co.uk
“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
@petecampbell https://www.kaizensearch.co.uk
INTRODUCING OUR STUDY
@petecampbell https://www.kaizensearch.co.uk
HOW FAST ARE THE TOP 700 ECOMMERCE SITES IN THE UK?
@petecampbell https://www.kaizensearch.co.uk
PageSpeed Insights Score
Homepage Size (MB)
HTTP/2 or Nope?
20 POINTS
5 POINTS
1 POINT
Homepage Loading Time 5
POINTS
@petecampbell https://www.kaizensearch.co.uk
# 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
@petecampbell https://www.kaizensearch.co.uk
54/100 59/100
8.5% SLOWER
DESKTOP MOBILE
Credit: https://developers.google.com/speed/pagespeed/insights/
AVERAGE SCORES
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
UK RETAILERS HOMEPAGES ARE 25% LARGER (3MB) THAN THE AVERAGE WEB PAGE (2.4MB)
Credit: HTTPArchive Dec 2nd 2016
@petecampbell https://www.kaizensearch.co.uk
7.9% OF TOP UK RETAILERS USE HTTP/2 ELSEWHERE, 12% OF THE WEB BENEFITS
Credit: W3C Techs Feb 2017
12.1% ADOPTION
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
SITE SPEED TACTICS
@petecampbell https://www.kaizensearch.co.uk
Google PageInsights Tool https://developers.google.com/speed/pagespeed/insights/
@petecampbell https://www.kaizensearch.co.uk
WARNING: THESE TOOLS ARE PRONE TO GIVING DUMB ADVICE
@petecampbell https://www.kaizensearch.co.uk
Using a CDN Tag ‘Bloat’ Image Optimisation
Minification In-Line Code Usage Internal & External Script Handling
RECURRING SITE SPEED SUGGESTIONS
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
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/
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
INLINE CODE – JUST DON’T DO IT!
@petecampbell https://www.kaizensearch.co.uk
INLINE CODE – JUST DON’T DO IT!
Hard to Maintain
Results in Unused Code
Overwrites Default Styles
@petecampbell https://www.kaizensearch.co.uk
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/
@petecampbell https://www.kaizensearch.co.uk
HTTP/2 ELIMINATES THE NEED FOR SOME TYPICAL SITE SPEED HACKS
Image Sprites
Credit: Kaizen May 2016
Switch to Smart Domain Sharding
‘Master’ CSS / JavaScript Files
@petecampbell https://www.kaizensearch.co.uk
CDNFinder https://www.cdnfinder.com/content-delivery-network-comparison/
@petecampbell https://www.kaizensearch.co.uk
GOOGLE AMP
@petecampbell https://www.kaizensearch.co.uk
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/
@petecampbell https://www.kaizensearch.co.uk
AMP SUPPORT HAS EXPANDED
Articles & News Content
Recipe Cards
Credit: Kaizen May 2016
eCommerce Products
Property Listings
@petecampbell https://www.kaizensearch.co.uk
EBAY IS NOW SERVING 8 MILLION URLS IN AMP
Credit: http://searchengineland.com/ebay-goes-amp-sign-might-break-past-news-253254
@petecampbell https://www.kaizensearch.co.uk
NORMAL
@petecampbell https://www.kaizensearch.co.uk
AMP VERSION
@petecampbell https://www.kaizensearch.co.uk
NORMAL
AMP VERSION
71% FASTER
@petecampbell https://www.kaizensearch.co.uk
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
@petecampbell https://www.kaizensearch.co.uk
HOW TO IMPLEMENT GOOGLE AMP
https://wordpress.org/plugins/glue-for-yoast-seo-amp/
https://wordpress.org/plugins/amp/
@petecampbell https://www.kaizensearch.co.uk
HOW TO IMPLEMENT GOOGLE AMP
https://www.ampproject.org/docs/get_started/create_page.html
@petecampbell https://www.kaizensearch.co.uk
INSTALL FREE GOOGLE PAGESPEED MODULE
Credit: Kaizen May 2016
Google PageSpeed Module https://developers.google.com/speed/pagespeed/module/
Combine & Minify CSS/JS
Optimise Images
Extend Browser Cache
@petecampbell https://www.kaizensearch.co.uk
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/
Credit: Kaizen May 2016
@petecampbell https://www.kaizensearch.co.uk
Pingdom Tools (Free Account) https://tools.pingdom.com/
@petecampbell https://www.kaizensearch.co.uk
View How a Website Actually Loads, Scripts, Renders & Paints
Right Click in Chrome > Inspect > Timeline & Hit Refresh
@petecampbell https://www.kaizensearch.co.uk
POST-WEBSITE ERA
@petecampbell https://www.kaizensearch.co.uk
MOBILE USERS PREFER APPS OVER BROWSERS
@petecampbell https://www.kaizensearch.co.uk
OPENS PAGE IN THE APP
‘Install App’ Button Fallback
APP INDEXING & DEEP-LINKING
@petecampbell https://www.kaizensearch.co.uk
Access Apps from Anywhere
Run Android Apps without Installation
INSTANT APPS WILL DOMINATE (ONE DAY)
@petecampbell https://www.kaizensearch.co.uk
NEW DEVELOPMENTS IN SPEED TECH
HTTP/2 AMP PROJECT INSTANT APPS
@petecampbell https://www.kaizensearch.co.uk
Using a CDN Tag ‘Bloat’ Image Handling
Minification In-Line Code Usage Internal & External Script Handling
TONS OF WAYS TO IMPROVE SITE SPEED
@petecampbell https://www.kaizensearch.co.uk
SLOW LOADING WEBSITES COST RETAILERS £1.73BN IN LOST SALES PER YEAR
Credit: https://blog.kissmetrics.com/loading-time/
@petecampbell https://www.kaizensearch.co.uk
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/
@petecampbell https://www.kaizensearch.co.uk
DOWNLOAD THESE SLIDES kaizensearch.co.uk/speed-deck/
Thank You! Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/
@petecampbell https://www.kaizensearch.co.uk
THE END
@petecampbell https://www.kaizensearch.co.uk
Signup for a 5-Min Site Speed Clinic
http://bit.ly/2jJJLGU * First Come, First Serve