Responsive web design: Five great resources for absolute beginners
February 23, 2015 5:54 pm
Responsive web design is certainly the buzz of the moment. Everyone seems to be talking about it, but if you’re new to the world of building websites, all the information out there might seem a little confusing and overwhelming.
To cut down the ratio of signal to noise a little, we’ve gathered together five articles that should give you a good introduction to responsive design is. Some include examples of responsive design in action; and others explain why, in a multi-device world, you might want to consider using it for your own website.
So whether you’re somebody venturing online for the first time and building a site for your business; a site owner who’s started to think about mobile strategy; or a web designer who wants to get on board with this new trend, the pieces below should be everything you need to get a headstart!
Responsive Web Design – Ethan Marcotte
The one that started it all, this piece for A List Apart introduced the idea of Responsive design to the world. Written in 2010, just as the number of different mobile devices was exploding, it’s Marcotte’s attempt to come up with a solution to the problem of producing websites that look great no matter the device they’re viewed on. He writes: ‘Rather than tailoring disconnected designs to each of an ever-increasing number of web devices, we can treat them as facets of the same experience. We can design for an optimal viewing experience, but embed standards-based technologies into our designs to make them not only more flexible, but more adaptive to the media that renders them. In short, we need to practice responsive web design.’
What the heck is responsive web design? – John Polacek
A useful, and relatively brief introduction to responsive design by web developer John Polacek. As well as multiple examples of sites that have gone the responsive route, he includes links to tools and frameworks that will help you get started with building a responsive website.
Get started with responsive design – Sam Hampton and Sush Kelly
Sam Hampton-Smith and Sush Kelly give an excellent introduction to responsive web design, explaining lucidly why it might be a good choice for website owners. They also provide a simple and easily understandable run-down of key concepts and methods for designers who are new to the subject.
Responsive web design: What it is and how to use it – Kayla Knight
A comprehensive and accessible introduction to the broad concept of responsive web design, along with lots of examples of how it works, as well as lots of examples of sites that use it. If you have some familiarity with CSS, Knight walks you through how to implement some simple responsive elements on a web page.
Beginner’s guide to responsive design – Nick Pettit
Pettit offers a good explanation as to why something like responsive design is needed in a multi-device world and also explains basic concepts like fluid grids and media queries in a way that’s understandable to beginners. This piece is from 2010, and Pettit has produced an updated version – The 2014 guide to responsive design – that’s worth a look once you’ve got your head around some of the terms used when talking about responsive design.
Beyond responsive design: RESS
If you’re just starting out with responsive design you would be forgiven for thinking that responsive design is the solution to all your problems. But, it’s not! There are performance and page-bloat pitfalls to watch out for, and it’s more useful to think of responsive design as just one tool in your web-development toolbox. A useful approach is to combine server-side techniques with responsive design, commonly referred to as RESS (REsponsive design with Server-Side components).
Image: Jeffrey Zeldman