HTML Introduction
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
A web site will often contain many html files that link to each other. You can edit HTML files with your favourite editor.
Most tags must have two parts, an opening and a closing part. For example, <html> is the opening tag and </html> is the closing tag. Note that the closing tag has the same text as the opening tag, but has an additional forward-slash ( / ) character. I tend to interperet this as the "end" or "close" character.
There are some tags that are an exception to this rule, and where a closing tag is not required. The <img> tag for showing images is one example of this.
Each HTML file must have the essential tags for it to be valid, so that web browsers can understand it and display it correctly.
The rest of the HTML file can contain as little or as many tags as you want to display your content.
<img src="image1.jpg"> or <p align="center"> ... </p>
Attributes are often assigned a value using the equals sign, such as border="0" or width="50%", but there are some that only need to be declared in the tag like this: <hr noshade>.
Most attributes are optional for most tags, and are only used when you want to change something about the default way a tag is displayed by the browser. However, some tags such as the <img> tag has required attributes such as src and alt which are needed in order for the browser to display the web page properly.
<!DOCTYPE html>
<html>
<head>
<title>Here Page Title</title>
</head>
<body>
<h1>Heading Here</h1>
<p>Start Paragraph.</p>
</body>
</html>
Web Browsers
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:
The <!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 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:
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 Files
Every web page is actually a HTML file. Each HTML file is just a plain-text file, but with a .html file extension instead of .txt, and is made up of many HTML tags as well as the content for a web page.A web site will often contain many html files that link to each other. You can edit HTML files with your favourite editor.
HTML Tags
HTML tags are the hidden keywords within a web page that define how the browser must format and display the content.Most tags must have two parts, an opening and a closing part. For example, <html> is the opening tag and </html> is the closing tag. Note that the closing tag has the same text as the opening tag, but has an additional forward-slash ( / ) character. I tend to interperet this as the "end" or "close" character.
There are some tags that are an exception to this rule, and where a closing tag is not required. The <img> tag for showing images is one example of this.
Each HTML file must have the essential tags for it to be valid, so that web browsers can understand it and display it correctly.
The rest of the HTML file can contain as little or as many tags as you want to display your content.
Tag Attributes
Attributes allow you to customise a tag, and are defined within the opening tag, for example:<img src="image1.jpg"> or <p align="center"> ... </p>
Attributes are often assigned a value using the equals sign, such as border="0" or width="50%", but there are some that only need to be declared in the tag like this: <hr noshade>.
Most attributes are optional for most tags, and are only used when you want to change something about the default way a tag is displayed by the browser. However, some tags such as the <img> tag has required attributes such as src and alt which are needed in order for the browser to display the web page properly.
HTML Example
<!DOCTYPE html>
<html>
<head>
<title>Here Page Title</title>
</head>
<body>
<h1>Heading Here</h1>
<p>Start Paragraph.</p>
</body>
</html>
Web Browsers
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:
The <!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 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:
Version
|
Year
|
HTML
|
1991
|
HTML 2.0
|
1995
|
HTML 3.2
|
1997
|
HTML 4.01
|
1999
|
XHTML
|
2000
|
HTML5
|
2014
|