XHTML Tutorial - Chapter 2: Introduction

HTML can rightly be said to be one of the foundations upon which the entire world wide web is built on, it is one of the major corner stones that is always present in virtually every web site online. Regardless of whether the site was built with extensive amounts of JavaScripting, advanced server side code like PHP or ASP, or with plugin powered features like Flash, HTML, in one form or another, always lays the foundation.



So what is this magic "glue" that makes all the components of a web site stick together then? Well, it is what's become known as a "markup language", used to "mark up" or "structure" the contents of the site. It does so through using something called "tags".

A good way to think of HTML tags is as label stickers. You know how labels work don't you? You stuff a few things in a box and stick a label on it. On the label you write with a marker the contents of the box so you'll always know what's in there without having to open the box.

Well, HTML takes it all one step further. HTML is actually a magic box, that will automatically shape the contents of the box according to what you write on the outside label. If you put a rock inside the box and write on the label, "Apple", then the rock suddenly becomes a tasty apple! Pretty neat huh?



That is actually the main fact you need to know about how HTML works. All you need to learn now is how to actually write these labels, and that is actually not too hard either. All HTML tags start and end with the < and > angle brackets, and most - but not all - are divided up into a "start tag" and an "end tag". The end tag needs to also have a slash (" / ") attached to it.

Let's look at an example. If we wanted to take our lovely rock and make that into an apple, we might use a code snippet looking something like this:

<html>
  <apple> Rock </apple>
</html>

See how the apple tags surround the rock in the middle? Because they're set up like that, they will make apples out of anything inbetween. Had we put a bunch of other random objects inbetween the tags, next to our rock, the apple tags would have made apples out of those too. Tasty, juicy apples.



Notice also that I used the <html> tags around the whole thing. Those are always present at the beginning and end of the document to tell the visitors browser that this is in fact an HTML file. Also note the slash used in both the end tags, </apple> and </html>.

If you fail to provide the end tag to something, then the poor browser won't know when to stop and will proceed to make apples out of every single thing in the rest of the document. And trust me, you don't want that many apples.





< Previous: Preparations

robert@eagleowl.se     +46 (0)26-16 13 61     www.eagleowl.se
©2021 EagleOwl