Lesson 2 - Basic HTML

BASIC HTML

    You could use Microsoft's FrontPage or Macromedia's DreamWeaver, but these softwares are mainly for experts. As for beginners, I think Notepad is more than enough. To begin with, open a Notepad document.

    Tags are important in your document, <html> is a tag signifying that this document is a HTML document. Remember! For every tags that you use, there must be a closing tag, in this example the closing tag for <html> is </html>.

    Every document has it's head and body, for your HTML document it is defined as <head> and <body>. <head> usually contains your homepage <title> and also CSS (Cascading Style Sheets) <style> together with <meta> tags, which defines how a search engine like Yahoo! searches for your homepage. As for <body>, it is where most of the work will be done in. You can define your homepage background color and text color within the <body> </body> tags.

    Here's an example of how your HTML document will look like :

<html>
<head>
<title>
My First Homepage!! </title>
</head>
<body bgcolor="
black" text="white">
Insert your homepage contents here.
</body>
</html>

    The above few lines are important as they will be used over and over again in each and every HTML document. Both the "black" and "white" can be replaced with hexadecimals. For instance, #000000 stands for black colour and #FFFFFF for white. The first 2 numbers stands for RED and the next 2 for GREEN and the last 2 for BLUE. The numbers range from 0 to 9 and from A to F. So red colour can be written as #FF0000, #00FF00 for green and #0000FF for blue.

    The <body> could be expanded to define colours for links and visited links.

<body bgcolor="black" text="white" link="red vlink="blue">

    This means that for every link on your homepage, it will be shown in red colour after clicking the link, it will turn blue. To learn more about links, please proceed to Lesson 4. If you like a certain image/graphic with the file name "bg.gif" to be use as your homepage's background just insert the line below. Remember! File names are case-sensitive, "Bg.gif" and "bg.gif" are two different files. So be careful when typing file names.

<body background="bg.gif" text="white" link="red vlink="blue">

    Within the <head> tags, you can insert the following lines. These lines are to allow the search engines to determine the contents of your homepage without accessing your homepage. It doesn't have to be inserted in every document, only the first page (index) of your homepage will do.

<head>
<meta name="Keywords" content="
Insert keywords regarding your homepage.">
<meta name="Description" content="
Insert a brief description of your homepage.">
<meta name="Author" content="
Insert your name here.">
</head>

    Remember to save your HTML document as "index.html". For Notepad users, you will have to select 'Save as - All Files' and type index.html as the file name. It's advisable that you open a new folder and save it in that particular folder together with any background image that you're going to use.

    Click here to get to Lesson 3 : Basic Text Editing.


This Page Is Published And Maintained By Wong Kuan Yew
Copyright © 2000 Wong Kuan Yew. All Rights Reserved.
Last Updated: