Website Best Practices
Maintaining a website can be quite simple and the Internet response
can be amazing if you follow this checklist of best practices.
Eventually there will be an article for each item explaining in detail
the purpose, advantages, and how to.
Files & File Structure:
- A website?s file and directory structure should be well-organized.
Cramming all the files in the root directory is messy and makes it
difficult to sift through a long list of files. Organize your files
into appropriate directories?for example, images should go in an
- Give your files and directories meaningful names, but do not use
spaces in the names. This will make it easier to manage your site.
- Make custom error pages (Especially page not found 404). On a 404
page you can refer people to an e-mail address so they can inform you
about a page that is missing, a bad link, etc. You may want to
view our custom404 page.
- Add a favicon.ico file to the root of your website. Then when a
web user adds your site to their 'Favorites' your custom icon will be
loaded giving you more visibility. Go to www.favicon.com for more
- Make a robots.txt
file that gives each search engine 'permission' to index your site.
- JPG files are best for photographs or art with gradient tints. GIF
images are best for line art?cartoon-like drawings, text rendered as
an image, artwork with flat areas of color.
- Images should be saved to the exact size you want them to be
viewed on the web. Do not resize images using size attributes in your
HTML code or FrontPage. Taking a large image and having it display at
a smaller size not only slows down loading times but also distorts
- Final web images should be saved same size at 72 pixels per inch
- An ALT tag should be used for each picture. Not only does this make your website more accessible for the blind,
but many search engines index these tags as well.
<img src="/images/imagefile.gif" height="200" width="100" ALT="Picture
Clue: It is not recommended to change the size of your image using the size attributes (height and width - see
example below), however it is recommended to specify the actual size attributes of each image. This is because even before all the images
are loaded, the page is shaped to its final structure. Without the size attributes, text and other pictures can get bounced around as
room is made for each loading image.
- A great alternative to frames is to use tables or divs. If you
make a table and set it's width to the entire width of the page, you
can then split it into multiple cells to get the same effect without
using frames. Tables give you more control over your borders, spacing,
and allows you to place items exactly where you want them. Divs are
similar to tables in that you can embed them and size them but you can
also locate by specifying the exact coordinates.
- Select fonts that are most likely to be used on 99% of the
computers on the Internet, you may want to select more than one at a
time. The code for using multiple fonts looks something like this:
<font face="verdana, arial, helvetica" size="2">
- Cascading Stylesheets allow you to specify font sizes and formatting
throughout the site from a single page. This allows for quick style changes site-wide!.
- Every page should have a complete descriptive title,
description and keyword tags. This will help with higher scores in
- Do not code links to pages within your site with absolute
pathnames (http://www.yourdomain.com/yourfile.html). Use only
root-relative (/index.html) or document-relative (../index.html)
links. This will guarantee that your files are called from the site it
is being browsed in?not another copy, such as a development site. I
personally prefer root relative links.
- Do not use Microsoft Publisher, Microsoft Word, or any desktop
publishing or Word Processing program to create HTML code. These
programs do a horrible job and it becomes impossible to manage it with
better programs when you want to do more advanced features.
Recommended programs are Microsoft FrontPage 2000, Dreamweaver, Hot
Dog, HoT MetaL Pro, etc.
- Take advantage of using server-side include files. This will allow
you to update the navigation and titles of your whole site from one
location. Refer to Handy ASP and
Handy PHP to learn how to use
Includes for each Programming Language.
Now that you got a website put together, do everything you can to help people know it is there. Put the web address on your business cards,
invoices, in your commercials, and on your company vehicles. Submit your website to search engines and update
it often. If you are selling stuff on your site, participate in affiliate marketing and get businesses to link to your site from theirs.
Article last reviewed: 08/16/2003
Created by: Digital Foundation,
Copyright © 2002-2005 Digital Foundation,
All content of the NetworkClue website is copyrighted. Articles, notes,
outlines, and all other materials may not be stored on the Internet or sold or
placed by themselves or with other material in any electronic or printed format in whole or
part. However materials may be referenced by links to the site.