Linking two pages together requires the following code:
<a href=”filename.html”>words for the user to click on</a>
Where do you put this code? Where you want the link to appear. Make sure it’s between the body tags, just as all other content on you web page should be.
The filename.html gets replaced by the name of the file you are linking to. The filename in the link must match exactly the actual name of the file. If you’ve named your file as I’ve suggested, it has no capitals, no spaces, and ends with .html. That makes it easier when you’re linking.
The “words for the user to click on” should be something that describes where the link will take the user. So “Click Here!” would not be very helpful to the user, whereas “Learn about zebras” would give the user a clue about where the link leads.
For example, if you are linking to a file which contains a description of your favorite movies, the link code might look like this:
Learn about Judy’s <a href=”fav_movies.html”> favorite movies</a>.
This code will work only when the file to which you are linking is in the same folder as the file from which you are linking. If the files are in different folders, you must do some relative pathing, which is beyond the scope of this tutorial.
Once you’ve created the link, test it out, twice. First, test it on your local computer. Then, test it on the server. Don’t forget to send both files to the server: the file you are linking from and the file you are linking to. If your link doesn’t work, check the following.
- Is the filename in the link code exactly the same as the actual filename?
- Beware: sometimes you don’t see the entire filename on your computer. The Windows operating system typically hides file extensions. To see your file extensions, open Windows Explorer and select: Tools > Folder Options > View, or Organize > Folder and Search Options > View. Then uncheck “Hide extensions for known file types.”
- Are both the file you are linking from and the file you are linking to in the same folder?
- Don’t forget to send both files to the server.
- Never start the filename in your link code with c:/ or e:/ or any other drive.
- This may work on your local computer, but when a user on another computer tries to access the link, it will fail. The server doesn’t have a clue what is on your computer.
If you want to link to another web site, the link code should include the entire URL, as follows:
For a great place to buy books, visit <a href=”http://www.amazon.com”>Amazon.</a>
Links within your site will also work if you start them with http:// … etc. For example, you could link to a page within your site as follows:
<a href=” http://www.student.nvcc.edu/home/YourUserID/fav_movies.html”>Link to My Favorite Movies</a>
The link would work, but this is a bad way to link to pages within your own site, for two reasons: 1) link access time is increased and 2) when you want to move your web site to another server, you have to change all your links.
Candela Citations
- Judy's HTML5 Tutorial. Authored by: Judy Jacobs Miller. Provided by: Extended Learning Institute (ELI), Northern Virginia Community College (NOVA). Located at: http://www.nvcc.edu/home/jumiller/html_tutorial/linking.html. License: CC BY-NC-ND: Attribution-NonCommercial-NoDerivatives