What is responsive design

Responsive Design is a new trend in Web Design. It was started by Ethan Marcotte. Responsive Design is the design of websites that work well when viewed on a wide range of devices. For example a responsive website will look good on Iphone, Ipad, Tablets, Laptops and Desktops.

Responsive Design is not a single technique but a set of several CSS practices, such as proportional layouts, flexible design, flexible images, browser compatibility, pollyfilling, CSS media queries and more.

A responsive design should be used in most cases. However if the website in question needs to have special requirements specific to a device such as mobile phone, then responsive design is not a good option

A responsive website should look good across old browsers as well. However it is upto the web designer on how well old browsers are supported. Pollyfilling is a technique used by web designers for supporting old browsers. It requires using different HTML code for browsers that do not support certain HTML standards. There are several pollyfill libraries that provide fallback support to old browsers that do not support certain HTML 5 standards. e.g a video element may be replaced by an image or a paragraph saying the browser does not support the HTML 5 video element

The book Responsive Web Design with HTML5 and CSS3 is a useful resource for learning about Responsive Web Design.

Published 13 Mar 2017

Pak Jiddat provides open source scripts and tutorials related to Web Development and System Administration.