Mobile Web Best Practices Working Group News

The home page of the Mobile Web Best Practices Working Group (BPWG), and (to some extent) the pages of the BPWG Web site just went through a little redesign.

The truth is we haven't been very good at applying our own recommendations so far. This very blog was slightly mobile friendly but just slightly. It was not mobileOK anyway. There was also a huge difference between BPWG's Web site and that of its Dear Mother, the Mobile Web Initiative (MWI).

A couple of weeks ago, the MWI Web site was updated with a new mobile-friendly design, so I thought it was just about time we "got back to Mom" and do the same thing with BPWG's Web site!

Sure enough, the result could be improved on some of the pages, and a few updates are subjective and may not be regarded by some as improvements at all, but the important point is that most of the Best Practices were taken into account to build the new Web site, including:

• [NAVIGATION] Provide consistent navigation mechanisms — the side bar yields the same experience throughout the now-merged MWI/BPWG Web site
• [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 — while the group's logistics home page had to be splitted into different pages for size reasons, there are only two levels in the BPWG Web site
• [NAVBAR] Provide only minimal navigation at the top of the page — the side bar appears at the end of the page in a vertical layout. Using CSS techniques, it is moved to the left on regular desktop browsers and a Site navigation shortcut should appear on top of the page on most mobile devices.
• [CENTRAL_MEANING] Ensure that material that is central to the meaning of the page precedes material that is not — more focused pages actually result in pages that are easier to read, so that's mobile-friendly and more generally speaking human-friendly!
• All of the Best Practices that are part of mobileOK — testing the pages with the mobileOK Checker displays a friendly green banner.

The result is actually much cleaner and more usable than the previous design, both on mobile and desktop browsers!

Anything broken, any layout bug, any comment? Let us know!