Introduction
This chapter demonstrates about the HTML Documents which consist of some absolute minimum elements. Following are the concepts covered.
- Structure
- Head and Title
- Body
Description
Every HTML document must and should contain two elements, they are <!Doctype> and <html>.
<!Doctype> is used to encode the document with in html specifications to the browser. <html> is used to inform the browser to consider from html starting tag to ending tag i,e <html>….</html>. The code below demonstrate the structure of the document.
[html]
<!DOCTYPE HTML>
<html>
<p>All other elements, styles, scripts must be enclosed within these two tags.</p>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
Description
The <head> and <Title> tags must be place in between the starting and ending tags of HTML tags. The <head> tag contains meta data, and the <Title> tag is the most required element in the html document. Title should be unique and appears on top of the document. <title> element is used by the search engine to get the idea about the web page and to place in a web page search results and title page can contain links or images. The code below demonstrate the head and title tags of the HTML document.
[html]
<!DOCTYPE HTML>
<html>
<head>
<title>The Title of the page.</title>
</head>
<p>Displays Title of the page</p>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
Description
Body element is used to display the content of the web page in the main window of the browser. Html document contains only one body element, it should be followed by <head> element. All other content of the document like headings, paragraphs, tables, forms, multimedia, links should be placed in between body tags. The code below demonstrates the body element.
[html]
<!DOCTYPE HTML>
<html>
<head>
<title>Title of the Webpage.</title>
</head>
<body>
<p>/* All contents to be displayed in the main window of the web browser
must be enclosed within the body tags.*/</p>
</body>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
Examples
The below code demonstrate the basic elements of a web page which contain <!DOCTYPE>, <head>, <title>, <body> elements.
[html]
<!DOCTYPE>
<html>
<head>
<title>The Title of the Webpage.</title>
</head>
<body>
<!-- the text to be displayed must be written within body element---->
<p> Basic HTML document </p>
</body>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
Key Points
- Title tag should be unique on the web page.
- Body element should be in between the head tag.
- Meta data should not appear on the web page.