Style deliverables

When I do stuff web development-wise, I usu­ally design, cut and code — or come in just after some poor print designer deliv­ered the PSDs.

Now I’m doing a job where I’ll do the design bit — but where some­one else will do the actual imple­men­ta­tion. So now I’ll have to get the mes­sage with regards to styling across to some­one else, some­thing I can com­plain about end­lessly when graphic design­ers fail to do that prop­erly when hand­ing over stuff to me.

Style guides are a genre in them­selves and I sus­pect they take a lot more time to do thatn one might think. So I thought about the most pre­cise way to describe styling I know. Turns out it’s the css itself.

Why not just do the css for the var­i­ous bits that need styling your­self? It’s accu­rate, saves time as your time is spent any­way and it allows your techie to just copy and paste — and if you’re good at css, chances are you’ll do a bet­ter job than the techie.

There are obvi­ous disadvantages:

While the over­all styling of typog­ra­phy is easy to do and prob­a­bly won’t inter­fere with the way the imple­men­ta­tion itself is done, styling of sec­tions etc. can prove dif­fi­cult as far as nam­ing is con­cerned. Just as you can’t skip mak­ing notes on gut­ters and other over­all lay­out deci­sions you don’t know how are implemented.

On the other hand, if you stick to mean­ing­ful names (as you should), as a min­i­mum it will be easy to under­stand — best case it can work as a plat­form for the actual code run­ning the site. In any case the techie will have to under­stand your code any­way and should be able to just use as much of it as is pos­si­ble. A few Pho­to­shop notes which explains what’s what should be plenty of information.

So the per­son cut­ting up your design gets all the mea­sures whereever he needs to go in any­way, all the over­all styling infor­ma­tion is pro­vided ready for use by you as css (no more look­ing at every sin­gle font for size, color etc.) and your style guide job is lim­ited to putting in notes on the names you’ve used in the css and some info on over­all thoughts on grid and concept.

In sit­u­a­tions where you work with the same devel­op­ers over and over, this could prove even more use­ful as you get to know each other’s cod­ing style.

Not exactly rocket sci­ence, I know — but I’ll try and give it a spin.