Responsive web design requirements

What is responsive web design and why is it important?

Responsive web design, originally defined by Ethan Marcotte in A List Apart, responds to the needs of the users and the devices they're using. The layout changes based on the size and capabilities of the device. For example, on a phone users would see content shown in a single column view; a tablet might show the same content in two columns.

What are the new CSS specifications for Responsive web design?

The Grid specification is a welcome addition for implementing responsive web designs. Two other new CSS specifications are also worth mentioning: the Flexible Box Layout Module (Flexbox) and The Multi-column Layout Module. Both show a great deal of promise for designing responsive Web sites.

How to test your website for Responsive design?

For example, using Google’s Resizer tool, you can toggle between phone and tablet versions of your website to see what they look like to users. After using the responsive web design test tools mentioned above, you’ll have a good idea of which site elements are responsive and which are not.