Go Back
Navigating round your site

Site design || Text links || Image links || Making anchors || Linking anchors || Anchors on another page

1. Designing your site

Before you start making pages, you should be clear about how the site will work. A simple model of a site would be a home page, linking out to the other pages. Remember, each page then needs to link back to the home page again.


2. Making text links

Links will take you to another part of the web site. To make a text link, highlight the words you want to link, and then click on the Link button.

When this window comes up, click the Browse button, and navigate to the page you want to link to. Then click Open. 

. . .

The piece of text you chose will now be link coloured, and underlined. When people open the page in a browser, they can click on those words, and go to the page you selected as a link.


3. Making image links

You can also make an image into a link. Click on the image, and then click the Link button. Go through the same process to link the image so that users can click on it to go to a different part of the site.

When you make an image into a link, it will put a border around the image and it will be the colour you selected as the link colour. If you don't want this border, double click on the image, and put zero in the size of the border box in that window.


4. Making anchors

Anchors are a way of linking to a particular part of a web page, and are very useful on long pages. They are often used as a quick link to get back to the top of the page without having to scroll up.

There are two parts to using anchors: making the anchor, and then linking to it.

To make the anchor, click on the Anchor button.

 Now you will see a window where you name your anchor. Call it something obvious you will remember (like top, if the anchor is to go at the top of the page.) Then click OK.

5. Linking the anchor

Once you have made your anchor, you can link to it. For example, if you want to make a link at the bottom of a page that bounces you straight to the top, go down the bottom of the page, and type in Back to Top.

Then highlight the words, click the link button, and type in a hash ( # ) and then the name of the link. For our example we will type #top.

Now when someone clicks on the words "Back to Top", they will go straight to the top of the page.

When you are working in Edit mode, you see a little anchor to show you where anchors are. But when you are in Preview mode, or using a browser, the anchor is invisible.  

6. Linking to anchors on another page

If you want to link to an anchor on another web page, first of all link to the web page, using the Browse button in the linking window. Then use the arrow key on the keyboard to move to the end of that link, and type in a hash ( # ) and the name of the anchor ............. so the link will say something like otherpage.html#middle - this example would link you to a page called other page, and it would take you straight to the anchor called middle, rather than to the top of the page.

Back to Top