Creating an easy-to-use interface that’s both quick-loading and visually appealing can be a fairly tedious task. The navigation bar is really the solitary element that designates the easy of use for your site. Make your buttons large enough to click on and place crisp, readable text on them. If you’re site isn’t easy to navigate thorough and gives your visitor a hard time, he or she probably won’t return no matter how useful the information is. They almost always have the option to obtain the same information from other resources. People also expect efficiency, which means you shouldn’t make just a few elements easy to use. Spend some time creating an excellent interface to make your visitor happy and make them come back. In short, design your interface carefully… with your visitor in mind.
A Web interface should retain the following qualities:
- All interfaces should reflect the interests of your target audience. Add the level of interactivity and balance of graphics and text appropriate to your visitors.
- Avoid pointed corners and straight lines whenever possible. Generally speaking, people prefer curved lines to the basic appearance. If you’re Web site is aimed at promoting your business practices, however, you may want to consider going for the pointed corners and straight lines to satisfy all the hard-pressed, straight collar business people out there.
- Make the interface colorful. Definitely avoid using simply black and white. You may want to consider referring to the “Color schemes” section on page 38 to assist you in creating an aspiring visual.
- Make it no larger than 20-25% of your Web page unless your site is based on an image-map.
- Keep the navigational elements consistent throughout your Web site. You don’t want to cause a lot of confusion.
- Most Web page interfaces appear on the left side of the screen. So how do you get it there if you want something on the right side? Create a table (with a 100% width) and place your navigation bar/user interface in the first <TD> cell (if you base your site on 2 cells) or the 3rd cell if its 4. See the diagram illustrated below.
Either way is fine, its up to you to decide which way would be easier for you to organize your web page data. Please don’t think you need to use one of these two illustrated methods. There are many more common layouts and we encourage you to look into them (or design your own!)
Side Note: Avoid creating a background image inside the navigation <TD> cell area. The reason for this is it creates a blank area around the table’s parameter, which deducts the appeal of your site’s layout. Instead, create a new image about 2000×1000 pixels (width x height) in length and place your navigation bar’s background element to the left. The reason for the large image set-up is that it spans across a typical monitor’s screen so the background image won’t tile. Unfortunately, you will need to sacrifice saving download time, but the final result is worth more than having a user wait a few extra seconds (sometimes milliseconds) to load. Generally, the more white space an image contains, the faster it loads.
We suggest creating a savvy curvy navigation bar (for informal Web pages) because it looks neat and it’s very popular. These navigation bars are typically rectangular but have a curvy right edge. If you choose to create this type of navigation bar, avoid sharp pointed rectangles and squares. Circular graphics look best for use with curvy navigation bars.