These days, everyone is consuming content differently. My mom has a netbook, I have a laptop, my friend has a 27″ iMac, my girlfriend and I have smartphones and her mom has an iPad.

The growing connectivity in our society leads to some amazing results, keeping information flowing at an astounding rate, while bringing people closer together. But there are plenty of downsides to this new era of consumption, one of them being the way websites are designed.

Since your content is now being viewed on more devices and browsers than ever before, you have to design it with that in mind. Websites that adapt to things like screen sizes and operating systems are known as responsive designs, and this Responsive Illustration by James Mellers, is a perfect example of what’s to come.

Built using HTML/CSS + media queries, “this is a simple interactive experiment with responsive design techniques.” Visit the page and resize your browser to see how the illustration changes from device to device, adapting to the changing size of your browser window. From Mellers:

This is achieved using media queries to apply different CSS rules for different sizes. This experiment is intended to illustrate the basic premise of responsive web design and the power of CSS to tackle it.

Responsive design has been very important, and is now quickly becoming absolutely necessary.

➤  Responsive Illustration

Screen Shot 2012 01 04 at 7.33.47 PM 520x359 This designer shows off the future of responsive web design