HTML is the standard markup language for creating Web pages. It stands for Hyper Text Markup Language.
What is HTML?
- HTML stands for Hyper Text Markup Language
- HTML is the standard markup language for creating Web pages
- HTML describes the structure and look n feel of a Web page
- HTML consists of a series of elements to create Web pages
- HTML tell the browser how to display the content and elements of Web pages
- HTML elements label part or pieces of content such as “this is a heading”, “this is a link”, “this is a paragraph”, etc.
A Simple HTML page
Example
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Example Explained
- The
<!DOCTYPE html>declaration defines the type of the document, here it shows that this document is an HTML5 document - The
<html>element is the root element of an HTML page - The
<head>element contains meta information about the HTML page such as Title, Description, etc. - The
<title>element specifies a title for the page (which is shown in the browser’s title bar or in the page’s tab) - The
<body>element defines the document’s body, it contains all the visible contents, such as headings, paragraphs, hyperlinks, images, tables, lists, etc. - The
<h1>element defines a heading, generally indicate the topic of the page. - The
<p>element defines a paragraph
What is an HTML Element?
An HTML element provides a structure to a Web age.
An HTML element is defined by a start tag, some content, and an end tag:
<tagname>Write Something Here…</tagname>
The HTML element is everything from the start tag to the end tag:
<h1>This is My First Heading</h1>
<p>This is My first paragraph.</p>
| Start tag | Element content | End tag |
|---|---|---|
| <h1> | This is My First Heading | </h1> |
| <p> | This is My first paragraph. | </p> |
| <br> | none | none |
Note: Some HTML elements have no content (like the <br> element). HTML elements which have no content are called empty elements. These Empty elements do not have an end tag!
HTML Page Structure
Below is a visualization of an HTML page structure:
<html>
<head>
<title>This is a Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is second paragraph.</p>
</body>
</html>
Note: The content inside the <body> section (the white area above) will be displayed to the user in a browser. The content inside the <title> tag will be shown in the browser’s title bar.
HTML History
Since the early days of the World Wide Web, there have been many versions of HTML:
| Year | Version |
|---|---|
| 1989 | Tim Berners-Lee invented www |
| 1991 | Tim Berners-Lee invented HTML |
| 1993 | Dave Raggett drafted HTML+ |
| 1995 | HTML Working Group defined HTML 2.0 |
| 1997 | W3C Recommendation: HTML 3.2 |
| 1999 | W3C Recommendation: HTML 4.01 |
| 2000 | W3C Recommendation: XHTML 1.0 |
| 2008 | WHATWG HTML5 First Public Draft |
| 2012 | WHATWG HTML5 Living Standard |
| 2014 | W3C Recommendation: HTML5 |
| 2016 | W3C Candidate Recommendation: HTML 5.1 |
| 2017 | W3C Recommendation: HTML5.1 2nd Edition |
| 2017 | W3C Recommendation: HTML5.2 |
This tutorial follows the latest HTML5 standard.