next gen mobile aug 2013 scotland

going mobile

Presented by:

Sandra Luther, Solutions Manager – Blackbaud Europe @sandraluther

Sandra.Luther@Blackbaud.co.uk

the rise of mobile…

should you bother?

Would you be willing to use a smartphone to make a donation through a browser?

Gen Y 36.4% Gen X 25.3% Boomer 6.1% Mature 2.9%

By 2015 mobile will outpace desktops as the #1

method for accessing the web

- Source: Morgan Stanley

UNDERSTANDING THE MOBILE USER

meet mr. multi-tasker

• Views the website in a different context on mobile devices vs. desktop

• Has different needs and goals

– The primary task for an airline desktop site is to book flights, whereas the primary task for the mobile site is to check flight status

• Knows what they want and want it quickly

– Maps and directions, contact

information (81% of users)

– Social Networking

(76% of users)

– Finding local information

(73% of users)

optimising presentation

• A design that works well for a desktop is not optimised for mobile browsing

• Desktop resolutions are on the increase (1990 = 800x600 pixels; 2000 = 1024x768

• Mobile device resolutions are smaller (iPhone = 480x320)

optimising presentation

• A design that works well for a desktop is not optimised for mobile browsing

• Desktop resolutions are on the increase (1990 = 800x600 pixels; 2000 = 1024x768

• Mobile device resolutions are smaller (iPhone = 480x320)

CONTENT

PRIMARY

SEARCH LINK1 LINK2 LINK3

LINK4 LINK5 LINK6

FEATURED CONTENT

FOOTER

CONTENT SECONDARY

PROMO PROMO PROMO PROMO

LOGO LINK1 LINK2 LINK3 LINK4

LINK4 LINK5 LINK6

LINK5

FEATURED CONTENT

usability

Easy to

Reach

Stretch

• Know your sweet spots

• Recognise the space

• 85% of people are right handed

Easily within a thumb’s reach

Stretch to get thumb here

Within reach, but can be awkward

mobile website design considerations

• Landscape

• App vs. website

• Microsite vs. full site

• Responsive Design

• Portrait

• Javascript vs. Flash

• Flicking vs. scrolling

• Tap vs. :hover

• Finger vs. cursor

VARIETY OF APPROACHES TO MOBILE

3 main approaches to mobile

Designated Mobile Site

Full Site Mobile

Replication

Responsive Design

Increasing Complexity & Costs

responsive

- Infographic Source: www.monetate.com

designated mobile site

• Helps you make the most of mobile quickly

• Adapts to a smaller screen size

• Puts a priority on specific content

• Minimise input requirements on web forms to keep it user friendly

• Minimises load time – maximising web speed

• All of this leads to an increase in conversions

designated mobile sites:

single page just the basics microsite

HOW DO I KNOW IF I NEED A MOBILE OPTIMISED WEBSITE?

ask google!

Click Advanced Segments

google analytics

Choose “All Traffic” and

“Mobile Traffic” and click

Apply

measure mobile traffic

“All” vs. “Mobile” traffic is

now included everywhere.

In this case 6.27% of total

visits come from mobile.

what about your supporters?

“Returning” visitors are your

supporters - they keep

coming back to your

website. How many of your

supporters are using a

mobile device to access

your site?

what happens if you don’t go mobile?

• In a recent survey of mobile web users: – 48% of users say they feel frustrated & annoyed when they get

to a site that’s not mobile-friendly

– 52% said that a bad mobile experience made them less likely to engage

– 50% of people said even if they like a business, they will use them less often if the website isn’t mobile-friendly

– 34% said they’d likely visit a competitor’s mobile site instead

Source: GoogleThink Research, What Users Want from Mobile, September 2012

however, doing it right...

• A site optimised for mobiles is able to generate almost twice the

average traffic per user than sites which haven’t

• On average, visitors are 51% more likely to actually do

business with an online retailer if it has a mobile site

Source: KISS Metrics

mobile site best practices

• Keep it quick as users are on the move

• Simplify navigation

• Design for visibility

• Make it friendly and easy to use

• Make your content relevant for mobile users

• Make the brand seamless

• Use mobile site redirects for device detection

And most importantly: Test, Listen, Learn and Modify

FOR TIPS ON MOBILE OPTIMISATION

http://mobilewebbestpractices.com/