Basic Concepts of HTML

Before getting into the details of making HTML documents accessible, an understanding of basic HTML concepts is needed. If you are familiar with the general structure and coding of HTML , you can skip this page and move onto the the first common HTML element to be covered, Making Images Accessible.

Tags, Attributes, and Elements

There are several versions of HTML that have evolved since its inception in 1989; HTML 4.0 is the latest and most prevalent version. HTML code, or mark-up, consists of tags, which are a set of symbols defined in HTML to have special meaning.

Tags start with a less-than sign (<) followed by a keyword, and conclude with a greater-than sign (>). (These signs are known as angle brackets.) For example: <img>, <form>, <table> are all tags and respectively represent images, forms, and tables.

Note: Tags are not case-sensitive, so <img>, <Img>, and <IMG> all have the same meaning.

There are two types of tags:

Start tags always begin the effect, such as <p> for a paragraph and may take certain attributes which affect the tag's behavior.
End tags close the effect and repeat the keyword with a slash in front, such as </p>.

An attribute is a word separated from the keyword by a space which generally requires a value in quotes preceded by an equal sign, such as <table width="90%"> (which calls for a table that is 90 percent of the width of the screen display.)

When many web developers talk about tags, their preferred term is "element". An HTML element defines the structures and behaviors of the different parts of a document. Most elements consist of three parts:

a start tag,
the content,
and an end tag.

For example: <p>This is a paragraph</p> creates a paragraph element.

Empty elements have no content and never have end tags. Some common empty elements are:

<img> (image),
<br> (line-break),
<hr> (horizontal rule).

In this module, you will be taught the proper use of the most common HTML elements along with any necessary accessibility-related attributes of the start tag.

Basic Structure of an HTML Document

Every HTML document consists of four basic structure elements: html, head, title, and body. Each of these is explored in detail below:

Html Element
- Start tag: <html> - First tag in the document which declares you are writing an HTML element.
- End tag: </html> - Last tag in the document.
Head Element
- Start tag: <head> - Second tag, follows the <html> tag, and starts the head section, which describes the document.
- End tag: </head> - Fifth tag, follows the </title> tag and closes the head section.
Title Element
- Start tag: <title> - Third tag, follows the <head> tag, and contains the title you want for the document. This information will be displayed in the title bar at the top of the browser window.
- End tag: </title> - Fourth tag, immediately follows, without any spaces, the title you want for the document and precedes the </head> tag.
Body Element

Start tag: <body> - Sixth tag, follows the </head> tag to denote starting the content of the document.
End tag: </body> - Next to last tag in the document, follows the end of the document content and precedes the </html> tag.

Code sample for basic structure of an HTML document:

<html> <head> <title>Put the title of the document here. Making certain there are no extra spaces between the title itself and the title tags. </title> </head> <body> Put the document content here.
</body> </html>

The next page presents information on the use of images in HTML.

Previous Page
Page 2:
Files You Need

Top of Page arrow up

Page 3

Page 4:
Images