2. Why move to mobile?
S Mobile browser use rises every year
S Smartphones and tablets are on the rise
S New technology loads sites faster
S HTML5 makes fast, compatible apps possible
anywhere
3. 2014 157.7 Smartphones
2013 137.5 on the Rise
2012 115.8 The forecast from previous
2011 93.1 years shows smartphone
users will almost double
2010 62.6 between now and 2016.
0
100
200
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/
4. Mobile
Browsing
With 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
5. Loading Sites Faster
S Several technologies help load sites faster.
S Use compression, simplify and rely on newer languages.
S The following technologies run most newer cross-compatible
sites.
S CSS3
S HTML5
S JavaScript
6. Using HTML5 and JavaScript
Responsive Design
Non-Responsive Responsive
S Site will not resize or scale S All content stays the same but
images to window size. resizes or moves based on
available screen real estate.
S All menus and items stay the S Items convert to conserve
same and force users to space (ie, a navigation bar
scroll left or right. may convert to a drop down
menu if the entire nav system
S If building for mobile, users cannot fit on the screen).
must build a whole version
for mobile and use the agent S No need to build a dedicated
version for mobile devices or
to chose the site style. use agent selector.
7. Using HTML5 and JavaScript
Responsive Design: Comparison: Non-Responsive
Landscape Portrait
S 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.
Using iPad 2, Google Chrome Browser with current client Kerr Pumps’ web site.
8. Using HTML5 and JavaScript
Responsive Design: Comparison: Responsive
Landscape Portrait
S 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.
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!
9. What to do about it?
Two Main Options
S Create a mobile version of your current site.
S This option will most likely need to use user agents to find out
if they are using a mobile device.
S While cheaper, it become more time consuming to maintain.
S Redesign with responsive design in mind.
S All content will be designed to work with any screen size
automatically.
S Will save time in the future in content editing.
S Gives users a far more seamless experience between mobile
and desktop.
10. Conclusion
S Device sales are increasing and so is mobile browser usage.
S 61% of customers that find a mobile site unfriendly are likely to
go to a competitor’s site.
S In 2011, smartphone adoption grew by 99% in 6-person
homes, 98% with people making less than $25k, and 92% with
retirees.
S 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/
Hinweis der Redaktion
There are a lot of reasons that your web site should have a mobile version. We will start by looking at the statistics with the growth of mobile browser use, the rise of smartphone and tablet usage, how technology makes web site load faster on mobile browsers and finally using HTML5 to do something new on the scene.
With new, faster technologies like 4G and processors in phones/tablets, the devices are quicker and far more accessible than a desktop or laptop. This means that as prices come down more users will be able to afford devices that are still compatible with today’s web standards.
Because mobile devices are becoming more common users are far more likely to open the browsers that are already available on their device or install the browser of their choice. Users are not locked to
Using compression, we can force scripts to download faster then let the browser take over to decompress and run. Then using CSS images are needed less and less to give web sites a style can be around 50k instead of several hundred. And finally, utilizing the additions in HTML5 videos and application functionality are no longer limited to specific browsers. Right now, most Blackboard users are still limited to using Internet Explorer because the system was put together without the foresight of user choices increasing.
Thanks to the tools available to us we no longer need to build web sites just for specific mobile devices or browsers sizes, including screen sizes on desktops. We can now tell the page where to move items should the screen be too constricting. It might be as simple and just removing the search bar because it hangs off to the right or as deep as replacing the entire navigation menu with a single drop down list should you be on something as small as an iPhone or Android.
Because the web site does not know what to do with the content that expands outside the boundaries, the browser will simply scale the entire site to make it fit. If the web site is extremely wide, the content may not be readable at all in portait mode forcing the user to zoom in.
The browser now knows that if the screen real estate falls below the width of the content on the site it should rearrange and modify it so that the visibility is not compromised.
Yes, the current site may be converted but because of the requirements and new standards of design it is not cost efficient to do so. It will be more time consuming and consistency will be lost.
With the massive increase and continuing trend of users on mobile devices, your web site will most likely be found online than desktop browsers and if the experience is less than desirable you will lose potential and possibly even current customers to a competitor with a web site that works on their device.We have the ability to create this for you in a way that your staff can maintain without extensive training or knowledge of how it works.
