[Home] [HTML 4 Manual] [CSS] [E-mail Me!]

The No Bollocks HTML 4 Manual


HTML is the easiest 'programming language' you'll ever see. It's about 100 times easier than learning BASIC (and that's easy!). So if you can't take it in, your brain isn't big enough to cope with more than playing a good computer game. Nuff said, let's get on with learning the code.

Open up Notepad and type this in (or cut and paste it) :

  <html>
<head>
<title>This Is The Title Of This Page</title>
</head>
  <body>
<p>Go to the 'View' Menu and select the 'Source' option.</p>
</body>
</html>

See what this looks like (I)

In Notepad, select the 'File' menu - 'Save As...' option, and save this file as 'something.html'. Double-click the saved 'something.html' file and this web page will be displayed in your default browser.

So What Does All The Code In The Last Example Mean ?

<html>...</html>

Just tells your browser that it's reading an HTML document.

<head>...</head>

This section contains information about the page. It must contain the <title>...</title> element.

Only Allowed To Contain The Following Elements :

<title>...</title>

You must include this in the <head>...</head> section. It is best to keep your title to about 40 characters so that the entire title is displayed on the browser titlebar and the pull-down menu on your back button. The title will also appear in some search engine listings so make sure it's short and descriptive.

<body>...</body>

This section contains all the text and graphics you see on the web page.

<p>...</p>

This marks the start (<p>) and end (</p>) of a paragraph.

Now That I Know About Displaying Text - How Can I Make It Look Better ?

<b>...</b>

This marks the start (<b>) and end (</b>) of bold text.

<i>...</i>

This marks the start (<i>) and end (</i>) of italic text.

See an example of the <p>, <b> and <i> elements (I)

Ok, So Now I Know How To Make Text Bold And Italic - What About Headlines ?

<h1>...</h1> To <h6>...</h6>

These mark the start (<hn>) and end (</hn>) of a heading.

<h1> is used for the main heading (the largest font size). <h2> is then used for the first sub-heading, and <h3> for a sub-heading to the <h2> sub-heading. All the way down to <h6> (the smallest font size).

Note : It is bad practise to choose a heading because of its font size. When you've learnt about Cascading Style Sheets (I) you'll discover how to change the appearance of each <hn> element.

See an example of headers (I)

Oh, And By The Way ...

<br>

If you want to force the start of a new line, but don't want to leave a blank line between the last line and the next line (like <p> does) then use the <br> (break) element.

Without It, The Web Wouldn't Exist!

<a>...</a>

The <a>...</a> element (Anchor) is without a doubt, the most important element in HTML. Without it, you couldn't create links to other pages on the Internet or to e-mail addresses!

  <a href="http://www.mycompany.com/sales/index.html">Sales</a>

There's A Lot Of Useless HTML In HTML

If you have some passing knowledge of HTML, you may have a fit at my blatant disregard for a large portion of it. But I can't help being a realist. If your learning HTML for the first time with the help of this manual, you do not need to concern yourself with the link below.

Click here to find out why there are many HTML elements you'll never need (I)

Well that's 14 elements down, 63 to go! More to come in a few hours!


[Alt]+'h' = Go Home!   |   [Alt]+'e' = E-mail Me!

Please Note : This manual is still under development. It is being updated regularly.