Links (Anchors)

HyperText links are created using the <A HREF....> or anchor tag. See more about links.

<A HREF"URL">Something to click on</A>

Absolute vs. Relative Links

Absolute links specify the location of the file as well as the file itself. Typically you would use this to link to a page that is not one you created. For example:

<A HREF="http://www.yorku.ca/faculty/finearts/">Go to York's Fine Arts Pages</A>

would appear as: Go to York's Fine Arts Pages

Relative links specify a file relative to the current document. When designing your pages you will most often want to link between pages and access files and images on your server account.

See a note about folders and files for a discussion of ways of viewing files on the Macintosh.

Link to a file in the same folder

The name of this file (the one we are looking at) is "wwwtags.html". The name of the file above for the note about folders and files is "l3ex6.html". If they were in the same folder in my directory. To link from this file to the other I would use:

<A HREF="l3ex6.html">A note about folders and files.</A>

Link to a file in a sub-folder

Given the file and folder setup in a note about folders and files. To create a link in the file "householdwaste.html" to the file "bottles.html" in the sub-folder "recyclables" you would use the command:

<A HREF="recyclables/bottles.html">Some text to link</A>

The / takes you down one folder.

Link to a file in a super-folder

Given the file and folder setup in a note about folders and files. To create a link in the file "bottles.html" to the file "householdwaste.html" in its sub-folder you would use the command:

<A HREF="../householdwaste.html">Some text to link</A>

The ../ takes you up one folder.

Link to a file in a sub-folder of a super-folder

Given the file and folder setup in a note about folders and files. To create a link in the file "bottles.html" to the file "computers.html" in the super-folder and then sub-folder "garbage" you would use the command:

<A HREF="../garbage/computers.html">Some text to link</A>

Examples for someone using the Fine Arts Server

A typical student with user name apalladini could have the following account file structure. Only things inside the WWW folder are available to the outside world.

Linking to a File in the WWW Folder from the Outside

If our pal wanted to tell friends to link to the file: ourpal.html the following URL would be used:

<A HREF="http://facs-newmedia.finearts.yorku.ca/apalladini/ourpal.html">A link to my friend Al's Page</A>

Linking to a File in Another Folder

If our pal wanted to link from ourpal.html in the WWW folder to A1page.html in the Assign1 folder the following URL would be used (inside ourpal.html):

<A HREF="Assign1/A1page.html">To another of my pages!</A>

Linking to a Default File

Most of our pal's colleagues don't know how to BLANK, so the shorter the URL the better!?! Deciding to use a default file name, our pal tells friends to use the following URL:

<A HREF="http://facs-newmedia.finearts.yorku.ca/apalladini/">A link to my friend Al's Page</A>

Without a specific file, the file in that directory called: default.html is served.

Linking within a File to Images in a subfolder

Our pal needs to show an image on the page: A1page.html. The image is in the subfolder: media. The following image tag would be used:

<IMG SRC="media/bigtruck.gif">

Linking within a File to Images Elsewhere

Our pal needs to show another image on the page: A1page.html. The image is in: apalladini/media and is called: hondarules.gif. The following image tag would be used:

<IMG SRC="../media/hondarules.gif">

Linking with an Image

At the beginning of this section I referred to:

<A HREF"URL">Something to click on</A>

Something to click on in the examples above was always text, but it can be an image as well. For example:

<A HREF="http://www.yorku.ca/faculty/finearts/"><IMG SRC="falogo.gif"></A>

would appear as:

Linking with MailTo

You can provide a link which people can click on to send you mail. This assumes that the person's browser is set up to do this. In the Winters Lab it will probably not be set up.

<A HREF="mailTo:dws@yorku.ca">Send mail to Don...</A>

Would look like this:

Send mail to Don...

Valid for Fall/Winter 2003-2004

The material contained in this site is copyright and owned exclusively by Don Sinclair and members of the FACS teaching team.

Last modified on 14-Nov-03 at 9:28 AM.