HTML - Hypertext MarkUp Language - A crash course in the Basics

**Admin Alex** on Sun Apr 26, 2009 7:45 pm

As Head of Web Development on this forum I suppose I should start posting some Tutorials on Web Development.
Heres one on HTML. HTML, short for hypertext markup language, creates the back bone of any web page or website.
In this tutorial I'll teach you how to make a basic HTML document.

HTML documents can be created in anything simple, like the Windows "notepad" which is what I use.

These Tags are for HTML 4.01. Earlier tags such as <applet>, <center> and <font> are now obsolete. (not in use)

IMPORTANT: At the top of every HTML document you must insert this:

Code:
<!DOCTYPE HTML PUBLIC "-W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
In this i'll just show you what some HTML tags there are, a few examples and all the tags needed and descriptions.[/b]

some tags Descriptions
<body> </body> These tags are for putting the web page data in (paragraphs and images) and what the web page look like.

<code> </code> These tags are for if you want to put html code in the web page to be displayed in the text. They go between the <body> </body> tags.

<h1> </h1> These tags are for making the web page heading. They are the largest of all headings. They go In between <body></body> tags at the top.
<h2> </h2> These tags are for defining a size 2 header. They make the sub heading under <h1> headings. They go between the <body> </body tags.
<h3> </h3> These tags are for defining a size 3 header. slightly smaller than size 2, they are good for chapter titles. they go between the <body> tags.
<h4></h4> These tags are for defining size 4 header. they go between <body> </body> tags.
<h5></h5> These tags define size 5 header. They go between <body> </body> tags.
<h6></h6> These tags define size 6 heading.They are slightly largere than normal text. They also go between <body> </body> tags

<head> </head> These tags are where all the page info goes, like the meta info and page title.

<input> These are for web forms to show how you want the input to be. They do not need a </input> tag. they work alone.

<noscript></noscript> they're for if you have put JavaScript in the document and don't want the javascript to work anywhere else.

<p></p> These are to for where you actually putting the page content text. E.G <p>Hello everyone</p>

<script> </script> These are for defining where you want JavaScript to work.

<title></title> These go just under the <head> tag. It shows at the top of the web browser window to tell you what the page is basically about.

These do NOT need a closing tag. They make a break in the text and carry the text on the line below. Inside the <body> tags.

<col> These do not need a closing tag. This tag make the text appear in collums. Inside the ,body> tags.

<form> </form> These show the browser that a web form is about to be used. I'll put an example at the bottem. they go inside <body> tags

<html> </html> These are the most important tags in the html document. they show that this page is made for the web. They go just under the strict dtd at
the bottom of the text document.

<small> </small> these tags make any text inside them small.

<big> </big> They make any text inside them big.

they make the text inside them italic.

<meta> Doesn't need a closing tag. It goes in the head section and gives info about the page.

Probably the longest tags, they make space in the page for a quote.

these tags display emphasis on the text in between them

<strong> </strong> These tags make the text appear strong between them.

Code:
<a href="http://site name.com">these tags make a link to a different site/Page

Example of a web form

Code:
<FORM METHOD=post ACTION="/cgi-
bin/example.cgi">
Enter your Comments:<br>
<TEXTAREA wrap="virtual" name="Comments"
rows=3 cols=20
MAXLENGTH=100><TEXTAREA><BR>
<INPUT type="submit" VALUE="Submit">
<INPUT type="Reset" VALUE="Clear">
</form>This makes a simple post system.
To use it yourself,
Start a new text editor
Put <html> at the top,
then <body> underneath it
then copy and paste the code shown here into it under <body>
put a </body> tag under the code
put a </html> tag under that.
And your done.
Now save it as Form.html

To make a popup come on when you go onto a web page use this code here!

Code:
<!DOCTYPE HTML PUBLIC "-W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Using Popup Welcomes</title>
<meta http-equiv="Content-type"
content="text/html; ch****t=ISO-8859-1">
</head>
<body onload="window.alert('Greetings')"
onunload="window.alert('...Goodbye')">
<h1> Pop appears!</h1>
</body>
</html>Save that Popup.html
I'll add some more Javascript, HTML, CSS stuff that is more advanced for people who want it.

Thanks, Admin Alex

Please tell me if the code doesnt work I'll fix it