Copyright Michael Karbo, Denmark, Europe.

  • Next chapter.
  • Previous chapter.

    Chapter 20. We need links

    Now we need to finish the page, and it is logical to give the visitors some links to other websintes that also deal with Saint Raphaël and surroundings.

    Insert external links

    You are going to make the last main section in the raphael.htm document:

    1.   Start again by repeating the heading etc., like in the previous exercise. Text needs to be Links. and the bookmark is changed to links.

    2.   Now enter the following paragraph:

    France has not as advanced as far with the net as one could expect, still there is a number of home pages relative to Saint Raphaël:

    3.   Now you could enter the various links, but that is not my plan. In stead you are going to ”steal” them from the home page for this book. Click on the first, which goes to Saint Raphaëls official home page:


    4.   Now this page opens in a new browser window:

    You probably have to maximize the windowif you want to study this site. There is much good information to find, but the layout is not particularly successful. But that is not our problem; you need to copy the sites URL (internet address), and here is how you do that.

    5.   Select the address in the browsers address field. You can also press F4 F4 and it is selected:

    6.   Make a copy with Control+c.

    7.   Shift to the NoteTab window. Enter the following:

    8.   Select (highlight) the three words.

    9.   Activate the clip hl2 with a double click. Then press Control+v to insert the URL directly in the field Link URL.

    10. Press Tab to go to the next field (Target).

    11. Press ArrowDown, it reads blank in  the field:

    12. The click OK, or press Enter.

    13. Save the page and test it in the browser. Click on the link; it needs to work like just like in the home page for this book.

    Now you have made an external link. That goes to a ”foreign” home page, somewhere else on the net. In that situation it is very practical that the page does not open in same browser window as your own page. As web master you are not interested in that the visitors leave your home page so it is smart to open the external links in a new window. That is done with Target blank, which you selected in point 11 of the exercise. You can also see that in code for the link:

    Figure 47. This link opens in a new browser window.

    The last links

    You can surely see that it is smart to copy URL’s directly from the browser. Then you do not have to enter, which is the address for our next link.

    You now need to add the next four links from the home page for this book into the document raphael.htm. You can copy both texts and URL’s if you want to (long live laziness!), and that can be done in different ways. First the least complicated:

    1.   Enter the four lines with <LI>-codes, like you did in the preceding exercise:

    2.   Then you must edit the four links individually: Select the text.

    3.   Copy the link from the browser window (with the quick entries F4 F4 Control+c).

    4.   Insert the URL with the clip hl2 (that can be activated very fast with Control+Space, when the clip is selected), just like in the previous exercise.

    If you want to experiment with alternative procedures, there are certainly two other options:

    ·        You can make four copies of the link line that already works. Then adjust the individual texts and URL’s.

    ·        You can copy the texts from the home page for this book and insert them in your own page. Then you don’t have to type them in. Then you can follow point two above.

    Now finish the page. As mentioned there are different ways to do that but don’t let that mystify you. If you are in doubt then select the ”slave method” as previously described.

    And the webmaster …

    The only thing lacking is that you need to insert your own e-mail address in the bottom of the page. That is a good habit, since it allows the reader to contact the webmaster and for example report errors.

    1.   In the bottom of the page insert a horizontal line with the clip phr.

    2.   Type Webmaster and select this text.

    3.   Enter your own e-mail address as a link, and type mailto: before the address:

    4.   Links that start with mailtwo: are automatically interpreted as e-mail addresses when you click on them in a browser window.

    5.   Save the page and test the whole thing in the browser.


    Now the page is almost ready. You just need to link the 6 points in the summary (page XX) to the 6 corresponding bookmarks (#intro, #nature, #city, #where, #recommend and #links) in the document.

    1.   Do that now, connect the 6 points in the summary to the 6 bookmarks. First select text, then double click on the clip hl2. You have tried that before, so that should not be a problem…

    2.   Save the document – hopefully you are finished now!

    3.   Then check that everything works. Check the links in the summary on top of the page.

    4.   Check that the five external links you made in the bottom of te page open the right pages, and that they open in a new browser window. If that is not the case you must correct the errors!

    5.   Check and see that the link to webmaster works. When you click on that the e-mail program opens so you can send a message!

    Figure 48. This link goes to an e-mail address like you also saw it in the browser status bar.

    That was the conclusion of this long exercise. I hope you able to use it. At least you have tried to make a somewhat larger home page. You will be able to use this format in a number of other subjects. So now you should be able to make your own home pages!

    The travel page works as it should. You can navigate from the top of the page down to the individual section, and you can return to the top again. That is like it should be. But I am certainly not satisfied with the appearance of the page (especially line length and fonts. They can be much improved, and we will look at that in the next chapter!


  • Next chapter.
  • Previous chapter.

  • HTML Tutorial Overview.

  • Get the files for this tutorial (opens in a new window)