4. Consumers Love Their Smart Phones
• 33% of smart phone users
use their smart phone while
watching TV
• 22% use them while reading
the newspaper
• One in three smart phone
users would give up
chocolate just to keep using
their phones
• 95% of smart phone users
will use their phone to search
for local information
5. How has mobile usage impacted web design?
1. Smaller Screen Size
6. How has mobile usage impacted web design?
2. Optimized for finger tips
7. How has mobile usage impacted web design?
3. Faster Load Times
8. How has mobile usage impacted web design?
4. Simpler Interface and Design
9. How has mobile usage impacted web design?
5. Device Support Concerns
10. Current Technologies to Make Websites Mobile Accessible
Responsive Web Design
Mobile Version Desktop Version
14. Suggestions for glit.edu
• Redesign website using Jquery,
making dedicated to mobile
devices
• Remove the Flash image slider and
buttons. Replace with a static
image.
• Simplify navigation and make it
vertically orientated
• Rework text so that it is displayed
in one column.
15. References
Mobile Mania – The Growing Importance of Mobile Website Optimization
(2011), Kissmetrics.com - http://blog.kissmetrics.com/mobile-mania/
Rigley, Joshua (2012) - Businesses need a mobile website to compete,
Standard.net - http://www.standard.net/stories/2012/01/20/businesses-need-
mobile-website-compete
Marqui.com (2012) – Top Mobile Website Design Trends for 2012
http://www.marqui.com/blog/top-mobile-website-design-trends-for-2011.aspx
Ma, Shanshan (2011) – 10 Ways Mobile Sites Are Different from Desktop Web
Sites, Uxmatters.comhttp://www.uxmatters.com/mt/archives/2011/03/10-ways-
mobile-sites-are-different-from-desktop-web-sites.php
Notas do Editor
Smartphones, Tablets, and other mobile devices are widely used throughout the world. The number of users is steadily growing. Mobile internet use has grown along with the adoption of the mobile devices. From 2009 to August of 2011, mobile Internet browsing has sky rocketed by %1000.
Mobile internet usage has been so robust over the past couple of years, by the year 2014 people accessing the Internet by a mobile device will eclipse the number of users accessing the Internet through a stationary or desktop device.
Mobile internet usage has been so robust over the past couple of years, soon the number of people accessing the Internet by a mobile device will eclipse the number of users accessing the Internet through a stationary or desktop device.
Mobile internet usage has dramatically changed the way people look at web design. There are many considerations when planning for the mobile web. The most obvious being the smaller screen size. Graphics and layout must be altered to accommodate smaller screen sizes and portrait / landscape orientations.
Most mobile devices are interacted with touch screens. Therefore mobile website navigation and buttons must be large enough so that people have an easy time touching the screens with their finger tips.
Mobile devices have slower processors and often times slower Internet connections. Mobile web content must be optimized for these hardware limitations so that they load in an acceptable time frame.
A simpler interface and design are necessary to limit scrolling, zooming and panning.
Not all mobile devices support all technologies. For example the iPhone does not support Flash content. This must be taken into consideration when developing a mobile website.
There are many ways to make websites accessible by mobile devices. Responsive designs use CSS to take desktop designs and modify them so they display appropriately on mobile devices. There are other web frameworks that can aid you in accomplishing this like Foundation.
Dedicated mobile web designs are completely new and different designs than desktop counter parts. Dedicated mobile websites are hosted in a different location than desktop websites and are essentially completely different websites. There are many frameworks that can aid in this type of development such as Sencha Touch and Jquery Mobile.
These websites don’t work well when using a mobile device for a few reasons. First they are not optimized for the smaller screen. Text is much too small to read so a user would have to zoom and pan to read. The navigation is also too small and would be difficult to interact with fingertips. Both websites use Flash which iPhone does not support. There is far too much content on one page for a mobile phone to display easily.
These websites do work well when using a mobile device for a few reasons. The designs are optimized well for the screen size. Users only need to scroll up or down to view content. Buttons are large enough to read and big enough for someone to easily tap with finger tips. No Flash was used so all content displays correctly on the iPhone. Vertical navigation and simple layout was used to make navigating and reading content easy to do.
The Great Lakes Institute of Technology website, while nicely designed now, needs to be simplified to display properly via mobile devices. I suggest designing another website to be dedicated to mobile devices only and use the Jquery Mobile framework. Jquery Mobile scales nicely to all screen sizes. The current site uses a Flash image slider and a couple of animated buttons. I suggest removing the slider and replacing it with a static image or a slider that uses Javascript. The navigation is horizontally orientated and contains dropdown menus. I would suggest simplifying the navigation and making it vertically oriented. Currently the text is displayed in two columns. I would suggest reworking the text so that it displays in one column.
