Earn From Online By HTML Tutorial
HTML Head
It is important to have clear conception about all the sections and elements of an HTML document.In the second post of this tutorial I have discussed about the structure of an HTML document.An HTML document starts with <html> tag and ends with </html> tag, can you remember? There are two sections between this starting and ending tag <head> and <body>. I will discuss about head section in details in this post.
HTML Head
Think about a book and its cover page.A book may contains thousands of information and what about the cover page?Cover page provides the basic information such as title, subject, author etc.
Just like a cover page of a book, head section of an HTML document contains some important informations about the document. The informations are placed under several elements like <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>. I will give you idea about this elements individually.
<title>element defines the title of a page, document or article.When a visitor visit your site he first look at the title of your site.Not only that this title is shown in search engine results.So a visitor can leave or enter to your site just looking at your title.So you have to select title carefully.It is ideal to place the main keyword in this tag.
HTML <base> Element
<base> element is the base URL or target for all the related links.I means when you set a base URL in the header section of your page all other links will use this URL.
A base element may have two attributes.An herf attribute and a target attribute.Here herf is for the base URL and target attribute defines where to open the target URL.The value of target attribute may be _blank, _self, _parent, or _top.
For example a complete path to insert an image is as follows
| <img src=”http://www.yoursite.com/images/html.gif” /> |
But if you insert the base URL as follows
| <head> <base href=”http://www.your site.com/images/” target=”_blank”> </head> |
Now you can insert the image with the code..
| <img src=”/images/html.gif” /> |
It will automatically use your homepage as the base URL.
HTML <link> Element :
<link> element is used to create link between a document and an external source.It is usually used to link to a style sheets.
HTML <style> Element :
<style> element is used to define style information of a document.Just see the following code and its effect on browser,
| <head> <style> body {background-color:blue;} p {color:red;}<p>This is a paragraph</p> </style> </head> |
Now see the result on your browser.
Here the background is blue and the paragraph is white as we defined in the code.
HTML <meta> Element :
<meta> tag is an important element of head section.It provide some information about an html page which is important for browser and search engines but is not displayed on the page.<meta> element may have many attributes.I will mention the most important attributes that are commonly used.
1.“keyword” attribute define the keywords of a webpage which is used for search engines.It is called meta keyword.
| <meta name=”keywords” content=”html tutorial,html,basic html tutorial” /> |
2.“description” attribute define the description about the page which is also used by search engines.It is called meta description.
| <meta name=”description” content=”This site contains free tutorials on HTML”> |
3.“author” attribute define the author that the person who created the webpage.
| <meta name=”author” content=”Mijanul Haque” /> |
4.”robots” attribute is used to specify a webpage whether it is indexed or not.
| <meta name=”robots” content=”noindex”> |
5.“refresh” attribute is used to specify when to reload the webpage.To set this time 30 seconds following code is used.
| <meta http-equiv=”refresh” content=”30″> |
HTML <script> Element :
<script> element is used to define a client-side script may be a JavaScript which make the webpage more dynamic.It is discussed under JavaScript Tutorial in details.
HTML <noscript> Element :
<noscript> element provide alternative information for the browsers which do not support JavaScript.
Head section is very important for webmasters as many important elements are present here which are important for SEO.I have tried to give you idea about the main elements and attributes.Hope you will be benefited.
If you face any problem you can comment here,I will try to help you.
Thank you.
