Responsive Design

What is Responsive Design?

Overview

"Responsive Web design" is a website build that is flexible and can adapt to different screen sizes. The elements on your page will scale and at certain "breakpoints" your layout will change to suit your users' screen.The underlying goal of responsive design is to have your website work (well) across a wide array of devices; which bring us to our next point...

Size Isn't Everything

Screen size is only one consideration. Many newer web-capable devices are touch-based---so instead of a keyboard and mouse, your users will be using fingers to access content (think iPad). This may not seem like a big difference initially---but on top of the smaller-screen size (and fat fingers) "hover" events do not exist; & more complex gestures (pinch, swipe) are common-place. Layouts are often adapted to suit by making buttons bigger and interactions that do not rely on mouse-overs.

Grandpa has to wait in the Car

Responsive design is fairly bleeding-edge and older browsers may not play well with some of the newer techniques that are used to accomplish our goals. Although things should still function for these older browsers, we like to concentrate on the future and keep our debugging efforts to browsers from this decade. (Sorry, IE7).

addendum: IE8 does not support "media queries", which are required to allow layout changes based on user screen size. IE8 support is offered in limited capacity.