Webvanta Blog: Creating Effective Websites

Interview with Eric Meyer: the State of CSS

Interview with Eric Meyer: the State of CSS Image

If you have paid any attention at all to CSS (and if you haven’t, what are you doing here?), the name Eric Meyer is no doubt familiar to you. Eric wrote the first book that evangelized the use of CSSEric Meyer on CSS—and is well known as one of the world’s top experts on CSS. His later books include O’Reilly’s CSS: The Definitive Guide and, most recently, Smashing CSS.

You may also know Eric from his Reset CSS, which has been widely used, or from his CSS compatibility charts, the official W3C CSS test suite, or the css-discuss mailing list.

Eric is also a cofounder, with Jeffrey Zeldman, of An Event Apart, where he is a perennial speaker. Eric’s trademark talks show how to take CSS further than most of us ever do, exploring its limits and expanding our vision of what we can accomplish with it.

In this year’s talk, Eric took a humorous tack, showing what mischief you can do with someone’s browser by installing a browser style sheet that plays some CSS tricks.

In this interview, Eric talks about how he got involved with CSS, the most common mistakes designers make, and how the standards process is evolving.

Eric’s consulting firm, Complex Spiral Consulting, provides custom in-house training for companies that want to build their staff’s expertise on the latest web technologies. You’ll find more of Eric’s current work at meyerweb.com, where the page of CSS resources is of particular interest.

Eric is also a prolific Twitterer at @meyerweb.

Interview Transcript

Michael: This is Michael Slater here at An Event Apart and I am interviewing Eric Meyer, well known in the CSS world. You have been in this CSS world forever, it seems. How did you first get involved in it?

Eric: I first encountered CSS at a web conference. I just happened to see a presentation on it really early, like before IE3 shipped. When I saw it I knew it was what we had been looking for. Up until then all we had was tables. We had tables and font tags. It just seemed icky, even from the outset. When I saw this presentation I said, ‘yes, that is what we want!’ Of course, anybody who remembers what things were like then remembers that CSS support turned out to be not that great. But it’s gotten better.

Michael: It’s come a long way. At this point I think evangelizing for web standards isn’t even necessary any more; most of the world has gotten away from table-based design. What do you feel like the big hurdles are now? What are designers still doing that they shouldn’t be doing?

Eric: Wow! That’s a good question. Stop making web forms that hurt people. That would be one. And I don’t know necessarily that CSS is the way to fix that, but forms should have good tab orders, and not block the keyboard, because that’s just wrong. I guess probably the other thing would be, I still see a lot of class-itis were people just class everything, instead of trying to use the element tree to say all the paragraphs in this particular area should be done this way. What I still see sometimes is that every paragraph has the same class. That’s kind of wasteful and problematic. Other than that, I’m not really a designer, so anything I’d say would be like ‘use more Comic Sans!’

Michael: I’m curious how CSS got to where it is without any reasonable way to have two columns with a footer below. Do you have some insight into why, when they were building CSS, were the things that seemed so fundamental to designers lacking in the structure they built?

Eric: Well, there are a few reasons. One is that specifying that stuff in a declarative language like CSS is not necessarily the easiest thing to do. We are looking into some multicolumn rules now, coming up in a spec, and they don’t necessarily cover all the cases that you might want with a multicolumn design, because that is not easy to specify.

Michael: From what I’ve read that’s still not quite a part of CSS3 that people are encouraging you to go use.

Eric: It’s one of the many CSS modules that are under consideration. I believe that Opera supports it and I think Gecko supports it. The point being that not everyone is supporting that type of thing. The bigger mystery is why was there no grid layout system? It’s a hard question to answer. I’m not sure myself to some degree why there wasn’t a grid system sooner. Now we have four competing grid system proposals. Now there’s flexbox, template layout, and two others. Flexbox seems to have some momentum now but other proposals appeared to have momentum in the past and they still are not implemented. We will see.

Michael: But none of this is something that designers will be using in the next couple of years on their mainstream sites.

Eric: Probably not in the next couple of years. There are JavaScript libraries that provide support for some of these things in browsers now. Alexis Deveria wrote a jQuery library that lets you write the CSS the way it should be written according to the CSS Template Layout Module, and this jQuery plugin would go through the stylesheet, pick out the bits that were meant to create the advanced layout, and then do the backend markup and CSS to make that happen using the technology we have now, which is probably mostly floats still. So there are those options, but as far as native support, it’s just not there.

Michael: In your talk you showed a lot of evil things people can do with CSS with local stylesheets. What was your intent here? Was it to push the edges and show what people can do?

Eric: My intent was to illustrate some of the ins and outs of those things. You probably are not going to ever deploy a stylesheet where hovering over the body element makes it spin 360 degrees. But you might want to spin other things. This was a way of introducing that syntax by having fun with it at the same time. Rotations and skews and so forth can be used to non-evil purposes if you like. But it’s more fun to do these wacky things, right? Push what’s possible.

Michael: How do you feel like the CSS standard is going at this point?

Eric: Slowly, as usual, but faster than in the past. There seems to be more progress being made on various modules. The nice thing about the modules, of course, is that the working group can concentrate on what that people are interested in. The web fonts, selectors, and flexbox specifications have been moving more quickly, and the other stuff that there isn’t much call for hasn’t been moving much. That was always the nice thing about modularization.

I’ve got a pretty good feeling. We are in a period of change now. The late 90s were similar for CSS. Browsers kept coming out and adding more CSS support, fixing their bugs, or not fixing their bugs, as the case may have been. In the late 2000s it sort of settled down. Of course, there will be browser partisans who will say “my browser was advancing.” OK, fine. But overall, the development of techniques and the development of the way we do stuff radically slowed down and settled into a period of consolidation, if you like.

Now we are moving again. There’s a lot more development happening with CSS and browser support for it. It’s showing up in inconsistencies. One of the things I showed in the talk is the different way of dealing with interrupted animations the browsers have right now. That may converge later, but right now it’s sort of chaotic because there are all these things going on.

Michael: So beyond that leading edge stuff, it seems that the browsers are pretty good in their CSS support these days. Do you feel like the browser makers are moving faster than they used to? Certainly things like Chrome seem to be moving pretty fast.

Eric: Yeah, well the fact that every time they release they go a whole version number makes it seem like they are moving fast. I have talked to other browser manufacturers who are dismissive of this, who feel that those should be point one releases, but you know, politics right? It’s everywhere. I think there is more velocity there. I think there is more speed of change these days than there has been in previous years.

Michael: IE seems to still be the laggard; even with IE9 we still can’t do things like gradients and so forth.

Eric: They are still playing catch up, but they feel closer to me at least than they have in the past. We will see if they can push their release schedule a little bit faster.

Michael: Great. Thanks very much for talking with us.

Eric: Thanks for talking.

Add Your Comments

(not published)