Building a web site: Part 1
Now that you’ve created your first web page and have some of the basics down, we can move onto building a web site.
Introduction: What is a website?
A website is just a bunch of web pages connected together through something called links. In HTML there is a special tag called (you guessed it!) the ‘link’ tag, and it looks like this in its most basic form:
And here is an example of the link tag with a destination filled in:
<a href=" http://www.killersites.com ">Go to killersites.com</a>
It’s safe to say that we have all used links when surfing the web. Whenever you click on a link that takes you to another page, you are using a link tag. The link tag is the most important tag in HTML; it makes the Internet interconnected!
In the above example, we see that the link tag points to the web site www.killersites.com and the text that is displayed on the web page is: ‘Go to killersites.com’. So if you wanted to create a link that took someone to www.yahoo.com, for example, you would replace the www.killersites.com with www.yahoo.com, Yahoo’s address.
Like all other tags, link tags have an opening tag (<a href=” http://www.killersites.com “>) and a closing tag (</a>). Links tags are a little more complex than the other tags we have seen so far, but I think that you can handle it!
Some of you may have noticed that there is some text in the link tag that comes before the web site address; the text I am talking about is this:
This text tells the browser that the link is pointing to a web page. Sometimes links can point to other things besides web pages; things like movies, PDF files, and so on.
Absolute vs. Relative URL
To link pages in your web site from one page to the next you have a choice of using one of two types of addresses: absolute addresses (complete) and relative addresses (partial).
Before I go on, URL is a nerd’s way of saying ‘address’.
An absolute URL is the complete address of a page that can be found from any other location on the Internet. So let’s say you have a page called contact.html on the root of your web site who’s domain name is www.myStore.com . In this case, the absolute URL of the contact.html page would be:
Ok, now I know I lost a few people because I used a word that I did not explain: ‘root’.
When geeks talk about the root of a web site, they are taking about the base of the web site, the starting level.
The files (pages, images, etc.) that make up your web site are organized in folders just like any other files that you store on your home computer. Your host will give you a space/directory on their server for you to place all your website’s files.
This space/folder assigned to you will be the ‘root’ of your web site. This means that as far as the Internet is concerned, anything (html files, images, other folders, etc.) in this folder is directly accessible by your domain name plus the name of the item. Huh! Even I’m a little confused! Perhaps a little example will explain this better:
Let’s say that on the root level of your website, you had these HTML files:
index.html and contact.html
And in a folder called ‘products’, you placed whole bunch of other pages with one called ‘bookcases.html’. You decided to put all your ‘product’ HTML pages into a ‘products’ folder to keep the web site more organized – a smart thing to do!