Creating a Basic HTML Document

This is a small tutorial which will take you through creating your first HTML document. Nothing complicated is included, this is just so you will understand what HTML is. If you already have created a simple html document of your own, you may skip this section.

Let's begin with the simplest HTML document possible:

<HTML> <HEAD> <TITLE> Your Title Here </TITLE> </HEAD> <BODY> </BODY> </HTML>
An HTML document needs a <HTML> tag (and a closing one at the end, </HTML> ), so the browser knows this is an HTML document. It also most contain a HEAD section with a TITLE, and also a BODY section (this contains the actual contents of the document).

The title of the document will be displayed by the browser at the top of it's screen (in the title bar with close and resize buttons, etc). The title is specified with the <TITLE> tag in the HEAD section.

The head section may also contain things like <META> tags and javascript functions. Don't worry if you don't know what that is right now.

Now let's look at the BODY section. Here's the content of your document (everything before the <BODY> tag is just information for the web browser or server software). Information you want to be visible to the user should be written between the <BODY> opening tag and the </BODY> closing tag.

Well, now your first HTML document is finished, but why stop when the fun is just beginning. Let's add some content.

Maybe you want a heading on top of your page saying 'Welcome', for example. This is done with the <H1> tag. Write your title between the opening tag (<H1>) and the closing tag (</H1>). Now you will have a big heading on your page.

<H1>Welcome to My Homepage</H1>

This will display a heading saying 'Welcome to My Homepage' with large characters. Yes, you may change the size of the heading. Just change the number in the tag (both opening and closing tag). H1 is the largest size heading, H6 is very small.

Alright, let's add some text under your title. A paragraph with some information about you, for example. The first thing you need to do is to create a paragraph. This is done with the <P> tag. Insert a <P> on the line below your heading. Now enter the text (after the <P> tag) and put a </P> closing tag at the end of the paragraph.

(Note: You don't need to create a paragraph to display text, but if you do, it may be easier to control the text alignment if you want to do that later.)

Now let's add a line at the end of your document. Simply insert an <HR> tag below your paragraph. This tag is an example of tags that do not require a closing tag.

Let's have a look at our HTML document, it may look something like this:

<HTML> <HEAD> <TITLE> My Homepage </TITLE> </HEAD> <BODY> <H1>Welcome to My Homepage</H1> <P>Hello, my name is Elvis and I've just started to learn HTML.</P> <HR> </BODY> </HTML>
I've inserted an empty line between the tags so the code should be easier to read but it does not affect the output.

Sometimes it may be a good idea to add some comments in the HTML code. A comment, which will be ignored by the browser, look like this:



Hopefully you are a little bit more familiar with HTML now after this little tutorial.

Creating a Basic HTML Document

Last updated 970617