A few responsive development resources

I’ve bookmarked several useful tools, bookmarklets and snippets lately that I thought I’d share with anyone looking to make their responsive design work a little easier. Here they are.

Layout tools

• PXtoEM – A very useful calculator for converting px layout sizing to ems.
• Scaling with EM’s – A good blog post and demo explaining how you can use em’s to scale your site
• Responsive layouts, responsively wireframed – A good demo of responsive wireframes

Testing tools

• Quick responsive tester – Chris Armstrong’s tool for quickly resizing your site in browser
• The responsinator – Another quick tool to see how your site looks at a range of different sizes
• Responsive.is – Yep, another …
• Media Query Bookmarklet – It’s exactly that
• Resizer – A bookmarklet that lets you set window sizes for quick testing
• Solidify app – A tool from Zurb for building clickable prototypes
• Blaze Mobitest – Awesome tool for testing the speed and weight of your site

Useful blog posts

• Cutting the mustard – A clever proposal for browser testing support
• Responsive navigation patterns – Brad Frost’s useful review of common techniques for navigation along with pros and cons for each
• Responsive navigation – A quick freebie I made for your use