Save over 40% when you secure your tickets today to TNW Conference 💥 Prices will increase on November 22 →

This article was published on January 5, 2012

This designer shows off the future of responsive web design


This designer shows off the future of responsive web design

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.

The 💜 of EU tech

The latest rumblings from the EU tech scene, a story from our wise ol' founder Boris, and some questionable AI art. It's free, every week, in your inbox. Sign up now!

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

➤  Responsive Illustration

Get the TNW newsletter

Get the most important tech news in your inbox each week.