We introduced the head tags
and as the tags that enclose elements containing information about the HTML file. The fact that most of the elements in the head tags function behind-the-scenes does not make them any less important.Most head elements are not seen by the average user, but can be seen by viewing the page source, and are useful sources of information for search engine spiders that come crawling around the web.
The title element is the only head element that does not function behind-the-scenes. Any text written between <title> and </title> will be displayed at the top of your browser or tab for all to see. This element is an important method of identifying the page and stating its purpose.
<head>
<title>My Page Name And Purpose</title>
</head>
Meta tags are most often used to describe a webpage to browsers and search engines, although they have other uses. Two commonly used meta tags are the "description" and "keywords" name tags, although many more are available. Meta tags look like this:
<head>
<meta name="description" content="Description Of Your Webpage Goes Here" />
<meta name="keywords" content="comma, separated, keywords, go, here" />
<meta name="copyright" content="Copyright (C) 2010 PHP For Kids.com" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
</head>
| Attribute | Value |
|---|---|
| charset | character_set |
| content | text |
| http-equiv | content-type default-style refresh |
| name | application-name author description generator keywords viewport |
Link tags define relationships between the HTML file and an external resource. They are most commonly used to link to external cascading style sheets and favicons. Link tags are used in the following matter:
<head>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="/Style.css" />
</head>
Script tags are commonly used to add javascript to a webpage. They are inserted between the head tags in the following manner:
<head>
<script type="text/javascript">
document.write("What did the porcupine say to the cactus?")
document.write("He Said: Are you my mother?")
</script>
</head>
Style tags, used for internal CSS, are inserted in the same manner:
<head>
<style type="text/css">
p { border: 1px dotted #000000; }
</style>
</head>