If you are scratching your head over the latest web design term then you aren't alone. It’s a phrase thrown around a lot of late for a reason. It’s cool and works to solve the problem with website appearance issues across multiple devices.
Responsive Design is a way of coding a website so that it adjusts according to the resolution of any screen.
Depending on the size, the website will adapt to fit appropriately. All the elements of the website will adjust, move and re-size, making your viewing experience seamless across all devices.
This essentially means creating up-to 5 sets of templates but can vary depending on the project requirements. One for each main device or resolutions: Desktop widescreen monitor, tablets (horizontal and vertical), Small phones (horizontal and vertical). You can even now add iPad mini and eReaders to the list of devices that you can potential adapt too.
Responsive design isn't the solution for all web presence because it will be a little more work to implement and manage but it does work well for information rich websites. Most good Content Management Systems will provide some functionality to accommodate responsive designs but these additional templates will need to be wire-framed and designed for the approach to work.
Recent examples of responsive websites:
Here’s a demonstration of Responsive Design in action:
Responsively Illustrated is a simple interactive experiment with responsive design techniques. Each device illustration is rendered using the same basic HTML which adapts its appearance to the changing viewport size.