HTML Structure Tags

The basic structure for HTML documents is simple and should include the following minimum elements or tags:-

  • <HTML> - The main container for HTML page
  • <HEAD> - The container for page header information
  • <TITLE> - The title of the page
  • <BODY> - The main body of the page



👉The <html> Tag

The first page structure tag in every HTML page is the <html> tag. It indicates that the contains of this file is in the HTML language. The <html> tag should immediately follow the DOCTYPE identifier. All the text and HTML elements in your web page should be placed within the beginning and ending HTML tags, as shown in the following example:-

<!DOCTYPE html>
<html>
..... describe your  page .....
</html>

👉The <head> Tag 

The <head> tag is a container for the tags that contain information about the page, rather than information than information than will be displayed on the page. Generally, only a few tags are used in the <head> portion of the page (basically, title tag). You should never put any of the text of your page into the header (between <head> tags). Here's a typical example of how you property use the <head> tag.

<!DOCTYPE html>
<html>
<head>
<title> This is your title </title>
</head>
..... describe your page .....
</html>

Elements used inside <head> tag are <title>, <base>, <link>, <style>, <meta>, <script>, <noscript>

<base> - Defines base URL for all relative links.

<head>
<base href = "https://www.google.com/">
</head>

 

<link> - Relationship between the current document and external style sheets.

<head>
<link rel = "stylesheet" href = "style.css">
</head>

 

<noscript> - Used when JavaScript disabled browser / No JavaScript support in browser

<noscript>
<p> JavaScript disabled </p>
</noscript>

 

<meta> - Provides metadata about document

<head>
<meta charset = "utf-8">
<meta name = "viewport" content = "width = device-width, initial scale = 1.0">
</head>  

 

👉The <title> Tag

Each HTML page needs a title to indicate what the page describe. It appears in the title bar of the browser when people view the web page. The title is stored in your browser's bookmarks and in search engines when they index your pages. Use the <title> tag to give a page title. <title> tags are placed within the <head> tag and normally used to describe the contents of the page.

<!DOCTYPE html>
<html>
<head>
<title> HTML basic structure tags </title>
</head>
..... describe your page .....
</html>

👉The <body> Tag

The content of your HTML page resides within the <body> tag. This includes all the text and other content (links, pictures, and so on). In combination with the <html> and <head> tags, your page will look something like this:

<!DOCTYPE html>
<html>
<head>
<title> HTML basic structure tags </title>
</head>
<body>
..... describe your page .....
</body>
</html>

NOTES.....

1. The <html> tag serves as a container for all of the tags that make up the page. It is required because both XML and SGML specify that every document have a root element. Were you to leave in out, which you shouldn't do because it would make your page invalid, the browser would make up an <html> tag for you so that the page would make sense of its HTML processor.

2. When search engines index your pages, each page title captured and listed in the search result. The more descriptive your page title, the more likely it is that someone will choose your page from all the search results.

Previous Post Next Post