Structure of HTML Document

htmlIn HTML, we have nested elements.  Each element has a starting tag and ending tag.  The starting tag and ending tag both are surrounded by angular brackets (< >).  The only difference between these two tags is that the ending tag has forward slash (/) in front of tag name.  These tags tell the browser how to treat the content between those tags.  There are 3 main elements in HTML file.

The very first element in HTML file is HTML, but first of all, we need to add DOCTYPE declaration which will let the browser know about the HTML version you are using.  In the past, we need to specify different types of DOCTYPE, but as of current, in latest version HTML5, we don’t need to dig too much.  A very simple declaration of DOCTYPE is enough to tell the browser that you are using HTML5.  Please see example given below.

The next element after HTML is Head.  This element basically contains page related info like title of the page which goes inside Title element.

The next element is body.  This contains more nested elements which all together construct a whole web page.

Now, this is the time to create our very first web page.  Open Notepad++ and copy and paste the code given below.  While saving the page, please make sure, you should save it as html.  This will tell the browser to treat the content in that file as html.  By default, the main page of a website is always index.html

You can open this html file in your favorite browser like Firefox, Google Chrome etc. to see the output.

NOTE:  Please don’t get confused if I call tag as element or element as tag, eventually both are the same, for example Head Tag or Head Element.

<!DOCTYPE html>
<html>
<head>
<title>HTML5 Tutorials</title>
</head>
<body>
Hello World!
</body>
</html>