Links

1
Lesson 6

• Links

2
Creating Folders

• For every web site/page, you need to create a
  separate folder
• The computer cannot find links if they are not
  stored together in a folder
• For example, if you want create a web site with
  multiple pages, all the pages need to be stored
  in the same folder
• If you want to include an image, you will want to
  store your image in the same folder as the web
  page on which it appears
• For the Gettysburg Address page, create a folder
  called presidents in your folder and move your
  Gettysburg page there.

3
Anchor Tag and Links

• The anchor tag or ltagt . . . lt/agt is used to link
  to other web pages
• Anything can become a link a button, a word, a
  phrase or a picture
• Lets say you want to be able to find more
  information on George Washington, you can make
  his name a link.
• One site with a bibliography is
  http//www.conservapedia.com/George_Washington
• You must use the entire web site address in your
  anchor tag.

4
Anchor Tag to a website

• You will need the name of the file or the URL you
  want to link to AND
• The link hotspot the highlighted text or
  graphic that will be clicked on to get to where
  you want to go
• Inside the tag, you need the attribute (href),
  meaning hypertext reference
• It works like this
• lta hrefname of websitegthotspot textlt/agt
• The George Washington tag would look like this
• lta hrefhttp//www.conservapedia.com/George_Washi
  ngtongt George Washingtonlt/agt(1789-1797)

5
lta hrefhttp//www.conservapedia.com/George_Washi
ngtongt
This goes before the words George Washington on
your page. Now place the ending anchor tag lt/agt
after the words George Washington on your web
page and before the dates of his presidency
(1789-1797). This will make the words George
Washington your hyperlink to the George
Washington page on the web.
6
Try it

• Save your page and open it in Internet Explorer.
• Click on your George Washington link and see if
  it takes you to the page containing George
  Washingtons biography.

7
Linking to Other Pages of a Website

• To build a web site, you can also link to other
  pages that you have created using the anchor tag.
• If all pages are in the same folder, you can use
  just the file name in the tag instead of the
  entire path.

8
Lets try this

• Your Graphic and Multimedia format page will be
  your index page or main home page.
• Create a folder called Graphic Formats
• Move your Graphic and Multimedia Format page to
  it.
• Rename the file index.html
• Now, create a new page called gif.html

9
To create the gif page

• Turn to page WS45 in your textbook, and type the
  code in 2 on to the gif page.
• Save the page to your Graphics Format folder as
  gif.html
• Now, pull up your index.html page and add the
  anchor tag around Graphics Interchange Format
• lta hrefgif.htmlgtGraphics Interchange
  Formatlt/agt
• Test your links, both to the home page or menu
  and to the gif page

10
Lets finish this website

• Do the Step-by-Step exercises from your book on
  pp. WS49-WS54 to create your web pages to be
  linked to your index.html file.
• Put anchor tags in your index.html file that will
  link your pages to the description of formats.

11
Adding a button

• ltform method"get" action"http//address you
  want to link to"gtltinput type"submit"
  value"click here"gtlt/formgt
• This is what it would look like
• Add color to your button
• ltFORM METHOD"get" ACTION"http//www.lissaexplain
  s.com"gtltINPUT TITLE"submit" TYPE"submit"
  STYLE"background00ff00" VALUE"Click
  Here"gtlt/FORMgt