Hints & Tips

Page 5

Is Your Site User Friendly?

Creating a user-friendly layout is very important when it comes to pleasing your visitors and thus establishing return visitors. This article will go over some of the things that you can take into account when you are looking over your website.

Here's a checklist for good usability:

  1. Easy to Find Menu or Links

  2. Good color contrast between text, backgrounds and links

  3. Having a clear link to your main page on each page

  4. Having a clear description of what each page is intended for

  5. Having "alt" attributes for each image

  6. Having "title" attributes for each link

To make sure that your menu is easy to find, most people would recommend that you place it near the top of your web page on the left side. This is mainly because we read from left to right and so our eyes will start on the left side of the screen. Others would argue that the menu is best placed on the right hand side because of the scroll bar location, but this isn't always the case as most visitors expect it to be on the left side.

Although placement is very important, it's even more important that you choose a good color scheme for your website. If you have a dark blue background, it wouldn't be wise to have a dark blue link or a dark red link as the contrast would be hard to see. Our Website Wizard can help out with the issue of selecting an appropriate color scheme. Try it out by registering for a free website hosting service.

It is always a good thing to have a link to your main page on each of your other pages. This way, when visitors get lost they can start fresh from your main page. Also, this helps as it brings them to the spot that you would like them to bookmark.

Always make sure that you are descriptive with your links. No one wants to click on "Page 2", "page 3", etc without knowing where they go or what will be on those pages. "Contact Us"; "Biography"; and "About This Site" are all good examples of link names.

While we can use our common sense when designing a website that is easy to navigate, it is pretty hard to overlook the fact that visually impaired people visit websites. many times, we will find ourselves using image that don't contain an "alt" attribute. Alt stands for alternate text. You can use the alternate text tag to describe the image for visitors that are using browsers that read out web pages to them. It wouldn't be a good experience if all they heard was "Welcome to [image] website" -- If you're using a logo (or any image at all), then you should have an alt text. Alt can be used like so:

<img src="imagepath/heart.jpg" alt="a small pink heart">

Like the alt tag, it is also important to use the "title" tag for the same reasons; if you are linking the words "To go to the main page, click here", all a browser would read is "[link]". By adding a title attribute, you are giving a description of what the link will do if clicked.

<a href="http://www.yourwebsite.com" title="Go back to the front page of Your Site Title">Click here to go to the home page</a>

Hopefully these tips will help you to ensure that your website is more user-friendly.

How Favicons Work

A favicon is a tiny graphic that replaces the standard web page icon in your browser's Address bar. It also appears in the Favorites menu when your web site is bookmarked.

A favicon is a tiny graphic that replaces the standard web page icon in your browser's Address bar. It also appears in the Favorites menu when your web site is bookmarked.

A favicon needs to be 16 pixels wide and 16 pixels high, and saved with an .ico extension. The easiest way to implement one is to name it "favicon.ico" and upload it to the root directory that holds all of your HTML files. This is where your browser will automatically look for a favicon.

If you want to put the favicon in a different place, give it a different name, or use multiple favicons for multiple pages, you can tell a web page which favicon to use by inserting the following line of code between the tags of your HTML. Just change the link to the address you need:

<link rel="shortcut icon" href="http://www.website.com/images/myicon.ico">

There are several software programs and web sites available that allow you to create favicons. Favicon.co.uk has a free online editor and emails the finished icon to you. Another free tool comes from Chami.com's HTML Kit, which converts an image you've created with your own graphics program into a favicon.

[ Hints & Tips 1 | Hints & Tips 2 | Hints & Tips 3 | Hints & Tips 4 | Hints & Tips 5 ]


[ About Me | Site Legal Info | Site Design | CSS Coding ]
[ JavaScripts | Hints & Tips | BackGrounds | Misc. Images ]
[ Templates | Logo Page | Special Characters | Color Chart ]
[ Contact Us! | Awards Won | Links ]
[ Home | Site Map ]


Go to Top

Webmaster & Owner: Anita Eberline
No part may be reproduced without prior permission by Anita Eberline