Servage Magazine

Information about YOUR hosting company – where we give you a clear picture of what we think and do!

Optimize the mobile experience

Monday, December 1st, 2014 by Servage

mobileMobile devices are fundamentally different from their larger counterparts. Users with mobile devices often have a totally different environment, expectation and cause for a given visit to your site, when compared to desktop users. This post will explain why you might benefit from doing a little more than just adding responsive CSS to your site, when you optimize an existing desktop version for mobile users.

What are mobile devices?

The IT world classified consumer devices into desktop/stationary and mobile devices for a while, but understanding the different needs of different users requires to look a bit more at the device types, and maybe a differentiation in larger, medium and small devices would be more suitable. We have this in a way already, when talking about computer, tablet and phone – so let us go with that for now.

Computers are devices like desktops and laptops with a medium to large screen size and good input tools like keyboard and mouse, so much information can be displayed at once, and inputs can be made rapidly.

Tablets are devices with small to medium screen sizes with good touch interfaces for rapid “taps” and other touch gestures. However, non-gestures such as text input via a virtual keyboard is inefficient, compared to the regular keyboard found on computers.

Phones are devices with small screen sizes, and basically the same input capabilities as tablets.

Consider the use-case when designing

Imagine your starting point is an event site where users can get an overview of various events, order tickets, manage their reservations and get in touch with the venues. Furthermore there is lots of advertising for upcoming shows, and lots of other information about the event company, venues etc. Classic mobile design principles would dictate that the exact same information is being transformed into a mobile-friendly interface, for example using responsive CSS. However, that is probably not really the most efficient result for the user when also considering the use-case for users across different devices.

Phone users are likely to be on the move and maybe even in a hurry. If a browser from a phone is detected on your site, chances are the user wants to quickly make an order or manage a reservation. Having tons of menu items and advertising in the exact same prioritization as the computer or tablet version may prevent the user from achieving the intended goal swiftly. Thereby your site causes frustration for the user, which is the exact opposite feeling you wish to stimulate with your mobile version.

Carefully consider which reasons users with different device-types are more or less likely to have, and promote such actions better on devices with limited screen space available. Also remember to make all input elements device-friendly. That means avoiding text-input as much as possible on tablet and phones, using large buttons that are easy to tap, etc.

Make your site available offline

The plentitude of affordable devices available to users nowadays makes people use computers, tablets and phones anytime and anywhere. You see it on the bus, in the train, in cafes, outside in the open, everywhere. However, connectivity is not always guaranteed. Mobile users are likely to jump in and out of network coverage, thus alternating between having internet connection and slow/no connection. Users may also open up your site or app while not even being online. Either way users would prefer that limited functionality is still available, instead of getting errors  about the missing connection.

Lots of static information can actually easily be made available offline, and HTML5 has Manifest and Local Storage to start dealing with some of those issues. Obviously you could never make a site completely available offline if backend data exchange is needed. However, you could at least make the user experience smoother in those cases. Thereby you switch frustration by your users to pleasant understanding of the situation.

References & more reading

Optimize the mobile experience, 5.0 out of 5 based on 2 ratings
Categories: Business, Guides & Tutorials

Keywords: ,

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

No comments yet (leave a comment)

You are welcome to initiate a conversation about this blog entry.

Leave a comment

You must be logged in to post a comment.