The Web Compatibility Test for Mobile Browsers combines in a single page a number of Web technologies that we believe are the foundation for a better Web experience, especially on mobile devices.
Using a very visual scheme of a set of squares whose color depend on the proper implementation of a given technology, it helps assess at a glance where a given browser might be lacking to support this improved Web experience.
The test is available at:
http://www.w3.org/2008/06/mobile-test/http://xrl.us/bmqox
You can also check how the test has evolved through the CVS module view.
The squares are roughly sorted by order of difficulty: the first row tests "baseline" technologies, the second row corresponds to technologies that are already widely used today, and the third row tests for support of technologies that we believe will be important in the near future.
The following technologies are tested as of today:
Fluid page widths, defined in percent of the screen width, often depend on the min-width and max-width properties to avoid turning unreadable on small screens. The former property is tested here.
PNG, a bitmap image format, supports transparency and alpha channels, that are useful in building appealing visual effects
The HTTP protocol allows data to be sent gzip-compressed when the client advertises its capability to uncompress them (through the Accept-Encoding header), thus saving bandwidth.
HTTPSThe HTTPS protocol is used to establish secure and encrypted connections on the Web.
Tests if the UA supports HTTP cookies (through Javascript).
iframe inclusing of XHTML-served-as-XML contentTests if the UA supports XML content-types by loading an XHTML document with the content-type application/xhtml+xml.
XMLHTTPRequestXMLHTTPRequest is at the core of AJAX, allowing to update a subset of an HTML page without requesting a new full content transfer
SVG allows authors to define vector-based graphics, that can be scaled up and down, fitting well the needs of mobile devices. Serving it gzip-ed allows to reduce the data sent through the network.
CSS Media Queries allow authors to constrain CSS rules to specific contexts, for instance so that they only apply to screens of a given maximum width. The min-width feature is tested here.
This test checks support for loading and applying one of the popular JavaScript framework - in this case, JQuery. These frameworks are an increasingly important part of the Web experience.
SVG also supports animations, that can be used to create appealing interfaces
IRI (Internationalized Resource Identifiers) allows to write Web addresses with any character of any language and script in the world; IDNs (Internationalized Domain Names) ensures that the DNS resolution works also on non-ASCII domain names.
The Document Object Model allows Web developers to trigger and notice browser-based events (e.g. a mouse click); Mutation events are triggered when a piece of a Web page is modified (e.g. by a script); they are particularly interesting on devices with small screens, where the user might not notice that a change occurred in a non-visible part of the page.
canvas elementThe canvas element defined in HTML5 offers a Javascript graphics API
contenteditableThe contenteditable attribute makes rich text editing of any element possible. Support for this attribute is tested.
CSS3 introduces a number of new selectors, allowing more fine-grained styling, leading to better layouts. The nth-child() selector is tested here.
Copyright © 2008 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C liability, trademark, document use rules apply.