HTML TUTORIALS-
-HTML - The Head Element Tag –
Introduction-
🔹- In <head> element in HTML contains meta-information about the webpage. It doesn't display content directly on the page instead, its helps the browser understand the pages, and loads essential files like stylesheets, fonts, and scripts...<head> element is a container for the following elements: <title>, <style>, <meta>, <link>,<script>, and <base>...
🔹 Why It Use-
🔹 Improves SEO and social sharing-
🔹 Enables responsive design-
🔹 Sets page title and encoding-
Common Tags Inside In <head>-
| Tag | Purpuse |
|---|---|
| <title> | Sets the title shown in the browser tab |
| <meta charset="UTF-8"> | Sets character encoding (UTF-8 is standard) |
| <meta name="..."> | Describes page (for SEO, responsiveness, etc.) |
| <link rel="stylesheet"> | Links external CSS file |
| <link rel="icon"> | Sets favicon (browser tab icon) |
✅ 1)-Examples 1. Basic Head Element with Title:-👇
<head> <title>My First Web Page</title> </head>
✅ 2)-Examples Adding a Character Set and Viewport for Responsiveness:-👇
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Responsive Page</title> </head>
✅3)-Examples Including a Favicon: -👇
<head>
<title>With Favicon</title>
<link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
✅4)-Examples Basic Structure: -👇
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<meta charset="UTF-8">
<meta name="description" content="This is a simple web page.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<script src="script.js" defer></script>
</head>
<body>
<!-- Visible content goes here -->
</body>
</html>