Mobile Web Best Practices

Posted on December 23rd, 2009 in How To, Mobile Marketing, Web Design by Lindsey

After revamping several dozen PPC landing pages for one of our clients, Crystal and I have turned our attention to re-creating the pages in the mobile space. While she dives into the actual work, I thought I would take a moment to review some best practices for mobile sites and landing pages.

I came across this great document a while ago, published by The World Wide Web Consortium (W3C). Published in July of 2008, the document guidelines everything you could possibly imagine from use of large graphics, to style sheet size, to the default input mode. If you do decide to create a mobile website “from scratch” so-to speak, I would recommend sharing the entire document (ok, at least the free standing summary) with your web developer. (Or hey, did we mention we do web design and development?)

Some highlights:
•    Provide minimal (and consistent) navigation
•    Use clear and simple language
•    Limit scrolling to one direction
•    Ensure that information conveyed with color is also available without color
•    Do not use frames – avoid tables unless the device is known to support them
•    Don’t rely on cookies being available

Just like “traditional” web design, you should bear in mind the limitations of the devices where your site will be served. The W3C suggests catering to the Default Delivery Context, defined as “the minimum delivery context specification necessary for a reasonable experience of the Web” and is outlined as follows:
•    Usable screen width = 120 pixels, minimum
•    Markup Language Support = XHTML Basic 1.1
•    Character Encoding = UTF-8
•    Image Format Support = JPEG, GIF 89a
•    Maximum Total Page Weight = 20 kilobytes
•    Colors = 256 Colors, minimum
•    Style Sheet Support = CSS Level 1
•    HTTP = HTTP 1.0 or 1.1
•    Script = No support for client side scripting

However, the W3C wants to stress “many devices exceed the capabilities defined by the DDC. Content providers are encouraged not to diminish the user experience on those devices by developing only to the DDC specification, and are encouraged to adapt their content, where appropriate, to exploit the capabilities of the actual device.”

Bottom line, mobile web design is still tricky. A variety of platforms, sizes and browser access make it hard to pin point a common denominator. Therefore, my final recommendation is to design both a WAP-friendly site and a smart phone site…and test, test, test!

~Lindsey

Share/Save/Bookmark
Lindsey

Post a comment