• Writing, coding: vim (usually MacVim, to my credit as a visual person, thank you)
• E-mail: mutt (I know. But really, my skin has a healthy glow and I do go outside and enjoy the sun)
• IRC: irssi
• RSS: canto
• Twitter: twitvim
• Written documents: LaTeX
• Drupal: drush (Drush rocks.)
• Task management: Taskwarrior

It seems weird, but for me, these types of activities don’t need eye candy, but effectiveness and speed. And these apps provide that. They are also all free to use and work on several platforms. I’m especially happy with mutt and canto. Mail and feeds, in the amounts I consume them, usually take up huge amounts of time. With these apps, I can zip through them relatively quickly.

I’ve been increasingly biting in my reactions to many admittedly fun but practically useless “demos”, “experiments” and other assorted HTML5 and CSS3 nonsense like CSS3 icons. I always get flack for this, and I probably will now.

While these experiments are easily defended—“just wanted to see what was possible”—they are generally non-complex (though they can be tedious; take one look at a CSS3 icon or font). They are, put bluntly, simply a way to show off. And as long as that works, it will continue. But what are these experiments helping, aside from the reputations of those who make them(!)?

Please note that many of these experiments utilize a technique that I and many other art directors and designers have used for ages, which greatly enhances product appeal. It involves simply combining two things you wouldn’t ordinarily expect to be together: CSS and fonts. CSS and icons. HTML and games. Peanut butter and chocolate—Hershey/Reese’s Peanut Butter Cups have used this to their advantage for years. And so forth. The first person to build real beer from Javascript will be speaking at conferences for years to come.

I could say more, but Chris Heilmann said it so well, there is no need:

Right now, we are happily thinking we innovate and push the envelope where in reality we are making each other go “Oooohhhh” while a large chunk of the audience that could benefit from our knowledge is stuck with really poor experiences on the web.

If you haven’t, please take a moment to read his article.

You should read the post. Then form an opinion. Mine is that vendor prefixes are no fun and quite annoying, but a necessary evil. At least for now. There’s no need for me to go into why, as Jonathan Snook makes the point well.

My biggest problem with vendor prefixes is the repetition (read: not the amount of typing), and the fact that I’ll one day need (okay, want) to go back and clean prefixed rules up once they’re no longer necessary or when the implementations change, which they can. I just want a clean style sheet.

A few workarounds, or deal-withs, were mentioned in the comments of the aforementioned posts:

1. A single “beta” prefix
2. CSS preprocessors
3. A separate style sheet

I like the last option the most, hat tip to Bridget Stewart for beating me to it. A separate style sheet fits my current practice of giving each element of design language its own file (I know about the performance implications, but there are plenty of solutions to that). So a generic group of style sheets for a given website might look like this:

• layout.css
• type.css
• color-img.css
• vendor.css
• ie[x].css

This is clean. Non-prefixed properties are entered into the normal style sheets, and will (hopefully) be ignored by browsers which don’t understand them. Prefixed properties are placed in vendor.css. And what I would really love is for CSS3, Please! to generate vendor.css for me (That was a hint, guys). Sure, there’s the risk of the spec changing, so it’s up to the designer/developer to be wise in deciding which things should be specified without prefix in the normal style sheets.

Why not the other two?

To be honest, something like -beta- might not be a bad idea, but as of yet, the fact that vendor prefixes are browser-specific is the only useful thing about them. A universal prefix is just that, universal, which could potentially introduce the same problems we would have with no prefixes at all.

I’m not a big fan of CSS preprocessors, or at least I haven’t seen one I’ve liked. We’re talking about CSS; it’s not all that hard to deal with. My problem is not with typing things out three or four times. And I don’t need a preprocessor to do that for me, as prefixes and things like rgba fallbacks are easily accomplished in any decent editor through snippets or scripting. And for those without a decent editor, just use something like CSS3, Please!.

How do you cope?

You only need to subscribe to www-style for about a week before realizing it’s going to take more than three people calling “-beta- prefix!” to get browsers to do it. When you dig down deep enough, there are some very, very smart people who have thought a lot about certain things (and admittedly less about others). It would be a good practice to research or ask why something is as it is, and perhaps participating in www-style and submitting ideas.

You could also try vendor.css. If you hate prefixes, at least you’ve gathered them all together in their own little prefix hell.

How do you deal with vendor prefixes?

On content

Content is important. After all, it’s content people who come up with job titles like Content Strategist, which pretty much means One Who Thinks About Content. Which content, for whom, when, where, why, how… It’s absolutely necessary, because clients don’t do it. Not at the level that it should be done.

Paul Rand, one of the most well-respected designers this world has seen, called design “a method of putting form and content together”. If you would agree with this statement (as I do), you can infer the role of the designer as the one who must successfully combine two components: form and content (the designer will first busy herself with the form component). These two are not mutually exclusive. They are separate components which share a common goal and should be developed on a parallel track to one another. This, however, does not mean that they should be reviewed by the client together at every stage.

On clients

Two quick facts about clients:

1. Many don’t know what they want, and when they do, they don’t know how to communicate it
2. Many lack the imagination to “see through” design sketches

These are the reasons we are hired in the first place. But these two facts have paved a dangerous path across the lawn of the creative process. An alarming number of web professionals today seem to advocate making preliminary deliverables mimic the finished product– the more accurate, the better.

This is, well, stupid.

It’s not stupid if don’t track your hours. It’s not stupid if you don’t care if or how much you are paid for your work. It isn’t stupid if you don’t mind doing twice as much work for nothing. Your clients will love you for it, and you’ll be doomed to continue doing it for the rest of your career.

On designing in the browser

When Andy Clarke first started talking about “designing in the browser”, I thought it was a great idea. Then people started misinterpreting this to mean “executing the creative process in the browser”. If Andy really designed in the browser, his designs would be shit. What he was of course referring to was the execution of a design idea in the browser as opposed to a tool like Photoshop, which doesn’t communicate Web Things the way a browser does. He strives for more realism in his deliverables. He’s simply working based on the two Client Truths listed above. And if you’ve ever done designs in Photoshop, you’ll know that applying client changes to those documents is akin to cutting off your own fingers one knuckle at at time. HTML is much easier.

That said, there is certainly a place for Photoshop sketches. It’s possible to put together a quick visual impression of a website in far less time than it would take to work out in HTML. I’m referring to the basic idea of a website, an impression of the design language, intended to gauge if we are on the write track before spending many more hours mocking things up in HTML, which is, in fact, templating. I am not referring to creating finished static design visuals. These are the bane of the web designer’s existence, and should be avoided at all costs. If you really understand your client’s needs, that means you’ve done your homework, and you’ve actually designed before the browser. Otherwise: baby steps.

On communication

Imagine that your job was to drive your client somewhere. They aren’t quite sure where they want to go, but a lot of sun would be nice. And perhaps water. You could drive them to California, but once they hear about Florida, they might prefer that and demand that you drive them there (at your cost, because you’re the one who chose to go ahead and drive to California).

A better way would be to communicate with the client, asking them if they prefer dry heat or humidity, surfing or Spring Break parties, earthquakes or hurricanes. Based on this information, you could show and tell about both places, help them weigh the pros and cons, and help them in their decision. Then drive. Only then.

Making websites is a process. Creativity is a process. Pacing and leading clients is a process. You’re not going to eliminate frustration by trying to come up with real content, a polished design and working browser functionality on the first go. You will lose money, though, and perhaps your sanity.

There’s a reason for storyboards. But wait, shouldn’t Pixar just go ahead and build and render the complete movie so that the studio execs can see how it will really look?. Then, if they like it, it’s done! Yeah, right. Good luck with that.

There’s a reason that advertising teams consist of an art director and a copywriter: design and content. They’re bed buddies. But these teams pitch ideas, and then work them out. That’s why we have wireframes. That’s why we have Photoshop. That’s why we have Lorem Ipsum. And that’s why we have, most importantly, good old pencil and paper.

On balance

Here’s what I think: some web professionals want to focus more on deliverables than on people. But guess what: it’s all about people. We need to help our clients along and communicate with them. If you want good deliverables the first time around, the answer is not to use “real” content and a design which is in fact finished HTML/CSS/Javascript in a real browser. The answer is to ask focused questions, discover the pressing problems, to introduce your client to your potential solutions to those problems. Give them tidbits: here’s an impression of how the site could look visually. Here are some things you might want to consider concerning your content. Work your way up to real content in a real browser. When done right, that point can come quickly.

It’s too much to show a client all these things at once in the very beginning. There are too many factors, and it’s impossible to tell which factors will influence their opinions at that moment, which makes revision a nightmare at best. Of course content and form should each be developed with the other in mind. But consider presenting separately at first. Yes, that could mean that Lorem Ipsum is an option. That could mean that Photoshop is an option. That could mean that a sketch on a napkin, with a good, old-fashioned explanation of how things work, is an option. When you know enough, put form and content together.

On bed buddies

And forget the content versus design war. They need each other. In the words of Paul Rand, “when form predominates, meaning is blunted. but when content predominates, interest lags.”

Some good things past

2009 certainly wasn’t all bad. There were plenty of good things. Vacation here in Holland with the kids and having my sister over to visit was fantastic, as was our week in Portugal (it was my first time there and I loved it.

I finally started understanding that doing some nice things for myself is a good thing, not selfish, and very necessary. I still didn’t do enough it, though. This website still needs a design. At least that design is coming along nicely.

If the worst problems in life are people problems, then the opposite is also true: the best moments are people moments. People who inspire, make you laugh, people you can have fun with. (Fun. Hmmm. Need more of that this year.)

There were some great people moments in 2009. Great personal, family moments, but also new contacts and friendships. I’ve also had the pleasure of meeting, becoming friends with and even working with some of the finest minds in web development. People who inspire me and make me want to become better at what I do. You know who you are. And last but not least my team at Cinnamon; we spend almost every day together and despite ups and downs, we still worked hard to kick web ass for our clients.

I didn’t do a lot of speaking last year, but I was glad to be a part of the events where I did speak. I was honored to have been invited to speak about CSS3 layout at Fronteers in Amsterdam. Grip2009, the workshop event that Cinnamon and Eend hosted, was a success and a pleasure to do.

Some good things to come

There are so many cool things going on in web development right now, and so many things I’d like to do. That’s my problem, as those who know me well have witnessed: too many interests. Trying to whittle them down to something manageable is futile.

I won’t pretend I will have the time or inclination to do everything I want to do this year, but I’ll be happy to get any of them done. These are not New Year’s resolutions; I never finish those. These are simply some of the things I’d like to do, accomplish or work on this year (aside from the usual stuff like running a company and having a family):

• I’d like to evangelize CSS3 layout even more, through writing, screencasts and speaking engagements. As a matter of fact, I’m enjoying speaking and would like to do more of that as well.
• This website needs a design, badly.
• There are a couple of really cool projects I’m planning with really cool people which are still non-public. I’d like to work on these and make them known.
• I want to finish the book proposal I started more than five years ago.
• I’d like to start training martial arts again, so my body doesn’t always feel like I’ve been hit by a truck.
• Exotic vacations, become rich, have nice cars… oh, wait. Got carried away for a minute.
• Be as prolific and productive as Chris Heilmann. Or half. Or a third.

I could go on and on, but trust me, it would hog some serious bandwidth.

Most of all, I want to do what I love, to look on the bright side of things, to see possibilities, to enjoy my friends and family, to have some fun, and to do it all in good health.

I wish you the same.

There’s no more hiding for us now, so go ahead clients: read all about how to get the upper hand.

This has nothing to do with the web, but I thought it might be helpful to share. After being plagued with calls from telemarketers between about 6pm and 10pm (the nerve!), my partner and I decided to change our voicemail message. We’ve seen the amount of calls drop dramatically. And when someone does call, we never need to pick up if the phone display shows a “number unknown/hidden”, or if we don’t know the number.

I’m sure this isn’t a new idea (people have screened their answering machines for years), but it’s still pretty cool and works well, at least here in Holland. Call it a lifehack, if you will. Just change your voicemail message to something like this:

“You’ve reached [your number]. We are either unable to take your call, or you’re calling with a hidden/blocked/unkown number, in which case we will never pick up. You can leave your name, number and reason for calling. Calls from friends and family will always be returned. Thank you.”

My own message isn’t this exactly, but that’s the gist of it. It seems kind of cold to do at first, but after all, you should be able to decide who you want to talk to during your evenings at home.