Source: W3C

I had listed some points from the W3C’s mobile web best design practice guidelines in a previous post. I will start with the ones not touched upon and append the other points towards the end (which will make up the full list):

Be cautious of device limitations: These relate to cookies (may not be available), using embedded objects or script, tables (may not support them and where possible use an alternative), style sheets (documents should be read even without style sheets), fonts (do not rely on support of font related styling) and colours (information conveyed with colour should also be available without it).

Optimize navigation: Simple navigation and typing become critical when using a small screen and keyboard, and limited bandwidth.

Check graphics & colors: Images, colors, and style brighten content, but require care: devices may have low-contrast screens or may not support some formats.

Keep it small: Smaller sites make users happier by costing less in time and money.

Use the network sparingly: Web protocol features can help improve the user experience by reducing the impact of network bottlenecks and latencies.

Help & guide user input: Keyboards and other input methods on mobile devices can be tedious to use, so effective designs minimize the need for them.

Think of users on the go: Web users on the go want compact information when time is short and distractions many.

And to recall the other points:

Design for ‘One Web’: Content designed with diverse devices in mind reduces cost, increases flexibility, and reaches the needs of more people.

Rely on Web standards: In the highly fragmented market of devices and browsers, standards are the best guarantee for interoperability.

Stay away from known hazards: Thoughtful design can help reduce usability problems due to small screens and keyboards, and other features of mobile devices. Hazards! May sound familiar, some of these: they include pop ups, using tables for layout and nested tables, using graphics for spacing and using frames and image maps.

Be cautious of device limitations: When choosing to use a particular Web technology, consider that mobile devices vary greatly in capability.

Small screen devices might well point the way to efficient and improved design for news sites. Small devices force designers to become disciplined, gets them to cut out the inessentials from their design and makes it as easy as possible for users to access site content. This approach might work wonders for regular sites too! What do you think?


Download link for the flipcards: The W3C download page; in PDF format.