Ethan Marcotte – The How and Why of Responsive Web Design

Sean Carmichael

March 11th, 2011

Play

Duration: 27m | 14MB

More types of devices are accessing your web content everyday. Have you figured out how to accommodate them? Ethan Marcotte is leading the charge in this area, with his work on Responsive Design, which can help your content scale and adapt to new devices.

Ethan’s methods use media queries, fluid grids and other CSS3 elements to create beautiful and adaptable designs across a variety of platforms. Recently, he discussed his techniques during a UIE Virtual Seminar, The How and Why of Responsive Design. Ethan and Adam Churchill address some questions from that seminar in this podcast.

Here’s an excerpt from the podcast.

“… Design really flourishes under constraints. The more known quantities that we have to deal with, the more creative solutions we can often apply. Because, really, design is all about creating order out of chaos.

Now, that can kind of run counter to a little bit of the web’s innate flexibility. As designers, the moment we publish something online we surrender so much control to the people that are actually digesting our content, that are reading our sites, to their browser preferences, to their window sizes, to the actual characteristics to the device they’re viewing our sites on.

There’s a little bit of attention there because I think our instinct as designers is to basically introduce constraints to sort of set those ideal parameters. So we’ll create fixed-width websites to suggest the ideal parameters and to which this content should be read. Or maybe we’ll create separate mobile websites or separate device-specific websites.

The problem is, I think, that desire to sort of impose constraints at some point feels a little not scalable to me. At some point we can’t keep up with the pace of technology. Because as mobile browsing has exploded over the past couple of years and that number is just going to keep going up, the emergence of tablets and other kinds of Internet-ready devices, our job has never been more challenging than it is right now, just this ever-widening landscape of browsers and devices.

So as we move beyond the desktop, I think there’s a lot we can learn from this other design discipline called responsive architecture, where architects have been sort of re-imagining what a space can do and how it can sort of adapt and respond to the needs of the people that occupy it, changing the shape of walls and changing the shape of a space to accommodate different sizes of crowds.

So I think that rather than trying to impose constraints on the web, we can see its flexibility as an asset and better design for it…”

Take a listen to the podcast and hear Ethan cover these additional points:

  • How do you convince your clients to go about this “one web” approach?
  • Does responsive web design adapt to connection speeds?
  • When planning to build a site, do you allow a lot more time to coding and testing various resolutions?
  • Does it make sense in today’s environment to design to fixed width?
  • When working with flexible layouts, how do you ensure readability at different screen or window widths?

Do you have experiences with responsive web design? Please share your thoughts in our comments section.

Recorded: February, 2011
[ Subscribe to our podcast via Use iTunes to subscribe to UIE's RSS feed. ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Transcript Available ]

One Response to “Ethan Marcotte – The How and Why of Responsive Web Design”

  1. Responsive Web Design Challenges | Information School Web Team Says:

    [...] Pod­cast from The How and Why of Respon­sive Design  Top Respon­sive Web­sites in Higher Education [...]

Add a Comment