Making Links and Tables

In this lesson we cover 2 important skills:
  1. Making Links (external and internal)

  2. Adding a table to our homepage

I have provided a step-by-step review of these skills in the tables below. Please refer to them while making changes to your web pages. As always, if you need more help outside of class, please come by my office or send me an email at: matthew633@hotmail.com

Making a Link


Within your website there will be several pages. Each of these pages is a separate html file and must be connected together in order to form a complete site. The way to make these connections is by creating links. Links that take a visitor from one page in your site to another page in your site are called internal links. On the other hand, links that take a visitor to a page outside of your web site are called external links. Fortunately for us, both types of links are made pretty much the same way. The only difference between the creation of an internal and an external link is in the URL address we use. Internal links will all begin with http://www.geocities.com/ while external links will not. Please refer to the steps below to learn how to make these links:

To keep this tutorial open and also work on your page at the same time go to the File menu at the top of the browser window. Select New from the pull-doen menu, and then select (Navigator) window. This will open another browser window. In this new window go to Geocities.com to log-in to your account and go to your filemanager.


Internal Links
  1. Remember, an internal link is a link to another page within your web site. So, the first thing that you need to do is to know the file name of the page you want to link to. We page file names end in .html or .htm. Look in your filemanager to get the name of the page you want to link to. If you only have one page other than the index page, then please create a new page.
    • Find the row of grey buttons at the top or bottom of the filemanager.

    • Click on the button that says New. A new page will open.

    • In the little white rectangle at the top of the page, type in the name of your new page. Be sure to end the name with .html.
      For example: lessonplans.html

    • Press the save button to save your new page and return to the filemanager.


  2. We now have a new page to link to, so it's time to go ahead and make a link on our original page (home.html for most of you). So find this page in your filemanager and press the link right next to it that says view. This will open your page in a separate window.

  3. We then need to open this page in Netscape Composer.

  4. Open your page in Composer (File....Edit page...)

  5. Within Composer, place your mouse cursor on the location in the page where you want the link to go.

  6. Type in the name of the link that you want to appear on the monitor. This is the word that visitors will click on to activate the link. It does nothave to/should not be a URL address. You just want a word that describes the destination of the link.
    For example: Lesson Plans

  7. After you type the word, highlight it with your mouse.

  8. Then click on the link button at the top of the window. A grey, rectangular box should appear.
  9. Inside the white rectangle that says Link to a location or local file type the URL address of the new page that you made.
    For example: http://www.geocities.com/tesltimes/lessonplans.html

  10. Then press the Apply button at the bottom of the box. Then press the Ok button.
  11. Your link should now appear on the webpage. But we still need to save the changes we have made.

  12. So, under the File menu, select Save as.... A save box should appear. Save your revised page to the desktop. Replace the old version.
Notes: follow the exact same procedure to make an external link. Just substitute a different URL address in for step 9.


Making a Table


A table is a very useful tool for creating a well organized look to your web page. A table can be used to create margins along the edges of you page to prevent text from spanning one end of the monitor to the other. A table also has the advantage of making everything on your page (text, pictures, links, etc...)always load in exactly the same location on the page no matter what size monitor the visitor is using.Please follow the steps below to make a table.
  1. While your page is still open in Netscape Composer, place your mouse cursor in the location on the page where you would like to put a table. For the sake of this example, we will make our table be a big box.

  2. Then click on the table button at the top of the window. A grey, rectangular box should appear.
  3. Inside the little white square that says Number of rows type the number 1. This will give us one row.

  4. Inside the little white square that says Number of Columns type the number 1. This will give us one column. This essentially creates an empty box.

  5. Below these small squares, select the Table Alignment. This tells the computer where on the page to place the table.

  6. If you want your table to have visible borders, then leave the check mark in the box next to Border line width. If you want the table to be invisible, uncheck the box.

  7. You can also control how wide and how tall your table will be. This size is measured in the % of the monitor that the table will occupy. To use a table as a margin I suggest that you choose a width of 88% and a heigth of about 90% in the box next to Table width.

  8. Then press the Apply button at the bottom of the box. Then press the Ok button.
  9. Your table should now appear on the webpage. But it will appear small at first because we have not put anything in the table.

  10. Highlight all the items that you want to place inside the table(text, pictures, etc...).

  11. Use the command Ctrl C on your keyboard to copy the items.

  12. Then use the command Ctrl V on your keyboard to paste the items inside the borders of your table.

  13. Remember to delete to items thatyou copied which are still outside of the table.

  14. Also remember to save your page and upload it to your geocities filemanager.


Back To the Web Design Center