HTML Syntax, Part Three
Now, we're going to get really technical. Be forewarned! And don't think you need to memorize any of this right now. We WILL be going over it again later. Hopefully, at a point where you can relate it better to your code.
Someday soon you'll want to point your webpage to an image or insert a link to another webpage. To do this you'll use URLs. So, we're going to take a brief look at what a URL is. A Uniform Resource Locator (or URL) is just a fancy way of saying a web address. It contains all the information your computer needs in order to track down any file (webpages, images, etc.) stored on the internet. It includes the protocol used, the server name, directories and subdirectories, and filename. A complete URL will look something like this:
The first part of this URL (http:// — HyperText Transfer Protocol) is called the scheme. The second part (www.ancientworlds.net) is the "name" of the server where the files are located. The rest of the address (aw/City/286736) gives the full path to the location of the file. This means on the ancientworlds server there is a directory called "aw" and below that a subdirectory called "City" and below that 286736 (which is The Orient).
Sometimes the address will end with the name of an html file. Like "mypage.htm". If there is no .htm file included (as in the example above), the server is programmed to look for a "default" page. The name of the default page varies, depending on the server's programming. Generally, it's index.html or default.html. HTML pages can end with either .htm or .html.
URLs can be either or . Absolute URLS are used when you need to include the FULL address, including the scheme. This is necessary when the file or link you're referencing resides on a different webserver than the one the your webpage resides on. (For example, if you want to put a link to a cool article about Egyptian History that you found on Tour Egypt's website into a post you're making here.) You can, if you wish, make all your URLs absolute.
Relative URLs can only be used when the file or link you're referencing is located on the same webserver as your page.
To get a better feel for this and see it in action, go to your homepage and look at the source code. (This can be done in MSIE and Opera by selecting View > Source; in Netscape and Firefox by selecting View > Page Source.) About 15 lines down you'll see a line of Javascript code that reads:
As you can see, there is a reference to a webpage that begins with http:// — this is the code that calls the comm panel. The comm panel resides on a different server than the rest of the site, so the code has to use an absolute URL, because that's the only way your browser can know where on the web to look for the comm panel. If the http://38.144.92.98 was missing, the computer would search the http://www.ancientworlds.net server. Since the file isn't on that server, your browser would report that the page could not be displayed. In other words, this link wouldn't work.
Now look down three or four lines and you'll see:
Here, a jpg file is being referenced (immediately after the src= attribute) ... but this one begins /aworlds_media and doesn't include the scheme or the name of the www.ancientworlds.net server. The reason this code works is because the /aworld_media directory falls under the www.ancientworlds.net web directory
on the same server. When the scheme and server address are missing, the computer automatically assumes the file you're looking for is in a subdirectory of the directory in which your webpage is located
on the current server. This link could have been written using the full URL (see below) and it would still work. It just isn't necessary.
This may seem confusing at first, but eventually it'll make sense. In the meantime, if in doubt, use the full URL and you can't go wrong.
Other commonly used schemes are https:// (HyperText Transfer Protocol Secure), which is used for secure web pages, like the checkout pages at Amazon; ftp:// (File Transfer Protocol), which is used for downloading files from the internet; news: for referencing newsgroups. (Notice there are no forward slashes), file:/// for accessing files on your hard drive (note the additional forward slash), and mailto: which you can use to create "Email me" links.
The main reason I point these out is to emphasize that you must use the correct URL when inserting links into your webpages. Using ftp://www.ancientworlds.net won't bring up Ancientworlds. We'll discuss how to include links and images in a later lesson. Don't worry about memorizing these schemes; you'll rarely use any of them other than http:// and mailto: — but someday, the knowledge may come in handy. At least now you know they exist.