HTML, an acronym for Hyper Text Markup Language, is a main markup language for creating websites. It consists of series of codes which are used to structure texts, images, and other content to be displayed in a browser.
HTML was first developed by British physicist Tim Berners-Lee in 1990. Since then, there have been many versions of HTML.
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. Attributes provide additional information about an HTML element.
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 come in pairs, like <p> </p> tags. The first tag in a pair is 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.
This is a paragraph between opening <p> and closing </p> tags.
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.
(Learn more about types of <!DOCTYPE> declaration).
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.
<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>
To start writing HTML code for your website you will need an editor. Let’s speak about HTML editors in our next chapter.