HTML tutorial creating a document Free Web Design Tutorials
Home   HTML CSS JavaScript PHP MySQL Usability Glossary
HTMLBasicsCreating an HTML DocumentCreating a DocumentHead and Body ElementsFormatting TextCreating ListsEmbedding ImagesURLs ExplainedLinking to DocumentsCreating TablesForms - BasicsInput and TextareaSelect ListsFramesetsThe Frame ElementNested FramesetsTargeting FramesInline Frames

Home > HTML > Creating a Documentprinter version

Creating an HTML Document

Creating an HTML document is straightforward. All that's required is a simple text editor such as Notepad or Wordpad (not Word) that can save a file as simple text (not rich text).

HTML instructions are typed in and the file then saved to the hard drive with a .html or .htm extension (instead of .txt). The file can then be viewed in the browser by going to the File menu, selecting Open, browsing the hard drive to find the file then double clicking it.

HTML Tags

An HTML document consists of the text to be displayed in the browser, interspersed with HTML tags. Tags are instructions to the browser on how to render the document and a tag begins with the less than character < and ends with the greater than character > with the name of the instruction (element) between. Most HTML elements have a start tag and a closing tag with whatever the element is to operate on, written between the tags.

Example: To create bold text the bold element can be used.
"I want <b>this</b> in bold." Will produce "I want this in bold."

Almost all HTML elements have a start and closing tag, with the forward slash at the beginning of the closing tag but there are few exceptions. For example the element to break to new line has no closing tag and is written as <br>.

If the browser encounters a tag it doesn't recognise, for example <nonsense> (there's no such tag), it just ignores it. HTML differs from languages like PHP in that an error will not stop processing (PHP stops when it encounters an error). This is to avoid pages breaking, and even badly written HTML will normally display reasonably well.

Attributes

Attributes extend the capabilities of elements and are placed within the opening tag. For example a heading element such as <h1>My Heading</h1> will align left by default but can be centred with the align attribute. e.g. <h1 align="center">My Heading</h1>. Many tags support multiple attributes that can be used to give fine control of the formatting of a document.

Required Elements

As a minimum an HTML document should contain the following elements.



Document Types

The two most up to date document types are HTML 4.01 and XHTML 1.0 and both of these can be written as transitional or strict. Transitional allows you to use mark-up from earlier versions which would now be considered obsolete (depreciated) if validated as strict.

The difference between HTML and XHTML is that HTML does not conform fully to the syntax of XML whereas XHTML does. XML is more portable than HTML and is extensible therefore XHTML is considered to be extended XML.

HTML or XHTML?

Whether you choose to use HTML or XHTML is up to you since there's not much difference, but XHTML is probably favourite.



Therefore a basic document with required elements should be like one of the ones below.

HTML 4.01 transitional Example
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body>
Some content here
<br>
Some more content here
</body>
</html>


XHTML 1.0 transitional Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
Some content here
<br />
Some more content here
</body>
</html>


Previous - HTML Basics Previous - Basics     Next - Head and Body Elements Next - HTML head and body elements


Privacy | Terms | Contact | Links | Sitemap | RSS Feeds RSS and JavaScript Feeds
©2009 www.webdesignworkmate.co.uk all rights reserved 
Design and Production by smallbizonline website design © 2000-2009
Valid HTML 4.01! Level Double-A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0Valid CSS!
Recommended Reading
html_and_xhtml

html and xhtml complete reference

learning web design beginners guide