HTML is a markup language that creates webpage layout. There are at least
1.2 billion websites online today and all are designed by using HTML. Take our HTMl tutorial and get a complete basic guide for beginners.
We have created this HTML Tutorial for beginners with practical examples for every topic. So, go through this complete HTML tutorial 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 with this tutorial.
HTML is called as a markup language that is different from a programming language. Its full form is Hypertext Markup Language. Now, What is a markup language?, What is Hypertext? How is it different from programming language? Let's explain each term and start our HTML tutorial:
In conclusion, HTML is not a programming language. A programming language uses logic to produce a result, it use conditional statements, variables, functions, etc. Whereas HTML is a markup language, that create structures using tags for the data presentation. There is no logic or algorithm involved.
Let's quickly see the historical facts about HTML-
Tim Berners-Leedeveloped HTML in late 1989, and he is considered as the Father of HTML.
Before diving deep into this complete HTML tutorial, it is necessary to get some fundamentals right. As a beginner, you should be aware of features and functionalities of HTML. Only then you will be able to take interest in HTML coding. Let's discuss the most important features of HTML:
structureof a webpage. All the blocks and elements present in a website, exist because of HTML.
Originally, HTML was developed to define the structure of webpages. It had some basic tags just for structural changes like heading tag, paragraph tag, list tag. However, continuous research and advancement in technology helped it develop over the years. Let us see some Advantages of HTML:
This is the first basic example in this HTML tutorial. Even for a beginner it is pretty easy to understand. Have a look at the structure of the HTML code, but don't stress too much about the unfamilar tags. This is your first example with very basic HTML tags:
This is a Paragraph
<!DOCTYPE>- The doctype declaration indicates the document type and version of HTML used on the webpage. Each version has a different doctype declaration. HTML5 Doctype is used in this example.
<html>- It 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
You can try our online HTML editor and can make changes accordingly.
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 gives 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 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 grammatical errors.
So, during the complete HTML tutorial, don't even think of using MS Word as a code editor. Use Notepad, Brackets, Sublime, VSCode, etc. for website development and designing.
HTML has evolved continuously with time. Each new version was better than the previous one with enhanced features. The current version is HTML5, equipped with various advanced tags. Lets have a look at the timeline of HTML Version's evolution:
Yes, all the websites present on the internet use HTML for their layout. Even different CMS, like wordpress, magento, etc, where coding knowledge is not necessary, also use it to design websites.
It is an easy language to learn. Anyone with some technical or non-technical background can opt to learn It. Being a markup language, it is easy to understand as it uses human-readable standard words for tags.
HTML use HTML tags to assign properties to the content. HTML with it's tags play a important role in web development. Learn full HHtml tutorial from the scratch. 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.
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.
HTML Full Form is HyperText Markup Language.
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.
|1||What is HTML||Learn|
|12||HTML Ordered List||Learn|
|13||HTML Unordered List||Learn|
|14||HTML Description List||Learn|
|16||HTML Input Types||Learn|
|17||HTML Form Attributes||Learn|
|19||HTML Marquee Tag||Learn|
|20||HTML Code Tag||Learn|
|22||HTML Button Tag||Learn|
|23||HTML BR Tag||Learn|
|24||HTML HR Tag||Learn|
|25||HTML Bold Tag||Learn|
|28||HTML Article Tag||Learn|
|29||HTML Footer Tag||Learn|
|30||HTML Figure Tag||Learn|
|31||HTML Dialog Tag||Learn|
|33||HTML Meta Tags||Learn|
|36||HTML Progress Tag||Learn|
|38||HTML Video Tag||learn|
|39||HTML Audio Tag||learn|
|40||HTML Youtube Video||Learn|
|41||HTML Datalist Tag||Learn|
|42||HTML keygen Tag||Learn|
|43||HTML output Tag||Learn|
|47||HTML 5 Quiz||Learn|