Posts in the Books Category

On Monday, July 3rd, as I sat in the living room of a house just a bit north of New York City, I pushed the last writing and editing changes to CSS: The Definitive Guide, Fourth Edition and notified the production department at O’Reilly that it was ready.

All twenty chapters, three appendices, and associated front matter are now in their hands.

It’s been a long and difficult journey to get here.  Back in 2011-2012, I started updating chapters and releasing them as standalone books, for those who wanted to grab specific topics early.  In mid-2013, I had to stop all work on the book, and wasn’t really able to get back into it until mid-2015.  At that point, I realized that several new chapters had to be added — for example, when I started out on this edition, Flexbox and Grid were pie-in-the-sky ideas that might or might not come to pass.  Feature queries weren’t a thing, back then.  Filters and masks and blend modes were single-browser at best, when I started out.  And forget about really complex list counters.

Now all those topics (and more!) have chapters, or at least major sections.  Had I not been delayed two years, those topics might not have made it into the fourth edition.  Instead, they’re in there, and this edition may well end up twice as long as the previous edition.

I also might not have brought on a co-author, the inestimable Estelle Weyl.  If not for her contribution in new material and her close, expert review of the chapters I’d already written, this book might have been another year in the making.  The Guide was always my baby, but I couldn’t be happier that I decided to share it with Estelle, nor prouder that her name will be on the cover with mine.

Speaking of major changes, I probably wouldn’t have learned AsciiDoc, nor adopted Atom as an authoring environment (I still use BBEdit for heavy-lift text processing, as well as most of my coding).  O’Reilly used to be a “give us your Word docs!” shop like everyone else, but that toolchain doesn’t really exist any more, from what I can tell.  In fact, the first few chapters I’d given them were in Word.  When I finally returned to writing, they had to give me those chapters back as AsciiDoc exports, so I could make updates and push them to O’Reilly’s internal repository.  The files I created to create figures in the book went into their own public repository, which I’ll get to reorganizing once the text is all settled and the figure numbers are locked in.  (Primary to do: create chapter lists of figures, linked to the specific files that were used to create those figures.  Secondary to do: clean up the cruft.)

As of this moment, the table of contents is:

• Preface

1. CSS and Documents
2. Selectors
3. Specificity and the Cascade
4. Values, Units, and Colors
5. Fonts
6. Text Properties
7. Basic Visual Formatting
8. Padding, Borders, Outlines, and Margins
9. Colors, Backgrounds, and Gradients
10. Floating and Shapes
11. Positioning
12. Flexible Box Layout
13. Grid Layout
14. Table Layout in CSS
15. Lists and Generated Content
16. Transforms
17. Transitions
18. Animation
19. Filters, Blending, Clipping, and Masking
20. Media-Dependent Styling

• Appendix A: Animatable Properties
• Appendix B: Basic Property Reference
• Appendix C: Color Equivalence Table

Disclaimer: the ordering and titles could potentially change, though I have no expectation of either.

I don’t have a specific timeline for release as yet, but as soon as I get one, I’ll let everyone know in a post here, as well as the usual channels.  I expect it to be relatively speedy, like the next couple of months.  Once production does their thing, we’ll get it through the QC process — checking to make sure the figures are in the right places and sizes, making sure no syntax formatting got borked, that kind of thing — and then it’ll be a matter of getting it out the door.

And just in case anyone saw there was news about O’Reilly’s change in distribution and is wondering what that means: you can still buy the paper book or the e-book from your favorite retailer, whether that’s Amazon or someone else.  You just won’t be able to buy direct from O’Reilly any more, except in the sense that subscribing to their Safari service gives you access to the e-book.  That does mean a tiny bit less in royalties for me and Estelle, since direct paper sales were always the highest earners.  Then again, hardly anyone ever bought their paper copies direct from O’Reilly, so honestly, the difference will be negligible.  I might’ve been able to buy an extra cup of coffee or two, if I drank coffee.

It feels…well, honestly, it feels weird to have finally reached this point, after such a long time.  I wish I’d gotten here sooner for a whole host of reasons, but this is where we are, and regardless of anything else, I’m proud of what Estelle and I have created.  I’m really looking forward to getting into your hands.

• CSS: The Definitive Guide, 4th Edition was published on Wednesday, July 5th, 2017.
• It was assigned to the Books, CSS, Web, and Writing categories.
• There have been six replies.

Available as of this morning from A Book Apart in both digital and paper formats: Design for Real Life, the book Sara Wachter-Boettcher and I started writing not quite a year ago.

Anil Dash was kind enough to write a wonderful foreword for the book, in which he perfectly describes the background we were working against:

Two billion people now have some kind of access to internet technologies, and almost all of them are spending more and more time with their thumbs flicking across their phones. And the technology they’re using has a real impact on their lives. They don’t use an app to “share photos”; they use it to maintain a relationship with distant family. They don’t need to do “online banking”; they need to lend a friend money to help them out of a jam. Nobody wants to learn a complicated set of privacy controls; they just want to be able to express themselves without antagonizing bosses or in-laws.

Our thesis, against that, was to say, “As personal and digital lives become closer and effectively merge, the things we design will have to work harder and harder to deal with real people in all their messy complexity.  How can we start people thinking about this, and what tools can we give them?”  That’s what we strove to create, and now you can judge for yourself whether we succeeded.

I’ll be honest: we were pretty scared as we wrote it.  This is not a topic area that’s gotten a ton of attention, and in a lot of ways we were breaking new ground — but, at the same time, we were very aware that there was existing research and knowledge in related areas, so we wanted to be sure we were inclusive or, and respectful of, that work.  We talked to a lot of people in a variety of disciplines, trying to make sure we brought in information that would help the reader and not flying in the face of things that were already known.

So you can imagine our relief and gratitude as we’ve heard glowing reactions from people who read preview drafts — among them Kim Goodwin, Indi Young, Sara Soueidan, Caren Litherland, and Karen McGrane.  Paul Ford said, “Anyone who aspires to build global products that people love should read this book now,” and Kate Kiefer Lee said, “It will be required reading on my team.”

You might think cover blurbs like those are pure marketing fluff, and maybe in some genres they are.  For us, they serve double duty: to let you know that people who know what they’re talking about believe we know what we’re talking about, and also to let us know that.  There were days we weren’t entirely certain.

To be clear, this isn’t a book about forever treating people with kid gloves.  We say “compassion isn’t coddling”, and that’s absolutely the case.  An error message still needs to convey the error; an account lockout still needs to keep the account locked.  But how we convey errors or lockouts, and how we make people aware of the possible ramifications of their actions, is critical.  Just as there are good ways and bad ways to commiserate with a grieving friend or handle a difficult work situation, there are good ways and bad ways to approach people in our designs.

As I said before, we need to deal with real people, in all their messy complexity.  We hope Design for Real Life is the start of a whole new conversation within our field, one that will teach Sara and me just as much as anyone else about how we can be more thoughtful and humane in what we create.

• Design For Real Life Now Available was published on Tuesday, March 8th, 2016.
• It was assigned to the Books, Design, Projects, and Writing categories.
• There have been two replies.

On March 8th, 2016 — just eight days from the day I’m writing this — Design for Real Life will be available from A Book Apart.  My co-author Sara Wachter-Boettcher and I are really looking forward to getting it into people’s hands.

The usual fashion is to say something like “getting it into people’s hands at long last”, but in this case, that’s not really how it went down.  Just over a year ago now, Sara published “Personal Histories”, and it was a revelation.  In her post, I could see the other half of the book that was developing in my head, a book that was growing out of “Designing for Crisis” and “Inadvertent Algorithmic Cruelty”.  So I emailed Sara and opened with:

Your post was like a bolt of lightning for me.  In the same way the Year in Review thing opened my eyes to what lay beyond “Designing for Crisis”, your post opened my eyes to how far that land beyond reaches.

After research and some intense discussions, we started writing in the spring of 2015, and finished before summer was over.  Fall of 2015 was devoted to rewrites, revisions, additions, and editing.  Winter 2015-2016 was spent in collaborative editorial and production work by the amazing team at A Book Apart.  And now…here we are.  The book is just a week away from being in people’s hands.

To celebrate, Sara and I will be hosting, with incredibly generous support from A Book Apart and PhillyCHI, a launch party at Frankford Hall in Philadelphia.  We’ll be providing some munchies, some tasty adult beverages, and there will be giveaways of both paper and digital copies of the book.  We’d love to see you there!  If you can make it, please do RSVP at that link, so we know how much food to order.

We chose Philadelphia as the site for our launch party for a few reasons.  For one, Sara lives there, so only one of us had to travel.  But to me, it brings some very personal histories full circle, because Philadelphia is where this really all got started.  It’s where Rebecca first went to be treated, where she was given the best possible shot at life, and where I started to notice the failures and successes of user experience design when it collided with the stresses of real life.

In a number of ways, this book has been a labor of love.  The most important, I think, is the love Sara and I have for our field, and how we would love to see it become more humane — really, more human.  That’s why we packed the book not just with examples of good and bad design choices, but of how we can do better.  The whole second part of the book is about how to take the principles we explore in the first part and put them to work right now — not by throwing out your current process and replacing it with a whole new, but by bringing them into your existing practice.  It’s very much about enhancing what you already do.

It’s been an intense process, both emotionally and work-wise.  We pushed as hard as we could to get this to you as soon as we could.  Now the time is almost here.  We’re really looking forward to hearing what you think of it.

• Design for Real Life was published on Monday, February 29th, 2016.
• It was assigned to the Books, Design, and Web categories.
• There have been four replies.

It’s time for a semi-periodic update on CSS: The Definitive Guide, 4th Edition!  The basic news is that things are proceeding, albeit slowly.  Eight chapters are even now available as ebooks or, in most cases, print-on-demand titles.  Behold:

• CSS and Documents, which covers the raw basics of how CSS is associated with HTML, including some of the more obscure ways of strapping external styles to the document as well as media query syntax.  It’s free to download in any of the various formats O’Reilly offers.
• Selectors, Specificity, and the Cascade, which combines two chapters to cover all of the various Level 3 selector patterns as well as the inner details of how specificity, inheritance, and cascade.
• Values, Units and Colors, which covers all the various ways you can label numbers as well as use strings.  It also takes advantage of the new cheapness of color printing to use a bunch of nice color-value figures that aren’t forced to be all in grayscale.
• CSS Fonts, which dives into the gory details of @font-face and how it can deeply affect the use of font-related properties, both those we use widely as well as many that are quickly gaining browser support.
• CSS Text, which covers all the text styles that aren’t concerned with setting the font face — stuff like indenting, decoration, drop shadows, white-space handling, and so on.
• Basic Visual Formatting in CSS, which covers how block, inline, inline-block, and other boxes are constructed, including the surprisingly-complicated topic of how lines of text are constructed.  Very fundamental stuff, but of course fundamentals are called that for a reason.
• Transforms in CSS, which is currently FREE in ebook format, covers the transform property and its closely related properties.  2D, 3D, it’s all here.
• Colors, Backgrounds, and Gradients, which covers those three topics in FULL GLORIOUS COLOR, fittingly enough.  Curious about the new background sizing options?  Ever wondered exactly how linear and radial gradients are constructed?  This book will tell you all that, and more.

Here’s what I have planned to write next:

• Padding, Borders, Outlines, and Margins — including the surprisingly tricky border-image
• Positioning – basically an update, with new and unexpected twists that have been revealed over the years (case in point)
• Grid Layout – though this is coming faster than many of us realize, I may put this one off for a little bit while we see how browser implementations go, and find out what changes happen as a result

My co-author, Estelle, has these three chapters/short books currently in process:

• Transitions
• Animations
• Flexbox

Beyond those 14 chapters, we have eight more on the roster, covering topics like floating, multicolumn layout, shapes, and more.  CSS is big now, y’all.

So that’s where we are right now.  Our hope is to have the whole thing written by the middle of 2016, at which point some interesting questions will have to be answered.  While most of the book is fine in grayscale, there are some chapters (like Colors, Backgrounds, and Gradients) that really beenfit from being in color.  Printing a 22-chapter book in color would make it punishingly expensive, even with today’s drastically lower cost of color printing.  So what to do?

Not to mention, printing a 22-chapter book is its own level of difficulty.  Even if we assume an average of 40 pages a chapter — an unreasonabnly low figure, but let’s go with it — that’s still a nine hundred page book, once you add front and back matter.  The binding requirements alone gets us into the realm of punishingly expensive, even without color.

Of course, ebook readers don’t have to care about any of that, but some people (like me) really do prefer paper.  So there will be some interesting discussions.  Print in two volumes?  Sell the individual chapter books in a giant boxed set, Chronicles of Narnia style?  We’ll see!

• CSS:TDG Update was published on Tuesday, October 13th, 2015.
• It was assigned to the Books, CSS, Web, and Writing categories.
• There have been eleven replies.

I was recently asked on Twitter about the status of the fourth edition of CSS: The Definitive Guide.  A fair question, given how long the project has lain dormant!  I have two things to announce on that front.

The first is that I’m really excited to say that Estelle Weyl has joined me as co-author for the fourth edition.  We’re working in parallel, tackling individual chapters and doing technical review of each other as we work.  Sharing the load, especially with someone as sharp and knowledgable as Estelle, will help get chapters out faster, and the overall book done sooner.

The second is that writing is once again underway, with four chapters in process.  I’ve got the transforms chapter done, and the backgrounds and gradients (and maybe foreground colors too) chapter almost done.  Estelle is nearing the end of transitions and animations, with flexbox up next.  What comes after that for each of us is a little bit up in the air, though I’ll probably tackle basic visual formatting next.  Unless I get distracted by something more interesting, of course — truth be told, I’ve been eyeing grid layout with some covetousness in my heart.

So, the book is once again underway, and actually has been for a little while now.  I can’t say with certainty when we’ll be done and ready to compile everything into the Doorstop Edition, but we’re pushing for this year or early next.

As an offshoot of this renewed push, I’ve been expanding and revising my CSS test files so that I can check my understanding of the specification, as well as test the fine details of browser support.  Over the holidays I decided, more or less on a whim, to commit the whole kit ‘n’ kaboodle to Github.  There’s no license and no readme, mostly because I didn’t think to establish either when I set up the repository.  Sorry, I guess?  In any case, I regard the CSS in the tests to be public domain, but the actual content (whether inline or replaced) of the HTML files may or may not be, so a single license would have been hard to assert anyway.  I mostly put the files up there as a form of open backup, and also to smooth out the process of managing updates to the tests between my local machine and meyerweb.  Feel free to make use of the tests for your personal education, though!

• Run, Salmon, Run was published on Monday, February 9th, 2015.
• It was assigned to the Books, CSS, and Writing categories.
• There have been two replies.

I just shipped off the last of my drafts for CSS Pocket Reference, 4th Edition to my editor.  In the process of writing the entries, I set up an ad-hoc test suite and made determinations about what to document and what to cut.  That’s what you do with a book, particularly a book that’s meant to fit into a pocket.  My general guide was to cut anything that isn’t supported in any rendering engine, though in a few cases I decided to cut properties that were supported by a lone browser but had no apparent prospects of being supported by anyone else, ever.

For fun, and also to give fans of this or that property a chance to petition for re-inclusion, here are the properties and modules I cut.  Think of it as the blooper reel, which can be taken more than one way.  I’ve organized them by module because it’s easier that way.

• The backface-visibility property from the 3D Transforms module.  This is one I’m already reconsidering, but I haven’t found any indication that anyone besides Webkit will be picking it up in the near future.  Still, I did document the rest of the 3D Transforms module so I may add this back in during the tech review stage.
• rotation and rotation-point from the CSS3 Box module.  These have been effectively replaced by the 2D Transforms module, but the Box module hasn’t been updated since that happened.
• Everything in the Flexible Box Layout module.  There are, as of now, just too many sections bearing notes, warnings, questions, and general feelings of instability and future change for me to feel comfortable including the properties from this module.  I’m probably going to catch some flak for that.
• grid-columns and grid-rows from the Grid Positioning Module Level 3, which effectively means means excluding the entire module.  Some day maybe I’ll write a separate pocket reference just for the various CSS layout systems.
• font-stretch.  Its continued exclusion saddens me, because I am exactly the sort of sheep-stealing lowlife who would programmatically stretch and compress font faces and like it, but so far as I can tell nobody’s supporting the property.  Alas.
• Basically, the entirety of the Generated Content for Paged Media module.
• The Behavioral Extensions module, which means the binding property as well as the :bound-element pseudo-class.
• All the properties in CSS Marquee module.  I’d love to see someone make a compelling case for re-instating them.
• The following properties from CSS Text Level 3: hanging-punctuation, punctuation-trim, text-align-last, text-emphasis-position, text-emphasis-style, text-emphasis, text-justify, text-outline, text-wrap, white-space-collapsing, and word-break.
• The following properties from the Basic User Interface module, dated 2004: appearance, icon, nav-down, nav-left, nav-right, nav-up, and nav-index.
• The Hyperlink Presentation module, dated 2004.
• The Presentation Levels module, dated 2003.
• move-to and crop from the CSS3 Generated and Replaced Content module, dated 2003.
• The Line module, dated 2002 and bearing my name for no reason I can recall.  The one property listed there which I kept is vertical-align, and I just used the CSS2.1 definition.

After all that, I imagine you’re going to laugh uproariously when I tell what I did include:  paged and aural properties.  I know — I’m kind of poleaxed by my own double standard on that score.  I included them for historical reasons (they’ve long been included) and also because they’re potentially very useful to a more accessible future.  Besides, if we run out of pages, they’re in their own section and so very easy to cut.

I’m pretty sure I listed everything that I explicitly dropped, so if you spot something that I absolutely have to reinstate, here’s your chance to let me know!

• CSS Pocket Reference: The Cutting Room was published on Wednesday, April 6th, 2011.
• It was assigned to the Books and CSS categories.
• There have been fourteen replies.

Well, I done did it again: I wrote a book.  This time, it’s Smashing CSS: Professional Techniques for Modern Layout, published by Wiley and Sons and available as of some time last week.  (Just in time for the holiday gift-giving season!  Buy one for everybody in the family!  Don’t delay—act now!)

What’s different about this book as compared to others I’ve written is that this is a collection of short tips, tricks, and techniques for using CSS in everyday work.  Many of them involve making changes and seeing the results, similar to my New Riders books, but where those books had chapter-long projects these are usually only a page or three in length.  Well, okay, a few get up towards ten pages, but only on occasion.

Another difference is that Smashing CSS spans the spectrum from basic tools and browser features that can speed your development and debugging to some cutting-edge ideas and a taste of the latest CSS3 hotness.  I really do hope there’s something in it for everyone, and with something like a hundred entries, I think my odds are pretty good.

I’m especially happy that it’s in full color, which allowed me to do lots of screenshots as well as color-hinting of the markup and CSS, and personally I think it looks awesome.  I hope you’ll agree.  Check out the official catalog page at Wiley or comparison-shop at ISBN.nu, and thanks!

Update 19 Nov 10:  Kindle, ePub, and PDF versions of the book should be available within the next week.  They’re all in the hands of Wiley’s ebook distributor, so now it’s up to the distributor to get the files into the hands of ebook sellers.  On behalf of all you ebook fans, I hope it will happen soon!  (Is “ebook” the way we write that now?  I’m a little light on the lingo.)

Update 6 Dec 10: So far I’ve found the Kindle (mobi) and Nook (ePub) versions of the book.  Finding a good (read: legal) PDF version is proving difficult, so if anyone’s seen it out there, let me know so I can link away!

• Smashing CSS was published on Thursday, November 18th, 2010.
• It was assigned to the Books and CSS categories.
• There have been thirty-three replies.

Two months ago, we had someone essentially spam css-discuss by sending a social networking invitation to the list.  Now, I’m all for making connections, but inviting close to 8,400 people all over the world to join your favorite new social graph seems a bit, well, anti-social.  Further, there was a statement right in the invitation that sending it to someone not personally known was an abuse of the service.  Regardless, it was a violation of list policies, so we booted the offender from the list.  I followed the “never send invitations to this address again” opt-out link and reported the offender via the abuse reporting address.

I very quickly got back a reponse from the team, expressing regret over what had happened and promising to take care of it.  I suggested they domain-block css-discuss.org and webdesign-l.com (you’re welcome, Steve), thanked them for being so responsive, and that was the end of it.  Until a few days later, when I got personally spammed from the same user account.  I reported them again, this time with a bit of snark, and opted myself out.  I didn’t hear a word from anyone.

Of course, as you’ve guessed from the title, the site in question was Shelfari.  And thanks to what I’m now finding out about their practices, it’s quite possible—even probable—that the offender was Shelfari itself.

What we have here is a clear case of bad design causing negative ripple effects far beyond the badly designed site.  In the case of css-discuss, over eight thousand people got spammed through a members-only list they’d joined on the promise of high signal and low noise.  I expelled a member of that community as a result of what a site did for them thanks to bad UI.  I feel bad about that.  Had I known, I might have put the account on moderation until they could be reasonably sure things were cleared up with Shelfari instead of just booting them.  So I’ve tracked down their address and apologized, which seems the only honorable thing to do.

It may also be the case that bad ethics are as much to blame here as bad design.  This is much harder to assess, of course, but the fact that the opt-out action was completely ignored makes me much less likely to chalk it all up to a series of misunderstandings.  Even if the Shelfari team was trying to be good actors and bungling the job, it’s little wonder they’re being hung with the spammer tag (the “Scarlet S”?).  Automatically using people’s address books to spread your payload is a classic worm-spammer technique, after all.

Given all this hindsight, I’m definitely intrigued by the following passage from the mail they sent me on 14 September:

We make it super easy to invite, but some people just send to all, which isn’t really what we want.

In other words, the very thing they’re apologizing for now, the thing that has caused such a recent uproar, was known to them no later than two months ago.  So yeah, no surprise that a whole bunch of folks are not cutting Shelfari even one tiny iota of slack.

Anyway, the bottom line is this: if you’re signing up for a social networking site and they offer to contact people you know or import your address book or things of that nature, be very cautious.  And be doubly cautious if you’re signing up for Shelfari.

• Shelfarious Behavior was published on Wednesday, November 14th, 2007.
• It was assigned to the Books and Web categories.
• There have been five replies.