Phase2's Newest Author Talks RWD

Sara Olson, Marketing Analyst
#Drupal | Posted

We are thrilled to congratulate Senior Developer Mike Crittenden on publishing his first book! Responsive Theming for Drupal: Making Your Site Look Good on Any Device is now officially available from O'Reilly Media. Mike joins Phase2's small but distinctive club of published authors, which includes Tracy Smith for his 2011 book Drupal Intranets with Open Atrium.

MikeC

We grabbed Mike for a quick Q&A about his new book and experience as a published writer. Enjoy!

Give us the scoop! Tell us a little more about your book.

Sure. Responsive Theming for Drupal is a foundation for learning how to make a Drupal site behave responsively, meaning it should look good on devices of all sizes, without any trickery like theme switching. It first introduces responsive web design (RWD) in general, then runs through an example of making a simple Drupal theme responsive, then dives into working with a few popular base themes to extend them. You'll also find some RWD gotchas and common issues and client questions, along with solutions.

It's a book for someone who has a limited knowledge of Drupal and wants to know how to make a Drupal site responsive. By "limited knowledge of Drupal" I mean that the reader should be familiar with basic Drupal concepts like blocks and nodes but might not have much advanced site building or theming experience.

That said, there's still a lot of meat here for people who have done more advanced theming or development and want to take a deep dive into, say, the Aurora base theme, or implementing responsive images (i.e., loading differently sized images based on device size to save bandwidth).

It's a pretty easy read. It's also fairly short, clocking in at 78 pages, so it's not overwhelming or scary at all.

What made you decide to write a book?

I actually got contacted by a publishing company out of the blue. They asked if I was interested in writing a book on RWD and Drupal, and I said YES. So we started going through the initial back and forth on deciding on book length, specific topics, tone, stuff like that. After a period of that, I finally realized they wanted the book to be a cut and dry set of instructions (do this, then that, then this other thing) for each approach to making a Drupal site responsive. They didn't want me to include any discussion on the multiple approaches you could take, like which approach is good in which situation, why one base theme might win over the others, etc. I fought against that for a while but it was a losing battle so I finally said that it wasn't going to work out.

However, by then I had gotten myself so excited about the idea of the book that I decided to shop around at other publishers to see if anyone else would be interested and would give me a little more freedom. My first choice was O'Reilly because, well, it's O'Reilly. From there, it was smooth sailing--a few phone calls, a book proposal, and we got the green light!

why is a mobile-first approach to rwd important?

Good question. Let's first back up and define a couple things. We're basically asking whether it's better to default to the best possible user experience and then dumb things down on devices that don't support them (i.e., "graceful degradation") or start with the lowest common denominator and add shiny features in for devices that support them (i.e., "progressive enhancement"). The difference is subtle, but important.

In graceful degradation, you build the site specifically for users with all the top capabilities and technologies--specifically, desktop users with good, up-to-date browsers. Once that's done, you then selectively remove highly interactive features such as <canvas> and high-performance features, such as animations for devices or outdated browsers that can't handle them. You'll also want to adapt the layout as the screen size gets smaller by removing extraneous sections, resizing images, stacking columns on top of each other rather than beside each other, and so on.

In progressive enhancement, you build the site first for mobile users. This means you make the site for users with touch-based devices and a small screen, so all the functionality you provide or the designs you come up with are specifically designed to look good and work well on smartphones. And then, once that's done, you can restyle the design for larger resolutions or add in things that touch-based users would have trouble with.

[blockquote]It's important to target mobile first, because mobile users are quickly becoming the most important demographic for the majority of new websites. Targeting them first ensures that they have the best experience possible.[/blockquote]

Think about it logically. If you build a site for desktop users, everything else becomes an afterthought by definition. For example, suppose that your desktop design includes a fancy slideshow, a sweet widescreen layout, or some hover effects. When the time comes to make it work for mobile, you'll probably just remove that stuff and replace it with the bare minimum. You might cut out the slideshow or just display all of the items at once. You might stack the widescreen layout with each section on top of the next. You might remove whatever section had the hover effects, if they're not absolutely necessary. In the end, mobile users will probably end up with what is basically the desktop site except with stuff removed or rearranged so that it doesn't break on mobile.

However, if you build with mobile first in mind, you're a lot more likely to take advantage of everything mobile has to offer. Maybe you'll be able to make use of the touchscreen to build a rich touch-based UI. Maybe you'll use the accelerometer for some interactive feature. Maybe you are just more likely to build an awesome design that looks great on small resolutions than if you were just trimming down a desktop design. It can take many shapes and forms, but it all goes to show that the first target is important.

how did your work at phase2 help you on this project?

Working at Phase2 means I'm working with state of the art Drupal implementations for large, complex sites all day every day. I get a lot of experience dealing with real problems that real clients have and proposing and implementing solutions.

One of those common problems is obviously "How can I make my site mobile friendly?" That is the question that led to this book being written. At Phase2, we have dealt with that question in many different ways for many different clients, so we're well versed and able to talk about the pros and cons of the different approaches from experience.

any future books in the works?

Six months ago I would have said "The world needs a good book on high performance Drupal! I want to write it!" But then High Performance Drupal happened, which filled that niche. So, for now, I'll probably lay off the writing.

That said, Drupal 8 will bring a whole new set of challenging technical areas that need documentation, so who knows what my answer will be a year from now?

Sara Olson

Marketing Analyst