Responsive web design refers to a web page that dynamically adapts its layout to fit the size and orientation of the device on which it is viewed. A responsive design allows for a more optimized user experience across desktop and laptop computers as well as smart phones and tablets of varying sizes.

Responsive layouts can behave in several ways; either via a series of common break points to which a layout might snap, or preferably in a smooth and continuous scaling that allows for an optimal experience at any width.

The same HTML is served to all sizes maintaining functional parody, and CSS is used to determine the behavior of the layout as the screen width reduces. Elements are often not simply scaled, but reorganized to allow for a more efficient use of space. Larger navigation hierarchies might roll up into a hidden menu, boxed content might become a carrousel and columns of content might become stacked into a single column view as a page shrinks.

A layout designed to fit the device you are looking at will be easier to use and create a more functional and satisfying user experience.

In the early days of smart phone popularity it was common to create separate websites with more limited functionality that is served only to users with these browsers. This approach of creating separate mobile experiences was a short-sighted fix, that in most cases is better served by a single code base and like-for-like content and functionality across all devices.

To deliver responsive design we would choose the most common device size among your user base as a starting point and test the layout at several other key widths. Most of the work is done in development where a rigorous quality-assurance process ensures a high standard of responsiveness is achieved across all devices.

Everything we’ve designed for many years has been responsive, with a few niche application exceptions. Generally speaking, if it’s on the web, it needs to be built responsively.