At Theme Trust, we recently launched our first responsive WordPress theme. Since it was also my first time building a responsive website, I had to do some learning and research. Along the way, I discovered some interesting techniques, useful resources, and handy tools to help with the task. So in this article, I’m sharing some of those tools and scripts I came across that make developing a responsive website a whole lot easier.
FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.
A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more)
Adobe® Device Central CS5.5 software simplifies the production of innovative and compelling content for mobile phones, tablets, and consumer electronic devices.
During Denise Jacobs’ workshop on CSS3 at ConvergeSE 2011, I was inspired to make these responsive web design sketch sheets to help think through layouts for various devices.
Columns, gutters, a baseline and a script.
Making layouts responsive using CSS3 Media Queries are a big part of the work that I’m doing for the Hardboiled Web Design site in the run up to the book’s launch.
Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone.
Test your own site… type the url and hit enter.