<head> element
The HTML head element helps as a container for metadata, which is information about the HTML document that is not displayed in the main browser window. It is placed between the opening <html> tag and the opening <body> tag. The <head> section go before the document body.
<!DOCTYPE html>
<html>
<head>
<title>A Meaningful Page Title</title>
</head>
<body>
The content of the page......
</body>
</html><title> element
The<head> one <title>element, defines the title of the HTML document, which is displayed in the browser’s title bar or in the tab of the page. The value within the <title> tags is used in the browser’s history system, recorded when the page is bookmarked, and consulted by search engine robots to help determine page meaning. Every HTML document should be meaningful to the user, allowing them to differentiate between browser tabs or windows.
<title> tag written as th following code
<title>A Meaningful Page Title</title>Example:
<!DOCTYPE html>
<html>
<head>
<title>A Meaningful Page Title</title>
</head>
<body>
The content of the page......
</body>
</html>The <meta> Element
The <meta>element provides meta-information about the HTML document. It exists in inside the<head>element.
Character encoding
One common use of the <meta> tag is to specify the character encoding scheme for the HTML document. HTML documents almost use UTF-8 character encoding. While not strictly required, it’s good coding practice to include it, particularly if you are coding in languages other than English or if your page title contains special characters.
To specify the character encoding using the <meta> element, you use the charset attribute.
Example
<head>
<meta charset="utf-8">
</head>
Character encoding specified using the http-equiv attribute along with the content attribute:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
The charset attribute is the up-to-date and recommended way to specify character encoding in HTML5. It is recommended the <meta> tag specifying the character set should be the first child of the <head> element, if the document’s <title> element contains special characters.
Links to External Resources
The <head> contain <link> elements to express relations with external resources, most commonly linking to CSS stylesheets to control the presentation of the HTML document. It can also be used for other links, like favicons.
<head>
<link rel="stylesheet" href="css/styles.css">
</head>
<Style> Element
The <style> element allows you to embed Cascading Style Sheets (CSS) directly within your HTML document. This provides a visual presentation of your HTML elements without relying on external stylesheets or inline style attributes.
<style>
body {background-color: powderblue;}
h1 {color: red;}
p {color: blue;}
</style><script> Element
The<script>element is placed inside the<head>section, which makes script definitions easier to track.<script>element is to include scripting in HTML pages.
<script>
document.write = "Hello JavaScript!";
</script><base> Element
The<base>element, located within the<head> HTML document, specifies a base URL to resolve relative links. By setting the href attribute to a qualified URL, all relative URLs in the document will be prefixed with this base. For example, <base href="http://www.example.com/"> will make <a href="page.html"> point to http://www.example.com/page.html. The <base> element can also define the default target attribute for all hyperlinks and form submissions. An HTML document should contain at most one <base> element. It is a void element and has no content.
Example
<head>
<base href="https://govindhtech.com/" target="_blank">
</head>
<body>
<img src="tutorials/wp-content/uploads/2025/04/Raspberry-Pi-IoT-platform.jpg" width="24" height="39" alt="Stickman">
<a href="tags/tag_base.asp">HTML base Tag</a>
</body>