bettysanders net

Created with WordPress

community inspections
Wedding photography
Nixon Contact Us

Top 10 Strategies for Mobile Web Implementation

October 29th, 2012 2 comments by Jonathan Meersman

My name is Jonathan Meersman and I teach a variety of web design/development, mobile development, eBusiness, and interactive media courses at Milwaukee Area Technical College. Yesterday, students in my Mobile Web Development class at MATC worked collaboratively to develop a top 10 list of strategies for mobile web implementation. This group included the following students: Kou Cha, Mirabelle Doiron, Greg Johnson, Leah Lueck, Staci Meissner, Betty Sanders, Mike Schroeder, Liz Tveten, and John Williams.

Top 10 Strategies for Mobile Web Implementation

DEVELOP A PROJECT PLAN – Start with a project plan to identify your target audience, mission, site structure, business objectives, and to identify software and hardware resources needed to develop the project.

MINIMIZE LOAD TIME – Keep file sizes (and thus load times) small by recompressing multiple versions of images according to device and resolution specifics. Then use CSS media queries to ensure a responsive design that delivers (or hides) only the appropriate sized images to the appropriate devices based on the device resolution.

ENSURE BACKWARD COMPATIBILITY – Consider developing sites that are backward compatible to earlier versions of mobile operating systems. This would be especially true with Android devices, since there is such a wide range of versions being used at any given time. Most iOS users tend to update to the latest available version, when possible. Also utilize current technologies that are widely supported across operating systems to ensure that the mobile web site runs on all devices and versions of operating systems. Thoroughly test on all possible devices.

PROVIDE FULL VERSION OPTION – Always provide mobile-friendly web site visitors with the option to view the full desktop version. With the rapid deployment of mobile devices and increased resolution options, some users might prefer to view the full desktop version of a site instead of the more mobile-friendly version. This might happen if they are familiar with the desktop version of the site and are looking for specific information.

DESIGN A CLEAN INTERFACE – Be sure to keep the design clean by using a simple, non-decorative, readable font that remains consistent throughout the mobile-friendly web site. Avoid extra clutter that would quickly fill the small screen of a SmartPhone.

BE CONSISTENT WITH BRANDING – Keep the branding consistent between desktop and mobile versions of your web site. You should use the same colors and logos to make sure the message remains the same using different delivery platforms.

AVOID FAT FINGER SYNDROME (FSS) – Consider using buttons instead of traditional inline text links and avoid using rollover images or dropdown menus in your navigation. Traditional navigational elements are not as user friendly when users can’t touch them with their fingers (not just fat fingers) without accidentally touching the wrong option. Try using large buttons, icons, or even collapsible or accordion blocks for managing navigation.

REMEMBER THAT NOT ALL CONTENT IS EQUAL – A typical visitor to a mobile web site is only interested in a information that they can access quickly and easily, usually related to a quick task. They don’t necessarily want all of the information that would appear in the traditional desktop version of the site (for those who do, see #4 above). The mobile-friendly versions should be just that – easy to use on a mobile device – not just a tiny version of the desktop web site requiring the visitor to pinch and zoom on their mobile device, and forcing them to sift through a lot of information that might be appropriate on the desktop web site.

PROVIDE OFFLINE CONTENT – Consider using a site manifest and a .manifest file to allow for offline viewing of content on a mobile site. This is helpful for those who have a spotty data connection that comes and goes, such as travelling on a subway.

CONDUCT USABILITY TESTING – Always conduct usability testing to ensure that consumer groups are getting the information that they want in a manner in which they can easily access.

In class, we have been testing our projects on iPhones, iPod Touches, iPads, Samsung Galaxy Tablets (Android), and my own personal Samsung Galaxy S III running Android’s Ice Cream Sandwich, on the U.S. Cellular network. Here’s my plug: I am a happy U.S. Cellular customer crew member. Contact me if you are interested in switching, as I may be able to help you get a good deal (and get a few extra Belief Points for me).

Ref: http://jonathanmeersman.com/



Go Daddy Deal of the Week: Get 15% off your order! Offer expires 6/5/12

Check my Web Page for updates often.            Let me fix your Computer Pain           Do you need a Web Site?      Does your computer drive you batty?     


top of page