|
Make Your Header Ahead of the Rest!
|
|
|
|
Welcome to another edition of the Graphic Guru! One of the most important elements in web design is the creation and implementation of an effective header. I would like to present some ideas on powerful headers.
Many people don't know how to determine if a header is effective or not. In order to approach that question, first we need to know what it is that a header needs to accomplish. The header is a tool used to promote the following general functions:
|
|
- Advertise for the business it represents (logo)
- Set the tone, feel, and mood of the web site
- And provide consistency for the visitor
|
|
Since it is a tool, there are obviously any number of ways that it could be applied, depending on the circumstances of the job and personal preference of the designer or client. However, remembering the above three characteristics of header functionality will dramatically improve the effectiveness of the headers you design.
What makes a header good?
I had the opportunity to review a number of your web sites this last week. I saw many great things on these sites, and, as with everything, I saw a few things that could be improved. I have compiled a list of eight questions that each of us can ask ourselves about our header designs. Maybe through asking ourselves each of these questions we can improve together and discover what makes an effective header design.
1. Is my header readable?
Legibility is key. Remember that if you cannot read what is written, you cannot sell what is being offered. Make sure you have enough contrast between the text and the header it is on. Would it look better light against dark or dark against light? Is your text big enough? Could you possibly choose a font that is a little bit clearer? The bottom line is to make certain that you and everyone who visits the site you are building can read what is there and make out any images you want to be seen.
2. Is my header more than 600 pixels wide?
Many people who will be surfing the net have monitor settings that may not exceed the standard 640 x 480 pixel screen size. As web designers we are always trying to plan for the greatest number of visitors to our sites to be accommodated. If you plan for each header (and the content under it) to fit within 600 pixels, you will ensure that more people will see it.
3. Is the business identity (its logo) clearly defined?
Again, the header is a tool that can serve to advertise for the business it represents. Be sure to take advantage of that. Make the logo or business name clear and clean, easy to read, and attractive.
4. Does my header fit in with the look, feel, and function of the rest of the site?
Ask yourself honestly if your header is getting the job done. Does it match the rest of the site? Sometimes when we have created something or spent a lot of time on it, we have a natural tendency to fall in love with it, whether it is helping or hurting our overall goals for the job. We need to emotionally separate ourselves from the work at times to determine if it really works or not. Then we need to be willing to change it if it does not work. The header must add to the web site - never detract from it.
5. Have I optimized the header for the smallest possible file size?
One common mistake that people make when starting to build web sites is to neglect to prepare an image for use on the Internet. This is a process called image optimization. If an image is not optimized, it can take much more time to appear on the screen than the visitor or potential customer has patience to wait for. This results in loss of customers.
6. Does my header lead my visitors to or distract them from the navigation?
As a tool, a header should be employed strategically. Examine your header and see if there is a way to use that tool in a more effective way that will lead the visitor’s eye to the navigation you would like them to click on first. Let's be as aware as we can of our use of such powerful opportunities. Can your header include the navigation? Can it be a similar color as the navigation? Can you design it to somehow point to the navigation? Ask yourselves some of these questions.
7. If there is any animated object as an element of my header, is it a help or distraction to the overall offering of my site?
The rage of animations has moved many web designers to include them in their sites. In truth, animations can be very useful, if used properly. Be sure that any animation is employed sensitively. If it is a distraction, it will potentially chase customers to another site where they can find what they are looking for without getting a headache.
8. What feel or mood is my header portraying? Is that the feel or mood I want it to portray?
The combination of color, images, text, and style all lend to the visual feel of a web site. As the designer, your goal is to create a header (and other graphics as needed for that matter) that will appropriately represent the client, his company, and what he is trying to sell. For example, does the site sell toys or does it sell tours? Is it a serious business or meant to entertain? These are effective questions to ask yourself when planning the feel of the site and the use of the header in accomplishing that.
I ask myself these same questions when I begin to design each site. The Header/Navigation combination is the foundation for any site, so give it serious consideration. Think deeply about these questions before even getting started, and you will avoid many headaches in the future! Good luck!
|
|
|
