Responsive Design Overview

02_magicPoster1_A01_alternate

Responsive web design (RWD) is a web design approach aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from mobile phones to desktop computer monitors). A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images,and CSS3 media queries, an extension of the @media rule. – From Wikipedia

Our Magic Poster Discussion

For Beginners

Inspiration

Design Principles

Remember, the web has ALWAYS been responsive…

Responsive Design Workflow

Having integrated teams—UX, visual design, front-end, and back-end folks all working together—that can deliver this sort of documentation is crucial for the success of these types of projects.

Frameworks

Tools