HTML basics

There are really very few tags that you need to be aware of in order to create a successful page. If you are aware of basic html principles then you know tags, and their attributes, must be enclosed in greater than and less than symbols such as < tag attribute=value >. Certain tags also require a closing tag which takes the form </tag>, with whatever the name of the tag, attribute or value is plugged into the corresponding location. All other text in the html file is treated as text that should be printed out onto the page according to the tag which surrounds them. i.e. if you have a bold tag followed by text and a closing bold tag, all the text in between the opening and closing tags for bold will be, you guessed it, bold. So what are the few tags you need to know to get started on your way to html stardom? Well, we'll make life easy for ourselves and create a template file to work from for all our html pages. The text file should look like this: 



<html>

<head>

<title>insert title here</title>

</head>



<body>

this is the text you want  to appear on your page





end of body

</body>

</html>

which results in a page which looks something like this.

There's all sorts of other nonsense that is 'supposed' to go in as well, but it's not necessary for the page to function so i've excluded it. Just don't be surprised if you find more than this when you view the source for a given page, there is, indeed, much more.

The first thing you'll notice when you view the example is that whatever is enclosed inthe title tags becomes the title of of the browser window, which is written in the bar at the top of the window. The next thing you should take note of is that whitespace, such as line returns and extra spaces between words, is completely ignored when the page is viewed in a browser. This means that you can make you html easier to read and edit by adding whitespace between elements, such as one my do when writing code in C or any other language.

The best place to go from here is to just play with the different possibilities. Each tag has a number of possible options for how it will effect the text which it encloses. If you want to know all the possibilities and plan to work with web pages frequently, I would recommend gettting a reference book. If you're more casual about your web presence than some sort of online reference would probably be adequate.

HTML style sheets

The most important change between html 3.0 and html 4.0 was the inclusion of style sheets. Style sheets tend to be slightly confusion so I use a template file to simplify the difficulties of remembering how things go. The template file I use looks like this: 



<html>
<head>
<title>template</title>
<style>
body
	{background: maroon; <!--or background: url(location) repeat;-->
	}
img
	{margin: 30;}
table
	{background:#ff0000;
	}
p
	{text-indent: 8pts;
	text-align: left;
	font: 12pt "Caslon", "serif";
	color: #00a5c6;
	}
h1
	{text-align: center;
	color: #0000ff;
	}
a:link
	{background:yellow; color:green;text_decoration:none;
	}
a:visited
	{background:yellow; color:yellow;text-decoration:none;
	}
a:hover
	{background:red; color:white;text-decoration:none;
	}
a:active
	{background:white;color:black;text-decoration:none;
	}
</style>
</head>
<body>
<basefont size=10>

<table width=100% border=0 cellpadding=0 cellspacing=0>
</table>


</body>
</html>

HTML tips

tables and why they're not hard to do

coming soon

What's this dhtml thing anyway?

DHTML seems to be the name for pages which use the attributes of html 4.0 and javascript. When used in conjunction the creative possiblilities of this combination are quite large. HTML 4.0 provides the simplified formatting options and javascript provides the means of extending these options to include a more interactive web page which engages the user. On a normal web page, or static html page, little of the content is able to change in response to user actions. HTML provides only the layout tools to display the page to the viewer. The most dynamic thing a static page has to offer is what colors the links change to when they are visited or clicked upon. This does not allow for much creative flexibility, nor does it create an interactive link between the web page and the user. Whereas with javascript, the page can be as interactive as the creator desires.

How does this work? Javascript is a scripting language, a programming language that doesn't need to be compiled. Which means that its functionality is limited only by the talent of the programmer and the limits of the medium. A skilled programmer can do quite impressive things with Javascript such as: create a scrolling banner on the web page or in the title or information bars of the window, or create a brief animation for visitors to view when the page loads.
MORE TO COME...