Hey. Yes, that is a challenge. I am from Manchester, although now I live in Wales, so my accent is somewhat diluted. Is there anybody here from Manchester? No. [laughter]

All right, because Manchester, Mancunians talk like this a little bit, and I don't talk like that, because I'm from near Cheshire originally, so hopefully you can understand me. This is my first Fronteers, and I've got to say, up until now, it's been great.

This building is absolutely flat-out bonkers. If this is your first time here, instead of listening to the talks and things like that, just spend five minutes walking around and looking up in the air. It's absolutely crazy, but great.

Today, I'm going to talk about responsive design. I've been trying to do responsive design for about 18 months or so, and it's been difficult, and continues to be difficult, and I think everybody's freaking out a little bit about it. That was confirmed when I ran a little survey on Twitter, and thankfully, Vitaly from "Smashing Magazine" retweeted it to his bazillion followers, and I got about 600 responses or so.

Throughout those responses, there were very, very clear trends that came through on what people are struggling with, and that informs a lot of this talk, but first of all...Could I have the lights down a little bit? In fact, all the way. I want to show you a little clip of a film I saw.

It's quite old, but I saw it recently again, and there was a scene in this film, it's five minutes long, but it really struck home about what happened 18 months ago, and how we're feeling now. There is sound. At least, I hope there is.

There isn't. [audio from the movie begins]

Whoa. All right.

...tumbling down the rabbit hole?

You can see that? I can see it in your eyes. You have the look of a man who accepts what he sees because he is expecting to wake up. Ironically, this is not far from the truth. Do you believe in fate, Neo?

No.

Why not? Because I don't like the idea that I'm not in control of my life.

I know exactly what you mean. Let me tell you why you are here. You're here because you know something. What you know you can't explain, but you feel it.

You've felt it your entire life, that there's something wrong with the world. You don't know what it is, but it's there, like a splinter in your mind driving you mad. It is this feeling that has brought you to me. Do you know what I'm talking about?

The Matrix.

Do you want to know what it is? The Matrix is everywhere. It is all around us, even now, in this very room. You can see it when you look out your window, or when you turn on your television.

You can feel it when you go to work, when you go to church, when you pay your taxes. It is the world that has been pulled over your eyes to blind you from the truth.

What truth? That you are a slave Neo. Like everyone else you were born into bondage. Born into a prison that you cannot smell, or taste, or touch. A prison for your mind. [sighs]

Unfortunately no one can be told what the Matrix is. You have to see it for yourself. This is your last chance...after this there is no turning back. You take the blue pill the story ends, you wake up in your bed and believe whatever you want to believe. You take the red pill, you stay in Wonderland and I show you how deep the rabbit hole goes. [music crescendos]

Remember, all I'm offering is the truth, nothing more. [thunder]

Follow me. [movie stops]

I'm not going to watch the whole film. [laughter]

It's a shame, in this building on a day like today...what a great film to see. I think watching that scene again made me think that responsive design is our red pill. For a long, long time I think we've been living in a consensual hallucination of control on the web. As designers we've made up pages that don't exist.

We've been trying to control the medium when it's inherently chaotic and fluid. Responsive design, however you may feel about the term, or what you thing the term represents...mobile first, content first, adaptive design, responsive design all of these terms exist to try and explain the situation we feel ourselves in. We all are like Alice tumbling down the rabbit hole at the moment.

Everybody's freaking out a little bit because we are finally accepting our situation. It's not only yours, right? The people in this room, and this talk actually isn't about, necessarily, the people in this room. Responsive design, we know that it's...we're focused on the technical delivery of it, media queries, bandwidth optimization, blah, blah, blah, blah, blah, new elements in the spec, et cetera, et cetera, right? We're focused on that.

But what responsive design has been useful for in the same way that Ajax was useful, right, it is a buzzword. But it's a buzzword there to explain our situation. Now people are getting it, people who are making the decisions to build their sites that way.

Big corporations, Disney, for example, Microsoft, the people who made those decisions aren't necessarily the front end developers or designers working in the teams. That went all the way up to management. What they're clinging onto is this idea that responsive design gives us a one solution to accommodate for the chaos.

I think that Ethan, Ethan Marcotte, was like Morpheus, really, in some ways. [laughs] He gave us the red pill, and we've actually swallowed it. Now we're freaking out a little bit and everybody's running around freaking out about how do we do this? This talk is about three things.

How responsive design affects business. Those of you who run businesses or work at businesses trying to do this, it does affect it. I'm going to talk a little bit about that. I'm going to talk about responsive design and process.

It turns a lot of processes, existing processes that we've done for a long time in our shared hallucination of what the web should be and how it should work, it turns those on its head. The third thing is content. Alongside the responsive design thing is the content thing.

That's also another hallucination that we've been lying to ourselves about. We're coming to terms with that we need our content. We need to think about our content. We need to plan for our content. Responsive design affects that, as well.

This is a quote, if you can read my writing, but I'll read it. From Bobby Solomon, from the Disney team, "Honestly, our team is bored of talking about responsive design. It's how any self-respecting website should behave in 2012."

Well, that's all well and good if you're Disney with the bazillion dollars and an in house team of 500 people or whatever it is. They have the resources and the capabilities to actually do this. But what if you're a three man web shop, freelancer, who is trying to do this for your clients? What then?

OK, so what came back from those surveys, the biggest thing that came back, and it may have been about...I'm going to share it, by the way. I'm going to share this spreadsheet, following this talk. If you follow me on Twitter, I'll just ping it out. I'll hashtag it for the conference, as well. It's a Google Doc of maybe, I don't know five-, six hundred responses.

But the biggest thing that came through, really clear trend, is that it costs more. Responsive design costs more. Now, where does that cost lie? What came through in the survey was that the cost lies with the agency doing the work. Because people don't want to pay for it.

My response to that would be simply charge more. If it takes more time in your billing by time, then you charge more. It's what I've been doing for 12, 18 months. It means that sometimes you don't win work, because you're, the market norm, remember the people who, everybody else who is not doing responsive design, they're building fixed width websites, apps. There's not as much involved, so they're cheaper. Doesn't take as long.

You have to accept that, and it's part of accepting that responsibility, swallowing that red pill. Eventually the rest of the industry now is catching up with people at Microsoft and Disney. Those are our big...so in web standards, it was when ESPN launched, right?

Everybody went, "Oh, right, well, if ESPN are doing it, we'd better do it." That's going to happen now. Disney, Microsoft, everyone will be doing it. Therefore, the costs will come down. Or rather, the costs will level. Everyone will be more of a level.

That's one thing, cost. It costs more money because it takes more time. This isn't quite so bad in internal teams because there isn't necessarily the bottom line pressures that there are in small agencies and midsized agencies, but there still are time pressures, but the pressures are slightly different. In fact, the pain in internal teams is actually more around teams and how teams are structured.

These are supposed to be people. They just look like little blobs. This is how traditionally teams are comprised. Who works in an organization where your teams are structured this way? A couple of hands. Well, quite a few hands.

Teams are siloed. There's management, there's design, there's development. Teams are put in their little pockets and they don't really talk to each other. One of the things responsive design forces through the processes that you have to go through within teams is that you need to work much more closely with people, particularly editorial, actually.

That's one of the things that content strategists have been banging on about for a year is get your content, get your content, content first. Actually, I don't necessarily agree with that. I think there's a misnomer that you need your content before you can start your work. I think that's damaging because we all know that that is unrealistic.

You get a job in, you get a brief into it...an agency, or you start a new project in your in-house team, you're briefed in on the project, and the first thing is you go is like, "OK, thanks, I've read the brief, now you go away and create all of this content, please, and come back when you're done." It doesn't work because nobody wants to be handed a big mountain of work.

What do we do? We spend time focusing on our content structure. If we know what our content is going to be then we can start working with it rather than actually having it. Teams need to look more like this. This does work. This is how I've been working for a long time, but I'm continually surprised. I take it for granted sometimes.

A lot of you in the audience will be looking at this and going, "That's nothing new, yeah, what?" Then I read some of the responses in the survey and I talk to other people and this is not the norm at all. A lot of agencies and a lot of in-house teams are still working like a factory like they're making sausages.

Ingredients come in one end, sausages go out the other. Content comes in one end, website comes out the other and it's just steps. Not many people are actually working this way, certainly in design. That's one thing that I think we need to change is how teams are structured.

If you're working in a team that is traditionally structured, go to work tomorrow. No, don't go to work tomorrow because the conference is on. Go to work next week or whenever you go to work and speak to your managers and say, "Look, this is painful. This is really painful. We're wasting a lot of time and energy. Can we restructure the teams?"Maybe not even say the word restructure because management freaks out about that word. That's like saying, "Snakes!" "Brrr...Restructure," so don't say that. Say, "I'd like to sit next to the developer," if you're a designer. If you're a developer say, "I'd quite like to go and sit next to the editorial part of my team." Proximity really, really helps, really helps.

That's one thing, teams. I think that's how businesses can get more effective at adapting to responsive design. The second thing is the big elephant in the room with responsive design that nobody really seems to be talking about, which is advertising. The way that advertising works on the web, as we know, and Roger Black puts it very well here, is that advertising has been ruining the design of content websites for 20 years, and it has.

The worrying thing is, is that it's a whole other industry that we have very little contact with. Ads are traditionally...we've seen ads, leaderboard, little rectangle, and ads are sold in the same way that print ads were sold 50 years ago. The model has not changed in 50 years, maybe more, actually, that you buy a slot on a page.

Now, remember, there are no pages anymore, so what happens to that? Also, the notion of small screen, and this is a big problem. I worked on a project last year for a big sports organization, and responsive design was firmly on the table. It was, "Yes, we want to do this. It's right, it's where the industry's heading, we want to do it."

We were like, "Great. This is great," until we started talking to the ad sales team, and they were like, "No, you can't do that, because we sell ads that are this width." We were like, "Well, can't you sell ads that are a different width?" He was like, "Well, no, not really because then we'd have to get the creative teams to produce different creative for every break point."

You're like, "Oh, that's really hard to explain." I'm not joking. That was what they said. This is a very difficult concept for ad sales teams to get their head around. They can't get it at the moment. Well, the ones that I had spoken to couldn't. What it meant for small screens, especially, was a big problem. This sports network had mobile products, and each one of those mobile products had their own revenue streams.

They made money from their advertising and through other ways. Going a responsive approach, essentially, would've wiped out an entire division of this organization, right? There was freaking out in this meeting I was in. That was dreadful. [laughs] It would have wiped off millions of dollars. Really, millions of dollars.

You may have seen these, these horrendous, absolutely horrendous...I'm getting some feedback. Can we turn that...that's better. These horrendous, they're called ad takeovers, and you see the banners down each side of a web page and one across the top. There has to be a width for this to work. There has to be a width.

I've just talked a lot about problems there, about advertising. Problems, it's an all over industry, they won't change the way they think. What do we do? Well, I think that we can't actually do anything, but what we can do is to start moving the industry towards that way, towards responsive design, which has happened. Ad sales will catch up eventually.

When they do, what they've got to do is to sell ad packages instead of individual ads. If you work at an organization with their ad sales team, go and talk to them about it. I'd really love to hear what they think about instead of an advertiser buying a slot, because this is the way it works. They buy a slot, and they buy it for a given amount of impressions. That's it.

What about if they bought a package of advertising assets, so they bought something that was served at this break point, something that was served at this break point, something that was served at this break point, instead of individual little things that are served over a given amount of time. It's something that technically is probably pretty trivial to implement, but actually, that's not where the problem lies with advertising.

The problem lies firmly in the ad sales engrained behavior, and remember this is a 50 year old industry. They've just copied the...it's older than that. They've just copied the model. It's very, very engrained. It's very difficult. That's a little bit about the businessy nuts and bolts things that I've come across that is challenging. But I think one of the most challenging things in day to day as a designer is the process and how it affects the process. This is Bob Ross. [laughter]

Did you guys have...do you guys have Bob Ross? Did you see Bob Ross? Are you familiar with Bob Ross? Yeah, Bob Ross. He's actually on Twitter. It's brilliant. Not him, but there is a Bob Ross Twitter account who just tweets happy trees every now and then. It's brilliant.

Bob Ross is probably the reason I'm a designer. He's pretty inspirational to me. But one thing that was really great about Bob when he was painting is he always screwed up. He was always like, "I'll add on some trees. Oop." That always happened every episode. "Oop. Oh, we'll just turn this into a little raccoon, or a little house." Every single time he screwed up.

Mike Tyson once said, "Everyone has a plan until you get punched in the face," and that is so accurate for designing for the web. This is why waterfall completely sucks for designing websites. It is totally opposite to how design naturally happens. Design naturally happens, and it has over the years, of constant iteration tweaking, improving.

Waterfall processes are, "We'll come up with three options, and we'll present them to you, and you will choose one, and then we'll take that, and we'll apply it to different things, and you can make three changes, and then we're going to build it, and then we're going to deploy it, and release it."

I thought waterfall was going the way of the dodo until I read some of these results in this survey, and talked to a few people. Waterfall, I'm afraid to say, is alive and kicking, and it's wrong, because it's producing bad work, because it's not a natural process for design. A natural process for design is this work.

This is some of my work from when I redesigned Drupal 7, and we spent most of our time doing this. I spend most of my time now on design projects actually not in code or in Photoshop. I spend most of my time with a pen a pencil because it's cheap. You can fail really quickly.

You can get punched in the face on a project, not literally. But you can get punched in the face, and you have to course correct very, very quickly and cheaply. You can't do that if you've got very high fidelity work, whether it's code or Photoshop. Sketches, very low fi sketches, is where it's at.

Now one of the things that's very interesting about this kind of work is that I also do this with clients. I talk to some clients. You have to be very careful about some clients. You have to gauge them. Because some of them will freak out. You show them sketches and they'll go, "What am I paying you for? I can do this."

They're not great clients. Try not to work with people like that. Try to work with people who will go "Oh, that's interesting, pick a pen up themselves and start scribbling all over it." The reason why, I think you get more honest feedback from work like this because people think that you haven't...clients think that you haven't invested a lot of time and effort into it.

You may have invested just as much thought and work into a sketch as you do a Photoshop comp. But because it's not all shiny they're more likely to take it on face value and tell you it's crap. They're less likely to tell you it's crap if it's shiny and you look like you spent a week on it because that week represents their budget represents their money.

Sketches is where it's at. Wireframes do not work anymore for responsive web design. They work in a sense of they can show what functionality needs to be on a page and maybe how it works if it's annotated. Why bother? Build a prototype. Why bother?

This sports network I was talking to you about. We were trying this process of responsive design. We were just prototyping it. While we were having these discussions with the ad team, they haven't freaked out yet. It was all like, "Oh yeah, we'll think about it." We were like yeah, "OK. Well let's just see how the change in process works with the team."

This organization is very traditionally structured. They have design team in the US, they have a product team in the UK, and they have front-end, back-end, and design team out in India in Bangalore. There's about 60 of them. Design guidelines get passed down from the US, product get their specifications, lots of documents, it goes into the factory in Bangalore and then it goes through this traditional waterfall process and out pops a website some time later.

We went out to Bangalore to just trial a process. We're saying, "Right, guys, you need to get into code quicker. You need to prototype faster, and we need to start testing a lot." They were like, "Oh, I don't think we can do that." I was like, "OK, well, what would you normally do?"

They're like, "Well, we've established these break points," and there were like six or seven. They said, "Can't you just produce a visual for each break point?" There were 16 templates. I went mental.

I was like, "You are joking, right? You are absolutely having a laugh. You're going from 16 templates and you want to increase that by six times for every break point?" If this is what you're doing on your responsive design projects, this is why it's costing more.

Because that's absolutely what you shouldn't do. Get it in to a prototype. The editorial process is something that also I've been deeply involved with, wow, for probably about 10 years or so. I used to work at the BBC editorial. I used to work with like 60 journalists. Throughout, when I started my agency, we've started working with a lot of heavy editorial sites.

I'm pretty familiar with it. But one of the things that responsive design is also highlighting is how content naturally works and how editorial naturally works. Take news, for example. News starts as a little seed of a story, something breaking, something happened.

"There's been an earthquake," and that's all it may be, and that may come off the wire from Reuters. "There's been an earthquake somewhere." Then very rapidly, things start to change within the story. We've got more information. The story starts growing. It's a single story. Then other stories start latching onto it. It's like a snowball going down a hill.

It starts getting bigger and bigger. It starts gathering things to it, trees, boulders, and whatnot. Before you know it, it looks like this. Your seed has grown into lots of different things, images, video, stories, pages, blogs, quotes, lots of different types of content all centered around this one story. What's interesting here is that the story is no longer a page, yet editorial and content always think of a story as a page.

Karen McGrane talks a lot about this in her talk, "Adaptive Content." If you haven't seen that talk, I think it's online somewhere, just Google it, and the transcript's available. It's brilliant, because what it does is it acknowledges the fact that actually, for a content to be best served responsively, we need to move like we have with design.

We need to swallow that red pill, and we need to move towards thinking about content as little pieces that have really good metadata, that can be pulled together to create the story. The story's not a page anymore. The story is the link.

I hear a lot recently about Microsoft talking about Metro being authentically digital. That's bullshit. It's colors. It's bright colors and sans-serif type. That's not authentically digital. This is authentically digital.

This is HTML. This is the hyperlink. This is where we're moving, and it's great, because it's actually acknowledging what the medium is and what it was designed to do. Another thing that people are freaking out about and struggling with is testing. "How do I test? There are a million different devices."

I'm afraid I don't know. I've got no magic answer for that, although I think there are two different types of testing. There's design testing, which is what we all do when we move the browser left and right, which nobody else does apart from us. [laughter]

That's testing how it breaks and moves. That's not device testing. For device testing, I have no idea, so traditional Q and A, QA, traditional device testing and acceptance testing is, "Does it do this, yes or no? Does it do this, yes or no? Does it work in this browser, yes or no?"

How can we answer that question anymore? It's only going to get worse. It's not going to get better. We can't do QA the same as we did before, same way that we can't do waterfall the same way that we did before. Our processes are getting turned on their head, and I don't know the answer to this. If anybody's got any bright ideas, I'd love to hear them on the FQA hash tag. That'd be great.

The other thing that responsive design challenges is content. I've talked a little bit about content. Because essentially, that's what our work boils down to, we design content. We give content form. Without content, there's no work for us.

We all need to pay very close attention to content, whatever it may be. This was somebody of Twitter who responded by saying responsive design forces a focus on content that many organizations do not understand. What that means is that not that we need content, we need to think about our content sooner, but it goes a bit deeper than that. I moved into a new house a few weeks ago.

I used to live in a very modern house, and now I live in a very old house. It's really old. I've got a little girl who's 15 months, so she's walking around like this, falling on her face. I put in a stair gate up at the bottom of the stairs. I'm drilling into the wall, and it's really solid stone walls. I'm drilling and drilling and the drill pops through, and then comes out on fire.

Right, the wall is on fire. My wife comes around the corner, and I'm freaking out. I pick up some water and I throw it on the wall just as she comes round the corner. She's like, "Why are you throwing water on the wall?" [laughter]

Well, it turns out the old houses, where I live, they're built up with two, their walls are made of two skins of stone, either side. In the middle there is horsehair or old potato sacks or just crap in there to make it warm. It turns out that I set some of that on fire. I spent the last two, the following two days freaking out, like, "Is my house on fire inside and I don't really know about it? Is this wall warm?" [laughter]

Like, what's going on? The point is that I spent time learning, and I'm still learning the materials of my new house, how my new house is made, what is it made from? What are the things it's made from? This is what we need to do. We need to spend time thinking about what our, what the web is made of. Jeremy Keith talks about, these are the fundamental things that the web is made of. HTTP, URLs, and files. But what is your content made from? That is a question that must be answered.

I've been working with CERN recently on redesigning their website. This is the first web server. It's got a sticker on it, "This machine is a ser(ver), DO NOT POWER DOWN!!" CERN is our, I'm going to skip through some of these pretty quickly. CERN's a crazy great place.

If you don't know much about it, it's brilliant. That is where all the computers are that store all the data from the colliders. In the top left hand corner there is the Internet. Everything else just is for their LHC (Large Hadron Collider). It collects about 40 million collisions per second. The computer discards some of that, but it keeps most of that data. Petabytes of data.

It's made up of not just the LHC, there's lots of other things there, too. Protons come into this thing and they go round and they go into the booster where they get boosted. Then they go into, eventually, they'll go into the LHC, which is at the top. There are four experiments in the LHC. It goes round.

Interestingly, one of them is beneath, like, aisle 16 of the supermarket. Black hole in aisle 16. It's also the home of the best typography in the world. Also, the best signage. This was what was in the cavern, we were very lucky that day to actually see one of the machines. This thing is enormous. That over there is a guy there. Yeah. Oh, it's big.

Everyone was, it was funny, because the beam pipe was exposed, so this is the beam pipe. This is where the electrons travel down. It's made of one single piece of beryllium, costs about two million quid. Everyone was very excited to see that when I was there. I'm just like, "It's just a pipe." [laughter]

I wasn't that thrilled. What I was excited about was the signage. I was taking pictures of "dead guy" sign and "hot hand" and this wonderful, "exploding cows," "1950s cleaning ladies." No. There was just great stuff like that.

There's wonderful experiments there, as well, not just the colliders, other things. This is an experiment called ISOLDE. In ISOLDE, there's lots of different things going on. It's just a lot of plumbing and some very serious men. Lots of different experiments, lots of experiments that actually don't work and just blow up. But physicists find that very interesting.

There's an experiment called Cloud. They're making clouds. This is a guy called Jasper and he's making clouds. Anyway, my point is that they're doing a lot there. People want to know what they're doing, so we needed to know what is your content? We need to understand what is it that people want to know and what is the content that you have.

To a physicist this is interesting content, this is called Page One. We have this up in the cafeteria and all over the CERN campus. It just shows the status of the beam. Stable beam, true/false...it's very interesting.

When we first started talking to them I was like, "I cannot show my mom this, she'd freak out," so what does my mom want to know? Well, after a lot of research NASA has got it really easy with pictures like this, but NASA is doing a very similar job to CERN. They're exploring space, they're just exploring inner space but they don't have pictures. They don't have planets, NASA has got it very, very easy.

One of CERN's jobs is to inspire a generation. They can't really do that with pictures of...with that. We had to look at the content, what have they got? They have got these, and these are beautiful visualizations...that one I think especially, of what is happening inside the colliders.

Our time on the project was to try and understand when it was appropriate to show these images and to who, so we came up with a comprehension matrix against the audience. If you're general public you have very low comprehension of what they do at CERN, you just want to know that it's not going to blow up. Scientists have very high comprehension and they have no time for pretty pictures, they want the data, so we mapped a wonder scale to that.

This is a way that we talk about what level of wonder is more appropriate for what audience. General public, high wonder low comprehension. Scientists, "I don't want to see pretty pictures, I just want the data."

Very easy way of modeling it. This is what the home page will end up being, which is a near real time visualization from the home page of one of the machines with a caption, and with some updates because that's what people wanted, updates to either research.

How did we do that? This is going to knowing what your content's made from. To get that picture on that home page took six months. It's absolute headache and it's still not right yet because the data came out of the machine 40 million times a second. Some of those are visualized, not all of them.

Of those, they're going to the control room. Some dude goes, "That one'll do." He picks it up and he puts it in a big computer thing. Then, from there, it goes into CDS, which is CERN's media storage, media server thing. Has everything in there, documents, sound, video, everything.

Then, from there, it goes out into a content object, which is trying to get towards being smart content. It's a bunch of image sizes, it's really good metadata, captions, and a link. It's the start of telling the story. Then, that content object, then, can be placed in different places at different times. Abstracting the content away from thinking it's a page and thinking it's a thing, it's a blob.

This has a problem for content management systems. Because how many content management systems look like this? Writers don't think like this. Writers don't think, "Well, you've got to write four summaries, and they've all got to be slightly different word length." It's a total pain in the ass, total pain in the ass.

How can we move content management systems to be more aligned with how writers think and the data that we need out of it? Remember, we don't need pages, we need chunks. One thing I've been thinking about is right, well, writers write in a page, that's how they think.

Well, how can provide guidance to say, "OK, well, your first paragraph needs to be X amount of characters or words and be self-contained so that it can be used elsewhere. Your second paragraph has to build on the story but also be self-contained so it can go somewhere else." Then how can...say that's just markdown, right, or a text file, Word file.

How can we pump that into a content management system or something where we can add the data to it, these different bits, and then abstract them so that they can be re-used. I haven't seen a content management system that can do that. I'd love to be able to see one, and I've spoken to a lot of writers and journalists who, they spend so long, so long after they've written a piece, carving it up to put it in crap content management systems.

Just to recap, I think responsive design really affects business. It affects our bottom line. It affects how we conduct business. It affects our teams, how our teams are structured. Responsive design affects our process.

Wireframes don't work anymore. Prototyping is the way to go, really. Responsive design affects content, how content is structured, how its put together, how right is right content, what is the output from their page of content? What is your content made of, how is it structured? Thank you very much.

Chris Heilmann: Boys and girls, Mark Bolton.

Mark: Thank you. Oh, this is nice.

Chris: Cozy, isn't it? Mark: Yeah, that's nice.

Chris: Was he understandable? Mark: Yeah, did you understand me? Did I talk too fast? Did I get all Mancunian? Chris: Nice. At CERN did you make the joke about, "Does particle physics give you a hadron?"

Mark: No, I didn't. Although I've misspelled hadron a lot of times.

Chris: Yeah? Mark: Yeah.

Chris: In the way we expect it? Mark: Yes. [laughs]

Chris: Not good.

Mark: One of my favorite moments, though, was I asked one of the physicists why particles decay into other particles. It's a pretty easy question, right? He just went hmm. I'll think about it and let you know. I'm like, "What? Really? You don't know?"

Chris: It's disappointing, isn't it? Mark: It is disappointing.

Chris: That was very interesting, and we have a few questions on the FQA thing, so don't be shy about this, not only Vitaly, who asked like five or so. It costs more money to develop, as you said. How can we actually tell clients or how can we convince clients that it will make more money in the long term?

Mark: That's a really good point. I think responsive design is probably the most sustainable way to design. It's not...as new devices, new capabilities are made available, then if you do the job well, then the website should just adapt. I think part of the problem comes from trying to convince clients to do responsive design is when they're comparing like for like.

They have, "Well, I've got a quote here, and it says this much, and yours is that much. Why?" Then you get into that whole thing of explaining what responsive design is. Unless a client is coming to you asking for responsive design, then I just do responsive design.

It's just the way we work now. It costs more, and takes longer to do, but that's about finding the right client and explaining to them very slowly and carefully, so that they're onboard with it.

Chris: Traditionally, I always found that Q and A doesn't get much money. It's basically one of those things that, you have a team, as you say, you outsource it somewhere else, and these teams are basically people that are underpaid, and are measured by how many Q and A things they've done, so they go for pixel-perfection.

Mark: Yep. They tick boxes.

Chris: How can we change that? Mark: I don't know. I honestly don't know. [laughs] I don't know how we can move from QA being this... Well, no, I do. I think that QA needs to be done all the time. I don't think it can be something at the end. You QA everything as you go. QA is like, "Well, I'll work a shit up until this point," and then somebody ticks a box. They say it's good, and passes it back to us, and we have to improve things.

I think it's more about making sure that your work's great all of the time, and you test often, but how can you device test? That's where I'm struggling, because you can't. The only thing that you can do is to say, "Well, this suite of devices, these break points, here's what we can test to," and defining those up-front, but even those are just a small portion of the reality. Once again, it's not really accepting the reality that we face ourselves in.

Chris: There are device labs and things like that. There are things like Adobe Shadow that allows you to test across different devices.

Mark: They help.

Chris: Do you think tooling will be an answer? Mark: Yeah, I do, and we're already starting to see this. We're seeing more specialist tools. I ride a bike, a road bike. One of the things about maintaining a road bike is that you have lots of different tools that just do one job, but they do them really, really well.

There's a spanner for getting your crank of, or there's a particular thing for unlocking some widget, right, and that's all it does. I think that that's where we're starting to move towards now, is to have these power tools on the web that just do one thing, and they do them really, really well for a specific purpose. The days of one tool trying to do everything I hope are long gone, because that's like having a massive Swiss army knife in your garage to do everything from drill holes to change your tires to...it doesn't work.

Chris: Most of the time, things go on fire if you try to do that.

Mark: Exactly. Right? [laughter]

Chris: The issue with ads and responsive design is a big one, because they are fixed size, and you cannot just resize, percentage-wise, a banner. That will not go down too well. Do you think there's a new market in there?

Mark: Yeah, I do.

Chris: That it would be new ad agency's...?

Mark: Yeah, a few people are experimenting. I can't remember the names of them off the top of my head. They are experimenting with ads having fluidity built into them, and they change. On the Boston Globe, there was the JetBlue ad. There's been a couple more on the Boston Globe as well.

But they're very, very niche. They're very bespoke. The problem is, is that if an advertiser is creating an advert for a campaign, this is why there are standards. This is why there are standards for ad sizes, is that they want to put that everywhere.

They don't want to create a bespoke thing for one site and the problems don't necessarily lie in does it move, is it percentage based. I think those hurdles are pretty small. I think the hurdles are in the very engrained industry that ad sales is.

Chris: Brad Frost gave a talk at Smashing Conference, a nice little conference that you spoke at, as well. He spoke about an approach to responsive design by just not showing, not hiding and showing content, but actually making different approaches and saying, OK, that image is not even sent over the wire.

Mark: Right.

Chris: Because a big problem is that people now put lots and lots of content in the page and then hide and show it according at break points. How can we get visual designers to think that way? It's hard enough to get people to embrace responsive design, but them thinking about adaptive responsive design, a different story.

Mark: Yeah, I think, it's trying to work with smart designers who know the web, know the medium, can write HTML, understand it, that's the first thing. I think if you're working with a designer who refuses to move on the idea of pixel perfection, he's eaten the blue pill. He or she is living in a world that is not accurately representing where we are.

That's the first thing. Then I think the second thing is smart content. It's having content that is available to come down the wire or not at certain sizes, with very smart metadata. Because without that metadata, and without that content being structured that way, then it's very, very difficult to say, "Oh well, OK, at this size, I want this piece of content, I want this piece of content and this piece of content."

In a very, very big organization, all of that content is being produced somehow, and it needs to be tagged very well, very good metadata, so that it is available when people need it.

Chris: Well, you did work with Drupal.

Mark: I did.

Chris: Did you get them to do something like that? Mark: No. But that was quite a while ago, and that was a very interesting project. The hurdles that we...so Drupal 6. People could not create content. That was one of the goals for Drupal 7, was that we want content creators to create content.

I was like, "Are you serious? Drupal 6, people struggled to create content?" No, we didn't. We didn't get there. There were bigger problems.

Chris: Because I found with working with content management systems and enterprise level stuff with six figure prices, the metadata doesn't get entered. We don't even get alternative text for images.

Mark: Nope. It's a total pain in the ass for editorial teams, and this is why...so I worked at the BBC, and there was a whole other job role for this thing. Writers would write and then they'd give them to some producer. I can't remember what they were called. But their role was to take editorial, break it up, add meta data, things like that.

It's a horrendous process, and we need better tools that can interrupt the natural editorial flow and tag content appropriately. I don't think those tools exist at the moment because big enterprise content management systems are just forms, and they're multiple fields, and all of the effort is on the editor.

I've said this for a long time, is that content management isn't a technical problem. Content management is a people problem, and it's a process and a people problem, you know?

Chris: OK, last one. Somebody's asking, "Are there any patterns already that you know about, like what's best for headers, sidebars, footers, these things, any design pattern library that is responsive already?"

Mark: There are some pattern libraries, Starbucks pattern library, the BBC, I know, is working on a responsive gel library. There are some things that are cropping up, but it's so emergent at the moment. We don't know the answers. We're just tumbling down the rabbit hole at the moment, and we're freaking out a little bit.

I think it's going to take time for those patterns to emerge and best practices to emerge. People are writing a lot. You mentioned Brad Frost. He's writing a lot of stuff. If you want to follow Brad Frost, actually, Ben Callahan is a guy you want to have a look at.

He talked a lot about retrofitting responsive design, so actually taking an existing fixed site and what to do and how to do it. It was quite a technical talk. It's really good. I heard him speak last week, so have a look at that as well.

Chris: Cool. Thank you very much.

Mark: Great. Thank you, everybody. [applause]