shawn terry - mobile presentation

10
S Mobile vs. Desktop Browsing Shawn terry

Upload: shawn-terry

Post on 19-Jun-2015

298 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: Shawn Terry - Mobile Presentation

S

Mobile vs. Desktop Browsing

Shawn terry

Page 2: Shawn Terry - Mobile Presentation

Why move to mobile?

Mobile browser use rises every year

Smartphones and tablets are on the rise

New technology loads sites faster

HTML5 makes fast, compatible apps possible anywhere

Page 3: Shawn Terry - Mobile Presentation

Smartphones on the RiseThe forecast from previous years shows smartphone users will almost double between now and 2016.2010

2011

2012

2013

2014

62.6

93.1

115.8

137.5

157.7

Users in Millions

*Statista, Number of smartphone users in the U.S. from 2010 to 2016 (in millions), Retrieved July 29, 2012, http://www.statista.com/statistics/201182/forecast-of-smartphone-users-in-the-us/

Page 4: Shawn Terry - Mobile Presentation

Mobile BrowsingWith bigger smartphone sales come the drive to build for developers to build for compatibility.

Mobile vs. Desktop browser use has gone from 2.29% in 2010 to 9.27% in 2012.

*StatCounter, Global Stats, Retrieved July 29, 2012, http://gs.statcounter.com/#mobile_vs_desktop-US-monthly-201001-201206

Page 5: Shawn Terry - Mobile Presentation

Loading Sites Faster

Several technologies help load sites faster.

Use compression, simplify and rely on newer languages.

The following technologies run most newer cross-compatible sites.

CSS3 HTML5 JavaScript

Page 6: Shawn Terry - Mobile Presentation

Using HTML5 and JavaScript

Non-Responsive

Site will not resize or scale images to window size.

All menus and items stay the same and force users to scroll left or right.

If building for mobile, users must build a whole version for mobile and use the agent to chose the site style.

Responsive

All content stays the same but resizes or moves based on available screen real estate.

Items convert to conserve space (ie, a navigation bar may convert to a drop down menu if the entire nav system cannot fit on the screen).

No need to build a dedicated version for mobile devices or use agent selector.

Responsive Design

Page 7: Shawn Terry - Mobile Presentation

Landscape Portrait

Using HTML5 and JavaScriptResponsive Design: Comparison: Non-

Responsive

Using iPad 2, Google Chrome Browser with current client Kerr Pumps’ web site.

The iPad’s option is to scale the entire page to ensure the width of the site fits inside the boundaries of the screen, by default.

Page 8: Shawn Terry - Mobile Presentation

Landscape Portrait

Using HTML5 and JavaScript

Responsive Design: Comparison: Responsive

Using iPad 2, Google Chrome Browser with current client Kerr Pumps’ web site.You may test this in your devices at http://www.informationoutput.com/~kerrpump/Try opening it in a browser on your desktop, then slowly resizing the width of the browser to see the changes!

With responsive design, in portrait mode the search bar is gone and the modules at the left move to the bottom below the article. Images also scale down automatically.

Page 9: Shawn Terry - Mobile Presentation

What to do about it?

Create a mobile version of your current site. This option will most likely need to use user agents to find

out if they are using a mobile device. While cheaper, it become more time consuming to

maintain.

Redesign with responsive design in mind. All content will be designed to work with any screen size

automatically. Will save time in the future in content editing. Gives users a far more seamless experience between

mobile and desktop.

Two Main Options

Page 10: Shawn Terry - Mobile Presentation

Conclusion

Device sales are increasing and so is mobile browser usage.

61% of customers that find a mobile site unfriendly are likely to go to a competitor’s site.

In 2011, smartphone adoption grew by 99% in 6-person homes, 98% with people making less than $25k, and 92% with retirees.

Your company literally cannot afford to not have a mobile device version of your site.

snaphop., Mobile Marketing Statistics 2012, Retrieved on June 29, 2012, http://snaphop.com/2012-mobile-marketing-statistics/