dp.cx blog

The overall design of your website is one of the most important parts of the entire deployment process. If the "look" doesn't match the tone of your content, you're going to lose readers… and revenue.

So, take your time with this step. Research the market. Get a feel for the type of impression you're trying to make (see Part 1). Then, make sure that impression resonates with your target audience (see Part 2). Allocate a decent portion of your budget to this step and GET IT RIGHT!

For the sake of this post, I'm using "design" as an umbrella term that includes such things as: logo, CSS, branding, site colors and site images (buttons, etc.). Site design should NOT be confused with site content, as this is an entirely different topic of discussion (which I'll cover in a future installment of this seemingly perpetual "guide.").

Logo

The logo is the graphical representation of any website (or company… or corporation… or association... you get the point). It represents your voice, your content, your intentions and most importantly, your integrity. Great logos reinforce great companies. Bad logos can project negative connotations on an otherwise great company.

The logo should take certain design cues from the general topic of your given industry. At very least, it should make a statement. If you're branding strategy calls for a bold look, keep masculine accents and features in mind when designing it. Also, be sure to make several drafts (meaning 10 or 20 or 30). Then, seek the approval of others. Don't be discouraged if you're sent packing back to your computer after the first round of opinions have been heard. Each revision brings you closer to the "look" that everyone is expecting.

Layout/CSS

After you've got your logo nailed down, it's time to start constructing the overall layout of your site. Again, this is where your initial research will come into play. If you've got a general idea of where you want to display pertinent information and what type of features you want to incorporate into the overall site design, this portion of the deployment should be quite painless.

Yet, if you haven't put in the wrench time in the preliminary stages of your site planning, this process can be an absolute nightmare. If you've come this far with intentions of "winging it," STOP. RESEARCH. GET A CLUE. PROCEED. Or, you can carry on and ultimately wind up with an expensive collection of words and pictures no one cares to view.

Site Branding/Graphics/Effects

After you've perfected the layout of your site, it's time for the fun stuff. You've likely already determined your site colors when designing your logo, so now, you've got to figure out where to implement these colors. Keep this simple. Too much clutter can confuse the reader.

You're looking to tastefully employ subtle accents throughout the site that enhance the user experience. Heavy gradients and an overuse of Flash animation will not only cause page load issues, but can also deter repeat visits to your site.

Some things to keep in mind when creating graphics and effects are as follows:

• Repeat images when possible (repeat-x, repeat-y, etc.)
• Rely upon CSS for solid colors and borders
• Keep Flash to a minimum
• Use PNG files when possible
• Use jQuery/Javascript as a Flash alternative

Also, before starting this phase of the deployment process, you will also want to keep a few things in mind regarding the actual production staff:

• Print designers are not welcome in the web domain. They don't understand web and likely never will. DO NOT EMPLOY THEM! Hire a web designer that knows print, as this will cover all of your bases.
• Cross-browser CSS is extremely important. Constantly test your layout in all major browsers when assembling your layout. You don’t want any big surprises or angry emails from readers.
• File sizes determine your page load time. Compress images when possible.

This above discussion should give you a general idea of what is to be expected during the design process. Did I touch on every issue you'll likely encounter? Hell no! That's why there's Google. Oddly enough, that's probably how you got here in the first place. Which brings me to Part 4 of this deployment guide, aptly titled, "SEO."