HTML Head
The HTML <head> Element
The <head> element is a container for metadata (data about data) and is placed between the <html> tag and the <body> tag.
HTML metadata is data about the HTML document. Metadata is not displayed.
Metadata typically define the document title, character set, styles, links, scripts, and other meta information.
The following tags describe metadata: <title>, <style>, <meta>, <link>, <script>, and <base>.
The HTML <title> Element
The <title> element defines the title of the document, and is required in all HTML/XHTML documents.
The <title> element:
- defines a title in the browser tab
- provides a title for the page when it is added to favorites
- displays a title for the page in search engine results
A simple HTML document:
Example
<html>
<head>
<title>Page Title</title>
</head>
<body>
The content of the document......
</body>
</html>
The HTML <style> Element
The <style> element is used to define style information for a single HTML page:
Example
body {background-color: powderblue;}
h1 {color: red;}
p {color: blue;}
</style>
The HTML <link> Element
The <link> element is used to link to external style sheets:
Tip: To learn all about CSS, visit our CSS Tutorial.
The HTML <meta> Element
The <meta> element is used to specify which character set is used, page description, keywords, author, and other metadata.
Metadata is used by browsers (how to display content), by search engines (keywords), and other web services.
Define the character set used:
Define a description of your web page:
Define keywords for search engines:
Define the author of a page:
Refresh document every 30 seconds:
Example of <meta> tags:
Example
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Hege Refsnes">
The HTML <script> Element
The <script> element is used to define client-side JavaScripts.
This JavaScript writes "Hello JavaScript!" into an HTML element with id="demo":
Example
function myFunction {
document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script>
Tip: To learn all about JavaScript, visit our JavaScript Tutorial.
The HTML <base> Element
The <base> element specifies the base URL and base target for all relative URLs in a page:
Omitting <html>, <head> and <body>?
According to the HTML5 standard; the <html>, the <body>, and the <head> tag can be omitted.
The following code will validate as HTML5:
Example
<title>Page Title</title>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
Note: subhodaya does not recommend omitting the <html>, <body>, and <head> tags. Omitting these tags can crash DOM/XML software and produce errors in older browsers.
HTML head Elements
| Tag | Description |
|---|---|
| <head> | Defines information about the document |
| <title> | Defines the title of a document |
| <base> | Defines a default address or a default target for all links on a page |
| <link> | Defines the relationship between a document and an external resource |
| <meta> | Defines metadata about an HTML document |
| <script> | Defines a client-side script |
| <style> | Defines style information for a document |
