The HTML Document Structure
Using the correct HTML document structure when creating a web page is important. If the HTML document structure is incorrect the web page can break or the search engine spider may not be able to read the page.
We'll review each section of the HTML document structure in this article.
Note: The following coding examples are for HTML 4.01. If your web page is coded using XHTML you will have to make the appropriate changes.
Starting with the very first line in your HTML document:
DOCTYPE Declaration
The DOCTYPE declaration is the first part of coding that you should enter in your HTML document. This is required if you wish to validate your document with the W3C's validation service.
Web browsers need to know what version of HTML/XHTML your page is written in to process the code correctly.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
The HTML Tags
All HTML documents contain a <html> and </html> pair of tags. These tags identify the document's contents as HTML to the browser. The <html> tag goes in the line right under your DOCTYPE declaration. </html> is the last line of coding in your document.
Opening html tag:
<html>
The Head Tags - Opening Head Tag
The <head> and </head> tags identify the document's head area. The information between these two tags is not visible on your page.
Opening head tag:
<head>
Character Encoding
The character encoding meta tag tells the browser which character set the web page uses.
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
Title Tag
The title tag creates the page title that is seen in the title bar of the web page.
<title>Title of the document</title>
Meta Tags
The meta tags provide information about your web page.
<meta name="Description" content="Your
description">
<meta name="Keywords" content="first, second, third">
<meta name="Author" content="Author Information">
<meta name="Copyright" content="Copyright Statement">
<meta name="Distribution" content="Global">
<meta name="Expires" content="Tue, 01 Jun 1999 19:58:02
GMT">
<meta name="Robots" content="index,follow">
Link Tag
The link tag is used to link other documents to this one.
This example shows linking to an external stylesheet.
<link rel="stylesheet" type="text/css"
href="styles/stylesht.css">
Script Tag
The script tag defines what type of script the browser is to execute. This tag can also be included in the body of your page.
<script type="text/javascript">
<!--
<!--Your script -->
-->
</script>
Style Tag
The style tag is used to set the style of your document elements. It is better to use an external style sheet using the link tag so if you wish to change something you only have to change it in one spot.
<style type="text/css">
Your style types
</style>
Closing Head Tag
The closing head tag defines the end of the document's head section.
</head>
The Body Tags
The body tags surround the body (contents) of your web page.
<body>
The body of the document
</body>
Closing HTML Tag
The closing HTML tag is the last line in your HTML document. Don't put anything after this tag! Your page will not validate if you do.
</html>
The above descriptions are excerts from the HTML Basics Simplified ebook.
HTML Document Structure Related Articles
- DOCTYPE - DTD - Document Type Declaration The DOCTYPE Declaration (DTD or Document Type Declaration), what it does and why each web page needs it.
- Character Encoding Character encoding tells the browser and validator what set of characters to use when converting the bits to characters.
- Meta Tags What meta tags are and how they are constructed.
- Anatomy of a Web Page Description of the basic structure of a web page and the anatomy of a web page. Here you will learn a web page basic structure.
- Code Validation Code validation is the process of checking that the coding of a web page is in compliance with the standards and recommendations set by the World Wide Web Consortium (W3C) for the web. Code validation helps to produce clean code.
- Lower Case HTML Tags and HTML Tag Attributes When entering your basic HTML tags and HTML tag attributes use lower case in preparation for future web technologies, consistent web page rendering and search engine optimization.
If you found this web page a useful resource for your own website please link as follows:
Correct HTML document structure when creating
a web page is important. If HTML document structure is incorrect web pages
break or search engine spiders may not index page.
URL:
