Ethan Marcotte
About a dozen years ago, as designers grappled with the need to serve similar experiences to both desktop and mobile computer users, Ethan Marcotte developed the practice of responsive web design.
I think we're at an analogous juncture now in content design. The need to serve similar content experiences across a variety of channels, devices, and touchpoints - and in a variety of contexts, like personalization - reveals the need for more flexible and adaptive content-design practices and systems.
Responsive web design was adopted almost immediately and remains relevant and important today. "Responsive content design" is just my way of describing a strategic practice that many others (hello, Rahel, Noz, Val, Cruce, Ann, Scott, et al.) have already articulated and developed in different ways.
It was fun and instructive to noodle on this topic with Ethan.
We talked about:
the origin story of responsive web design
how content was a first-class citizen in his early responsive web design work
Ethan's take on accessibility: "a sign of a job done right"
a reminder that even in developed countries a lot of people are still "accessing the internet is over a spotty network connection on a mobile device"
how to account for non-visual media like chatbot content in design systems
how to make design systems not necessarily responsive, but certainly flexible
the importance of having design principles drive design-systems decisions
how every design org has a design system whether they call it that or not
Ethan’s Bio
Ethan Marcotte works at the intersection of design and front-end development, to help organizations design and build sites and services that can be accessed by everyone, everywhere. Notably, he introduced the world to responsive web design.
Video
Here’s the video version of our conversation:
https://youtu.be/z7NN-bboy_E
Podcast intro transcript
This is the Content Strategy Insights podcast, episode number 132. I usually prepare pretty thoroughly for these interviews. This episode is a little different. I had scheduled a Zoom chat with Ethan Marcotte to noodle on an idea that had recently occurred to me about "responsive content design." As we started our conversation, we agreed that it might be worth recording. It definitely was. As usual, Ethan was a fount of insights and ideas about designing great experiences and building systems that support their creation.
Interview transcript
Larry:
Hey everyone. Welcome to a special episode of the Content Strategy Insights podcast. I woke up a few weeks ago with this crazy idea in my head and I said, "I know a guy who might be able to help me noodle on this." So, I'm talking today with Ethan Marcotte. You might remember Ethan. He started this thing called responsive web design. What was, 11 or 12 years ago now? Is that-
Ethan:
Yeah, yeah, back in the Stone Age, I think. Yeah, that sounds about right. Yeah.
Larry:
Well, and the reason I wanted to talk to you about this, because it seems like we're at some maybe analogous juncture. Back then, I think it was mobile and just the need to have designs work on different devices and in different contexts. There's stuff going on in the content world now with personalization and the need for omnichannel strategies and these kinds of things that are just... Anyhow, when I woke up with that idea of responsive content design, I think that's what was going on. I honestly have no idea what I was thinking about. But anyhow, I just wanted to noodle on that with you. So, maybe start, can you tell me a little bit about where responsive web design came from?
Ethan:
I can give you my level best, Larry. But man, it started pretty early on in my career, when I read this really great essay by John Allsopp called A Dao of Web Design. And in it, he was basically talking about how the web as a design medium was kind of at a weird tension point because it was sort of following on from centuries of graphic design in the printed page. He was basically saying, "Here's this brand new medium, and what we're trying to do from a design perspective is trying to replicate the constraints of the page." We're drawing fixed little boxes on the screen, filling them with content and imagery and stuff like that, but more or less, treating it like it's an extension of Photoshop or Illustrator.
Ethan:
And so he was basically arguing that the web is this completely flexible design medium. We can't control when or how somebody's going to access our content. They could be on a massive monitor or a tiny one. They could have really poor internet connection. And we have to think more flexibly as designers. We have to plan for that flexibility.
But he wrote this back in 2000, I think. The tools that we had for web design were pretty rudimentary. So, when I coined the term, responsive design, it was basically sort of, again, mobile as you said, it was kind of exploding. And so I was just like, we now have the technology to capitalize on this old idea of thinking about the web more flexibly. So, why not think about experiences that could be shown to somebody on desktop or on mobile or any kind of device that they have? And really just think about one flexible experience that can respond to the changing environment that it's in. So, that's kind of how it started.
Larry:
It occurs to me now that you were probably thinking about content as part of that, or was that an explicit part of that at all? Or?
Ethan:
I mean, I'm a designer by trade, and I think it wasn't explicit, in that it wasn't a big formal part of the article when I coined the term. But it was really something like, we need to stop thinking about mobile users and desktop users as having dramatically different needs by default, simply because they have differently sized screens. We want to share the same information, the same content with anybody.
Ethan:
The first large-scale responsive redesign was the Boston Globes website, which I was a design lead on, part of a large team, but I was involved with it. We pretty much very quickly decided, your readership is coming to your website at multiple points of the day, with different kinds of devices, that they are trying to read articles. They don't necessarily care about what articles are available to them when they're on mobile, or they don't want to track what's available to them when they're sitting at their desktop at work. They really just want to have access to the Boston Globe's information. So, yeah, I mean, content was treated as a first citizen, maybe not in a formal way, but it was basically everyone wants the same information, regardless of the device that they have.
Larry:
Yeah. You're reminding me now too, I can't remember exactly when it was, but I'm always surprised at how early it was when NPR did their Create Once, Publish Everywhere (COPE) model. That was in the air at that same time as well. I've always been surprised at how little that... I was hoping that would explode, but it really didn't right away. But responsive web design did explode. That just became the thing.
Ethan:
Yeah. Yeah, I think so. And it's interesting because I definitely remember, maybe I've been hanging out with Karen McGrane too much, but I feel like the COPE model was something that was talked a lot about at that time. But folks definitely were pretty excited about responsive design.
Ethan:
I will say that one of the things that was really helpful in conversations, both with the Globe, but every client that I've worked with since, is this idea of designing for mobile first. Because I think responsive design was kind of counter to this idea that we have to present a slimmed-down view of our design and our content to folks simply because they're on a smaller screen.
Ethan:
A very smart band named Luke Wroblewski basically said, "We're doing that simply because we're starting from a desktop context and then trying to make everything fit on mobile. Instead, our audiences are becoming more mobile-focused. They're becoming predominantly mobile-only. So, why not treat mobile as a first-class citizen? Why don't we start there and think about what's the information that's best for the small screen user, and then use that as our foundation?"
Ethan:
So, that at least for me, has always been one of the ingredients of a really successful responsive redesign is thinking about what's the information that's most valuable to your users? And working from a mobile context, and then using that to build consensus around how that's going to look on tablet, on desktop, or any kind of device.
Larry:
All of a sudden, I'm thinking about things like accessibility, that by designing for people who have extra needs, that it's a better experience for everyone. And it seems like that mobile-first approach may have had something like that. Is that?
Ethan:
Yeah, I think so. I mean, accessibility for me has just been like, it's a sign of a job done right, I think. It's really about thinking about... I don't know, I would say mobile-first and an accessible experience are similar in that you're trying to think about experiences outside your default view of working from the web. I've got a decent laptop and a decent monitor and a decent internet connection. My body can do certain things, and the way that I design a website is kind of informed by all those things.
Ethan:
But the concept of thinking about mobile first is, okay, what if somebody is working with a screen that's 80% smaller than the one that I have? Or maybe they're on a spotty network connection. Simply by thinking about those use cases, it's going to make the experience better for everybody because everyone's going to benefit from something that's built to be lightweight and nimble and deliver as fast as possible. Something that's going to have content that's tailored to a smaller screen. As you expand out from that,
