Rather than trying to be witty, which I am not, I will cut right to the chase… the Basic layout of an HTML page. This should generally exist in all HTML Layouts you create from the simplest to the most complex.
{code type=HTML}<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<HTML>
<HEAD>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<TITLE>Page Title</TITLE>
</HEAD>
<BODY>
Your page content here.
</BODY>
</HTML>{/code}
That is all it takes to display a plain page that says “Your page content here.”
Now I will break this code down and explain what each section is for.
The DOCTYPE
{code type=HTML}<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>{/code}
The DOCTYPE tells the user’s web browser what standards set you will be using in your web page.
This basically tells the web browser that the page is HTML 4.01 in English, and might not conform to strict HTML Standards. For an HTML Beginner, this is probably the easiest DOCTYPE to use, as it allows you to mix in some older tags. This will also make it possible to do some minor hacks and tweaks for older web browsers.
The HEAD
{code type=HTML}<HEAD>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<TITLE>Page Title</TITLE>
</HEAD>{/code}
The HEAD section is used for things you need to include in your page that do not necessarily need to display in the body of the page. This might include JavaScripts, Style definitions, Meta tags, and more.
In our HEAD above, you will see a META Tag, and a Title. The Particular META Tag used defines the website’s Content Type and Character Set. For the most part, this should usually be exactly what I have above. Once in awhile you will need to change the charset= part to another character set to display text in a language other than English, or produced by certain applications.
* A quirk with how some web browsers interpret HTML means that this tag should be very first thing after the opening <HEAD> tag.
The TITLE Tag is what will display in the Web browser’s title bar when your page is loaded. It is helpful to have something descriptive here, since it is usually what a search engine will display in search results, and users who multi-task will find it easier to navigate back to your page if they do something else.
The BODY
The BODY is probably the most interesting part of the page to your visitors. Where the DOCTYPE and HEAD are hidden, all of the glory goes to the BODY because, face it… Content is King. Here is where you will put your content.
