Home » HTML » HTML Tutorial

HTML Tutorial for beginners - Become a Master

HTML is a markup language that creates the structure of webpages. All websites present on the Internet use HTML for their basic structure setup. We talk with browser through HTML. We give instructions to the browser in the form of HTML Code. Browser parse that HTML code and give us output in the form of a webpage.There are at least 1.2 billion websites online today, and all of them websites use HTML.

If you are interested in developing websites, then, gaining an in-depth knowledge of HTML is the first step. We have created this Completely Free HTML Tutorial Course with simple examples for every topic. So, take this Complete HTML Tutorial for beginners, and start climbing the ladder of a beautiful Web Designing journey.

In our previous article we gave a brief introduction to What is HTML?. We also talked about some prerequisites and popular HTML Editors. We suggest you to first read that article and then continue futher.

Useful Reads: Full Stack Development – Steps to Become a Full Stack Developer.

HTML Full Form - Each Term Explained

HTML full form is Hyper Text Markup Language. Now, What is a markup language?, What is Hypertext? Let's explain each term:

  • Hypertext: Hypertext means, text with a link embedded in it. If you click on that link, it will open a new webpage. Apart from text, hypertext may contain HTML tables, HTML lists, HTML forms, HTML images, etc.
  • Markup language: Markup language uses tags to define elements within a document. It contains familiar words that are human-readable like forms, tables, links, titles, etc. Every tag in a markup language has a special meaning of its own and performs a particular operation.

Short HTML History :

Let's quickly see the historical facts about HTML-

  • Sir Tim Berners-Lee developed HTML in late 1989, and he is considered as the Father of HTML.
  • In 1996, the World Wide Web Consortium (W3C) became the authority to maintain the HTML specifications.
  • HTML became an international standard (ISO) in 2000.

Features of HTML

There are various features of HTML, but in this HTML tutorial, we will discuss the most important ones.

  • HTML describes the structure of a webpage.
  • Human-readable HTML tags represent elements in a webpage. Hence, they are easy to remember.
  • HTML is universally supported by all browsers. It is a standard markup language for website development.
  • HTML 5 can give support in enhancing the experience in gaming arena.
  • It is easy to learn and implement. You can quickly learn HTML programming in a few days and create your first web page.
  • It is platform independent, i.e., it works on all the operating systems.

Advantages of Learning HTML

Originally, HTML was developed to define the structure of webpages. It had some basic tags just for structural changes like HTML heading tag, HTML paragraph tag, HTML list tag. However, continuous research and advancement in technology helped HTML progress over the years. Let us see some Advantages of HTML :

  • It has tags that optimize the website for search engine and boost performance. These tags are <meta> tags, <heading> tags, <title> tag, etc.
  • It is the base of designing and developing web pages. Once you understand HTML's basics, other related technologies like Javascript, CSS, etc become easier to understand.

Your first HTML Example with Explanation

Take a glimpse of a simple HTML example. This is your first example with very basic HTML tags. Try to understand how to use these HTML tags. Below the example, we have explained each tag and its use. Let's see the first HTML example :


<!DOCTYPE html>
<html lang="en">
<HTML>
<head>
<title> Page Title </title>
</head>
<body>
<h1> This is a Heading </h1>
<p> This is a Paragraph </p>
</body>
</html>

Output

Page Title

This is a Heading

This is a Paragraph


Explanation of HTML tags used in the Example

  • <!DOCTYPE>- The doctype declaration indicates the document type and version of HTML used on the webpage. Each HTML version has a different doctype declaration. HTML5 Doctype is used in this example.
  • <html>- The HTML tag is the root tag that describes the whole webpage. It is a paired tag, i.e., it has a closing tag also, </html>. Everything will be written inside these tags.
  • <head>- Head tag contains information about the document like its title, author information, description of the webpage, and so on. It has different tags to perform these functions. It is also a paired tag.
  • <title>- Title tag is used inside <head>, and it specifies the title of the document.
  • <body>- The body tag contains all the information which will be displayed on the webpage. If you want anything to be displayed on the webpage, you have to write it within these tags.
  • <h1>- Heading tag is used to define headings. <h1> is the largest heading, followed by <h2>, <h3>, to <h6>.

You can try our online HTML editor and can make changes accordingly.


Microsoft Word as HTML Editor?

Can you use word processors like MS Word for HTML editing? The answer is yes you can but you shouldn't. You can write your HTML code on any application that give you facility to write, but you should only use dedicated HTML editors or Notepad.

MS Word is not appropriate for coding because it won't be able to format code like a dedicated HTML Editor. Formatting of code, like indentation, color scheme, etc. is very important, it results in less errors and the code looks appealing to the eyes. MS Word is not able to understand the HTML code and it will show error for everything you code.

So, don't even think of using MS Word as a code editor. Use Notepad, Brackets, Sublime, VSCode, etc. for website development and designing.


HTML Versions Timeline

HTML has evolved continuously with time. Each new version of HTML was better than the previous one with enhanced features. The current HTML version is HTML5, equipped with various advanced tags. Lets have a look at the timeline of HTML Version's evolution:

HTML Versions Year
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML 5 2014

Frequently Asked Questions

Do all website use HTML?

Yes, all the websites present on the internet use HTML for their structure. Even different CMS, like wordpress, magento, etc, where coding knowledge is not necessary, also use HTML to create websites.


Is there any alternative for HTML?

No, there is no alternative to HTML. It is a standard for creating webpages on the internet. HTML creates a base of the website. This base is then modified by using CSS, JavaScript, JQuery, Bootstrap, etc to beautify the website and to make it dynamic.


HTML is a programming language or not?

No, HTML is not a programming language. A programming language use logic to produce a result, it use conditional statements, variables, functions, etc. Whereas HTML stands for HyperText Markup Language, i.e.,it is a markup language, which uses Tags to mark and define elements.


Is HTML hard to understand?

HTML is an easy language to learn. Anyone with some technical or non-technical background can opt to learn HTML. Being a markup language, it is easy to understand as it uses human-readable standard words for tags.


What are tags in HTML?

An HTML tag is a keyword surrounded by the sign '<>'. All these tags has a special meaning to web browser. Each tag's work is predefined and the content we write or insert between these tags will be displayed on the web page as per the definition of that tag. For example: <p>This is a paragraph</P>, this line will display a paragraph because the content we write between <p> tags get displayed as a paragraph in the browser.


What is the meaning of Markup Language?

A Markup language uses tags that can be predefined (in HTML), or user-defined (in XML). Any markup language is very easy to learn as it uses human-readable tags that are easy to remember.


What is the full form of HTML?

HTML's Full Form is HyperText Markup Language.


What is Hypertext in HTML?

A HyperText is a text that contain a link to some other text or webpage. Hypertext document is a the one the contain Hyperlinks. HyperText is also sometimes used to define tables, images, etc with integrated Hyperlinks.


In this HTML tutorial we have learned basics of HTML, and in the next HTML tutorial we will learn about HTML tags and their use. Click on Next.