Navigation

Before finalising your plans, you must consider how your visitors are going to move around your site.

This gets more complicated as sites get bigger - a simple site may only have a few pages, which is fine. In this case a link to each page on every page is the best plan.

Once you've got more than a handful of pages though, things get complicated. It's probably worth splitting your content into well defined sections (if possible). What you'll end up with is a tree structure, with your index page being the root. Each branch (section) can contain links to the pages within it, or even have more branches itself.

The physical location of your files is also important in this case - use directories and name things well. For example, the URL to this page gives a good indication to where you are: in part 3 of the design section of Sitebuilder. This will also help you to find things more easily.

Put links to your different sections in the same place on every page.

To Frame or Not to Frame?

Frames (click here for tutorial) can be very useful in aiding navigation. You can keep a menu frame at the top or side of the screen to hold all of your links leaving you just to make the main frames which can be virtually all content. There's also the advantage of having only one file (the navigation frame) to update when you change your site.

There is a downside to frames though. Firstly, search engines don't like them. Unless you provide plenty of content in your NOFRAMES section, you're unlikely to be listed which will put a major dent in your visitor statistics.

Secondly, frames can confuse the visitor. This is for two reasons: first, they can't see the path to the file they're looking at because the URL of your frame set stays in the location bar of the browser. Unless you've designed things very well, this can make people feel lost and not know where they are. In addition you can't bookmark(favourite place) individual pages, as you'll just get the frame set again. However, good design can overcome these problems.

Contents and Index

Make sure that your front page (or homepage also known as index) lets your visitors get to each section of the site.

Large sites may also benefit from a Site Map - this is a page which lists every page on the site, clearly illustrating the various sections. Have a look at the code-warrior Site Map by clicking here.

The Final Plan

Once you've decided on a navigation system, modify your page designs as necessary. You should now have a reasonable idea of what you want your pages to look like.

The next step is to create a prototype - take your plan and try to make it happen on the screen using HTML. Create a front page with some placeholder links and just enough text to get a reasonable idea of what the finished page will look like.

This is where things will probably start to come unstuck. Your design may be too complicated to create, or it may turn out to look very different to you visualised. Ask other people what they think, and start practicing. Also check how it looks at various screen resolutions - the minimum it should work at is 800x600, but you may want to go as low as 640x480.

* This site best viewed on our monitors :)