The following is an email exchange I had with a friend at another company about a year ago. We were talking about the best way to go about hiring a front-end developer, and I was sharing some tips from our hiring process.

“Hi Scott, we are in need of a CSS expert/ninja. Our company has gone through agencies and the whatnot, but the candidates that have come from that route haven’t exactly knocked our socks off. I’m hoping that since this is what you do you might know some people, have some advice, or know some agencies that specialize in this area.”

I’ll tell you how we found Libby, our other CSS rockstar.

Anyone who applies, give them a comp and ask them to convert it into a standards-based layout. You’ll immediately know more about whether they’re worth talking to or not.

We had one guy who submitted his late, and not only didn’t provide support for IE6, but actually wrote rules to make things look bad under IE6. Needless to say, his interview didn’t last long.

“Thanks! One question… When you say ‘comp’ I kind of understand what you mean, but maybe you can explain it to me just to make sure I understand.”

Sure — the comp is the photoshop or fireworks document that gets handed off from the designer to the developers when it’s time to build the site.

“Ah, I see. So tell me, do your CSS rockstars do much design work?”

In a perfect world, none at all. We’ve got a creative department who do all the design work in photoshop/fireworks, and we’ve got a development team who do all the back-end programming, and then there’s the production team (that’s me!) who does all the front-end coding. In a perfect world, the creative team hands comps off to me, and I tell the programmers what sort of back-end functionality we need while I work on the HTML/CSS.

“That is quite the pipeline that your company has over there. So just to be clear, you give the applicants a Photoshop file with layers and all and you judge them on how well they slice it, dice it and convert it to HTML and CSS files. I like it. Any tips when creating a comp? I assume the best thing to do is give them something that would apply to the type of work we do. Any tips for what to look for in the output?”

I would give your applicants a file that represents something you guys would actually do, yeah. In a perfect world, you grab a photoshop file for something you’ve already built so that you can compare and contrast how they did it with how you did, but it’s also not bad to make a photoshop file specifically for new applicants. If that’s the case, I would get whoever does your front-end code normally to make suggestions like “make sure the comp includes a navigation element with a hover effect,” or “include some transparent images so we can see how they handle transparent PNGs,” etc.

As for what to look for in the output, there are just some best-practices stuff I look for. With CSS, there’s a million ways to do anything, so it’s not technique so much as talent I’m looking for. I would want to see clean, standards-compliant code, and I would expect to see some bug fixes included for IE. I would definitely open the page they give me in multiple browsers, especially the “big three” – Firefox, IE6, and IE7. If your user base includes a lot of macs or iPhones, check it in Safari, too.

If the site looks good in all the browsers you care about, the code looks reasonable, then the person is probably worth talking to.

Red flags would include the site being broken in one or more browsers, particularly ugly code, or failure to handle things you thought were important or obvious in the comp, like a transparent PNG here, or rollover states on the navigation there, etc.