Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Usability

Author Talk: Tim Kadlec on Implementing Responsive Design (Podcast Transcript)

  • Print
  • + Share This
Peachpit publisher Nancy Aldrich-Ruenzel interviews Tim Kadlec, author of Implementing Responsive Design, about why he wrote the book, the Breaking Development conference, and how anyone can start applying responsive design to their site.

This interview is a transcription of the podcast, Tim Kadlec on Implementing Responsive Design.

Like this article? We recommend

Nancy Aldrich-Ruenzel: Welcome to Author Talk.  I’m here today with author and web expert Tim Kadlec.  He is the author of a brand new book called “Implementing Responsive Design,” and he’s here to tell us more about it.  Tim, welcome and congratulations.

Tim Kadlec: Well, thanks Nancy.  I’m happy to be here.

Nancy: So, new devices and platforms are coming out it seems daily.  The browsers are changing at a fast clip, and getting our websites to look good on all devices and browsers seems impossible anymore, but then we learn something about this thing called responsive design.  Can you tell us exactly what responsive web design is and maybe why it’s changed the way we need to think about designing for the web?

Tim: Sure. So, responsive web design, it’s a technique that was introduced by Ethan Marcotte in 2010, and the whole premise is that it lets you build device-agnostic sites.  So you use three existing tools--media queries, fluid grids, and fluid images--and you combine them all under this graphic term responsive web design. And using them, you’re able to create sites that display very nicely at a variety of different resolutions.  So with this one site you can add a site that displays just as nicely on a phone, as it does on a tablet, as it does on a computer. And, larger than that, I think it’s a huge shift in the way that we approach building for the web because it’s us acknowledging the fluid nature of the web.  It’s always been there, but we were kind of ignoring the specifics with layouts.

Nancy: So it’s not just CSS anymore; we’ve got to think differently. So is it a technique or is it a combination of techniques?

Tim: Well, I think it’s a technique, but I think it’s also…a different approach than what we’re used to.  Over the…there were always a few people who would argue for using fluid layouts over fixed width layouts.  But it was always a fairly unpopular cry. And until the iPhone came along and people started using their mobile devices quite heavily to browse the Internet,…it was arguable how much we actually needed to create sites that adapted to these different layouts.  But now that people are using their iPhones and iPads and their Androids and all sorts of different devices to access the web, the fluid nature of the web, which has always been there, we’re finally kind of having to come face to face and acknowledge it.  It’s changing a lot. It’s changing the way that we design, the way we think about it, the way we build, I mean it’s a fundamental shift in this entire medium.

Nancy: So, who did you write the book for?

Tim: So, actually there was one other book out at the time that was written by Ethan, and it was a shorter book, and he crammed it full of a lot of information. But I felt like there was a lot more discussion that needed to be had, because over the time since he had discussed the technique at first, a lot of different best practices had emerged and a lot of things had been learned--you know, hard earned lessons.  And so the book was intended to be for someone who is …either not that experienced with responsive web design, or they are and they want to kind of take their knowledge to the next level and see how it affects all the other aspects of…how they’re interacting with things such as content or design of workflow and see some advanced techniques.  So the first three chapters kind of layout the basics: that’s that media query fluid grid in fluid images.  And then it built on from there to see how does this effect everything else, and also some additional techniques you can use to make closer-to-bulletproof sites (I don’t know if you can ever claim to have a bulletproof site on a web with this many different devices, but closer).

Nancy: So, in thinking about the job functions, it sounds like it could be anyone from a web designer or web developer to content strategists even.

Tim: Yeah, I think that there’s something for everybody to take away.  There is a fair amount of code throughout the book, but as I say in the introduction, I don’t think it’s necessary to necessarily follow along and do all the codes to get the value out of it.  A lot of the chapters and a lot of the really important concepts that are discussed can be understood and are very applicable to designers or, like you said, content strategists.  I think it’s a topic that appeals to a very wide range of people.

Nancy: And how did you go about writing it?  Did the process go smoothly, and what did you learn at the end of writing the book?

Tim: Writing a book is hard (laughter). I think it went fairly smoothly. You know, there’s always lessons learned along the way.  I would say that it was fun, it was a lot of fun.  There was a lot of research that went into it; a lot of email exchanges and phone calls with other people, trying to get an idea for how they were approaching it and really trying to get the nitty gritty of what was going on and how people are tackling this.  Writing a book is time consuming, but...I’m pretty happy with the way it turned out.  I think in the end it turned out very nicely and I hope that everybody else agrees when they read it.

Nancy: Well we certainly agree, but we’re certainly biased as well (laughter).  But really, didn’t a lot of the book come out of the conversations that you had in the community, because it’s a fairly vibrant community of designers talking about responsive design these days, and I’m sure you’ve had many, many conversations with a lot of different folks in the field.

Tim: Oh absolutely. I know that people kind of gloss over the acknowledgements typically in a book, but I tried to point that out there. You know, if anybody ever tells you that writing a book is a solitary act, then they weren’t writing the same kind of book I was, because it absolutely was not.  It was so many conversations, so much helpful feedback along the way, and it really pre-dated that.  Through Breaking Development, the mobile web conference that we do, I had met a lot of people, had some fascinating discussions there, and that had kind of prompted a lot of the thinking that went into this. I view the book a little bit more of a synthesis of some of the incredible thinking that is taking place around responsive design, more so than it is anything that was a bottled up secret.  It was more trying to take that awesome conversation and, like I said, the hard-learned lessons that people kind of already figured out and put them all together in one place so that people would have a guide on how to tackle this.        

Nancy: Right, right.  Well you certainly are spending a lot of time with the industry leaders.  You present at conferences like Web Visions and you also curate Breaking Development.  For folks who aren’t familiar with that, maybe you can tell us a little about what that is.  I know it’s a leading conference here in the U.S.

Tim: Sure. So actually, so I curate and I’m the co-founder of Breaking Development.  It’s a conference that’s focused on web design and development for beyond the desktops, with a strong emphasis on mobile web and stuff like that.  We don’t talk about anything native.  It’s nothing against native at all; in fact native absolutely has its place.  It’s just, I think, the web side of things was under-discussed and I think it’s also to me, at least personally, a little more interesting.  So, it’s a biannual conference.  We’ve got one coming up in late September, here in Dallas, and then one again in April, in Orlando, with two days of 12 people coming in and giving presentations dealing with this stuff.  You know, we try to keep the faces fresh and the topics are always fresh.  And then we follow that up with a day of workshops, and it’s been a lot of fun and I think the attendees have a lot of fun.  We have them in these big, huge resort-like hotels and stuff, so they’re kind of like a biodome.  I think one person explained it as a cross between Jurassic Park and Disneyland.  Hopefully, that’s not terrifying.  It’s actually quite fun.  My favorite part about it is the conversations that take place.  I mean, we are hanging out with everybody until 2 or 3 in the morning, sitting around campfires, just talking about the kind of problems we’re facing and how we’re trying to solve that.  It’s incredibly exhilarating. 

Nancy:  Well I’m sure when you started out writing this you were thinking, “Well what I want my readers to learn is x, y and z.”  So tell folks what you think they’ll be able to do after they read your book, and maybe you could give us a real world example of that.

Tim: Sure. So…the book kind of builds up from the very beginning.  Like I said, the first three chapters [cover] the basics…in case they were coming into the book with no prior experience. By the end of the first three chapters, everybody’s going to be on a similar page and then can explore from there how a Responsive approach affects the planning stages.  So, like looking at analytics to determine what devices you need to try and target and test on.  How to build a test bed.  Into the design workflow, so are we making a mistake using static mockups.  Are we designing in the browser or Photoshop and what do we do there?  You know, that kind of thing, wire-framing.  And once you’ve gone through there then we start looking at content, because content is a huge piece of this.  How do you combine it, like service site detections, more robust solutions and ultimately it kind of concludes with a little bit more broader thinking of responsive design, more of a concept.  Like, how do we apply this kind of mindset of building for a web that can go anywhere to create richer, more immersive experiences.  And so I think that by the time everybody’s done, you’ll absolutely be able to build a responsive design from scratch, but you’ll hopefully, also, be armed with the information you need to be able to…start to readjust, find a workflow that works for you guys with your company for this particular kind of project.  So yeah, like I said, I think the goal is that by the end of the book you’d be very comfortable building your own responsive sites and also incorporating that kind of practice into your teams. 

Nancy:  That’s great.  So it’s kind of a two-pronged approach then.  One is, you’ve got what you need to design the site, but you’ve also got what you need to re-architect the workflow for the way in which you create your website altogether.   So is it going to be easier for people who are creating fresh or those who are kind of reengineering an existing website? 

Tim: You know, I think it is, especially if you’re going to build from the mobile first concept--that is, build them for the mobile device first and kind of build up.  I think it’s easier going fresh, but we do talk about changing from a fixed width pixel layout-based site and using pixels for fonts and everything like that, and we do talk about how to convert that to more fluid units, so ems for type and percentages and stuff like that for the lists.  So there is some value there, absolutely, if you’re going to have to incorporate these responsive approaches into an existing site.  And there’s actually…a bunch of sidebars by brilliant, brilliant people, but one of the sidebars is specifically about kind of taking those baby steps.  The BBC took this baby step of combining the separate site with the responsive approach and sort of building on top of that, so ultimately it’s their end goal to be responsive all the way across.  But again, it’s taking baby steps and applying that to an existing solution.

Nancy:  So you don’t have to do it all at once.  You can start to just chip away at it.

Tim:  I mean, if time allows, then absolutely.  But otherwise, yeah, just start chipping away. 

Nancy: Great, good.  Well, listen Tim, thank you for your time today and congratulations on your new book. 

Tim: Thanks, Nancy. 

  • + Share This
  • 🔖 Save To Your Account

Peachpit Promotional Mailings & Special Offers

I would like to receive exclusive offers and hear about products from Peachpit and its family of brands. I can unsubscribe at any time.

Overview


Pearson Education, Inc., 221 River Street, Hoboken, New Jersey 07030, (Pearson) presents this site to provide information about Peachpit products and services that can be purchased through this site.

This privacy notice provides an overview of our commitment to privacy and describes how we collect, protect, use and share personal information collected through this site. Please note that other Pearson websites and online products and services have their own separate privacy policies.

Collection and Use of Information


To conduct business and deliver products and services, Pearson collects and uses personal information in several ways in connection with this site, including:

Questions and Inquiries

For inquiries and questions, we collect the inquiry or question, together with name, contact details (email address, phone number and mailing address) and any other additional information voluntarily submitted to us through a Contact Us form or an email. We use this information to address the inquiry and respond to the question.

Online Store

For orders and purchases placed through our online store on this site, we collect order details, name, institution name and address (if applicable), email address, phone number, shipping and billing addresses, credit/debit card information, shipping options and any instructions. We use this information to complete transactions, fulfill orders, communicate with individuals placing orders or visiting the online store, and for related purposes.

Surveys

Pearson may offer opportunities to provide feedback or participate in surveys, including surveys evaluating Pearson products, services or sites. Participation is voluntary. Pearson collects information requested in the survey questions and uses the information to evaluate, support, maintain and improve products, services or sites; develop new products and services; conduct educational research; and for other purposes specified in the survey.

Contests and Drawings

Occasionally, we may sponsor a contest or drawing. Participation is optional. Pearson collects name, contact information and other information specified on the entry form for the contest or drawing to conduct the contest or drawing. Pearson may collect additional personal information from the winners of a contest or drawing in order to award the prize and for tax reporting purposes, as required by law.

Newsletters

If you have elected to receive email newsletters or promotional mailings and special offers but want to unsubscribe, simply email ask@peachpit.com.

Service Announcements

On rare occasions it is necessary to send out a strictly service related announcement. For instance, if our service is temporarily suspended for maintenance we might send users an email. Generally, users may not opt-out of these communications, though they can deactivate their account information. However, these communications are not promotional in nature.

Customer Service

We communicate with users on a regular basis to provide requested services and in regard to issues relating to their account we reply via email or phone in accordance with the users' wishes when a user submits their information through our Contact Us form.

Other Collection and Use of Information


Application and System Logs

Pearson automatically collects log data to help ensure the delivery, availability and security of this site. Log data may include technical information about how a user or visitor connected to this site, such as browser type, type of computer/device, operating system, internet service provider and IP address. We use this information for support purposes and to monitor the health of the site, identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents and appropriately scale computing resources.

Web Analytics

Pearson may use third party web trend analytical services, including Google Analytics, to collect visitor information, such as IP addresses, browser types, referring pages, pages visited and time spent on a particular site. While these analytical services collect and report information on an anonymous basis, they may use cookies to gather web trend information. The information gathered may enable Pearson (but not the third party web trend services) to link information with application and system log data. Pearson uses this information for system administration and to identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents, appropriately scale computing resources and otherwise support and deliver this site and its services.

Cookies and Related Technologies

This site uses cookies and similar technologies to personalize content, measure traffic patterns, control security, track use and access of information on this site, and provide interest-based messages and advertising. Users can manage and block the use of cookies through their browser. Disabling or blocking certain cookies may limit the functionality of this site.

Do Not Track

This site currently does not respond to Do Not Track signals.

Security


Pearson uses appropriate physical, administrative and technical security measures to protect personal information from unauthorized access, use and disclosure.

Children


This site is not directed to children under the age of 13.

Marketing


Pearson may send or direct marketing communications to users, provided that

  • Pearson will not use personal information collected or processed as a K-12 school service provider for the purpose of directed or targeted advertising.
  • Such marketing is consistent with applicable law and Pearson's legal obligations.
  • Pearson will not knowingly direct or send marketing communications to an individual who has expressed a preference not to receive marketing.
  • Where required by applicable law, express or implied consent to marketing exists and has not been withdrawn.

Pearson may provide personal information to a third party service provider on a restricted basis to provide marketing solely on behalf of Pearson or an affiliate or customer for whom Pearson is a service provider. Marketing preferences may be changed at any time.

Correcting/Updating Personal Information


If a user's personally identifiable information changes (such as your postal address or email address), we provide a way to correct or update that user's personal data provided to us. This can be done on the Account page. If a user no longer desires our service and desires to delete his or her account, please contact us at customer-service@informit.com and we will process the deletion of a user's account.

Choice/Opt-out


Users can always make an informed choice as to whether they should proceed with certain services offered by Adobe Press. If you choose to remove yourself from our mailing list(s) simply visit the following page and uncheck any communication you no longer want to receive: www.peachpit.com/u.aspx.

Sale of Personal Information


Pearson does not rent or sell personal information in exchange for any payment of money.

While Pearson does not sell personal information, as defined in Nevada law, Nevada residents may email a request for no sale of their personal information to NevadaDesignatedRequest@pearson.com.

Supplemental Privacy Statement for California Residents


California residents should read our Supplemental privacy statement for California residents in conjunction with this Privacy Notice. The Supplemental privacy statement for California residents explains Pearson's commitment to comply with California law and applies to personal information of California residents collected in connection with this site and the Services.

Sharing and Disclosure


Pearson may disclose personal information, as follows:

  • As required by law.
  • With the consent of the individual (or their parent, if the individual is a minor)
  • In response to a subpoena, court order or legal process, to the extent permitted or required by law
  • To protect the security and safety of individuals, data, assets and systems, consistent with applicable law
  • In connection the sale, joint venture or other transfer of some or all of its company or assets, subject to the provisions of this Privacy Notice
  • To investigate or address actual or suspected fraud or other illegal activities
  • To exercise its legal rights, including enforcement of the Terms of Use for this site or another contract
  • To affiliated Pearson companies and other companies and organizations who perform work for Pearson and are obligated to protect the privacy of personal information consistent with this Privacy Notice
  • To a school, organization, company or government agency, where Pearson collects or processes the personal information in a school setting or on behalf of such organization, company or government agency.

Links


This web site contains links to other sites. Please be aware that we are not responsible for the privacy practices of such other sites. We encourage our users to be aware when they leave our site and to read the privacy statements of each and every web site that collects Personal Information. This privacy statement applies solely to information collected by this web site.

Requests and Contact


Please contact us about this Privacy Notice or if you have any requests or questions relating to the privacy of your personal information.

Changes to this Privacy Notice


We may revise this Privacy Notice through an updated posting. We will identify the effective date of the revision in the posting. Often, updates are made to provide greater clarity or to comply with changes in regulatory requirements. If the updates involve material changes to the collection, protection, use or disclosure of Personal Information, Pearson will provide notice of the change through a conspicuous notice on this site or other appropriate way. Continued use of the site after the effective date of a posted revision evidences acceptance. Please contact us if you have questions or concerns about the Privacy Notice or any objection to any revisions.

Last Update: November 17, 2020