HTML (HyperText Markup Language) is a primary markup language for creating websites. It consists of a series of codes used to structure texts, images, and other content to be displayed in the browser.
HTML Versions
HTML was first developed by British physicist Tim Berners-Lee in 1990. Since that time, there have been many versions of HTML.
| Version | Year |
|---|---|
| HTML | 1991 |
| HTML+ | 1993 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML 1.0 | 2000 |
| HTML5 | 2012 |
| XHTML5 | 2013 |
Basic HTML Concepts
Elements, tags, and attributes are basic concepts in HTML.
HTML element is a main structural unit of a web page. HTML tags are used to define HTML elements, and attributes provide additional information about these elements.
HTML Tags
HTML tags are used to structure website content (text, hyperlinks, images, media, etc). Tags are not displayed in the browsers, they only “instruct” browsers how to show the content of the web page.
There are over 100 tags in HTML, and you can find them in our HTML tutorial.
HTML tags are written in angle brackets (e.g <html>).
Most of HTML tags comes in pairs, like <p> </p> tags. The first tag in a pair called the start (opening) tag, and the second tag is the end (closing) tag. The information is written between opening and closing tags.
However, there are unpaired, or empty tags, which only have opening tag. (for ex. <img/>).
Let’s consider an example.
If you need to define a paragraph (which is an element ) you should use <p> tag. The content of the paragraph you should write between opening (<p>) and closing (</p>) tags.
Example
This is a paragraph between opening <p> and closing </p> tags.
HTML Attributes
HTML attributes are added to an HTML element to provide additional information about it. For example, if you define an image with <img/> tag, you can use src, height, width attributes to provide information about its source, height, width correspondingly.
Structure of an HTML Document
The <!DOCTYPE html> declaration specifies the HTML version used in the document. Every HTML document should start with this declaration so that the browsers can render the page compliant with HTML standards.
There exist several types of <!DOCTYPE> defined for each HTML version.
All the content on the webpage is written between <html> </html> tags. The <html> element is used to give information to the browsers that it is an HTML document.
The <head> element contains metadata (data about the HTML document), character set, document title, styles, etc. This data is not shown to viewers.
The <title> displays the title of the website in the browser tab when the page is loaded. The title is written between <title> </title> tags.
The <body> element contains the content of the webpage (text, images, videos, etc). The content is written between <body> </body>.
Heading elements contain different types of headings. There are six heading levels - <h1>-<h6>, where <h1> is the most important and <h6> least important tags.
The <p> element contains paragraphs of the text. The content is written between <p> and </p> tags.
Example
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Title of the document</title>
</head>
<body>
<h1>The most important heading.</h1>
<p> The first paragraph.</p>
<h2> Subheading</h2>
</body>
</html>Result
To start writing HTML code for your website you will need an editor. Let’s speak about HTML editors in our next chapter.