Yahoo! Blueprint for mobile sites

Posted by Patrice Neff Mon, 21 Dec 2009

The past few days I created a mobile site for Memonic. During this I made use of some of the newly found knowledge from the past Webtuesday which Adrian Kosmaczewski was kind enough to share. See also my notes about iPhone web development from that event.

The goal of this mobile site was to get a broad device coverage. As we’ll create an application for the iPhone, it was especially important to get a nice site for all the other devices. During his talk Adrian mentioned the Yahoo! Blueprint framework and I was sold quickly.

The basic architecture is relatively simple:

The really nice thing is that as a developer you don’t have to worry about any of the device detection, HTML generation, CSS fiddling, etc. That’s all handled in the “Yahoo server” box.

For our internal evaluation I gathered the following list of advantages and disadvantages:

Advantages:

  • Very broad device coverage
  • Fast development
  • Image compression done by Yahoo
  • Less code

Disadvantages:

  • Mobile frontend hosted by Yahoo without any SLA (but transparent to the users, we can still serve it using the m.memonic.com domain)
  • No HTML (we have to convert HTML to XForms XML – that’s a problem for detail pages on Memonic)
  • No custom design (though to some extent that’s coming next year)
  • No integration in Google Analytics (but we probably can use Yahoo’s own statistics tool for the mobile part)
  • Currently no price plan

Based on that list we decided to go with Blueprint for the moment. The architecture means, that whenever we have to migrate away we can probably re-use our existing code and build something similar to Yahoo! Blueprint ourselves. That would actually be a really nice open source project.

For now: thank you Yahoo! for offering a wonderful service.