SlideShare une entreprise Scribd logo
1  sur  42
@aweil #convcon
Mobile First?
@aweil #convcon
What is Mobile First?
It’s an Opportunity
–Reach more people
–Focus on content
–Innovate
–Convert more customers
http://bit.ly/16ZN7pe
Instead of starting with a desktop site,
start with a mobile site & progressively
enhance to devices with larger screens.
@aweil #convcon
80% of mobile revenue
Derived from visitors browsing the full site from a mobile device
35% of mobile visitors
Prefer to use a full site over an m.site whenever the option is provided
(souders)
One in five
Electronic purchases is made using a mobile phone
(BuzzCity)
@aweil #convcon
½ billion mCommerce shoppers by 2016
71% of smartphone users shop on their mobile
48% of retail shopping time already on mobile
@aweil #convcon
@aweil #convcon
Apparel & Accessories sold $1Bn via mobile in Q113
@aweil #convcon
• You can’t just shrink an existing site
– Size matters…but it really IS more than that
– (common) Assumptions are your enemy
• Mobile cannot be treated as a subset
– Start simply by removing excess
– Iterate and grow with testing & validation
http://bit.ly/158FIEH
Quick notes for context
@aweil #convcon
51% say websites hard to navigate & use
46% say product images are too small
41% are concerned about security26% feel that checkout is frustrating
41% are materially concerned about security
@aweil #convcon
Conversions Support Mobile First
Website Visits by Device
Smartphone Revenue / Session
@aweil #convcon
How Does Your App Behave?
• Lose the signal
– Find a basement or elevator
• Mix it up
– Walk in and out of WiFi areas
• Have a cuppa
– Find slow, saturated WiFi (coffee shop, train)
• Shut up and drive
– Ride along in a car to swap towers, signals
• Paint a picture
– Map your findings to understand and prioritize
http://bit.ly/14MOmNr
@aweil #convcon
You Need To Know…It’s Important
42%
29%
29%
Will go to a competitor
Will NEVER RETURN
Will wait a year
85% expect
mobile to be
FASTER
57% experience
PROBLEMS
WILL NEVER RETURN!!
@aweil #convcon
Users perceive sites to be 15% slower
than they really are
@aweil #convcon
• You need to start over
– Design for the smaller, more limited devices
– Note: conceptually, not necessarily a rollback
• Basic abilities to plan for
– Responsive images for various viewports, DPI
– Adaptive capability based on env. & capability
– Dynamic layout as screen real estate increases
– Optimized user experience to drive conversions
http://bit.ly/19QS5t2
So what’s the point?
@aweil #convcon
• Launched mCommerce app in 2012
• Visualize product: Virtual stickers via camera
• 5 column design (conversions vs. columns)
• Cost: $250,000
– 1,500 staff hours from 10 people
– 3 months to implement
http://bit.ly/18oin2z
Enough hyperbole. Prove it.
1 col 2 col 3 col 4 col 5 col
Device(s) Phones Tablets Tablets &
Desktops
Desktops Widescreen
Desktops
Traffic 16% 6% 54% 17% 7%
@aweil #convcon
It’s a Journey
http://bit.ly/15BQqGT
@aweil #convcon
@aweil #convcon
Do you even need a mobile site?
10% site traffic from mobile
Calculate
– % target customers
– $ to implement
Would another
solution have a
larger impact?
@aweil #convcon
@aweil #convcon
Consider Existing Investments
• Site Design and Development
• Maintenance & Support
• Hosting / Server fees
• Marketing, automation, analytics
• eCommerce Software
http://bit.ly/18vHK66
@aweil #convcon
What is your objective?
@aweil #convcon
@aweil #convcon
Goals Help Determine “How”
• Less expensive
• Faster development
• Simpler deployment
• Better tracking
• Best for productivity
• More robust
• Better interaction
• Faster
• Offline access
• Best for interactivity
Site App
@aweil #convcon
LinkedIN Went Native
2012: HTML5 for efficiency & agility
8-10%
Mobile
users
Apps
running
out of
Memory
Lacked
testing &
profiling
2013: Native for user experience
Majority of
Traffic from
mobile
Better
features (use
HTML5, CSS
for email)
Apple and
Google drive
innovation
http://bit.ly/15NdyAg
@aweil #convcon
Educate Yourself
http://bit.ly/14IgtMN
@aweil #convcon
@aweil #convcon
Advantages Disadvantages
Enables mobile-optimized content Split mobile/main link value
m. subdomains synonymous with mobile Large investment to implement redirects
Could affect usability/CRO
Mobile URL Redirect
@aweil #convcon
Consider Consistent Content
http://bit.ly/14IfBrC
@aweil #convcon
RWD Your site works well on every device
Advantages Disadvantages
No duplicate content maintains rankings Requires additional code re-working
One URL means no mobile crawlers Can’t differentiate mobile content
Max link value. No risk of split link value Could affect usability/CRO
No redirects = low latency & fewer errors New code may affect rankings
@aweil #convcon
Responsive Not.
How do Users Experience You?
@aweil #convcon
For 90/10 Go to Extremes
@aweil #convcon
A Note on Device Support
http://bit.ly/159wwjl @aweil #convcon
@aweil #convcon
And It’s Becoming More Difficult
Growth of Webpage Footprint & Number
of Requests (1995 to 2012)
(Sources: Demenech 2007, Gomez 2008, Charzinski 2010, Souders 2012)
Ajax / HTML5
Becomes
Mainstream
Global Internet Devices Shipment (2005 to
2016, Unit: 500M)
(Source: Business Insider Mobile Report 2012)
2005
Personal Computers
Smartphones
Tablets
2006 2007 2008 2009 2010 2011 2012E 2013E 2014E 2015E 2016E
@aweil #convcon
Analyze & Optimize
http://bit.ly/17nUE7z
@aweil #convcon
@aweil #convcon
Performance Impacts Conversions
28.7%faster
slower
BETTER PERFORMANCE
=
HIGHER CONVERSIONS
11.9%
Quality Score
impacts cost per click
Performance
CPCLOWERS
IMPROVING
@aweil #convcon
Performance = Experience + Speed
4.3%in REVENUE
2 seconds
slower
Pages that were…
DROP
2.2 seconds
improvement in
landing page speed
INCREASED
DOWNLOADS
15.4%
by
60% faster
INCREASED
DONATION
CONVERSION
Making
Barack Obama’s website
14%
1
second
delay
causes a
7%
in CONVERSIONS
1
second
delay
causes a
16%
in CUSTOMER
SATISFACTION
DROP DROP
1
second
delay
causes an
11%
in PAGE VIEWS
DROP
@aweil #convcon
All Things Are NOT Created Equal
DNS
Resolution
Server
Connection
Server
‘Wait Time’
Page
Downloaded
Browser Title
Bar Appears
Page Starts to
Render
Page is
Displayed
Ready for
Interaction
• Network bottlenecks
• Number of round trips
• Content Size & Complexity
− Page asset weight (4.3 MB)
− Number of requests (304)
− 3rd party widgets
− Use of CSS and Javascripts
• Serialization (sequential loading & execution of
individual page assets)
LEGEND
DNS
Resolution
Content
Delivery
User Experience
Delivery
Challenges
Start
Your Website
0.013
Sec
1.056
Sec
2.116
Sec
11.389
Sec
1.687
Sec
0.748
Sec
0.062
Sec
@aweil #convcon
3rd Parties = Distributed Problems
http://bit.ly/1dsV3b7
@aweil #convcon
http://bit.ly/15aRBtG
Pick Your Battles
@aweil #convcon
Engaging Experiences Aren’t Free
– Fonts
– Retina Images
– Audio
– Video
– 3rd party tags
http://bit.ly/16GoSfX
@aweil #convcon
Image-ine that…
20%
4%
5%
70%
1%
Average Bytes per Page by Content Type on Mobile
Scripts
Stylesheets
HTML
Images
Other
@aweil #convcon
Base resolution
(300 x 200 px)
Retina/HD resolution
(600 x 400 px)
Jpg compression 80 / 21 kb Jpg compression 31 / 16 kb (75% of base)
Can you spot the difference?
@aweil #convcon
Compress
Aim LOW
– Lowest acceptable
quality
Investigate Formats
– WebP?
Be Progressive
– Can lead to better
perceived perf
@aweil #convcon
http://bit.ly/133ijam
Improve the Experience
Challenge User Experience Issues
Goal Increase traffic & conversions
Solution Accelerate page rendering
Results 30% more conversions
“That’s a very real figure indicating more
sales and more money in my pocket.”
James Ness, Founder and President
@aweil #convcon
@aweil #convcon
• Yottaa case studies
Put Your Site on a Diet
http://bit.ly/15aVu1E
Challenge 1.4 MB page, heaviest 20% on web
Goal Increase traffic & conversions, incl. mobile
Solution Reduce Requests 41%
Results 53% faster loads, increased traffic 100%
“With Yottaa turned on, the Big Train site just
flies on mobile devices.”
Jim Wendt, eCommerce Marketing Manager
@aweil #convcon
@aweil #convcon
Experience is EVERYTHING
74%
OF SHOPPERS
WILL ABANDON
TRANSACTIONS
OVER 5s
$3Bn
POTENTIAL
CONVERSION
REVENUE
LOST
70%
cite poor
performance
CART
ABANDONMENT
IN eCOMMERCE
46%
Say performance
Is material
to BRAND loyalty
52%
Loss in
CONVERSIONS
for every 1sec
7%
SEM CLICKS
DOUBLED
INCREASED
PAGE LOAD 5sAND
@aweil #convcon
In Summary
• Analyze Needs
• Either
– Go Mobile First!
– Think mobile!
• Optimize Images & Rendering
• Evaluate 3rd Party Javascripts
• ITERATE!
@aweil #convcon
Thank You!
ROI of WPO eBook
1.Analyze Needs
2.Go Mobile First! Think mobile!
3.Optimize Images & Rendering
4.Evaluate 3rd Party Javascripts
5.ITERATE!

Contenu connexe

En vedette

開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會
開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會
開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會Jason Cheng
 
10 Things your Audience Hates About your Presentation
10 Things your Audience Hates About your Presentation10 Things your Audience Hates About your Presentation
10 Things your Audience Hates About your PresentationStinson
 
Googleのインフラ技術から考える理想のDevOps
Googleのインフラ技術から考える理想のDevOpsGoogleのインフラ技術から考える理想のDevOps
Googleのインフラ技術から考える理想のDevOpsEtsuji Nakai
 
How to think like a startup
How to think like a startupHow to think like a startup
How to think like a startupLoic Le Meur
 
Recovery: Job Growth and Education Requirements Through 2020
Recovery: Job Growth and Education Requirements Through 2020Recovery: Job Growth and Education Requirements Through 2020
Recovery: Job Growth and Education Requirements Through 2020CEW Georgetown
 
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013Cain Ransbottyn
 
SXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsSXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsOgilvy Consulting
 
Digitized Student Development, Social Media, and Identity
Digitized Student Development, Social Media, and IdentityDigitized Student Development, Social Media, and Identity
Digitized Student Development, Social Media, and IdentityPaul Brown
 
Teaching Students with Emojis, Emoticons, & Textspeak
Teaching Students with Emojis, Emoticons, & TextspeakTeaching Students with Emojis, Emoticons, & Textspeak
Teaching Students with Emojis, Emoticons, & TextspeakShelly Sanchez Terrell
 
32 Ways a Digital Marketing Consultant Can Help Grow Your Business
32 Ways a Digital Marketing Consultant Can Help Grow Your Business32 Ways a Digital Marketing Consultant Can Help Grow Your Business
32 Ways a Digital Marketing Consultant Can Help Grow Your BusinessBarry Feldman
 
The State of Sales & Marketing at the 50 Fastest-Growing B2B Companies
The State of Sales & Marketing at the 50 Fastest-Growing B2B CompaniesThe State of Sales & Marketing at the 50 Fastest-Growing B2B Companies
The State of Sales & Marketing at the 50 Fastest-Growing B2B CompaniesMattermark
 
3 hard facts shaping higher education thinking and behavior
3 hard facts shaping higher education thinking and behavior3 hard facts shaping higher education thinking and behavior
3 hard facts shaping higher education thinking and behaviorGrant Thornton LLP
 
[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?InterQuest Group
 
Game Based Learning for Language Learners
Game Based Learning for Language LearnersGame Based Learning for Language Learners
Game Based Learning for Language LearnersShelly Sanchez Terrell
 

En vedette (15)

開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會
開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會
開源 x 節流:企業導入實例分享 (二) [2016/03/31] 文件自由日研討會
 
10 Things your Audience Hates About your Presentation
10 Things your Audience Hates About your Presentation10 Things your Audience Hates About your Presentation
10 Things your Audience Hates About your Presentation
 
Googleのインフラ技術から考える理想のDevOps
Googleのインフラ技術から考える理想のDevOpsGoogleのインフラ技術から考える理想のDevOps
Googleのインフラ技術から考える理想のDevOps
 
Inaugural Addresses
Inaugural AddressesInaugural Addresses
Inaugural Addresses
 
How to think like a startup
How to think like a startupHow to think like a startup
How to think like a startup
 
Recovery: Job Growth and Education Requirements Through 2020
Recovery: Job Growth and Education Requirements Through 2020Recovery: Job Growth and Education Requirements Through 2020
Recovery: Job Growth and Education Requirements Through 2020
 
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013
Privacy is an Illusion and you’re all losers! - Cryptocow - Infosecurity 2013
 
SXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsSXSW 2016: The Need To Knows
SXSW 2016: The Need To Knows
 
Digitized Student Development, Social Media, and Identity
Digitized Student Development, Social Media, and IdentityDigitized Student Development, Social Media, and Identity
Digitized Student Development, Social Media, and Identity
 
Teaching Students with Emojis, Emoticons, & Textspeak
Teaching Students with Emojis, Emoticons, & TextspeakTeaching Students with Emojis, Emoticons, & Textspeak
Teaching Students with Emojis, Emoticons, & Textspeak
 
32 Ways a Digital Marketing Consultant Can Help Grow Your Business
32 Ways a Digital Marketing Consultant Can Help Grow Your Business32 Ways a Digital Marketing Consultant Can Help Grow Your Business
32 Ways a Digital Marketing Consultant Can Help Grow Your Business
 
The State of Sales & Marketing at the 50 Fastest-Growing B2B Companies
The State of Sales & Marketing at the 50 Fastest-Growing B2B CompaniesThe State of Sales & Marketing at the 50 Fastest-Growing B2B Companies
The State of Sales & Marketing at the 50 Fastest-Growing B2B Companies
 
3 hard facts shaping higher education thinking and behavior
3 hard facts shaping higher education thinking and behavior3 hard facts shaping higher education thinking and behavior
3 hard facts shaping higher education thinking and behavior
 
[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?
 
Game Based Learning for Language Learners
Game Based Learning for Language LearnersGame Based Learning for Language Learners
Game Based Learning for Language Learners
 

Plus de Yottaa

2016: The Year to Align Marketing & IT Departments
2016: The Year to Align Marketing & IT Departments2016: The Year to Align Marketing & IT Departments
2016: The Year to Align Marketing & IT DepartmentsYottaa
 
Optimizing Website Performance in the Age of Mobile & Social
Optimizing Website Performance in the Age of Mobile & Social Optimizing Website Performance in the Age of Mobile & Social
Optimizing Website Performance in the Age of Mobile & Social Yottaa
 
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...Yottaa
 
How to Optimize Your Entire Mobile Experience
How to Optimize Your Entire Mobile ExperienceHow to Optimize Your Entire Mobile Experience
How to Optimize Your Entire Mobile ExperienceYottaa
 
Monetizing Mobile: How To Optimize Mobile Engagement and Conversions
Monetizing Mobile: How To Optimize Mobile Engagement and ConversionsMonetizing Mobile: How To Optimize Mobile Engagement and Conversions
Monetizing Mobile: How To Optimize Mobile Engagement and ConversionsYottaa
 
Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance
Beyond CDNs: How to Harness the Next Phase of Innovation in Web PerformanceBeyond CDNs: How to Harness the Next Phase of Innovation in Web Performance
Beyond CDNs: How to Harness the Next Phase of Innovation in Web PerformanceYottaa
 
Yottaa State of Web Performance Optimization Group Webinar
Yottaa State of Web Performance Optimization Group WebinarYottaa State of Web Performance Optimization Group Webinar
Yottaa State of Web Performance Optimization Group WebinarYottaa
 
Image-ine That: Image Optimization for Conversion Maximization
Image-ine That: Image Optimization for Conversion MaximizationImage-ine That: Image Optimization for Conversion Maximization
Image-ine That: Image Optimization for Conversion MaximizationYottaa
 
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...Yottaa
 
Mobile Optimization Tips from Yottaa - MEGMeetup #1
Mobile Optimization Tips from Yottaa - MEGMeetup #1Mobile Optimization Tips from Yottaa - MEGMeetup #1
Mobile Optimization Tips from Yottaa - MEGMeetup #1Yottaa
 
Best practices to optimize commerce site performance [webinar slides]
Best practices to optimize commerce site performance [webinar slides]Best practices to optimize commerce site performance [webinar slides]
Best practices to optimize commerce site performance [webinar slides]Yottaa
 
Managing a Website Performance Optimization (WPO) Project
Managing a Website Performance Optimization (WPO) ProjectManaging a Website Performance Optimization (WPO) Project
Managing a Website Performance Optimization (WPO) ProjectYottaa
 
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...Yottaa
 
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012Yottaa
 
Cdn-Summit-2012-mocospace-and-yottaa
Cdn-Summit-2012-mocospace-and-yottaaCdn-Summit-2012-mocospace-and-yottaa
Cdn-Summit-2012-mocospace-and-yottaaYottaa
 
Your customer your asset seminar ecommerce and website speed yottaa
Your customer your asset seminar ecommerce and website speed   yottaaYour customer your asset seminar ecommerce and website speed   yottaa
Your customer your asset seminar ecommerce and website speed yottaaYottaa
 
Anti design patterns - an experts guide to making a slow website - yottaa sit...
Anti design patterns - an experts guide to making a slow website - yottaa sit...Anti design patterns - an experts guide to making a slow website - yottaa sit...
Anti design patterns - an experts guide to making a slow website - yottaa sit...Yottaa
 
Yottaa site speed optimizer presentation at mass innovation nights part of fu...
Yottaa site speed optimizer presentation at mass innovation nights part of fu...Yottaa site speed optimizer presentation at mass innovation nights part of fu...
Yottaa site speed optimizer presentation at mass innovation nights part of fu...Yottaa
 
Yottaa website-performance-services-overview-hostingcon-2011-
Yottaa website-performance-services-overview-hostingcon-2011-Yottaa website-performance-services-overview-hostingcon-2011-
Yottaa website-performance-services-overview-hostingcon-2011-Yottaa
 
Mongodb beijingconf yottaa_3.3
Mongodb beijingconf yottaa_3.3Mongodb beijingconf yottaa_3.3
Mongodb beijingconf yottaa_3.3Yottaa
 

Plus de Yottaa (20)

2016: The Year to Align Marketing & IT Departments
2016: The Year to Align Marketing & IT Departments2016: The Year to Align Marketing & IT Departments
2016: The Year to Align Marketing & IT Departments
 
Optimizing Website Performance in the Age of Mobile & Social
Optimizing Website Performance in the Age of Mobile & Social Optimizing Website Performance in the Age of Mobile & Social
Optimizing Website Performance in the Age of Mobile & Social
 
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...
NextGen CDNs: Webinar with Dan Rayburn of Frost and Sullivan and Ari Weil of ...
 
How to Optimize Your Entire Mobile Experience
How to Optimize Your Entire Mobile ExperienceHow to Optimize Your Entire Mobile Experience
How to Optimize Your Entire Mobile Experience
 
Monetizing Mobile: How To Optimize Mobile Engagement and Conversions
Monetizing Mobile: How To Optimize Mobile Engagement and ConversionsMonetizing Mobile: How To Optimize Mobile Engagement and Conversions
Monetizing Mobile: How To Optimize Mobile Engagement and Conversions
 
Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance
Beyond CDNs: How to Harness the Next Phase of Innovation in Web PerformanceBeyond CDNs: How to Harness the Next Phase of Innovation in Web Performance
Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance
 
Yottaa State of Web Performance Optimization Group Webinar
Yottaa State of Web Performance Optimization Group WebinarYottaa State of Web Performance Optimization Group Webinar
Yottaa State of Web Performance Optimization Group Webinar
 
Image-ine That: Image Optimization for Conversion Maximization
Image-ine That: Image Optimization for Conversion MaximizationImage-ine That: Image Optimization for Conversion Maximization
Image-ine That: Image Optimization for Conversion Maximization
 
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
So you want to build a mobile app - HTML5 vs. Native @ the Boston Mobile Expe...
 
Mobile Optimization Tips from Yottaa - MEGMeetup #1
Mobile Optimization Tips from Yottaa - MEGMeetup #1Mobile Optimization Tips from Yottaa - MEGMeetup #1
Mobile Optimization Tips from Yottaa - MEGMeetup #1
 
Best practices to optimize commerce site performance [webinar slides]
Best practices to optimize commerce site performance [webinar slides]Best practices to optimize commerce site performance [webinar slides]
Best practices to optimize commerce site performance [webinar slides]
 
Managing a Website Performance Optimization (WPO) Project
Managing a Website Performance Optimization (WPO) ProjectManaging a Website Performance Optimization (WPO) Project
Managing a Website Performance Optimization (WPO) Project
 
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...
How GoDaddy Brought Down Millions of Sites – and How to Avoid Being a DNS Out...
 
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012
An Expert's Guide to Making a Website Slow - Chicago Webmasters Meetup 6/5/2012
 
Cdn-Summit-2012-mocospace-and-yottaa
Cdn-Summit-2012-mocospace-and-yottaaCdn-Summit-2012-mocospace-and-yottaa
Cdn-Summit-2012-mocospace-and-yottaa
 
Your customer your asset seminar ecommerce and website speed yottaa
Your customer your asset seminar ecommerce and website speed   yottaaYour customer your asset seminar ecommerce and website speed   yottaa
Your customer your asset seminar ecommerce and website speed yottaa
 
Anti design patterns - an experts guide to making a slow website - yottaa sit...
Anti design patterns - an experts guide to making a slow website - yottaa sit...Anti design patterns - an experts guide to making a slow website - yottaa sit...
Anti design patterns - an experts guide to making a slow website - yottaa sit...
 
Yottaa site speed optimizer presentation at mass innovation nights part of fu...
Yottaa site speed optimizer presentation at mass innovation nights part of fu...Yottaa site speed optimizer presentation at mass innovation nights part of fu...
Yottaa site speed optimizer presentation at mass innovation nights part of fu...
 
Yottaa website-performance-services-overview-hostingcon-2011-
Yottaa website-performance-services-overview-hostingcon-2011-Yottaa website-performance-services-overview-hostingcon-2011-
Yottaa website-performance-services-overview-hostingcon-2011-
 
Mongodb beijingconf yottaa_3.3
Mongodb beijingconf yottaa_3.3Mongodb beijingconf yottaa_3.3
Mongodb beijingconf yottaa_3.3
 

Dernier

[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality AssuranceInflectra
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxLoriGlavin3
 
A Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersA Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersNicole Novielli
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterMydbops
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfMounikaPolabathina
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningLars Bell
 
Rise of the Machines: Known As Drones...
Rise of the Machines: Known As Drones...Rise of the Machines: Known As Drones...
Rise of the Machines: Known As Drones...Rick Flair
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 

Dernier (20)

[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptx
 
A Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersA Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software Developers
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL Router
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdf
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
 
Rise of the Machines: Known As Drones...
Rise of the Machines: Known As Drones...Rise of the Machines: Known As Drones...
Rise of the Machines: Known As Drones...
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 

Mobile First - Conversion Conference Presentation

  • 2. @aweil #convcon What is Mobile First? It’s an Opportunity –Reach more people –Focus on content –Innovate –Convert more customers http://bit.ly/16ZN7pe Instead of starting with a desktop site, start with a mobile site & progressively enhance to devices with larger screens.
  • 3. @aweil #convcon 80% of mobile revenue Derived from visitors browsing the full site from a mobile device 35% of mobile visitors Prefer to use a full site over an m.site whenever the option is provided (souders) One in five Electronic purchases is made using a mobile phone (BuzzCity)
  • 4. @aweil #convcon ½ billion mCommerce shoppers by 2016 71% of smartphone users shop on their mobile 48% of retail shopping time already on mobile @aweil #convcon
  • 5. @aweil #convcon Apparel & Accessories sold $1Bn via mobile in Q113
  • 6. @aweil #convcon • You can’t just shrink an existing site – Size matters…but it really IS more than that – (common) Assumptions are your enemy • Mobile cannot be treated as a subset – Start simply by removing excess – Iterate and grow with testing & validation http://bit.ly/158FIEH Quick notes for context
  • 7. @aweil #convcon 51% say websites hard to navigate & use 46% say product images are too small 41% are concerned about security26% feel that checkout is frustrating 41% are materially concerned about security
  • 8. @aweil #convcon Conversions Support Mobile First Website Visits by Device Smartphone Revenue / Session
  • 9. @aweil #convcon How Does Your App Behave? • Lose the signal – Find a basement or elevator • Mix it up – Walk in and out of WiFi areas • Have a cuppa – Find slow, saturated WiFi (coffee shop, train) • Shut up and drive – Ride along in a car to swap towers, signals • Paint a picture – Map your findings to understand and prioritize http://bit.ly/14MOmNr
  • 10. @aweil #convcon You Need To Know…It’s Important 42% 29% 29% Will go to a competitor Will NEVER RETURN Will wait a year 85% expect mobile to be FASTER 57% experience PROBLEMS WILL NEVER RETURN!!
  • 11. @aweil #convcon Users perceive sites to be 15% slower than they really are
  • 12. @aweil #convcon • You need to start over – Design for the smaller, more limited devices – Note: conceptually, not necessarily a rollback • Basic abilities to plan for – Responsive images for various viewports, DPI – Adaptive capability based on env. & capability – Dynamic layout as screen real estate increases – Optimized user experience to drive conversions http://bit.ly/19QS5t2 So what’s the point?
  • 13. @aweil #convcon • Launched mCommerce app in 2012 • Visualize product: Virtual stickers via camera • 5 column design (conversions vs. columns) • Cost: $250,000 – 1,500 staff hours from 10 people – 3 months to implement http://bit.ly/18oin2z Enough hyperbole. Prove it. 1 col 2 col 3 col 4 col 5 col Device(s) Phones Tablets Tablets & Desktops Desktops Widescreen Desktops Traffic 16% 6% 54% 17% 7%
  • 14. @aweil #convcon It’s a Journey http://bit.ly/15BQqGT @aweil #convcon
  • 15. @aweil #convcon Do you even need a mobile site? 10% site traffic from mobile Calculate – % target customers – $ to implement Would another solution have a larger impact? @aweil #convcon
  • 16. @aweil #convcon Consider Existing Investments • Site Design and Development • Maintenance & Support • Hosting / Server fees • Marketing, automation, analytics • eCommerce Software http://bit.ly/18vHK66
  • 17. @aweil #convcon What is your objective? @aweil #convcon
  • 18. @aweil #convcon Goals Help Determine “How” • Less expensive • Faster development • Simpler deployment • Better tracking • Best for productivity • More robust • Better interaction • Faster • Offline access • Best for interactivity Site App
  • 19. @aweil #convcon LinkedIN Went Native 2012: HTML5 for efficiency & agility 8-10% Mobile users Apps running out of Memory Lacked testing & profiling 2013: Native for user experience Majority of Traffic from mobile Better features (use HTML5, CSS for email) Apple and Google drive innovation http://bit.ly/15NdyAg
  • 21. @aweil #convcon Advantages Disadvantages Enables mobile-optimized content Split mobile/main link value m. subdomains synonymous with mobile Large investment to implement redirects Could affect usability/CRO Mobile URL Redirect
  • 22. @aweil #convcon Consider Consistent Content http://bit.ly/14IfBrC
  • 23. @aweil #convcon RWD Your site works well on every device Advantages Disadvantages No duplicate content maintains rankings Requires additional code re-working One URL means no mobile crawlers Can’t differentiate mobile content Max link value. No risk of split link value Could affect usability/CRO No redirects = low latency & fewer errors New code may affect rankings
  • 24. @aweil #convcon Responsive Not. How do Users Experience You?
  • 25. @aweil #convcon For 90/10 Go to Extremes
  • 26. @aweil #convcon A Note on Device Support http://bit.ly/159wwjl @aweil #convcon
  • 27. @aweil #convcon And It’s Becoming More Difficult Growth of Webpage Footprint & Number of Requests (1995 to 2012) (Sources: Demenech 2007, Gomez 2008, Charzinski 2010, Souders 2012) Ajax / HTML5 Becomes Mainstream Global Internet Devices Shipment (2005 to 2016, Unit: 500M) (Source: Business Insider Mobile Report 2012) 2005 Personal Computers Smartphones Tablets 2006 2007 2008 2009 2010 2011 2012E 2013E 2014E 2015E 2016E
  • 28. @aweil #convcon Analyze & Optimize http://bit.ly/17nUE7z @aweil #convcon
  • 29. @aweil #convcon Performance Impacts Conversions 28.7%faster slower BETTER PERFORMANCE = HIGHER CONVERSIONS 11.9% Quality Score impacts cost per click Performance CPCLOWERS IMPROVING
  • 30. @aweil #convcon Performance = Experience + Speed 4.3%in REVENUE 2 seconds slower Pages that were… DROP 2.2 seconds improvement in landing page speed INCREASED DOWNLOADS 15.4% by 60% faster INCREASED DONATION CONVERSION Making Barack Obama’s website 14% 1 second delay causes a 7% in CONVERSIONS 1 second delay causes a 16% in CUSTOMER SATISFACTION DROP DROP 1 second delay causes an 11% in PAGE VIEWS DROP
  • 31. @aweil #convcon All Things Are NOT Created Equal DNS Resolution Server Connection Server ‘Wait Time’ Page Downloaded Browser Title Bar Appears Page Starts to Render Page is Displayed Ready for Interaction • Network bottlenecks • Number of round trips • Content Size & Complexity − Page asset weight (4.3 MB) − Number of requests (304) − 3rd party widgets − Use of CSS and Javascripts • Serialization (sequential loading & execution of individual page assets) LEGEND DNS Resolution Content Delivery User Experience Delivery Challenges Start Your Website 0.013 Sec 1.056 Sec 2.116 Sec 11.389 Sec 1.687 Sec 0.748 Sec 0.062 Sec
  • 32. @aweil #convcon 3rd Parties = Distributed Problems http://bit.ly/1dsV3b7
  • 34. @aweil #convcon Engaging Experiences Aren’t Free – Fonts – Retina Images – Audio – Video – 3rd party tags http://bit.ly/16GoSfX
  • 35. @aweil #convcon Image-ine that… 20% 4% 5% 70% 1% Average Bytes per Page by Content Type on Mobile Scripts Stylesheets HTML Images Other
  • 36. @aweil #convcon Base resolution (300 x 200 px) Retina/HD resolution (600 x 400 px) Jpg compression 80 / 21 kb Jpg compression 31 / 16 kb (75% of base) Can you spot the difference?
  • 37. @aweil #convcon Compress Aim LOW – Lowest acceptable quality Investigate Formats – WebP? Be Progressive – Can lead to better perceived perf
  • 38. @aweil #convcon http://bit.ly/133ijam Improve the Experience Challenge User Experience Issues Goal Increase traffic & conversions Solution Accelerate page rendering Results 30% more conversions “That’s a very real figure indicating more sales and more money in my pocket.” James Ness, Founder and President @aweil #convcon
  • 39. @aweil #convcon • Yottaa case studies Put Your Site on a Diet http://bit.ly/15aVu1E Challenge 1.4 MB page, heaviest 20% on web Goal Increase traffic & conversions, incl. mobile Solution Reduce Requests 41% Results 53% faster loads, increased traffic 100% “With Yottaa turned on, the Big Train site just flies on mobile devices.” Jim Wendt, eCommerce Marketing Manager @aweil #convcon
  • 40. @aweil #convcon Experience is EVERYTHING 74% OF SHOPPERS WILL ABANDON TRANSACTIONS OVER 5s $3Bn POTENTIAL CONVERSION REVENUE LOST 70% cite poor performance CART ABANDONMENT IN eCOMMERCE 46% Say performance Is material to BRAND loyalty 52% Loss in CONVERSIONS for every 1sec 7% SEM CLICKS DOUBLED INCREASED PAGE LOAD 5sAND
  • 41. @aweil #convcon In Summary • Analyze Needs • Either – Go Mobile First! – Think mobile! • Optimize Images & Rendering • Evaluate 3rd Party Javascripts • ITERATE!
  • 42. @aweil #convcon Thank You! ROI of WPO eBook 1.Analyze Needs 2.Go Mobile First! Think mobile! 3.Optimize Images & Rendering 4.Evaluate 3rd Party Javascripts 5.ITERATE!

Notes de l'éditeur

  1. Dir. Of Products at Yottaa Web Performance and User Experience Optimization Service 15 years building and tuning apps and websites from various angles
  2. PHILOSOPHY – Prioritize Mobile Context Reach more people (77% have mobile, 85% sold in 2011 have browsers) Focus on core content (what to do with 20% of screen available?) Innovate – new technology CONVERT – more mobile devices than people this year, restaurants convert 90%, 64% w/in the hour By the end of this year there will be more mobile devices than people http://mashable.com/2013/02/06/mobile-growth/?__hstc=28181411.2b94e1c1b807545f894e9da17dcc240b.1380296215268.1380296215268.1380296215268.1&__hssc=28181411.1.1380296215269 Mobile searches related to restaurants have a conversion rate of 90% with 64% converting within the hour. (Source: xAd and Telemetrics, 2012) - See more at: http://www.digby.com/mobile-statistics/#sthash.ZACPqe1r.dpuf
  3. WHO has a mobile site? You ALL do You need to act accordingly WHY…? http://queue.acm.org/detail.cfm?id=2510122
  4. http://www.comscore.com/Insights/Press_Releases/2013/5/comScore_Reports_Q1_2013_Desktop_Based_US_Retail_ECommerce_Spending
  5. The AVG. SPEND on mCommerce sites is $65K this year plan to spend an average of $65,000 on mobile this year - See more at: http://www.digby.com/mobile-statistics/#sthash.ZACPqe1r.dpuf
  6. Challenge SHALLOW NOTION you can shrink desktop site Mobile-optimized is real More than screen size Remove convenient assumptions Networks shaky Device capabilities vary On-device app versions fragmented ACCOMMODATE most difficult (MOBILE) first
  7. USERS ARE NOT PASSIVE – Maybe passive aggressive Shrink a site = shrink conversion potential
  8. Numbers speak for themselves * 70% of users abandon shopping carts, huge $$ spent on retention Smartphones convert the worst – why? Smallest viewports Greatest fragmentation Highest impact from unreliable networks
  9. SO how does your app behave? How many use an APM solution? How many use RUM? How many have a dedicated group to manage performance YOU SHOULD TEST – And this is the PERFECT opportunity
  10. Mobile users expect a site to load faster 4-8 seconds For sites slower than 5s, users spend less time on ads, maybe 1sec
  11. So if global cart abandonment is 70%, perception is 15% slower, you will struggle NOTE: Mobile abandonment numbers suggest more patience, but this is changing Fun fact: research shows that rodeo riders are one of the (if not THE) only professions to consistently guesstimate time.
  12. Conceptual reboot Design for smaller, limited devices Be smart about images Implement intelligent code – RWD (we’ll talk more) Respond to device capability – enable more when it will benefit users Implement what you can afford to maintain (old browsers, variable experience, more testing, more $$)
  13. Dec 2009: 12% mobile Dec 2010: 24% (next, launch mobile) Dec 2012: 42% H112 – H113: 90% increase in mobile conversions! 275% increase in traffic Revenue per user > 70%! Mobile revenue 538% increase! Non-phone: 17% conv inc., 25% revenue inc, rev/user inc 17% http://www.internetretailer.com/mobile/2013/01/28/fathead-dives-head-first-augmented-reality-and-responsive
  14. Existing investments may already constrain budget * How much do you spend on your website solutions? * Mobile solution CANNOT be additive, must be aligned
  15. Objective drives your choice/decision
  16. TEST a market oppty Easily roll out new features (vs. app) Target market starting to use tech – Samsung GS4 Easy Mode folks Tracking user behavior Retailers’ apps with store mode gather five times more engagement. - See more at: http://www.digby.com/mobile-statistics/#sthash.ZACPqe1r.dpuf
  17. LinkedIN – saw users spending more time on site Surprised to find that devices running out of memory! It’s ideal to keep rendered content for instant switching back. However you could only do that if memory management is done optimally. There’s only so much you could keep until the app crashes running out of memory.
  18. Mobile redirects are exceedingly common Challenge SEO - Google penalizing sites for poor m.site optimization Challenge CRO - converting is harder when the experience is poor potentially EXPENSIVE Tools: multiple domains, DIY, framework plugins Figuring it out: User Agent Switcher, Ayima Redirect Checker
  19. Common differences between RWD and .msite is content & features m.site typically a subset of content Assumption "mobile users want access only to content that is “important” to them." Sure to alienate and frustrate Studies found the content users were seeking was the same, regardless of device
  20. Responsive Web Design articulates how to adapt a website’s layout for multiple screen resolutions. Creating a responsive web design utilizes: Fluid grids that ebb and flow with a devices’ screen size Flexible images and media that keep content intact on any resolution Media queries allowing designs to adapt by establishing dimension breakpoints
  21. Scaling up versus scaling down ensures message, content and functionality remain intact Scaling down risks core message and functionality getting lost
  22. For RWD, “designing to the extremes.” Either mobile first, OR Start by designing the desktop version of the website. Work out typography, tone and overall visual direction — as well as layout Small screen or “mobile” version, using the same visual direction, but adjusting the layout as appropriate for the smaller screen. Visual examples of the two layouts of the website that will vary the greatest — the biggest and the smallest screen versions of the design. These two examples will guide me as I begin the website’s front-end development. Image: http://media.smashingmagazine.com/wp-content/uploads/2012/11/envision-extremes.jpg
  23. Optimizing for everything is impossible
  24. There’s an ALIGNED concept in mobile design and mobile first, and that’s PERFORMANCE. Why is this important? Because of how websites and web applications have changed Over 200 versions of os/browser Over 30 combinations of mobile OS in the wild Strategically decide what target devices and browsers for which to optimize.
  25. Using site analytics can help you understand your audience better can be misleading (they might rely on JS, they don’t count impatient visitors that don’t ever wait for your site to load, etc) BETTER perf = HIGHER conversion Google’s Quality Score impacts cost/click, and speed impacts QS you must research your audience to gauge what best to optimize for. Focus on known devices and screen sizes (phones, tablets, desktops). mobile-first established the baseline for our website’s CSS.
  26. 7% drop in conversions for every 1 second of latency
  27. Let's talk about a necessary evil - the cost of doing business? CoreMetrics, Optimizely, GetSatisfaction, LiveChat, Marketo Show us where users've been, how they're behaving, but ruining their experience Some companies are ripping out 3rd party javascript to get performance back Consider delay or lazy loading Social Last year, only 12% of consumers bought anything through social media - See more at: http://www.digby.com/mobile-statistics/#sthash.ZACPqe1r.dpuf
  28. MYTH 2: total size of assets for mobile will be smaller than desktop. MYTH 2: The total number of http requests for mobile web will be smaller than those delivered to desktop web.
  29. Fonts usage — old version of Typekit that downloaded SVG fonts on iPhone. These font files made the mobile version much bigger than desktop. Retina images — Sometimes, both the mobile images and the retina mobile images are getting downloaded for a double hit. HTML5 Audio — HTML5 audio is embedded on the page. The browser is downloading the full mp3 file regardless of whether or not the user presses play. This balloons huffduffer.com from 122k on desktop to 2.9MB in Mobile Safari. HTML5 Video — Mobile Safari starts downloading a portion of the video in order to validate the video will work and to grab a scene from the video to use in the player. Desktop Safari wasn’t doing this.
  30. Images are stilly typically the worst offenders
  31. Consider a tip for mobile retina images - in most cases you can avoid bloat http://mobile.smashingmagazine.com/2013/05/29/the-state-of-responsive-web-design/
  32. Pageviews per visit & time spent on the site per visit have increased by 30% We’ve seen a 30% increase in conversion rate since optimizing our site – a very significant increase. That’s a very real figure indicating more sales & money in my pocket.
  33. Analyze & Determine Mobile Needs Get to know your content & your users Either Give mobile first a try Specifically rev your site with mobile in mind Optimize Images & Rendering Evaluate 3rd Party Javascripts ITERATE!