HTML Topics
©1998–2010 R. Hinton, Broome
Community College
Last Updated: 18–Feb–10
Links provide the “connections” that make the World Wide Web possible. They allow you to “jump” to external sources such as files stored on your computer and on other computers. They can be used within a Web Page, permitting you to quickly navigate to specific locations on that page. Using the <a>nchor tag, it is easy to incorporate any type on your page.
The most common internal link provides a way of returning to the top of a page. This is useful, especially for long pages. In long pages they can be even more useful. Links to specific locations within the page can be organized as a Table of Contents at the top. Provide links at each section which return you to the Table of Contents and now you can easily navigate long pages.
Each link will require two <a>nchor tags. First, you must define the location in the page. This is done by providing a name for the location and the text it is associated with. Internal links take the following general format:
<a name="LocationName">Associated Text</a>
where the Location Name and Associated Text are replaced with location names and text specifically related to your Web Page. The following <a>nchor tag was used to define the link to this section:
<a name="InternalLinks">Internal Links</a>
Links don’t require any text. The following <a>nchor tag was used to define the top of this page:
<a name="Page_Top"></a>
Next, you create the actual link to that location. This is done by referencing the name for the location and the text to be displayed as the link. Internal links take the following general format:
<a href="#LocationName">Associated Text</a>
where href stands for hypertext reference. Note: The location name is case sensitive. The following <a>nchor tag was used to reference our locations:
<a
href="#InternalLinks">within</a>
<a href="#Page_Top">Return to Top of Page</a>
Note: To see how the internal links in the Overview were created and used– view the Page Source.
External links are references to computer files. These may be stored locally on your machine or may be at other web sites.
In order to maintain a web site, you will need to create links to all the pages supporting the site. These will normally be stored in the same directory, so they can be easily referenced by their filenames. Internal links take the following general format:
<a href="filename">Associated Text</a>
where the filename and Associated Text are replaced with filenames and text specifically related to your Web Page and href stands for hypertext reference. Note: The filename is case sensitive & is usually written in lower case. The following <a>nchor tag will take you to a file stored in the same directory as this Web Page:
<a href="samedir.html">File in Same Directory</a>
If the file isn’t in the same directory, then the entire path to that file must be listed. This takes the following general format:
<a href="/path/filename">Associated Text</a>
where the path is replaced with the path specifically related to your Web Page and can contain multiple directories. Note: The path is case sensitive & is usually written in lower case. The following <a>nchor tag will take you to a file stored in a different directory from this Web Page:
<a href="/~hinton_r/html/examples/diffdir.html">File in Different Directory</a>
Often you will find sites related to yours. Providing links to these sites makes it easy for surfers to continue on their way. However, while not required, it would be considerate to contact the Webmaster of the link site and obtain their permission. REMEMBER– Web Pages come and go every day! Periodically you should check these links to ensure they are still valid. Hey! Another good reason to contact the Webmaster. They may notify you when the page goes down. Web links take the following general format:
<a href="http://url/path/filename">Associated Text</a>
where the url, path, and filename are replaced with the URL, path, and filename specifically related to your Web Page and the path can contain multiple directories. The following <a>nchor tag will take you to a file stored at a Web Site:
<a href="http://web.sunybroome.edu/~hinton_r/html/examples/webdir.html">File at Web Site</a>