Responsive design is awesome because it allows a web designer to design for any screen size including, but not limited to, mobile, tablet, TV, computer and the 400 different tablet/mobile screen sizes. The core of responsive design is really media queries, but it’s still an art. Below is a list of ten resources that will help you start learning responsive web design. Even if you’re not a web designer, you need to know how to use and modify code that is built responsive.

First, get started by understanding The Possibilities and Restrictions of Responsive Web Design.

Learn Responsive Web Design For Drupal
This is a comprehensive list of links that will help you get started learning responsive design for Drupal. The resources include frameworks, concepts, and more, but are geared towards the Drupal CMS.

Beginner’s Guide to Responsive Web Design
This guide is just as the title says, a responsive web design tutorial by Think Vitamin geared toward beginners. This is a must read.

Responsive Design Using Foundation with ASP.Net MVC
We don’t give enough love to the fans, so this one is for you!

5 Useful Tools For Responsive Web Design
This one is out of the Pinehead playbook. I like to mention these because the writer nDeHertogh does a great job of showing these responsive web design tools to newbies.

CSS3 Media Queries
At the core of responsive design are media queries. Knowing how they work is essential.

The Possibilities and Restrictions of Responsive Web Design: Responsive Data Tables
This tutorial will help you dive into the specifics of responsive data tables and how they work.  This is another one from the Pinehead playbook.

Creating A Mobile-First Responsive Web Design
Lastly, let’s take a look at what mobile-first responsive web design looks like.  We’ve heard a lot of concepts of “mobile-first,” but how does it apply to responsive design?

Get actionable training and tech advice

We'll email you our latest articles up to once per week.