Most small web sites use colour themes, position and logo's (or shared images) to generate whats known as a 'look and feel' that is common on all pages on a site. Larger sites actually often do the same thing but may also have sub themes or variations for each major section of a site.
Getting a Look and Feel for your Site
On a small site a simple way to achieve a 'look and feel' for a site is to dedicate certain areas for certain functions. With the page content in one of those areas.
This mini web site, does that by grouping elements of the page into: -
- The Common Area: This must be consistent on all pages.
In this case, the common area is in two shades of orange. It includes the: -
- Site Logo/Theme Photo.
- Navigation areas (pale orange).
- Site title.
- Keyboard navigation help.
- Right hand bar.
- Footer bar.
and
- The Content Area: Which is used for the remainder of the page, in this case in pale yellow.
Giving your site a look and feel should be a major aim. You want any visitor quite literally at a glance to understand the navigation, see the page titles and where to find the content of a site!
Designing the Common Area and Content Area:
- Site Navigation
Simple site navigation on a small site consists of each page linking to every other pages on the site. In this case its the pale orange list on the left hand side.
If you have seen the earlier page organise your material. You should be able to split your content into separate web pages.
After doing that designing the navigation is simple - decide on the order of the pages. Then give short meaningful titles (or even single word titles) to each page, if they are key words even better.
- Position, Colour and Font Size
The basics are:-
- Position of site navigation (top, left, right, bottom or combinations of those. Also if you use them (and you don't have to) - position of any header bars, side bars and footer bars.
- Background colour in the navigation area and any bars around the content.
- Text colour in the navigation area and other common areas or bars. I usually prefer to stick to black but its your choice.
- Text font size in the navigation area, this is typically a little smaller than the content font size.
- Position of logo(s) or any common graphic(s) used.
- The Content Area
Position of the content is already decided, basically its what left after all the other bars are in place. It expands downwards if your page is very long. Content is pale yellow on this page, to remind you.
Without positional decisions, that leaves:-
- Background colour for the content.
- Text colour in for the content. Again I usually prefer to stick to black but its your choice.
- Text font size in the content area.
- Position of any image(s) or multimedia used.
Of course very many more factors can be varied but with just those few you can get quite a good web page.
For some tools that can help you see how colours match together or to try and customising a web site template see:-
I should declare an interest in the Web Design off the shelf web site as it was written by me. If anyone in the work shop wants to give it a try I will create a web site for them using one of the templates for free.
