The emergence of mobile as the dominant platform for the online activity of all kinds means that it’s more important than ever to pay special attention to it. This shift in user habit underlines a change in how people consume content, in general, what appeals to them, and how they engage with it. In order to reflect this, and cater for your audience’s wants and desires, it’s necessary to carefully consider how your online content is presented on mobile. This will involve both technical and creative elements in equal measure, and there are many aspects you may want to consider – here we deal with the importance of good user experience, and the best way to achieve it.
As previously mentioned, users consume content on mobile devices in a completely different way to on a desktop. For instance, often they will be on the move, have little time or are multi-tasking, and, of course, they will be reading on a much smaller screen. In short, they’re looking for convenience and clarity of information. Therefore, in order to present truly mobile-friendly content, the user experience must be at the forefront of your approach.
- Snappy headers. With a smaller screen, space is at a premium. Don’t waste it with long titles – cut unnecessary filler words, and keep them sharp and to the point. This serves the double purpose of stoking people’s interest as well as saving valuable screen space.
- Keep scrolling. Scrolling down to read further feels more natural and is far less labor intensive than loading a new page. If your content really must be paginated, make it as easy as possible by allowing swiping, or at least an easily accessible link to the next page.
- Direct style. As with titles and headers, any written content should keep short attention spans firmly in mind.
- Multimedia. While videos, audio and .gif images are great ways of engaging users, they should be optional to avoid punishing smaller data allowances.
- Compress images. Keep your file sizes down to a minimum to cut back on page loading time, and be careful to specify sizing dimensions that are appropriate for mobile displays.
Mobile site or Responsive Design?
In terms of the layout of your site, there a two main options to deliver content in a mobile friendly way: a separate mobile site (e.g. ‘m.website.com’), or a responsive web design. Both methods can help achieve the aforementioned user experience goals, but the latter is more effective than the latter.
While m.sites were popular in the past, there are now plenty of good reasons to ditch them. For a start, it’s much harder to maintain two separate sites, often with the same content – you can’t possibly dedicate the same level of attention to both. Although web space is becoming increasingly easier to manage, with hosting packages from established companies like 1&1, the more you can focus your efforts, the better. Furthermore, an m.site necessitates a redirect from your main site, which is fundamentally bad for SEO, and will damage your ranking in Google.
Responsive design avoids these issues by allowing you to apply different CSS rules to the same core HTML code, depending on the device being used. By using the meta name=”viewport” tag, you can tell browsers how to adjust the dimensions of your content so that scaled more appropriately. The key advantage here is its fluidity compared to an m.site – there’s no need for redesigning the entire page for essentially the same content, and the transition from desktop to mobile is seamless for the user.
What’s more, you retain the use of a single URL, which vastly simplifies cross-platform sharing and the ability for bots to crawl your site. Due to these advantages, the unified approach of responsive web design is the way forward for mobile user experience.