HTML - Basic Tags
WHAT IS AN HTML DOCUMENT?
HTML (HyperText Markup Language) Documents are plain-text files that can be created using any text editor such as Notepad on a Windows machine or SimpleText on a Mac, or a full HTML editor.

As well as the text that you want to go on the page there are markup tags which determine how the text will look on the web page.

Hint: In order to make sure that all broswers can read your web page, it is a good idea to type all your tags in lowercase.

It is also a good idea to look at other people's HTML coding to see how things work. For example Right click your mouse on this page and select View Source. This will open a text editor window in which you will be able to read the source code which produced this page. There will be code in there which we haven't met yet, but you will see many of the tags mentioned below.

When you have finished looking at the coding, close the text editor window by clicking on the "X" at the top of the window and you will come back to this page.

Every HTML document will contain certain essential standard HTML tags. See below.

Notice that each of these tags has a beginning tag and an end tag.

REQUIRED ELEMENTS
HTML <html></html>
This tag tells your browser that the file contains HTML-coded information.

HEAD <head></head>
The head tag identifies the first part of your HTML-coded document that contains the title. The title is shown as part of your broswer's window.

TITLE <title></title>
The title tag contains your doucment title and identifies its content in a global context. The title is generally displayed in the title bar at the top of the browser window. The title is also what is displayed on someone's hotlist, or bookmark list, so choose something descriptive, unique and quite short. A title is also used to identify your page for search engines.

BODY <body></body>
The second (and the largest) part of your HTML document is the body, which contains the content of your document. There are dozens of different tags that can be used within the body of the document, but we will deal with only the most simple here.

Back to the Top

BODY ATTRIBUTES
<body bgcolor="?">
Sets the background colour - you can use a name or a hex (#) value. There are a number of colours. (Note: American spelling in the tag: color)
white, black, silver, gray, red, green, lime, navy, blue, purple, fuchsia, olive, yellow, teal, aqua, maroon. For a set of hex colours, try this link hex colors The colour of the background of these pages is #FFFFCC.

<body text="?">
This allows you to set the text colour using either the name or hex value of the colour. The text colour on these pages is #000064.

<body link="?">
You can set the colour of the link using either the name or hex value of the colour.

<body vlink="?">
You can set the colour of the visited link using either the name or hex value of the colour.

Back to the Top

TEXT TAGS
<h1></h1> - creates the largest headline

<h6></h6> - creates the smallest headline

<b></b> - makes text bold

<i></i> - makes text italic

<font size="?"> - sets the font size from 1 to 7

<font color="?"> - sets font colour, using name or hex value of colour

Back to the Top

FORMATTING
<p></p> - makes a new paragraph

<p align="?"> - aligns a paragraph to the left, right or center

<br> - inserts a line break

<blockquote> </blockquote> - indents text from both sides

<ol></ol> - creates a numbered list

<li></li> - insert round each item in list, it adds a number

<ul></ul> - creates a bulleted list

<li></li> - if used with a bulleted list will add the bullet to each item

<div align="?"></div> - is used to format large blocks of HTML.

Back to the Top

LINKS
<a href="URL"></a> - creates a hyperlink

The power of web pages lies in the ability to create hyperlinks between pages anywhere on the Internet. These can be links between pages of your own website as at the top of these pages, or between sites.

Links are created by using the <a></a> tags with the href code.

1