Home > Articles > Web Development > HTML/CSS

  • Print
  • + Share This
This chapter is from the book

Addressing Web Pages

The simplest way to organize Web pages for an individual Web site is to place them all in the same folder together. When files are stored together like this, you can link to them by simply providing the name of the file in the href attribute of the <a> tag. If you have many pages, you may want to put them in more than one folder for better organization. In that case, you still shouldn't use the full Internet address to link between them. You can use relative addresses, which include only enough information to find one page from another.

A relative address describes the path from one Web page to another, instead of a full (or absolute) Internet address.

For instance, suppose you are creating a page named zoo.htm in a directory folder named webpages on your hard drive. You want to include a link to a page named african.htm, which is in a subfolder named elephants within webpages. The link would look like the following:

<a href="elephants/african.htm">learn about african elephants.</a>


The / forward slash is always used to separate directory folders in HTML. Don't use the \ backslash normally used in Windows and DOS! I apologize if the reference to DOS was shocking, but believe it or not there are still a few remnants of it in the Windows operating system, such as backslashes.

The african.htm page might contain a link back to the main zoo.htm page:

<a href="../zoo.htm">return to the zoo.</a>

The double dot (..) is a special code that indicates the folder containing the current folder—in other words, the parent folder. (The .. means the same thing in Windows, Macintosh, and UNIX.) In truth, specifying a filename by itself is also a form of relative addressing because you're saying that the file resides in the current folder.

If you use relative addressing consistently throughout your Web pages, you can move the pages to another folder, disk drive, or Web server without changing the links. Or using the example, everything will work as long as you always put african.htm inside a subfolder named elephants.


The general rule surrounding relative addressing (cow.html) versus absolute addressing (http://www.accsyst.com/cow.html) is that you should use relative addressing when linking to files that are stored together, such as files that are all part of the same Web site. Absolute addressing should be used when you're linking to files somewhere else—another computer, another disk drive, or more commonly, another Web site on the Internet.

Relative addresses can span quite complex directory structures if necessary; Hour 21, "Organizing and Managing a Web Site," offers more detailed advice for organizing and linking among large numbers of Web pages.

To Do

You probably created a page or two of your own while working through Hour 2, "Create a Web Page Right Now." Now is a great time to add a few more pages and link them together:

  • Use a home page as a main entrance and central hub to which all of your other pages are connected. If you created a page about yourself or your business in Hour 2, use that as your home page. You also might like to make a new page now for this purpose.

  • On the home page, put a list of <a href> links to the other HTML files you've created (or plan to create soon). Be sure that the exact spelling of the filename, including any capitalization, is correct in every link.

  • On every other page, include a link at the bottom (or top) leading back to your home page. That makes it simple and easy to navigate around your site.

  • You may also want to include a list of links to sites on the Internet, either on your home page or a separate hotlist page. People often include a list of their friends' personal pages on their own home page. (Businesses, however, should be careful not to lead potential customers away to other sites too quickly—there's no guarantee they'll come back!)


There is one good reason to sometimes use the complete address of your own pages in links. If someone saves one of your pages on his own hard drive, none of the links to your other pages from that page will work unless he downloads all of the pages or you've included full addresses.

A good middle-of-the-road solution to this addressing problem involves including a link with the full address of your main home page at the bottom of every page, and use simple filenames or relative addresses in all the rest of the links.

Remember to only use filenames (or relative addressing) for links between your own pages, but full Internet addresses for links to other sites.

  • + Share This
  • 🔖 Save To Your Account