The <head> section contains all the information that the browser, search engines, or other tools need to know about the webpage — but it’s not visible to visitors.
This defines the title of the page shown on the browser tab. It’s also important for SEO since search engines use it as the page title in results.
html
<title>My First Website</title>Meta elements contain metadata about the page, such as character encoding, description, or mobile settings. They aren’t visible to users but are essential for proper functioning.
html
<meta charset="UTF-8">
<meta name="description" content="Personal blog about HTML learning.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">The <link> element lets us attach external stylesheets, such as CSS files. It’s one of the most commonly used elements in the <head>.
html
<link rel="stylesheet" href="styles.css">JavaScript files can be loaded using the <script> element. While it’s best practice to place scripts at the end of the page, sometimes it’s necessary to include them in the <head>, such as for early initialization.
html
<script src="main.js"></script>The example below shows a typical <head> block, containing basic meta, link, script elements, and the title.
html
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Learning HTML</title>
<link rel="stylesheet" href="style.css">
<script src="main.js"></script>
</head>Always use appropriate character encoding (e.g., UTF-8), define the viewport for mobile devices, use informative titles, and if possible, include concise, meaningful meta descriptions.
✨ Ask Lara — your AI study partner
Unlock personalized learning support. Lara can explain lessons, summarize topics, and answer your study questions — available from the Go plan and above.
Lara helps you learn faster — exclusive to ReadyTools Go, Plus, and Max members.