Website Guidelines

Keashly.ca Consulting uses these website guidelines and tips to design web pages for the sites that they develop. These guidelines and tips help ensure that the website maintains a professional look and feel and at the same time is easy for users to navigate and find the information that they are looking for. The website tips and guidelines have been broken into the following sections:

• Professional look and feel
• Different Browsers, Browser Versions and Monitor Resolutions
• Javascript, Cookie and Plug-ins Use
• Web Standards
• Testing

Professional Look and Feel

Use the same background color and/or images on all pages, the home page may be slightly different.

The company logo should be on every page always in the same place.

Use a consistent means of webpage navigation on all pages. Provide a site index or site map, this page has links to all pages in the site. The site map is usually a simple text-only listing of how the website is organized.

Every page should have the copyright and All rights reserved notice (e.g. Copyright © 2000-2008 Company name. All rights reserved.), a link to the website Privacy Policy and Terms of Use/Legal Policy. It is also recommended to have when the page was last modified and an email address if problems or questions need answering.

Keep headers, footers, content, etc. consistent. Use the same colors, fonts, sizing, alignment, etc. on all pages for the same elements.

The convention on the web is that all links are underlined and visited links are one color and non-visited links another. Use this convention as users can get very confused when links no longer have their underlining or they can not tell where they have been or not yet visited. This is especially true for people with accessibility issues. Exception to this is for the navigation menu, its colors can stay the same for visited or non-visited links.

Give all images an alternate text so users that have turned images off will still have an idea what the image is. This is also important for people with accessibility issues.

Every website page should have its own title and unique URL. If you are using frames, ensure that each webpage has its own title and URL. Users may want to bookmark a certain page of information on your site, if you do not have unique URLs for each page, every time the user goes to the bookmark, they will be taken to the home page and have to navigate to the page they really wanted. This is very frustrating for a user.

Every page should have a means of contacting the company be it via email or link to a contact information page.

Different Browsers, Browser Versions and Monitor Resolutions

Design your site to work with the majority of browsers, browser versions and platforms. Don't assume that if your website works for one particular version of a browser that it will work for others or if it works on a PC it will work on a Mac. If you are using frames, remember that there are a large number of people who have browsers that do not support frames, for example users with AOL browsers, browsers for disabled people or people who have turned frames off in their browser. Therefore, you will need an alternate means for these people to access your information. Test your website under a number of different browsers and versions of the browser.

Design your site to work with all monitor sizes. Use relative sizes rather than absolute sizing (e.g. on a table width=90% rather than width=680). Using percentages allows for automatic sizing. For example percentages allow a table to resize depending upon the monitor size and/or the window size.

Code your pages so they can be used on alternate devices such as cellular phones, hand-held devices etc.

Javascript, Cookie and Plug-ins Use

Be careful with your use of Javascript and cookies, your pages should still work if Javascript and cookies have been turned off or are not supported. If you are using Javascript to power your site navigation ensure that you have an alternate method for users that do not have Javascript capabilities to navigate your site. Test for these cases.

Limit your use of animation/flashing images, Flash and plug-ins. These are neat but get very tiring for the user after a very short time. Ensure that you have a way for the user to by-pass these effects if they so desire. When you use these effects make sure that their use is appropriate for what you are doing.

Web Standards

Your HTML, XHTML, CSS, Javascript and DHTML should all be validated to comply with current web standards.

Testing

Make sure that your site is thoroughly tested before content is added to the general viewing public. There is nothing worse than going to a website that does not work, has non-working links, nothing happens when you click a link or you just get an under construction message. Start small, get a page or two working and build from there, sites are always a 'work in progress'. A good idea is to set up a working directory and a test directory for your website. Have the working directory the thoroughly tested version that the general public accesses and the test directory for you to use while testing new content. Once you are confident that the tested page is ready then promote it to the working directory.