shawn terry - mobile presentation
TRANSCRIPT
S
Mobile vs. Desktop Browsing
Shawn terry
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
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/
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
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
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
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.
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.
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
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/