Web Design

10 Tips to What is Good Web Design

1. Use a Plain, Flat-colored Background
Keep the appearance clean and neat. Your message is in your words and foreground images. Busy, patterned backgrounds distract. This is why we usually print on plain paper. White or light colors are best and essential for pages containing critical information that the visitor may wish to print. Think “executive dress for success”.
2. Use Plain or Black Horizontal Rules
Again, don’t distract from your message and keep a clean, professional appearance. Rainbow, 3D, striped and other graphical horizontal rules or bars are not only garish but dated and eat up valuable download time. There are many subtle things that can be done with just the standard HTML horizontal rule tag, <hr>.For Example:



For coding techniques with horzontal rules, check out the article “Horizontal Rules!” in Techniques.

3. Use 6 Colors or Less
More executive dressing. Six colors includes text color (1), background, (2), active link (3), visited link (4), highlighted links (possibly 5), and headers (possibly 6). Acclaimed magazine and interface designer Roger Black uses only black, white, red and occasionally yellow. Note that these are the common colors of road signs.You might want to use compatible shades of these colors (such as grey, a shade of black) or you might want to select others such as blue or green, but a limited palette keeps the pages consistent, easier to navigate, neater and faster to load. It also speeds up development and maintenance by reducing the question of colors. And finally, if you use photographs or other illustrations on your site, it will make them stand out.
4. Use Graphics Sparingly and Consistently
Graphics are accessories to the web wardrobe. Too many accessories looks cheap. Better 1 outstanding graphic than many clashing ones. Or use a series of small, related graphics that tell a story. Use meaningful ones. Make your graphics count. People will look at a single graphic on a page before reading the text. Always caption any photographs or illustrations. People will read photo or illustration captions before reading the text. Ideally, the graphic is related in some fashion to the text or the message. Use the same style of graphics throughout the site. For example, cartoon illustrations versus woodcut illustrations. Eliminate cloying or unnecessary graphical interfaces likes large navigation buttons, especially 3D buttons or splashes. These are very dated while “the littler black dress” is always in style. Todays graphical user interfaces are either simple, flat colors or require a professional graphics designer and serious HTML coding. Try to keep graphics sizes under 45K for the entire page to expedite download.
5. Use a Maximum of 3 Font Families Per Page
You can also safely mix 1 sans-serif (e.g., Arial) for say headlines and 1 serif (e.g., Times New Roman) for text. Or vice versa. When in doubt, use only 1 font family (e.g., Arial OR Times New Roman). If you are uncomfortable mixing font styles, consider buying “The Non-Designers Design Book” by Robin Williams. A jumble of decorative fonts is very dated and difficult to read.

Content Upgrades

6. Make Your Site Useful to Your Target Audience
The content must be of some tangible use to your target audience. Give something away that demonstrates your expertise and is useful to your target audience. A novelist may wish to provide short book reviews in the same genre as his or her novel. If targeting vacation travelers, post valuable travel tips, accommodation or restaurant reviews, reviews of the travel booking sites, etc. If your site were a brochure or a magazine, who would pick it up and why? What’s in it for your audience?
7. Keep on Topic
Remove content that is not directed to your target audience. Always ask yourself, “Of what use or interest is this material to my target audience?” Limit the personal and cute. Think of stepping into a corporate office. An executive office may have 1 or 2 family photos on the desk and some trophies or framed artworks on the wall, but they are neat and carefully selected. Limit your personal photos and momentoes to a single biographical page. If the personal is part of the overall style of the site, limit it to a single image or segment per page that ties in and leads to your next message. For example, if you’ve written a series of mysteries with a cat protagonist named “Mrs. Pedegaris”, then you may decide to use Mrs. pedegaris as a theme for the site by having each page entitled something like “Mrs. Pedegaris’ Favorite Summer Reads” and at the bottom include a small photo of the cat with a note “Click here to see what the other critics said about my latest book, Mrs. Pedegaris Goes to the Dogs!” Keep everything on target.
8. Keep a Consistent Tone and Style
Is the web site style corporate, journalistic, humorous, chatty, refined? Whatever the style and tone, keep it consistent throughout. If in doubt, keep it simple and direct. Brief is better than big and bad.
9. Weed the Links
A page of additional resources on the site’s topic can be useful, but only if it remains accurate and current and isn’t just a meaningless list. Better to keep a small list with a brief description of the site and why it’s worth the visit than 50 dead links and 50 dull links. You can’t compete with Yahoo. Clean out resources that are no longer active, are of minimal value to your target audience or you really can’t recommend. Add some information explaining why you consider the link valuable. Better quality than quantity.
10. Get Rid of Counters, Guestbooks and Other Old Programs
Visitor counter programs are old tricks from the early days of the Web to allow programmers to show off or test their programming skill. Low counter numbers tell everyone that your site is new or has a limited target market or just isn’t very successful. High counter numbers are wasted real estate — a successful site is known by its audience. Even McDonald’s has stopped counting those burgers! Another common early program still around is the guest book which either give visitors’ e-mail addresses to spammers or add no meaningful benefit to the site (collecting testimonials can be useful, but should be specified as such). Originally guest books were used for the same reasons as counters and allowed geeks from diverse countries to connect. Most randomizers are meaningless as well unless you have them set to generate something genuinely useful like a new tip of the day directly related to your topic. Also, eliminate SSIs (server-side includes) for inserting current the date and time or information about the user such as their browser type, IP address, referrer page, and so on. Again, these are old and now meaningless geek toys.
Bonus: Relax and Keep It Simple
This isn’t brain surgery and your business doesn’t depend on the perfect web site. Your web site should be a part of your overall marketing plan, albeit an important one these days. Better something simple and clear, even if it’s only 1 page with your business pitch and contact information than something cluttered and confused. Don’t worry about current web fads. Quality is NEVER out of style. Don’t be afraid to ask or hire help. And to make certain you stay in control of the process you might check out a little something I wrote elsewhere, called “Cooking Up A Web Site”.

Tips for Working with Your Web Design Team

To get the most for your web project dollars, you need a good working relationship with your web site design team. Clear communication, a sense of trust between parties, and everyone is working towards the same goals makes all the difference in results.

What the Design Team Needs from the Client

Cooperation.
You hired the design team for it’s knowledge, talent and skill. You should trust your design team to know their business. If your design team recommends that you cut your site text by 50%, try it. If they ask for complete product pricing schedule, provide it in a timely fashion. If they ask for a site review meeting and sign off before proceeding, schedule the meeting and be prepared to make the necessary final decisions. Don’t ask them to make your site look exactly like another site. They should be trying to make your business have it’s own identity.
Information.
Lots of clear information. If you’re working with a good design team, you may mistake them for the 60-Minutes investigation squad. Be prepared to explain clearly, completely and carefully, your web site goals, your budget limitations and your business. Even if you write your own copy and provide it to the designer, be prepared for suggested edits, changes and the request for more information. Be prepared to be specific and complete in your information. These folks know that people online want details, and they want them now. The design team is working to convey the necessary information to your best advantage. don’t hide information from them. If there are any restrictions, limitations, special cases or requirements for products or services, be sure the design team knows about them well in advance. It’s much more expensive to have to fix the consequences of bad information.
Answers.
When the design team requests feedback or answers, they deserve prompt, courteous replies. Take their phone calls, answer their emails. Give them your time and attention. Think of them as your number one sales person, because that’s what your web site is.
Questions.
If there’s something you don’t understand, ask about it. Do you want to know why they chose certain colors or images or organizational structure? Ask. Politely. They may be working under a misunderstanding or you may not see the whole picture. If they’re answers don’t match the fundamental principles of good web design, ask them why. And they can’t give you answers that makes sense, then…
Communication.
Talk with your account contact and express your concerns — again politely. If you like the work you’re seeing, tell them that, too. Make sure the design team feels the lines of communication are genuinely open. This keeps you in the loop in the event problems arise or new opportunities become available.
Payment.
Set up a payment schedule and agreement and then follow it. If you’ve approved of a design and want changes later, be prepared to pay for them. If you said you’d pay for a font, graphics package, software or other materials for development, don’t quibble when the bill arrives. Don’t try to cheat your design team of valuable time or services. It’s not worth the bad feelings later when you call them for additional help. And trust me, you willcall for additional help. If nothing else, think abou the fact that they know all about your site’s structure, hosting setup and Internet access. They know all about your company and your audience. It’s like the guys who install your office locks, you don’t want to tick ’em off.

Most importantly, make certain the design team knows you are interested in the project — without feeling like you’re trying to tell them their business. Don’t be the “ghost client” who “disappears” after the project starts. And don’t become the “Control-Freak client” insisting on approval of every sentence, graphic or tag. Sure, you may just smile, nod and contemplate how well your daughter’s doing in little league as the designers eagerly explain how they used a relational style sheet to optimize for the aging population of your target audience. But they’ll know you’ll keeping and eye on the project and feel your support — which just might get your site a little extra effort.

Selecting a Web Designer

Like any good business relationship, the one between web designer and client should be built on trust. A client should be able to trust the web designer to work with the client’s best interest in mind, not the web designer’s, and to be competent and knowledgeable about web design and development.

If you are considering hiring a web designer to develop or re-design your site, don’t simply look for the cheapest. If you make “cheap” your primary or only criteria for web development, you deserve what you get — which will probably make you, and your business, look cheap! Check out examples of the designer’s other work. If nothing else, the designer should be able to present a high-quality site for his or her own business. Don’t look for flashy cutting-edge techniques unless that’s directly related to yourbusiness. You’re looking for evidence of competence and an understanding of web useability, professional design skills, and effective communication both visually and verbally.

Look at the top companies or organizations in your industry or field. You should aspire to look like the best in your field. You would never go dirty and ungroomed to a financial meeting; neither should your web site.

Signs of web design incompetence include:

  • Blink tag use (If they’re using the blink tag on their business site for any reason except as a bad example, run away!)
  • Excessive use of animation
  • Plugin or special browser requirements for the Home page or critical information
  • Use of tiled, pattern backgrounds
  • Low-quality graphic images
  • Use of low-quality images for things like email addresses, buttons, bullets or line rules
  • Coding mistakes such as missing tags, images overlapping the text or styles tags that were never closed (e.g., all of the text after a certain point is in bold or italics)
  • Inconsistent use of header tags instead of correct use of changes in font style or color to consistently represent a specific kind of information.
  • Hand-coding each tag style instead of using style sheets or inline styles. (They aren’t keeping up with the technology and standards and are likely to have control conflicts.)
  • Crowded, busy pages that are difficult to read or find information on

Other questions to answer from the designer’s site and client list:

  • What kind of client are they targeting?
  • Has the designer put the client’s best interest ahead of his or her own? (e.g., were appropriate technology and techniques used to reach the client’s audience or did the designer push cutting-edge techniques to showcase his or her skills to his or her potential clients?)
  • Does the designer’s web site and the client sites look high-quality?
  • Is the site navigation and useability clear and appears well tested? Did you have any problems understanding how to get around the site or finding the information you needed?
  • Did you like the look-and-feel of the designer’s site and the client sites?

And finally, don’t be afraid of hiring a new designer, especially if you’re cost-conscious, so long as the designer demonstrates competence and skill. If money is tight, you might also look at hiring a designer to create your home page and internal page templates and then learning enough HTML to maintain and develop the rest of the site in-house. What you are paying for is graphic design skills, web useability knowledge and viable Internet solutions to your business needs. If all you are getting is someone who read a book on HTML coding and has a package of “web graphics”, don’t waste your money or your time. There are web development programs that can write the code. It takes talent to design an effective site. You want to spend your money on the talent.If a web design business is based on “volume selling”, how much personal attention can they really give you and your specific business needs? How skilled can their designers really be? Think about it.