HTML Code Examples Index
1. HTML Page Layout Basics	2. Creating HTML Hyperlinks	3. Creating HTML Tables
4. Font/Text Types & Colors	5. Working With HTML Images	6. Creating HTML Lists
7. Working With Backgrounds	8. Importing JavaScript Files	9. Importing CSS Files

HTML Page Layout Basics

There are 5 things you need to create a correct HTML file, I show you each one of them below with complete details and explanation, make sure you read each one.

Also at the end I give you a sample of a full HTML template using the 5 things I showed you, so don't miss it.

1. Using Your HTML Tags:

For any HTML document to work, you have to start by using the HTML tag below, otherwise the document can NOT be identified as HTML and hence any html code in there will not work or in some browsers produce errors:

	<html> -- This is the starting tag.
    
    Your content goes here!
    
    </html> -- This is the ending tag.

2. HTML Document Type:

Any HTML Document starts with a Document Type Declaration (DTD), you use this right after the starting tag.

We are going to look at the 3 main types you can use:

HTML Strict DTD: Any elements or attributes that have not been deprecated yet are included in this Type. To use this type you can start your HTML with the following line:
```
		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
        					"http://www.w3.org/TR/html4/strict.dtd">
        
```
HTML Transitional DTD: This type includes everything in the Strict version however in addition it also includes deprecated attributes and elements. To use this type you can start your HTML with the following line:
```
		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
             				"http://www.w3.org/TR/html4/loose.dtd"> 
        
```
HTML Frameset DTD: This type includes everything in the Transitional version however in addition it also all frames as well. To use this type you can start your HTML with the following line:
```
		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" 
          					"http://www.w3.org/TR/html4/frameset.dtd">
        
```

So Which One Should You Use?

The most commonly used one is (b) Transitional DTD, so if you are starting a new simple website, use (b) and you will be ok. Otherwise if you need frames then use (c).

I use (b) in programming all of my websites.

3. HTML Title Tags:

Any HTML page has to have a title, it's the title you see at the top of the page and also shows in search engines. To apply a title to your page, you have to use the Title tags as follow:

	<title> -- This is the starting tag.
    
    Your Page Title Goes Here. 
    
    </title> -- This is the ending tag.
    
    -----------------------------For Example:-----------------------------
    
    <title> Contact Us - Create A Website Income </title>

HTML META Tags:

Any text inside META tags will not be shown on the page, in other words they will be hidden but servers and search engines will be able to read them.

You use META tags to better explain what your page is about by providing a description of the page as well as keywords. You have to use META tag within the HEAD tags.

There are 2 types of META tags, you can use both in each HTML page as follows:

Type 1 - You can define a description of your contact page as follows:

	<meta name="description" content="Create a Website Income Contact Us Page" />

Type 2 - You can use this type to add keywords to your page, some search engines will use this when indexing your pages.

	<meta name="keywords" content="Websites, Create a Website, Create Income Online" />

5. HTML BODY Tags:

Body tags is where all the content that you want to show on your page goes.

Your content must be between the BODY open and closing tags, otherwise you will have problems.

You can define your BODY tags as follow:

    <body> -- This is the starting tag

    Your Content Goes Here!
    
    </body> -- This is the ending tag

BELOW IS A COMPLETE HTML TEMPLATE EXAMPLE USING ALL 5 POINTS

    <html>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
               "http://www.w3.org/TR/html4/loose.dtd">
    <head>
    
    <title> Contact Us - Create A Website Income 
    
    <meta name="description" content="Create a Website Income Contact Us Page" />
    
    <meta name="keywords" content="Websites, Create a Website, Create Income Online" />
    
    </head>
    
    <body>
    
    This is my contact page for create a website income.
    
    </body>
    
    </html>

Did You Like This Page? Please Share :D