The basic structure of HTML comprises of four important html elements. They are:
- <html>…</html>
- <head>…</head>
- <title>…</title>
- <body>…</body>
All the web pages created in HTML will definitely contain these 4 elements. So these are called Document tags.
Now let us see how to use these tags and their purposes.
HTML Document Structure:
<html>
<head>
<title>This is a sample page</title>
</head>
<body>
This is the message seen in the browser window
</body>
</html>
<head>
<title>This is a sample page</title>
</head>
<body>
This is the message seen in the browser window
</body>
</html>
The elements can also be typed in Capital letter (since HTML is not case sensitive). But don’t mix both capital and small letter to maintain some consistency.
Explanation of HTML Document Elements:
- <html>…</html> – This is the main element that contains the entire html document. The elements make the browser to understand the start and end of the document. The html tags outside this element will not be considered by the browser.
- <head>…</head> – This is the header element that contains information about the page like title, description, etc. Generally the information is not displayed in the browser since they are used for SEO purpose (explained in SEO tutorial). The header element is also used to link javascript and CSS style sheet with the document which is discussed in our advanced tutorial.
- <title>…</title> – The title given inside is displayed at the top of the browser window. In our example, “This is a sample page” is the given title which can be seen at the top of the browser. This is purely used for SEO purposes. Skipping this element or leaving blank doesn’t cause any harm to our document.
- <body>…</body> – This is the place where all the information to be seen inside the browser window are given. The layouts, links, images, forms are all coded inside this body element to display it to the world. In our example, “This is the message seen in the browser window” text is displayed in the browser.
What is Next?
Now let us start learning other html elements one by one which are used inside the body element to design great web pages. First we can see about HTML Headings.
Advertisement
