Hey, there! I'm Christopher Schmitt and I'm writing a book and developing a course that teaches the principles of responsive web design (RWD) — through converting page layouts and elements of existing legacy web sites.
"Perfect for companies like yours." - Jeffrey Zeldman
How Responsively Retrofitting is different from other books is that we go through converting page layouts and elements of existing, legacy web sites. While starting from scratch is the best way to build a responsive site, not all of us get the opportunity.
Some web builders and site owners don't have the budget for a new web site thus making a retrofitting approach more financially feasible.
Even if you could start from scratch, it's not a good idea to totally reinvent the wheel with a new design.
By retrofitting an existing site, we can open up the site to more devices within a sites' current visual style while not alienating current users.
"One option for going responsive is doing a responsive retrofit. Learn from [Christopher] how to do it right." - Karen McGrane
WHY A MAKEOVER BOOK FOR RWD?
With the surge in mobile browsing and mobile commerce, our legacy sites and apps now need to be re-imagined for more than desktop browsers: tablets, smart phone browsers, watches, and — who knows? — maybe smart glasses will back a come back.
But the key is to build for devices that have not been invented yet and away from desktop-only mentality.
HOW IS THIS BOOK DIFFERENT?
To make sure the content in Responsively Retrofitting is approachable, the book won't be neither tediously technical nor theoretical overview.
With hands-on walkthrough projects, the goal is to help you retrofit today’s legacy web sites for tomorrow’s mobile devices.
In the same vein as my previous book projects — CSS Cookbook, Designing Web & Mobile Graphics, and HTML5 Cookbook — I aim to create a book that focuses on what is practical to take existing sites and web elements through a series of HTML5 and CSS examples found in typical web projects today.
"Eager to get my hands on [Christopher's] Responsively Retrofitting: Responsive Web Design Makeovers book." - Petra Gregorová
PRINT PUBLISHING & DISTRIBUTION
One of my favorite publishers, O’Reilly Media, is going to publish the print and e-book editions of the book.
If you haven't heard of them, they make great technical books! O'Reilly has been making solid web development books since web safe palettes, Dynamic HTML, and even the first browser wars! (Remember those?!)
Like on past book projects, I'll be working with a great O'Reilly editorial team to usher the book from manuscript to distribution.
FOCUSING ON E-BOOK DEVELOPMENT
The popularity of e-books is without question today. E-books are easier to buy and carry around than a backpack filled with books. The sale of e-books is outpacing physical books — so I want to make sure there's an e-book version of the book.
Sadly, while there are efforts to improve the quality, the design quality of most e-books is a little less than desired.
Since most people’s only contact with the book will be as an e-book, it is a paramount concern for me that we design a quality e-book experience that is both a joy to read and helps aid the reader.
For this project, I'm creating a quality e-book experience by focusing where possible on:
- Improving typography,
- Page layouts for popular e-readers,
- Creating longer video demos, and
- Adding additional enhancements where possible
RETROFITTING ONLINE COURSE
In addition to writing a number of web design books, I've developed courses for Sessions College, the first accredited online graphic design school, and Lynda.com, the popular online learning company.
With Responsively Retrofitting, I intend to create an online course with the goal to aid the reader with complimentary responsive web design material that’s not possible in an e-book.
This includes material like deep diving into the minutiae of RWD parts such as navigation menus and providing additional video demonstrations that cannot be included an e-book due to file size limitations.
If you want to get a copy of the online course with the e-book, you can grab the respective Kickstarter reward level to get both a copy of the ebook and online course!
TABLE OF CONTENTS
This table of contents Responsively Retrofitting represents the beginning of the journey:
Responsively Retrofitting Chapters:
- Makeover ① — Converting Layout to Proportions
- Makeover ② — Building out a Simple Menu Navigation for Mobile
- Makeover ③ — Adjusting a Multi-Tiered Navigation Menu
- Makeover ④ — Working with Responsive Images
- Makeover ⑤ — Adding Video
- Makeover ⑥ — Retrofitting HTML Tables
- Makeover ⑦ — Responsive Ads
- Makeover ⑧ — Improving Speed & Performance
- Makeover ⑨ — Finding Nearest Location
- Appendix Ⓐ —HTML5 Resources
- Appendix Ⓑ —CSS3 Resources
- Appendix Ⓒ —RWD Resources
Thanks to friends and colleagues, I'm able to offer some amazing rewards as part of this project:
Again, another thanks to all my friends and colleagues for lending their time and talents. Here's a more detailed look at the rewards:
Our Undying Love
By donating the smallest amount possible, you unlock my undying love. Every small bit helps me move along the journey. By contributing, you get access to the book's project as it unfolds!
Besides my artistic contribution, we will have an amazing art collection of digital wallpapers for you to hang on your desktop or mobile device wall:
Rich Grillotti is pixel artist/animator and co-founder of PixelJam, the retro low resolution game
Ari Stiles is conference organizer extraordinaire. In previous lives, she's been an Art Director, a Newspaper Production Manager, Experimental Video Maker, and a Storyteller.
and myself! I am trained designer from an fine art college. True fact: I was a professional artist before a professional designer.
Copy of E-book
Get a copy of the book in three different flavors: PDF, ePub, Kindle-compatible .mobi. Because you contributed, each version is free of DRM because it's your book and DRM is silly.
The e-books will be fully searchable, and you can cut-and-paste and print them. If you have an e-book device or computer, you will be able to read the book.
For being an awesome supporter, I will list you in the acknowledgements for the book. Any why not? Without you, I wouldn't have made this possible!
3 Months of Front-End Training
The fine folks at Frontend Masters are donating ten three-month memberships to their recorded workshop sessions. Learn from some of the best in web design and development as they dive deep into their respective disciplines!
Early Adopter Day One
You get day one access to all the code, text, images, issues, etc. via GitHub. As soon as I commit a chapter, you get first dibs on it.
While there might be typos, but you will also will access to the content sooner than anyone else!
As big fan of geeky tshirts, I will be designing a truly one-of-a-kind shirt that reflects you will want to wear time and time again. Warning: It might glow-in-the-dark and/or have hypercolor.
RWD Summit 2015 Special
The annual RWD Summit is an online conference where the best minds in RWD come together and share their expertise and participate with an international audience. You get all three days of recordings for a great reward level.
CSS Summit 2015 Special
Similar to RWD Summit, but longer running is the CSS Summit. While CSS is the main focus, other topics including SVG, animation, new layout techniques, HTML emails, and much more are discussed. With this reward, you also get all three days of CSS Summit recordings.
Ever wanted to bend the ear of an industry peer? From design to programming, we have plenty of experts donating their time:
Estelle Weyl is the author of numerous books on HTML5 and CSS and a sought-after international speaker. If it's written in the W3C spec, she knows how the browser really renders it.
Dave Rupert is Founder & ⅓ of Paravel, three-man web design & branding shop, and co-host of the wonderful Shop Talk Show podcast.
Ben Callahan is President of Sparkbox, a leading agency firm on responsive web design for the multi-device web.
Trent Walton is Founder & ⅓ of Paravel, three-man web design & branding shop located in Austin that's helped clients like Microsoft and RetailMeNot.com go responsive.
Dan Mall is the Founder & Design Director at SuperFriendly that has handled RWD makeovers for Tech Crunch and Entertainment Weekly.
Ryan Irelan is President of Mijingo and formerly VP of Technology at Happy Cog. Which means he can help you with the big picture in getting things done on the Internet as well how to build it.
Stephen Hay is a web design and development strategist and the author of Responsive Design Workflow.
Greg Storey, Design Practice Manager at IBM, has hired, managed, and lead a number of design and development teams, creating websites for everything from NCAA sports tournaments to AAA game titles, telemedicine to Fortune 100 brands.
Sam Richard is UI Architect at IBM Watson. He's skilled at design and development, especially for the web.
After the book is published, I will travel to where you are and cover in more detail anything written for Responsively Retrofitting or from the process of writing the book. Valid only for USA and Canada.
HOW WILL THE FUNDS BE SPENT?
Funds raised through the Kickstarter go towards writing, design and implementing a well-produced e-book for multiple digital reader platforms including, but not limited to:
- Writing time,
- Design time,
- Production time,
- E-book design research,
- Font licenses,
- Photography purchases,
- Kickstarter fees,
- Course development, and
- T-shirt reward designs and processing
If we are lucky and raise funds beyond the initial goal, those additional funds could go to potentially adding Stretch Goals, new Reward Levels, and/or funding new book projects.
WORK ON THE BOOK HAS
The good news is that writing for the book is already under way—with draft of book elements already completed.
And thanks to Jeremy Loyd, Creative Director at Sparkbox — one of the leading agencies on responsive web design, we have some great project designs for the makeover projects:
NEED YOUR SUPPORT
Where does that leave us? Well, I need your help to make this the best book on learning responsive web design it can be.
If you would, please donate and pick your reward level to help make this book an important part of web design education!
Thank you an advance for your support!
Risks and challenges
➊ There is some risk with any project, especially with writing technical books. While this isn't my first technical book — or second or even third — there is a necessary amount of work involved to make it live up to O'Reilly and my standards.
➋ The main focus of this project and Kickstarter project is to help make an impressive e-book version. Time for testing has been added to the traditional print book writing schedule to not only test and develop designs and workflows for ebook development.Learn about accountability on Kickstarter
- (30 days)