29
www.yottaa.com | www.marlinmobile.com Understand and Overcome! Mobile Web Performance

Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com

Understand and Overcome!

Mobile Web Performance

Page 2: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 2#mobileweb @yottaa @marlinmobile

Your Presenters

Ari WeilVP of Products, Yottaa@aweil

Adrian MendozaCo-founder, Marlin Mobile@marlinUX

Page 3: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 3

Agenda

#mobileweb @yottaa @marlinmobile

Mobile: much ado about...what exactly?Smaller is only the beginningOptimization best practicesOvercome and winQ&A

Page 4: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 4

20% of electronics purchases using mobile35% of mobile visitors prefer www to m.site80% of mobile revenue from full site browsing

#mobileweb @yottaa @marlinmobile

Why is everyone so focused on mobile?

Page 5: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 5

Mobile traffic - it’s just the tip of the iceberg

#mobileweb @yottaa @marlinmobile

0.7 Billion

Page 6: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 6#mobileweb @yottaa @marlinmobile

Plus, it’s a part of virtually every transaction

Page 7: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 7#mobileweb @yottaa @marlinmobile

So you see, this “small” problem can be BIG

51% say websites hard to navigate & use

46% say product images are too small

41% are concerned about security

26% feel that checkout is frustrating

Page 8: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 8#mobileweb @yottaa @marlinmobile

And when you get it wrong, you lose…BIG

64%OF SMARTPHONE USERS EXPECT PAGES TO LOAD IN

UNDER 4s

$1BnAPPAREL &ACCESSORIESPURCHASES

in Q113

71%Of all retail transactions

SMARTPHONEUSERS SHOPVIA MOBILE

48%

Expect mobile to be fasterthan desktop

85%Will go to a competitorto transact

42%Will neverreturn toyour site

29%

Page 9: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 9#mobileweb @yottaa @marlinmobile

Don’t be that business

that if they arrive on a business site that isn't working well on mobile, they take it as an indication of the

48% of users saybusiness simply does not care.

Page 10: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com

Smaller is only the beginning.

Page 11: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 11#mobileweb @yottaa @marlinmobile

Know the mobile ecosystem

This is your mobile experience now…

…its complicated

Page 12: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 12#mobileweb @yottaa @marlinmobile

And what goes into loading a web page

Images

Javascript

Via HTTPArchive, May ‘13-’14

Page 13: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 13

Now consider the average eCommerce page

#mobileweb @yottaa @marlinmobile

Trust Icons

High-Res Images

Long-scrolling pages

Social Media

Dynamic Content

In Addition:• A/B Tests• Analytic tracking• Beacons• Chat• Personalization• Pixels• RWD w/out RESS

Visitors expect fast, flawless

experiences on any device

Marketing needs social media and other tags to engage visitors

IT needs control to ensure speed, scalability and security

Page 14: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 14

Cannot impact 3rd party dynamic content like social

media or ads

CONTENT DELIVERY NETWORKS

#mobileweb @yottaa @marlinmobile

Reality: ever-growing content and complexityPA

GE L

OA

D T

IME IT

EFFO

RT &

TIM

E

SITE LAUNCH ONGOING MAINTENANCE AND USER ENGAGEMENT EFFORTS

UPDATE CONTENT & IMAGES

ADD SOCIAL MEDIA WIDGETS

ADD REAL TIME PERSONALIZATION

A/B TEST PAGE CONTENT

Hiding components cannot keep pace with ongoing User & Marketing needs

Cannot control page load behavior, content

priority

FRONTEND OPTIMIZATION

Manual effort for every content change

DO IT YOURSELF

Page 15: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com

Optimization best practices.

Page 16: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 16

Implement Responsive Web Design

#mobileweb @yottaa @marlinmobile

Advantages Disadvantages

Most consistent user experience possible Requires additional code re-working

No duplicate content maintains rankings Difficult to 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

Page 17: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 17

Responsive Web Design Dirty Little Secret

#mobileweb @yottaa @marlinmobile

ALL websites are exactly the same in page size and requests!

Page 18: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 18

Little r – presentation mostly– Fluid, flexible layout– Media queries– Responsive images

Big R– Dynamic serving

BOTH are better than

#mobileweb @yottaa @marlinmobile

The difference between little r and big R

Page 19: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 19#mobileweb @yottaa @marlinmobile

Fact: Reducing Page Weight/Requests Works

increased performance by

68%by reducing

HTTP requests

small page-1.5s

big page – 4.7s

Page 20: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 20

Desktop: 78 requests, 5.1sec load time

Mobile: 38 requests, 20.8sec load time

#mobileweb @yottaa @marlinmobile

Reduce requests

Still loading…

So what went wrong?

Page 21: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 21#mobileweb @yottaa @marlinmobile

Fact: Mobile behaves differently

Example:parallelizing requests HURTS mobile experience

Page 22: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

22#mobileweb @yottaa @marlinmobile

www.yottaa.com | www.marlinmobile.com

Myth #1: A CDN solves everything

Example:Cloud storage being used for image assets

Page 23: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

23#mobileweb @yottaa @marlinmobile

www.yottaa.com | www.marlinmobile.com

Myth #2: Design for First Paint is enough

Time to First Paint:5 seconds

Your users radio stays on for an additional 12 seconds burning their battery.

Page 24: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

24#mobileweb @yottaa @marlinmobile

www.yottaa.com | www.marlinmobile.com

Myth #3: Delay-loading 3rd party assets wins

Example:analytics tag keeps the page from completely loading

Time to First Paint:5 seconds

Page 25: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com

Overcome and win.

Page 26: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 26#mobileweb @yottaa @marlinmobile

Optimizations that work (but…TNSTAAFL)

Treats Middle mile geographic latency

Good for Individual assets, streaming media

Challenges

Visitor context

Related assets

VersioningCDN

Treats Content weight, round trips

Good for Efficient asset delivery, rendering

Challenges

Visitor context

Device capabilities

Ongoing care & feedingFEO

Page 27: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 27#mobileweb @yottaa @marlinmobile

Yottaa: holistic site optimization service

See business results before you buy

www.yottaa.com/prove-it

40% FASTER

InstantON AppSequencing

MORE CONTROL

ContextIntelligence

DEEP INSIGHT

Page 28: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

www.yottaa.com | www.marlinmobile.com 28#mobileweb @yottaa @marlinmobile

Marlin Mobile: Monitor your mobile web

Get insights from REAL mobile devicesSee your REAL customer view on mobileSign up for a free account – marlinmobile.com/free

Get insight and data on your ENTIRE mobile ecosystem.

Page 29: Monetizing Mobile: How To Optimize Mobile Engagement and Conversions

THANK YOU

#mobileweb @yottaa @marlinmobile

www.yottaa.com | www.marlinmobile.com 29