What is HTML? What are HTML Tags? What is the purpose of Web Browser? HTML Page Structure and Declaration with examples.
What is HTML?
HTML is a markup language for describing web documents (web pages).- HTML stands for Hyper Text Markup Language
- A markup language is a set of markup tags
- HTML documents are described by HTML tags
- Each HTML tag describes different document content
HTML Example:
<!DOCTYPE html>Example Explained:
<html>
<head>
<title>Youth Voice HTML Example</title>
</head>
<body>
<h1>Learning HTML</h1>
<p>First Example</p>
</body>
</html>
- The DOCTYPE declaration defines the document type to be HTML
- The text between <html> and </html> describes an HTML document
- The text between <head> and </head> provides information about the document
- The text between <title> and </title> provides a title for the document
- The text between <body> and </body> describes the visible page content
- The text between <h1> and </h1> describes a heading
- The text between <p> and </p> describes a paragraph
What are HTML Tags?
HTML tags are keywords (tag names) surrounded by angle brackets:<tagname>content</tagname>
- HTML tags normally come in pairs like <p> and </p>
- The first tag in a pair is the start tag or opening tag, the second tag is the end tag or closing tag
- The end tag is written like the start tag, but with a slash before the tag name
What is the purpose of Web Browser?
The purpose of a web browser (Chrome, IE, Firefox, Safari) is to read HTML documents and display them. The browser does not display the HTML tags, but uses them to determine how to display the document:
HTML Page Structure
Below is a visualization of an HTML page structure:
<html>
<head>
<title>Page title</title>
</head>
<body>
</html>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>Note: Only the <body> area (the yellow area) is displayed by the browser.
What is the use of <!DOCTYPE> Declaration?
The <!DOCTYPE> declaration helps the browser to display a web page correctly. There are different document types on the web. To display a document correctly, the browser must know both type and version. The doctype declaration is not case sensitive. All cases are acceptable:<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>
Common <!DOCTYPE> Declarations:
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
HTML Versions:
Since the early days of the web, there have been many versions of HTML and there will be many more versions in the future for sure:| Version | Year |
|---|---|
| HTML | 1991 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML | 2000 |
| HTML5 | 2014 |
Note: All Youth Voice tutorials and examples use HTML5.
Click here to read next chapter "Simple HTML Editors"
