756 days since this post was last revised. Specific details are likely out of date.

Same title, same subject; different book.

TL;DR: The 2nd edition is a completely different work. It includes Flexbox, Responsive Images, SVG, @supports, CSS Level 4 media queries and more.

Get it here:

Packt have also got a great page that gives a good overview of everything that’s in the book along with a link to a free chapter. Head over to https://www.packtpub.com/web-development/responsive-web-design-html5-and-css3-second-edition for all the detail. Click the ‘read more’ link at the bottom centre and you can expand each chapter section on the left.

Back in April 2012 my first book, ‘Responsive Web Design with HTML5 and CSS3’ was published by Packt Publishing. It was only the 2nd book published on the subject of responsive web design, Ethan Marcotte’s own ‘Responsive Web Design’ being the first.

In the summer of 2014 I was asked by Packt to write a second edition of the book. To bring it up to date, revise any code syntaxes etc. However, I couldn’t get excited about merely updating what I’d already done. The more I looked back on that book the more I wanted to do something completely different.

The first book worked by taking a desktop design and converting it, chapter by chapter, into a fully working responsive web design. You didn’t need to read it in a linear fashion but diving into a later chapter could be tricky as the examples were entwined with the code from earlier chapters.

All the technical books I have gotten most use out of over the years didn’t work that way. Although related, each chapter could standalone. That way, if you just wanted to grok or re-learn a particular subject (JavaScript variable hoisting and callbacks being the ones I personally re-read every 2–3 months) it was easier to dip back in and re-acquaint.

For the second edition, this has been the fundamental change. All chapters can be read in isolation. I’d encourage any reader to read all the chapters linearly but my hope is that any chapter can be read on its own and the subject matter will make complete sense and none of a chapters example code will rely on prior chapters.

What else?

  • There are no vendor prefixes in the code. Vendor prefixes are explained but tooling like Autoprefixer is recommended instead.
  • There’s a huge section on Flexbox. Virtually all of Chapter 3 is dedicated to it. Right now, I think it’s the most appropriate layout technique for most situations so I wanted to give readers everything they need to get a good handle on it.
  • Responsive images is covered in detail. Full coverage of the syntaxes needed to switch resolutions and perform art direction image techniques
  • SVG. All the implementation options and shortfalls. Inline in HTML, background images, inside an img or object tag. Also an example of how to animate SVG with JavaScript libraries (cause IE won’t let you animate SVG any other way!).
  • @supports, CSS Filters, Level 4 media queries (scripting, interaction, environmental), linking CSS and JS media queries and lots more.

Code samples and book website:

You can grab the code samples from GitHub or via the dedicated website: rwd.education/download.zip. There will be a dedicated website at http://rwd.education in the coming months but for now it’s just the downloads there.

A note on the plethora of similarly names titles from Packt

For reasons I don’t understand, nor appreciate, it saddens me to relate that Packt has seemed intent on plundering the success of the first edition by releasing a multitude of different books, covering the same subject, with similar titles by different authors.

I’d like to state quite clearly I have nothing to do with, in any shape or form whatsoever, any of the Responsive web design with HTML5 and CSS3 ‘cookbooks’, ‘mastering’ or ‘By example’ titles that Packt produce.

Review copies

As this is a new book, I would really like to garner some reviews for Amazon. The truth is that most sales go through Amazon and having some reviews helps enormously when people are deciding what to purchase.
Therefore, if any readers would like a free* review copy, I have 5 to give away.

*When I say ‘free’ that’s not really true. In exchange I would like you to leave a review on Amazon. I’m not asking for a false review, just an honest one.

The first 5 people to leave a comment below, “I’d like one” requesting a copy will get one. Please use the email you would like the book sending to (your email will only be seen by me, it is not published in the comments) in the email field and I’ll forward it to the publishers who will get a copy to you.

Thanks in advance people, I really hope you like it.

Ben Frain Developer, Author: 'Enduring CSS', 'Responsive Web Design with HTML5 & CSS3'.