MWI Team Blog http://www.w3.org/blog/MWITeam en-EU hourly 1 2000-01-01T12:00+00:00 The Pythia casts mobileOK spells http://www.w3.org/blog/MWITeam/2009/11/18/mobileokpythia 2009-11-18T16:55:00Z Francois Daoust News Web authoring tools ease publication process. Simplicity comes with some loss of control over the generated content. There is hardly anything an authoring tool user may do to improve her content when the W3C mobileOK Checker reports that pop-up windows should not be used. So what?! I do not have any of these pop-up links in my content! The underlying theme can be updated, but this approach works up to a point when e.g. the post would best be split into multiple pages when delivered on mobile devices. Authoring tools that do not provide content adaptation mechanisms need to be extended to be able to serve mobile-friendly content to mobile devices. I have been working on an open-source suite of tools written in PHP lately, named mobileOK Pythia, designed to help generate mobileOK content and more generically speaking to help adapt content to fit the properties of the requesting device. Here is a short overview of the outcome of this work. More information (including crucial information about the choice of Pythia as a name ;)) can be found in the documentation of mobileOK Pythia. This work is part of the MobiWeb 2.0 project supported by the European Union's 7th Research Framework Programme (FP7). Plug-ins for WordPress and Joomla! From a user's point of view, the visual and hopefully useful outcome of this work is the creation of the mobileOK Pythia plug-ins for WordPress and Joomla! that make it possible to generate mobileOK content with these tools. The plug-ins feature: Device identification: based on WURFL, an open-source DDR published as an XML file, and accessed through a standard DDR Simple API interface. Content adaptation to fit the properties of the requesting device in terms of e.g. screen size, script support, page size limit. Theme switching: possibility to switch to a more mobile-friendly theme when the requesting device is identified as mobile. POWDER: a machine-readable mobileOK claim for the Web site can be automatically created and served using a POWDER document. The POWDER document is made discoverable through the addition of a Link HTTP header field as decribed in the POWDER Primer. W3C mobileOK Checker link: a link to the W3C mobileOK Checker is added next to the authoring input form to be able to assert the mobile-friendliness of the created content while it is being written. mobileOK theme: a mobileOK template may be installed with the plug-in. The development of a third plug-in for Moodle has started but it is still work in progress. There exist other plug-ins that provide similar functionality (see for instance WordPress Mobile Plugin, WordPress Mobile Pack, Mobilebot 1.0 or WAFL: Mobile Content Adaptation). mobileOK Pythia separates tool-specific functionalities from tool-agnostic libraries to ease porting to other tools. In particular, the plug-ins wrap the same extensible libraries: AskPythia to identify and retrieve the properties of the requesting device. TransPythia to adapt content based on the properties of the requesting device. AskPythia AskPythia is an open-source conforming implementation of the Device Description Repository Simple API in PHP. It is not a DDR but a wrapper to existing DDRs. AskPythia ships with an implementation on top of the WURFL database that maps WURFL capabilities to properties defined in the Device Description Repository Core Vocabulary standard. Support for other DDRs is welcome! Check AskPythia's documentation for more information. TransPythia TransPythia is a transcoding library that adapts content (HTML, CSS, images) based on the capabilities of the requesting device. The library ships with a set of transcoding actions that are particularly adapted to mobile devices and that may be extended as needed. Main transformations are: Images conversion and adaptation: adapts images to match the requesting device's list of supported image formats and to fit the screen size. Removes images that cannot be converted or that are still too big for mobile consumption after conversion. Pagination: a generic pagination algorithm that may be used to paginate HTML pages or HTML fragments when the requesting device is identified as a mobile device. Tables linearization: to remove nested tables and linearize tables when the requesting device does not support them. Check TransPythia's documentation for more information. Feedback If you would like to comment, contribute, report bugs or simply tell us what you think, you are very welcome! Feel free to send an email to the public-mobile-dev@w3.org mailing-list (with public archives). Web authoring tools ease publication process. Simplicity comes with some loss of control over the generated content. There is hardly anything an authoring tool user may do to improve her content when the W3C mobileOK Checker reports that pop-up windows should not be used. So what?! I do not have any of these pop-up links in my content!

The underlying theme can be updated, but this approach works up to a point when e.g. the post would best be split into multiple pages when delivered on mobile devices. Authoring tools that do not provide content adaptation mechanisms need to be extended to be able to serve mobile-friendly content to mobile devices.

I have been working on an open-source suite of tools written in PHP lately, named mobileOK Pythia, designed to help generate mobileOK content and more generically speaking to help adapt content to fit the properties of the requesting device. Here is a short overview of the outcome of this work. More information (including crucial information about the choice of Pythia as a name ;)) can be found in the documentation of mobileOK Pythia.

This work is part of the MobiWeb 2.0 project supported by the European Union's 7th Research Framework Programme (FP7).

Plug-ins for WordPress and Joomla!

WordPress and Joomla home pages with the mobileOK Pythia plug-in

From a user's point of view, the visual and hopefully useful outcome of this work is the creation of the mobileOK Pythia plug-ins for WordPress and Joomla! that make it possible to generate mobileOK content with these tools.

The plug-ins feature:

  • Device identification: based on WURFL, an open-source DDR published as an XML file, and accessed through a standard DDR Simple API interface.
  • Content adaptation to fit the properties of the requesting device in terms of e.g. screen size, script support, page size limit.
  • Theme switching: possibility to switch to a more mobile-friendly theme when the requesting device is identified as mobile.
  • POWDER: a machine-readable mobileOK claim for the Web site can be automatically created and served using a POWDER document. The POWDER document is made discoverable through the addition of a Link HTTP header field as decribed in the POWDER Primer.
  • W3C mobileOK Checker link: a link to the W3C mobileOK Checker is added next to the authoring input form to be able to assert the mobile-friendliness of the created content while it is being written.
  • mobileOK theme: a mobileOK template may be installed with the plug-in.

The development of a third plug-in for Moodle has started but it is still work in progress.

There exist other plug-ins that provide similar functionality (see for instance WordPress Mobile Plugin, WordPress Mobile Pack, Mobilebot 1.0 or WAFL: Mobile Content Adaptation). mobileOK Pythia separates tool-specific functionalities from tool-agnostic libraries to ease porting to other tools. In particular, the plug-ins wrap the same extensible libraries:

  • AskPythia to identify and retrieve the properties of the requesting device.
  • TransPythia to adapt content based on the properties of the requesting device.

AskPythia

AskPythia is an open-source conforming implementation of the Device Description Repository Simple API in PHP. It is not a DDR but a wrapper to existing DDRs.

AskPythia ships with an implementation on top of the WURFL database that maps WURFL capabilities to properties defined in the Device Description Repository Core Vocabulary standard. Support for other DDRs is welcome!

Check AskPythia's documentation for more information.

TransPythia

TransPythia is a transcoding library that adapts content (HTML, CSS, images) based on the capabilities of the requesting device. The library ships with a set of transcoding actions that are particularly adapted to mobile devices and that may be extended as needed.

Main transformations are:

  • Images conversion and adaptation: adapts images to match the requesting device's list of supported image formats and to fit the screen size. Removes images that cannot be converted or that are still too big for mobile consumption after conversion.
  • Pagination: a generic pagination algorithm that may be used to paginate HTML pages or HTML fragments when the requesting device is identified as a mobile device.
  • Tables linearization: to remove nested tables and linearize tables when the requesting device does not support them.

Check TransPythia's documentation for more information.

Feedback

If you would like to comment, contribute, report bugs or simply tell us what you think, you are very welcome! Feel free to send an email to the public-mobile-dev@w3.org mailing-list (with public archives).

]]> W3C Cheatsheet for developers http://www.w3.org/blog/MWITeam/2009/11/05/w3c_cheatsheet_for_developers 2009-11-05T22:00:46Z Dominique Hazael-Massieux Technical I’ve been working over the past few weeks on a nifty little tool that summarizes a number of W3C technologies, including the Mobile Web Best Practices, in a mobile-friendly format, called the W3C Cheatsheet. See my post in the W3C blog to learn more about it, and send your feedback! Screenshot of the W3C Cheatsheet on a phone

I’ve been working over the past few weeks on a nifty little tool that summarizes a number of W3C technologies, including the Mobile Web Best Practices, in a mobile-friendly format, called the W3C Cheatsheet.

See my post in the W3C blog to learn more about it, and send your feedback!

]]> Device APIs on the way http://www.w3.org/blog/MWITeam/2009/10/16/device_apis_on_the_way 2009-10-16T14:40:57Z Dominique Hazael-Massieux News Back in June, I noted that a new group that would work on Javascript APIs to access device features (such as a camera, an addressbook, a calendar, etc.) had been proposed for review to W3C Members. Since then, not only was the group approved and started, but we even got our first publication out: a Working Group note describing the expected requirements for these device APIs. Of course, that document may seem a bit abstract at a first glance: you'll see no API defined in there, nothing with which to play. But if you think Device APIs are a great opportunity for the Web platform (on mobile and elsewhere), I strongly encourage you to take a look at that document and check if the requirements highlighted there match what you know you'll need from these APIs - and if they don't, please let the Working Group know! Back in June, I noted that a new group that would work on Javascript APIs to access device features (such as a camera, an addressbook, a calendar, etc.) had been proposed for review to W3C Members.

Since then, not only was the group approved and started, but we even got our first publication out: a Working Group note describing the expected requirements for these device APIs.

Of course, that document may seem a bit abstract at a first glance: you'll see no API defined in there, nothing with which to play.

But if you think Device APIs are a great opportunity for the Web platform (on mobile and elsewhere), I strongly encourage you to take a look at that document and check if the requirements highlighted there match what you know you'll need from these APIs - and if they don't, please let the Working Group know!

]]> MWI on Twitter http://www.w3.org/blog/MWITeam/2009/09/04/mwi_on_twitter_1 2009-09-04T14:58:20Z Philipp Hoschka Current state As quite a few of you have already found out, info on MWI is available on twitter (and has been for a while; on an "experimental" basis). There are currently two MWI-related twitter channels: mobiweb: The main MWI channel. It distributes RSS feeds of MWI news as blog entries and shared bookmarks from the folks working on MWI at W3C. It also contains "sponatenous" tweets by MWI folks, e.g. live reporting from conferences relevant for MWI. pmobiweb: Distributes the RSS feed of the popular "Planet Mobile Web". Most importantly, it provides an archive of past entries (since the planet does not provide an archive of older entries). Hope this is useful, and if you want, follow us! As quite a few of you have already found out, info on MWI is available on twitter (and has been for a while; on an "experimental" basis).

There are currently two MWI-related twitter channels:

  • mobiweb: The main MWI channel. It distributes RSS feeds of MWI news as blog entries and shared bookmarks from the folks working on MWI at W3C. It also contains "sponatenous" tweets by MWI folks, e.g. live reporting from conferences relevant for MWI.
  • pmobiweb: Distributes the RSS feed of the popular "Planet Mobile Web". Most importantly, it provides an archive of past entries (since the planet does not provide an archive of older entries).
Hope this is useful, and if you want, follow us! ]]> A tool to "powder" mobileOK content http://www.w3.org/blog/MWITeam/2009/07/03/a_tool_to_powder_mobileok_content 2009-07-03T12:50:00Z Francois Daoust News Version 1.2 of the W3C mobileOK Checker, released on Tuesday, helps Web authors focus on the failures that most affect the mobile-friendliness of their content, and returns the POWDER document Web authors may use as the basis of a mobileOK® conformance claim. Expandable sections The reports returned by the mobileOK Checker can be long. That's not a bad thing, failure points need to be clarified. That said, scrolling over a long list of details is a tedious process and does not reveal the big picture. The new version adds unobtrusive (as in "works fine when Javascript is not enabled") Javascript to hide/show details. Details are hidden by default, simply click on a failure message to reveal its details! Severity levels A missing width attribute on an img element? That's a failure. Using frames? That's a failure. Obviously, the former case only slightly affects the mobile-friendliness of the page, while some mobile browsers won't even be able to render the page in the latter case. And yet both failures looked alike in the report, leaving the difficult task to evaluate the impact of a failure on the overall mobile-friendliness of the page to the reader. Each failure now comes with a severity level: critical: such failures typically prevent the rendering of at least part of the page on most mobile devices! Critical errors are highlighted using a yellow background. severe: while such failures usually do not prevent the rendering of the page, they strongly impact the user experience. medium: some mobile constraints are not appropriately taken into account, e.g. the browser needs to retrieve more data than actually needed to render the Web page. low: useful improvements are possible. Web authors who only have limited time available to fix failures may want to focus on the most severe failures first. The "Where to start..." section near the top of the report lists the top 3 failures to address right away. Sprinkle POWDER on your mobileOK content So your content is mobileOK? Congratulations! You may now wish to identify your content as mobileOK conformant. The Mobile Web Best Practices Working Group recently published the W3C mobileOK Scheme 1.0 note. It provides an overview of the mobileOK scheme and explains in particular how to claim mobileOK conformance. One way to make such a claim is to use POWDER. When the page is mobileOK, the mobileOK Checker now returns a POWDER document you may use to advertise that the page is mobileOK®. For instance, the mobileOK checker returns the following POWDER document when http://www.w3.org/Mobile/ is checked: <?xml version="1.0"?> <powder xmlns="http://www.w3.org/2007/05/powder#">  <attribution>   <issuedby src="http://www.w3.org/data#W3C" />   <issued>2009-07-03T08:37:21Z</issued>   <supportedby src="http://validator.w3.org/mobile/" />  </attribution>    <dr>   <iriset>    <includeresources>http://w3.org/Mobile/</includeresources>   </iriset>     <descriptorset>    <typeof src="http://www.w3.org/2008/06/mobileOK#Conformant" />    <displaytext>The page is mobileOK</displaytext>    <displayicon src="http://www.w3.org/2005/11/MWI-Icons/mobileOK.png" />   </descriptorset>  </dr> </powder> For more information on POWDER, please refer to the POWDER Primer. ... and more! A few other features compose this summer release, such as the size of each resource that composes the page, or the repartition of points lost per severity level. The complete change log is detailed in the What's new? page. Feedback welcome! Version 1.2 of the W3C mobileOK Checker, released on Tuesday, helps Web authors focus on the failures that most affect the mobile-friendliness of their content, and returns the POWDER document Web authors may use as the basis of a mobileOK® conformance claim.

Expandable sections

The reports returned by the mobileOK Checker can be long. That's not a bad thing, failure points need to be clarified. That said, scrolling over a long list of details is a tedious process and does not reveal the big picture. The new version adds unobtrusive (as in "works fine when Javascript is not enabled") Javascript to hide/show details. Details are hidden by default, simply click on a failure message to reveal its details!

Expandable sections to focus on what's important for you.

Severity levels

A missing width attribute on an img element? That's a failure. Using frames? That's a failure. Obviously, the former case only slightly affects the mobile-friendliness of the page, while some mobile browsers won't even be able to render the page in the latter case. And yet both failures looked alike in the report, leaving the difficult task to evaluate the impact of a failure on the overall mobile-friendliness of the page to the reader.

Failure messages are prefixed with their severity level

Each failure now comes with a severity level:

  • critical: such failures typically prevent the rendering of at least part of the page on most mobile devices! Critical errors are highlighted using a yellow background.
  • severe: while such failures usually do not prevent the rendering of the page, they strongly impact the user experience.
  • medium: some mobile constraints are not appropriately taken into account, e.g. the browser needs to retrieve more data than actually needed to render the Web page.
  • low: useful improvements are possible.

Web authors who only have limited time available to fix failures may want to focus on the most severe failures first. The "Where to start..." section near the top of the report lists the top 3 failures to address right away.

Sprinkle POWDER on your mobileOK content

So your content is mobileOK? Congratulations! You may now wish to identify your content as mobileOK conformant. The Mobile Web Best Practices Working Group recently published the W3C mobileOK Scheme 1.0 note. It provides an overview of the mobileOK scheme and explains in particular how to claim mobileOK conformance.

One way to make such a claim is to use POWDER. When the page is mobileOK, the mobileOK Checker now returns a POWDER document you may use to advertise that the page is mobileOK®. For instance, the mobileOK checker returns the following POWDER document when http://www.w3.org/Mobile/ is checked:

<?xml version="1.0"?>
<powder xmlns="http://www.w3.org/2007/05/powder#">
 <attribution>
  <issuedby src="http://www.w3.org/data#W3C" />
  <issued>2009-07-03T08:37:21Z</issued>
  <supportedby src="http://validator.w3.org/mobile/" />
 </attribution>
 
 <dr>
  <iriset>
   <includeresources>http://w3.org/Mobile/</includeresources>
  </iriset>
 
  <descriptorset>
   <typeof src="http://www.w3.org/2008/06/mobileOK#Conformant" />
   <displaytext>The page is mobileOK</displaytext>
   <displayicon src="http://www.w3.org/2005/11/MWI-Icons/mobileOK.png" />
  </descriptorset>
 </dr>
</powder>

For more information on POWDER, please refer to the POWDER Primer.

... and more!

A few other features compose this summer release, such as the size of each resource that composes the page, or the repartition of points lost per severity level. The complete change log is detailed in the What's new? page.

Feedback welcome!

]]>