Responsive Web Design – Helpful Links

June 4, 2012 • Damien White

This post looks at the basics of Responsive Web Design (RWD) and takes you on a tour around the web of some helpful links about the three principles of RWD: CSS Media Queries, Fluid Grids, and Fluid Images and Media. I hope you find these useful.

There’s tons of great things on the internet regarding RWD, so obviously I can’t include everything here. Did I miss something you wrote or that you found helpful? Let me know in the comments.

CSS Media Queries

W3C Spec For CSS Media Queries

Useful Queries

Fluid Grid Layouts

Grid layouts for webpages have become a popular web design approach. The goal is to have a solid visual and structural balance on a page.

What’s a Grid?

Table based markup was popular in the past, but it’s a poor approach.

There are many reasons why tables are bad for layout, with one of them being that the semantics are wrong. Note that semantics are an important part of HTML5.

Grids give a page structure and consistency like tables, but without the rigidness.

Fluid Grid

Fluid Images

Posted in css, web design and tagged with responsive-web-design

Damien White

I am a software architect with over 16 years of experience. I simply love coding! I have a driving passion for computers and software development, and a thirst for knowledge that just cannot be quenched. I'm happy to share what I know in my quest to learn as much as possible. I focus most of my time on web development using Ruby on Rails, Ember.js, and ASP.NET MVC.

comments powered by Disqus