HTML document layout

HTML document layout

HyperText Markup Language (HTML) is based on the SGML (Standard Generalized Markup Language) metalanguage and is the format of the World Wide Web documents. An HTML page is a simple file containing text formatted with HTML tags. A web page can be built from even the most basic text editors, such as Notepad++. There are also HTML editors which display tags, attributes, and their values in different colors to make them easier to read.

HTML extensions

Traditionally, the file is given as .htm or .html extension, but a web page may have other extensions as well, including:

  • .asp for a page generated dynamically by ASP (Active Server Pages).

  • .cgi for a page generated dynamically with CGI (Common Gateway Interface).

  • .php, .php3 or .php4 for a page generated dynamically in PHP.

  • .pl for a page generated dynamically in Perl (Practical Extraction and Report Language).

HTML document layout

  • An HTML document begins with the tag <HTML> and ends with the tag </HTML>.

  • It also contains a header describing the title of the page and a body where the page's content is located.

  • The header is delimited by the tags <HEAD> and </HEAD>.

  • The body is delimited by the tags <BODY> and </BODY>.

Example of a simple document layout:

<HTML>
<HEAD>
<TITLE>Page title</TITLE>
</HEAD>

<BODY>
Page content
</BODY>
<HTML>

Document type declaration

The HTML page should include the document type declaration, which is a reference to the HTML standard being used, in order to specify which coding standard the page employs. The declaration is made by adding the following line:

<bold><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"></bold>
<HTML>
 <HEAD>...</HEAD>
 <BODY>Page content</BODY>
</HTML>

This indicates which DTD (Document Type Definition) is being used. The DTD is a reference to the characteristics of the language being used. The table below summarises the declarations for the main versions of HTML:

  Declaration
HTML 2.0 
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 4.0//EN">
HTML 3.2 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
HTML 4.01
  • Strict: 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
  • Transitional: 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • Frameset: 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
HTML 5 
<!DOCTYPE html>
XHTML 1.0
  • Strict:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • Transitional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd">
  • Frameset:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

HTML editors

Around the same subject