Mobile Web Best Practices
Yesterday the W3C released a Candidate Recommendation document called “Mobile Web Best Practices 1.0“. With this document W3C is offering a set of guidelines to help web developers deliver a better user experience to mobile users.
The deadline for providing feedback to W3C is the 27th of August 2006 and all developers are encouraged to try it out.
At the core of the recommendation are 60 statements that every web developer should follow:
- Thematic Consistency
Ensure that content provided by accessing a URI yields a thematically coherent experience when accessed from different devices.- Capabilities
Exploit device capabilities to provide an enhanced user experience.- Deficiencies
Take reasonable steps to work around deficient implementations.- Testing
Carry out testing on actual devices as well as emulators.- URIs
Keep the URIs of site entry points short.- Navbar
Provide only minimal navigation at the top of the page.- Balance
Take into account the trade-off between having too many links on a page and asking the user to follow too many links to reach what they are looking for.- Navigation
Provide consistent navigation mechanisms.- Access Keys
Assign access keys to links in navigational menus and frequently accessed functionality.- Link Target Id
Clearly identify the target of each link.- Link Target Format
Note the target file’s format unless you know the device supports it.- Image Maps
Do not use image maps unless you know the device supports them effectively.- Pop Ups
Do not cause pop-ups or other windows to appear and do not change the current window without informing the user.- Auto Refresh
Do not create periodically auto-refreshing pages, unless you have informed the user and provided a means of stopping it.- Redirection
Do not use markup to redirect pages automatically. Instead, configure the server to perform redirects by means of HTTP 3xx codes.- External Resources
Keep the number of externally linked resources to a minimum.- Suitable
Ensure that content is suitable for use in a mobile context.- Clarity
Use clear and simple language.- Limited
Limit content to what the user has requested.- Page Size Usable
Divide pages into usable but limited size portions.- Page Size Limit
Ensure that the overall size of page is appropriate to the memory limitations of the device.- Scrolling
Limit scrolling to one direction, unless secondary scrolling cannot be avoided.- Central Meaning
Ensure that material that is central to the meaning of the page precedes material that is not.- Graphics For Spacing
Do not use graphics for spacing.- Large Graphics
Do not use images that cannot be rendered by the device. Avoid large or high resolution images except where critical information would otherwise be lost.- Use of Color
Ensure that information conveyed with color is also available without color.- Color Contrast
Ensure that foreground and background color combinations provide sufficient contrast.- Background Image Readability
When using background images make sure that content remains readable on the device.- Page Title
Provide a short but descriptive page title.- No Frames
Do not use frames.- Structure
Use features of the markup language to indicate logical document structure.- Tables Support
Do not use tables unless the device is known to support them.- Tables Nested
Do not use nested tables.- Tables Layout
Do not use tables for layout.- Tables Alternatives
Where possible, use an alternative to tabular presentation.- Non-Text Alternatives
Provide a text equivalent for every non-text element.- Objects or Script
Do not rely on embedded objects or script.- Images Specify Size
Specify the size of images in markup, if they have an intrinsic size.- Images Resizing
Resize images at the server, if they have an intrinsic size.- Valid Markup
Create documents that validate to published formal grammars.- Measures
Do not use pixel measures and do not use absolute units in markup language attribute values and style sheet property values.- Style Sheets Use
Use style sheets to control layout and presentation, unless the device is known not to support them.- Style Sheets Support
Organize documents so that if necessary they may be read without style sheets.- Style Sheets Size
Keep style sheets small.- Minimize
Use terse, efficient markup.- Content Format Support
Send content in a format that is known to be supported by the device.- Content Format Preferred
Where possible, send content in a preferred format.- Character Encoding Support
Ensure that content is encoded using a character encoding that is known to be supported by the device.- Character Encoding Use
Indicate in the response the character encoding being used.- Error Messages
Provide informative error messages and a means of navigating away from an error message back to useful information.- Cookies
Do not rely on cookies being available.- Caching
Provide caching information in HTTP responses.- Fonts
Do not rely on support of font related styling.- Minimize Keystrokes
Keep the number of keystrokes to a minimum.- Avoid Free Text
Avoid free text entry where possible.- Provide Defaults
Provide pre-selected default values where possible.- Default Input Mode
Specify a default text entry mode, language and/or input format, if the device is known to support it.- Tab Order
Create a logical order through links, form controls and objects.- Control Labelling
Label all form controls appropriately and explicitly associate labels with form controls.- Control Position
Position labels so they lay out properly in relation to the form controls they refer to.
Technorati Tags: w3c, accessibility, user experience, usability, web standards, mobile, guidelines, web development, programming
June 28th, 2006 at 11:28 (GMT-1)
Interesting, and when I relate these to “normal” web pages, it’s surprisingly similar.