From WCAG 1.0 to MWBP: Making content that meets Web Content Accessibility Guidelines 1.0 also meet Mobile Web Best Practices

Introduction

Incomplete draft: This document is an in-progress Working Draft provided for review and feedback. It is incomplete and will likely have major changes. See also Status of this Document in the overview page.
Please send feedback to public-bpwg-comments@w3.org (with public archive).

This page is part of a multi-page document. Please refer to the “How to Use This Document” section for more information.

For those familiar with Web Content Accessibility Guidelines 1.0, this page describes what also needs to be done to meet Mobile Web Best Practices (MWBP). WCAG 2.0 was approved as a W3C Recommendation in December 2008 and W3C encourages organizations to focus on WCAG 2.0 instead of only WCAG 1.0.

Summary of work required to make content that meets WCAG 1.0 also meet MWBP

Compliance with WCAG 1.0 helps go some way towards achieving compliance with some of the MWBP. This section provides a summary of these BPs. There are two possible levels of effort required, labelled for simplicity with the keywords nothing, something and everything. To summarise, if your content already complies with WCAG 1.0, to achieve compliance with the MWBP, you need to do the following:

Note on inconsistent links: Links in the “something” and “nothing” sections point to within this page. Links in the “everything” section point to the Recommendation. REVIEW NOTE: Is this too confusing? Suggestions for better ways to do it?

Nothing: Content that complies with WCAG 1.0 already complies with this provision so no further effort is necessary. The list is provided for completeness. Links in this section point to the relevant Recommendation.

• AUTO_REFRESH, covered at priority 2 by 7.4 Until user agents provide the ability to stop auto-redirect, do not use markup to redirect pages automatically.
• CLARITY, covered at priority 3 by 13.8 Place distinguishing information at the beginning of headings, paragraphs.
• CONTROL_LABELLING, covered at priority 2 by 12.4 Associate labels explicitly with their controls.
• GRAPHICS_FOR_SPACING, covered at priority 2 by 3.1 When an appropriate markup language exists, use markup.
• LINK_TARGET_ID, covered at priority 2 by 13.1 Clearly identify the target of each link.
• MEASURES, covered at priority 2 by 3.4 Use relative rather than absolute units in markup language attribute values.
• NAVIGATION, covered at priority 2 by 13.4 Use navigation mechanisms in a consistent manner.
• NON-TEXT_ALTERNATIVES, covered at priority 1 by 1.1 Provide a text equivalent for every non-text element (e.g., via "alt", "longdesc", or in element content).
• OBJECTS_OR_SCRIPT, covered at priority 1 by 6.3 Ensure that pages are usable when scripts, applets, or other programmatic objects are turned off or not supported.
• POP_UPS, covered at priority 2 by 10.1 Until user agents allow users to turn off spawned windows, do not cause pop-ups or other windows to appear.
• PROVIDE_DEFAULTS, covered at priority 3 by 10.4 Until user agents handle empty controls correctly, include default, place-holding characters in edit boxes and text areas.
• REDIRECTION, covered at priority 2 by 7.5 Until user agents provide the ability to stop auto-redirect, do not use markup to redirect pages automatically. Instead, configure the server to perform redirects.
• STRUCTURE, covered at priority 2 by 3.5 Use header elements to convey document structure and use them according to specification.
• STYLE_SHEETS_SUPPORT, covered at priority 1 by 6.1 Organize documents so they may be read without style sheets. For example, when an HTML document is rendered without associated style sheets, it must still be possible to read the document.
• STYLE_SHEETS_USE, covered at priority 2 by 3.3 Use style sheets to control layout and presentation.
• TAB_ORDER, covered at priority 3 by 9.4 Create a logical tab order through links, form controls, and objects.
• USE_OF_COLOR, covered at priority 1 by 2.1 Ensure that all information conveyed with color is also available without color.
• VALID_MARKUP, covered at priority 2 by 3.2 Create documents that validate to published formal grammars.

Something: More effort of some kind is necessary to comply with the provision. What is required is explained in the following section. For each there is a list of the provisions that may provide some compliance or are in some way related. There is no direct correspondence between one provision and another. In some cases, it may be necessary to make an extra effort or to consider a more diverse range of user needs. In these cases, the word “possibly” is used. In other cases scope may be different, giving partial compliance. In these cases the word “partially” is used. BP links in this section point to the detail section below; checkpoint links links in this section point to the WCAG 1.0.

• ACCESS_KEYS, partially covered at priority 3 by 9.5 Provide keyboard shortcuts to important links.
• BACKGROUND_IMAGE_READABILITY, partially covered at priority 2 for images, priority 3 for text by 2.2 Ensure that foreground and background color combinations provide sufficient contrast…
• COLOR_CONTRAST, partially covered at partially covered at priority 2 for images, priority 3 for text by 2.2 Ensure that foreground and background color combinations provide sufficient contrast…
• CONTROL_POSITION, partially covered at priority 2 by 10.2 Until user agents support explicit associations between labels and form controls…
• FONTS, partially covered at priority 1 by 6.1 Organize documents so they may be read without style sheets… and partially at priority 2 by 11.2 Avoid deprecated features of W3C technologies.
• NAVBAR, partially covered at priority 3 by 13.5 Provide navigation bars to highlight and give access to the navigation mechanism.
• PAGE_SIZE_USABLE, partially covered at priority 2 by 12.3 Divide large blocks of information into more manageable groups where natural and appropriate.
• PAGE_TITLE, possibly covered at priority 2 by 13.2 Provide metadata to add semantic information to pages and sites.
• TABLES_ALTERNATIVES, possibly partially covered at priority 2 by 5.3 Do not use tables for layout unless the table makes sense when linearized.
• TABLES_LAYOUT, possibly covered at priority 2 by 5.3 Do not use tables for layout unless the table makes sense when linearized.,' in WCAG 1.0 document" href="http://www.w3.org/TR/WAI-WEBCONTENT/#tech-style-sheets">3.3 Use style sheets to control layout and presentation and 5.3 Do not use tables for layout unless the table makes sense when linearized.

Everything: For all other BPs, WCAG 1.0 does not ensure compliance and it will be necessary to do the work involved. These BPs are not related to any WCAG 1.0 checkpoints.

• BALANCE
• AVOID_FREE_TEXT
• ERROR_MESSAGES
• DEFAULT_INPUT_MODE
• SCROLLING
• TESTING
• THEMATIC_CONSISTENCY
• URIS
• MINIMIZE_KEYSTROKES
• NO_FRAMES
• TABLES_NESTED
• TABLES_SUPPORT
• CACHING
• CAPABILITIES
• CHARACTER_ENCODING_SUPPORT
• CHARACTER_ENCODING_USE
• CONTENT_FORMAT_PREFERRED
• CONTENT_FORMAT_SUPPORT
• COOKIES
• DEFICIENCIES
• EXTERNAL_RESOURCES
• IMAGES_RESIZING
• LARGE_GRAPHICS
• LIMITED
• MINIMIZE
• PAGE_SIZE_LIMIT
• SUITABLE

Addressing Mobile Web Best Practices

This section lists each of the MWBPs that are related to WCAG 1.0 checkpoints, which are listed under “something” above. For each BP, the section title is that of the BP. This is followed by a list of the checkpoints that can help meet it.

[ACCESS_KEYS] Assign access keys to links in navigational menus and frequently accessed functionality

Back to Best Practices list.

[BACKGROUND_IMAGE_READABILITY] When using background images make sure that content remains readable on the device

Back to Best Practices list.

[COLOR_CONTRAST] Ensure that foreground and background color combinations provide sufficient contrast

Back to Best Practices list.

[CONTROL_POSITION] Position labels so they lay out properly in relation to the form controls they refer to

Back to Best Practices list.

[FONTS] Do not rely on support of font related styling

Back to Best Practices list.

[NAVBAR] Provide only minimal navigation at the top of the page

Back to Best Practices list.

[PAGE_SIZE_USABLE] Divide pages into usable but limited size portions

Back to Best Practices list.

[PAGE_TITLE] Provide a short but descriptive page title

Back to Best Practices list.

[TABLES_ALTERNATIVES] Where possible, use an alternative to tabular presentation

Back to Best Practices list.

[TABLES_LAYOUT] Do not use tables for layout

Back to Best Practices list.