Web hyperlinks — the connections that let you go from one Web page to another with a single click — are the key to what makes the Web great. They also can be a bit complicated to create, test, and maintain. The basic idea, remember, is for your HTML document — the core of your Web page — to refer to another file. The user is either going to see that file in your Web page, for instance as in a graphic embedded in the page, or click something in your Web page to leave it and link to the other file.
One of the biggest problems users have on the Web is broken links: a link that doesn't do what it says it does. Encountering a broken link is very frustrating, and you, as the Web page publisher, may not find out about the problem for a long time. Create and test your links carefully and repeatedly, fixing any problems, to avoid broken links.
Understanding how links work
The basic mechanism for creating a link from one Web page to another is simple. You use the <a>, or anchor, tag to begin the link. Within the anchor tag, you can specify where the link goes to, using theHREF attribute to specify the Hypertext REFerence, or destination, of the link. Some text within your document usually follows the anchor tag. An </a>, or end-of-anchor, tag then follows that text.
In a typical Web page, the underlined text — called the link text, because it's where the user clicks to follow the link — displays in color as well as being underlined.
The other kind of link you commonly create in your Web page is an image link. You begin this kind of link with the image tag, <img>. You use the src attribute, which nearly always appears within the <img>tag, to specify where the image lives. For simple sites, store the image in the same folder as the HTML file that links to the image. Then the src option is very simple:
<img src="myimage.jpg">
Avoiding mistakes
Making mistakes in your Web site when you're specifying links is easy, and "good" links can easily become broken because of changes in the Web site you're linking to. Here are some ways to prevent problems, and to manage problems when they do come up:
One of the biggest problems users have on the Web is broken links: a link that doesn't do what it says it does. Encountering a broken link is very frustrating, and you, as the Web page publisher, may not find out about the problem for a long time. Create and test your links carefully and repeatedly, fixing any problems, to avoid broken links.
Understanding how links work
The basic mechanism for creating a link from one Web page to another is simple. You use the <a>, or anchor, tag to begin the link. Within the anchor tag, you can specify where the link goes to, using theHREF attribute to specify the Hypertext REFerence, or destination, of the link. Some text within your document usually follows the anchor tag. An </a>, or end-of-anchor, tag then follows that text.
In a typical Web page, the underlined text — called the link text, because it's where the user clicks to follow the link — displays in color as well as being underlined.
The other kind of link you commonly create in your Web page is an image link. You begin this kind of link with the image tag, <img>. You use the src attribute, which nearly always appears within the <img>tag, to specify where the image lives. For simple sites, store the image in the same folder as the HTML file that links to the image. Then the src option is very simple:
<img src="myimage.jpg">
Avoiding mistakes
Making mistakes in your Web site when you're specifying links is easy, and "good" links can easily become broken because of changes in the Web site you're linking to. Here are some ways to prevent problems, and to manage problems when they do come up:
- Keep your whole Web page in one folder. When your whole site is just one Web page, your only links are to the graphics images that display as part of your page. Put the graphics images in the same folder as the HTML file that defines your Web page. That way, your links to graphics files are simple — just the filename — and when you publish the site, you just move a single folder from your machine to the Web server.
- Keep your whole Web site in one folder. When you grow your Web page into a multipage site, you can keep all the HTML files that define your Web pages, as well as all the graphics files they use, in a single folder, again simplifying links. This method does get crowded after a while, though.
- Avoid internal links to Web pages on other sites. Linking directly to a spot within a Web page on another site is fun, but you're depending on an anchor that may go away as the Web page is updated. Try to only use internal links within your own site, wherever possible.
- Check all links before you publish. Before you publish your Web page or Web site, try every single page to make sure that graphics load properly, and try every single link to make sure it works correctly. If you find a problem, make the change while it's still easy — and then recheck to make sure you got it right.
- Check all links after you publish. Some of your Web links — both links to graphics within the Web page and links to other sites — may break when you publish your site. Check to make sure. If you do find problems, fix them, test on your local machine, and then republish and recheck.
- Check all links every couple of weeks. Other Web publishers can easily make changes in sites you depend on — and it's a sure bet that the minute you decide that the site you link to will never change, it does. Keep checking your links every couple of weeks to make sure they're all good. (And update any out-of-date content in your site while you're at it.)