More mobile web resources

I thought I'd supplement yesterday's mobile web presentation notes with a quick round up of online and offline resources that I've found very useful in trying to understand developments in this vast and fast moving field.

Some books

First, one or two books. I would start with the excellent A Book Apart series, especially Ethan Marcote's Responsive Web Design and Luke Wroblewski's Mobile First, which I notice are currently available for as a reduced price two-book bundle. Like the others in the A Book Apart series they are short and to the point. Ethan's book is an elegant summary of the three core principles of responsive design: fluid grids, flexible images and media queries. Luke's book opens with a chapter defining what the mobile web is and why we should care, backed with some of the more eyewatering mobile usage stats. He then outlines the 'mobile first' philosophy to web design, which contends that websites should be designed with mobile devices in mind, not 'traditional' desktop browsers: additional content and functionality can be added for larger screens and more powerful devices, if required, but should be layered on top of a core mobile experience.

Another key text is Aaron Gustafson's Adaptive Web Design. This sets 'responsive web design' and 'mobile first' in the context of a wider design philosophy called 'progressive enhancement', which maintains that a website's core content and functionality should be accessible to all users, whatever browsing device they're using, and whether or not they are physically able to use user interface controls such as mice, keyboards and touchpads. Content and functionality should be multi-layered to cater for the differing capabilities of end users: essential content should be available as core, to everyone, with enhanced features of secondary importance progressively added for more capable browsers. That's the ideal anyway: the extent to which progressive enhancement is possible will depend upon project timescales and budgets, and there's a useful discussion of these real-life business issues in the book.

I'm currently making my way through another book, Head First Mobile Web by Lyza Danger Gardner and Jason Grigsby, a larger tome which includes a discussion of the responsive web design, mobile first and progressive enhancement but which goes into more details about the technical ins-and-outs of implementing a mobile friendly site, including a very useful study of server side techniques for detecting different browsing devices. I'll post a review once I've finished. There's a similar book called Mobilizing Web Sites by Kristofer Layon which I haven't read yet, but which looks promising.

Blogs and frameworks

All these books are invaluable guides to the core principles of mobile design, and, as I've noted, are full of concrete examples of how those principles can be implemented. But the field is moving so quickly you'll need to keep on top of a few blogs charting the latest developments, which happen pretty much daily. Mobile web blogs are legion, but I've narrowed my reading down to just a few:

  • Brad Frost - everything here is worth reading - Brad's blog is an invaluable source for the best and most recent thinking regarding mobile matters
  • Cloud Four - the blog of an agency at the forefront of the development of new mobile web techniques
  • Jeremy Keith - a visionary blogger who has helped define the principles of progressive enhancement
  • Stephanie Rieger - an Edinburgh-based designer who quite possibly knows more about the capabilities of mobile browsing devices than anyone else
  • Mark Boulton - Mark is at the forefront of efforts to repurpose traditional graphic design thought on grids and typography for the web
  • Andy Clarke - Andy runs excellent workshops distilling cutting edge mobile web development thinking and techniques and maintains a fine blog
  • Smashing Magazine - fabulous resource for latest web design thinking
  • A List Apart - venerable web design journal that has a rich selection of mobile web tutorials

There are many others, but these are the main ones I have time to keep up with and they frequently reference good work by other bloggers. You can follow all of the above on Twitter.

A few frameworks have emerged to that serve as excellent foundations for mobilised websites. I particularly like:

  • 320 and Up - developed by the aforementioned Andy Clarke, incorporating elements of the HTML5 Boilerplate, the standard starting point for any new website, mobile or otherwise
  • Frameless - take one look at this site and you'll understand immediately how mobile first web design differs from the traditional fixed width approach
  • The Goldilocks Approach - similar thinking to Frameless

I could go on, but I hope this helps.