Foundation HTML5 with CSS3 was a book I co-wrote with Jason Garber in 2011-2012. It was a combination reference and textbook, explaining every element in HTML5 (at the time of writing) and how to use it, along with enough introductory CSS to handle basic styling and layout. Every element needed some example markup, and to keep it fun we incorporated various comic book and superhero references into all the code samples.
This culminated in the final chapter where we walked the reader through building a website, from information architecture and wireframes to markup and style. The site we made was for an imaginary retailer, Power Outfitters Superhero Costume & Supply Co., proud purveyors of practical paraphernalia for the contemporary costumed crime-fighter. It was fun to design as well as build, and I like the way it turned out. And I got to draw a sweet bionic eye.
Of course, this was made over a decade ago and the state of the web has changed a lot. Responsive design was still a fairly new thing, and frankly felt a bit too advanced for this book so I only briefly touched on it in the last chapter. The Power Outfitters site is only marginally responsive and isn’t at all optimized for mobile devices or high-resolution screens. Flexbox and grid layout weren’t things at all yet, so this is all old-school floats and positioning. That makes it fairly dated by current standards and best practices, but that’s just how time works.