Embed Your Branding in Your CSS

Imagine the situation: your designer is in a life-threatening car crash. Can someone take over his work immediately?

Chances are, NO. There will almost always be a learning curve. But you can help to combat that by adding some simple instructions into the master CSS file that you use.

At Dockery Design, we work with all kinds of websites. Designers aren’t always in fatal crashes. Sometimes they are just flaky, get hired away, or find that they just really wanted to be a dancer. We pick up a fair amount of websites that had been started, and never got finished to the level of satisfaction required.

Often, dealing with an unhappy (and not to mention unemployed) designer to get standard branding information can be difficult. Why not plan ahead, and have your brand information coded into your main css document? Here’s an example:

/* ------------------------------------------------------
Standard Branding Colors:
#555 - grey (used on standard text)
#33281E - very dark grey (used for block headers)
#A64A23 - brown
#9C9A69 - green (used exclusively on the Services page)
#ECE2DE - light grey (used for navigation and Course Titles)
------------------------------------------------------- */

EXPLANATION:

the code:

/*

is a comment line. Anything that follows is NOT read by the search engine, browser, or screen view. Usually a series of asterisks, hyphens, equal signs, etc. makes a nice horizontal break for the page.

Standard Branding Colors:
Any text inside the /* will not be read. I prefer a simple note to outline what your are describing, and the Web colors with explanations. This makes an easy reference for any designer picking up the pieces, and also for designers who may not have updated the website in several months.
*/
is a close comment mark. Anything which follows this mark will be read into your css document.

While it can be intensely frustrating to pick up someone else's project and try to run with it, noting your colors and other standard branding elements can make not only this process go smoothly and comfortably, but it makes a great reference for any further web development.
Do you have a similar process to outline some major elements in your websites? Please let us know!