1. GOING MOBILE
Why Mobile? Why Now?
Hi Everyone,
Today we’re going to learn a bit about the power of mobile websites, and what you need to think about in
order to provide your customers with a solid mobile experience.

2. GROWTH
“Over 70% of the world’s populations now has
a mobile phone.”
-Sybase
When you think about mobile devices, the first thing we need to realize is that the platform is experiencing
tremendous growth.
According to Sybase Inc., a research provider, over 70% of the world’s population now has a mobile phone. (Sybase,
2010)

3. GROWTH
Growth of Mobile phones as a core internet device for users is growing as well. (click)
Gartner, a research firm with thousands of corporate clients worldwide (Gartner, 2012) suggests that “mobile
phones will overtake PCs as the most common web access devices worldwide by 2013.” (Walsh, 2010)

4. GROWTH
“Mobile Phones will overtake PCs as
the most common web access
device...by 2013”
-Gartner Research
Growth of Mobile phones as a core internet device for users is growing as well. (click)
Gartner, a research firm with thousands of corporate clients worldwide (Gartner, 2012) suggests that “mobile
phones will overtake PCs as the most common web access devices worldwide by 2013.” (Walsh, 2010)

5. GROWTH
“Tablets will overtake PC sales by the end of
2012.”
-Tim Cook (Apple CEO)
Source: (Brill, 2012)
And we certainly cannot forget tablets.
Apple CEO Tim Cook, announced recently that tablets will overtake PC sales by the end of 2012. (Brill, 2012)

6. FOCUS
“a mobile version of your site is not simply
made by trimming down content to fit on a
smaller screen”
-Tom Wentworth (Ektron, Inc.)
Secondly, one of the first things we work towards is focusing together on what’s truly important for mobile
users, in regards to your site.
-Tom Wentworth, the CMO of the web content management and marketing optimization provider Ektron Inc.
says that a mobile version of your site is not simply made by “trimming down content to fit on a smaller
screen” (Wentworth, 2011)

7. FOCUS
CORE EXPERIENCE
Location
When thinking about your customers on the go, we really have to answer a few key questions.
Where are they? - on the road - at home - on vacation - in bed (click)
What are they looking for at this moment? - If they’re on the go, they may be looking for
quick information bites. (click)
How will they need to interact with your site on their mobile device?
Do they want to find information quickly? Are they forwarding that information to someone
else?

8. FOCUS
CORE EXPERIENCE
Location Needs
When thinking about your customers on the go, we really have to answer a few key questions.
Where are they? - on the road - at home - on vacation - in bed (click)
What are they looking for at this moment? - If they’re on the go, they may be looking for
quick information bites. (click)
How will they need to interact with your site on their mobile device?
Do they want to find information quickly? Are they forwarding that information to someone
else?

9. FOCUS
CORE EXPERIENCE
Location Needs Interaction
When thinking about your customers on the go, we really have to answer a few key questions.
Where are they? - on the road - at home - on vacation - in bed (click)
What are they looking for at this moment? - If they’re on the go, they may be looking for
quick information bites. (click)
How will they need to interact with your site on their mobile device?
Do they want to find information quickly? Are they forwarding that information to someone
else?

10. FOCUS
Simplify Navigation
Vertical
Once we identify these key features, we can start to pinpoint functions of your new mobile
site.
For instance we implement:
Vertical scrolling - which can really make your mobile website easy to navigate. (click)
Clear Paths - If your customers are in a hurry, they’ll want the information they seek to be
readily available and easy to find. (click)
Easy Navigation - Remember we’re no longer talking about a precision mouse for pointing on
screen. We’ll have to provide easy to use buttons and links, made for fingertips!

11. FOCUS
Simplify Navigation
Vertical Clear Path
Once we identify these key features, we can start to pinpoint functions of your new mobile
site.
For instance we implement:
Vertical scrolling - which can really make your mobile website easy to navigate. (click)
Clear Paths - If your customers are in a hurry, they’ll want the information they seek to be
readily available and easy to find. (click)
Easy Navigation - Remember we’re no longer talking about a precision mouse for pointing on
screen. We’ll have to provide easy to use buttons and links, made for fingertips!

12. FOCUS
Simplify Navigation
Buy
Vertical Clear Path Big Buttons
Once we identify these key features, we can start to pinpoint functions of your new mobile
site.
For instance we implement:
Vertical scrolling - which can really make your mobile website easy to navigate. (click)
Clear Paths - If your customers are in a hurry, they’ll want the information they seek to be
readily available and easy to find. (click)
Easy Navigation - Remember we’re no longer talking about a precision mouse for pointing on
screen. We’ll have to provide easy to use buttons and links, made for fingertips!

13. FOCUS
CORE EXPERIENCE
So those are some examples of how we can shift your user experience to a more mobile
friendly configuration.
But that’s only half the story. (click)
How/What do you want your customers to think and feel when they use your website?
This is a very important question, because for many this will be the first encounter of your
business and its purpose.

14. FOCUS
CORE EXPERIENCE
Think Affect
So those are some examples of how we can shift your user experience to a more mobile
friendly configuration.
But that’s only half the story. (click)
How/What do you want your customers to think and feel when they use your website?
This is a very important question, because for many this will be the first encounter of your
business and its purpose.

15. FOCUS
Reduce Bandwidth
Compress Optimize
Remember that mobile internet bandwidth is still in the early stages of speed.
We’ll need to think about streamlining your content, images and media to provide a quick and
beautiful experience on mobile platforms.

16. DEVELOP
One of the core philosophies we live by is “Develop for One Web” (click)
This means “building your pages in a way that makes it easier to provide the same content to
a wide range of users, regardless of the device they’re using to access your site.”
Joe Marini (Lynda.com)

17. DEVELOP
“...build your pages in a way that makes it
easier to provide the same content to a wide
range of users, regardless of their device...”
-Joe Marini (Lynda.com)
One of the core philosophies we live by is “Develop for One Web” (click)
This means “building your pages in a way that makes it easier to provide the same content to
a wide range of users, regardless of the device they’re using to access your site.”
Joe Marini (Lynda.com)

18. PROGRESSIVE
ENHANCEMENT
Behavior
Style
Content
This means that your website is built from the ground up to ensure your content and
messaging is viewable on every platform possible, and that the look and feel of your website
in rendered over various levels based on the device of the viewer. (click)
It also means that by purchasing one website you will provide as seamless an experience for
all your potential and current customers.

19. PROGRESSIVE
ENHANCEMENT
Behavior Javascript
Style CSS
Content HTML
This means that your website is built from the ground up to ensure your content and
messaging is viewable on every platform possible, and that the look and feel of your website
in rendered over various levels based on the device of the viewer. (click)
It also means that by purchasing one website you will provide as seamless an experience for
all your potential and current customers.

20. DETECT
CAPABILITIES
The key to Progressive Enhancement, and the piece you should know above all else; is that
your website, if built with Progressive Enhancement in mind, will detect the capabilities of
each unique visitor, and provide the best experience it can.

21. DEVELOP
Trident
(Based on IE7)
Here we can see an example of two mobile browsers.
Her we see a simplified version of the mobile site from Wells Fargo
We can see the basic functionality of the site is maintained with the basic sign in boxes.
(Click)
On the right, we see a fully supported Wells Fargo mobile site, with its style and behavior as
intended by the company.
Same information, but more complete experience.

22. DEVELOP
Trident WebKit
(Based on IE7) (Based on Safari)
Here we can see an example of two mobile browsers.
Her we see a simplified version of the mobile site from Wells Fargo
We can see the basic functionality of the site is maintained with the basic sign in boxes.
(Click)
On the right, we see a fully supported Wells Fargo mobile site, with its style and behavior as
intended by the company.
Same information, but more complete experience.

23. BAD EXAMPLE
National
Let’s take a look at a not so good example of a mobile website. In fact, this example isn’t a
mobile website at all.
Take a look at this reservation page on National Car Rental’s website. Now imaging trying to
view this on an iPhone. (click)
Picture yourself struggling to zoom and tap on an individual link.
What are some things that National could do better?

24. BAD EXAMPLE
National
Let’s take a look at a not so good example of a mobile website. In fact, this example isn’t a
mobile website at all.
Take a look at this reservation page on National Car Rental’s website. Now imaging trying to
view this on an iPhone. (click)
Picture yourself struggling to zoom and tap on an individual link.
What are some things that National could do better?

25. GOOD
Hertz
Now let’s take a look at a great example. Hertz has really worked to address their mobile
customers and make them feel wanted.
They provided a clear path. In this case, what do you think this particular page is designed to
do?
(click)
That’s right, make reservations. (click)
Now look a this a bit closer. Though reservations are certainly the focus here, notice that
they have also provided clear paths and (nice sized buttons) to get to other areas of the site.

26. GOOD
Hertz
Now let’s take a look at a great example. Hertz has really worked to address their mobile
customers and make them feel wanted.
They provided a clear path. In this case, what do you think this particular page is designed to
do?
(click)
That’s right, make reservations. (click)
Now look a this a bit closer. Though reservations are certainly the focus here, notice that
they have also provided clear paths and (nice sized buttons) to get to other areas of the site.

27. GOOD
Hertz
Now let’s take a look at a great example. Hertz has really worked to address their mobile
customers and make them feel wanted.
They provided a clear path. In this case, what do you think this particular page is designed to
do?
(click)
That’s right, make reservations. (click)
Now look a this a bit closer. Though reservations are certainly the focus here, notice that
they have also provided clear paths and (nice sized buttons) to get to other areas of the site.

28. GETGOCOOL.COM
Find a Retailer
OK, so any questions so far?
Great.
Let’s bring it closer to home and talk about a few things we might do to GetGoCool.com to
really take care of your awesome customers.
Based on our past conversations, we know that there are three main needs that our customers
have. hey want to find a retailer, (click) share information and (click) get answers to their
questions.

29. GETGOCOOL.COM
Find a Retailer Tell a Friend
OK, so any questions so far?
Great.
Let’s bring it closer to home and talk about a few things we might do to GetGoCool.com to
really take care of your awesome customers.
Based on our past conversations, we know that there are three main needs that our customers
have. hey want to find a retailer, (click) share information and (click) get answers to their
questions.

30. GETGOCOOL.COM
Find a Retailer Tell a Friend Answers
OK, so any questions so far?
Great.
Let’s bring it closer to home and talk about a few things we might do to GetGoCool.com to
really take care of your awesome customers.
Based on our past conversations, we know that there are three main needs that our customers
have. hey want to find a retailer, (click) share information and (click) get answers to their
questions.

31. GETGOCOOL.COM
Mobile Version
Now we’ll have to dive in more to figure out all of the different technologies that can help you
accomplish those things, however I do want wrap up by speaking about the value these
concepts would bring to your customers.
You and I have previously spoke of your core target demographic, Truckers. Now truckers are
very connected, but they’re not always on their laptops. They are however always on their
mobile devices, and a mobile version of GetGoCool would give them a quick and easy way to
access your site, which would let them know that you value their time and lifestyle.

32. QUESTIONS

33. REFERENCES
About Gartner. (n.d.). Gartner Inc.. Retrieved June 23, 2012, from http:// Flower Heart. (n.d.). DryIcons.com. Retrieved June 24, 2012, from http://
www.gartner.com/technology/about.jsp dryicons.com/free-graphics/preview/flower-heart/
Affiliate Resources . (n.d.). Internet Marketing. Retrieved June 24, 2012, from How to Optimize VPS . (n.d.). Best Cloud VPS Servers. Retrieved June 24, 2012,
http://practicelightinternet.com/affiliate-resources-cb1/ from http://www.host1plus.com/blog/how-to-optimize-vps-performance/
Arrow down. (n.d.). Icon Search Engine. Retrieved June 24, 2012, from http:// Hunter Green Screen Marketing. (n.d.). Hunter. Retrieved June 24, 2012, from
findicons.com/icon/184617/arrow_down http://www.huntergreenscreenmarketing.com/services.php
Brill, M. (2012, February 16). Tablets: key usage statistics . The Future of IDC. (2012, February 6). Smartphone Market. IDC Home. Retrieved June 23,
Mobile . Retrieved June 23, 2012, from http://txt4ever.wordpress.com/ 2012, from http://www.idc.com/getdoc.jsp?containerId=prUS23299912
2012/02/16/tablets-key-usage-statistics/ Institute, T. R., & company, t. b. (n.d.). Maryland Estate Plan. Hyatt & Weber,
Business Obj. vs. User Exp.. (n.d.). MatSays. Retrieved June 24, 2012, from P.A. Law Firm. Retrieved June 24, 2012, from http://
http://www.matsays.com/notes/business-objectives-vs-user-experience- hyattweberestateplanning.com
via-smashing-magazine/ Ma, S. (2011, March 21). 10 Ways Mobile Sites Are Different . UXmatters.
CityWest Church . (n.d.). CityWest Church . Retrieved June 24, 2012, from http:// Retrieved June 23, 2012, from http://www.uxmatters.com/mt/archives/
www.citywestchurch.com.au/rwt-blog-28513 2011/03/10-ways-mobile-sites-are-different-from-desktop-web-sites.php
Comfort Box Shears . (n.d.). BlueStoneGarden.com . Retrieved June 24, 2012,
from http://www.bluestonegarden.com/Comfort-Box-Shears-HSB.html
Compress 1GB Data . (n.d.). Shazan Zahid: My Web World. Retrieved June 24,
2012, from http://www.shazanzahid.com/2011/08/compress-1gb-
into-64kb.html