What Is Responsive Web Design?

This is a great question that I hear almost daily. My ‘official’ definition source is Wikipedia; “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).”

Simply put, a responsive website adapts to the screen it is being viewed on. This isn’t just making a tiny version of the desktop view on your mobile device or a giant version of a mobile site. A responsive design changes and is made for the device you are viewing it on. So if you pull up the site on your desktop, laptop, tablet or phone it looks great and is easily navigated.

Responsiveness is accomplished through three methods: fluid, adaptive and alternate content. A fluid design changes in a smooth, typically predictable, manner using a single design with changes in browser size whereas an adaptive responsive website will have different design variations that are served up at a predetermined screen size. These are sometimes referred to as break points. The final method, alternate content, is simply detecting and redirecting mobile users to a different site that is designed for those devices. This could also be in the form of a phone or tablet app.  I should note that while this third method isn’t using one design, or even one site, it is delivering an optimal viewing experience across a wide range of devices.

 

posted by: Mike Marshall