Course Progress 54%

HTML head Element

HTML <head> element का उपयोग web page की metadata और configuration information define करने के लिए किया जाता है।
<head> के अंदर लिखा गया content page पर directly दिखाई नहीं देता, लेकिन browser और search engines के लिए बहुत important होता है।

head Element क्या होता है

<head> element HTML document का एक container होता है जिसमें page से related जानकारी रखी जाती है।
यह <html> tag के अंदर और <body> से पहले लिखा जाता है।

Head का main purpose:

  • Page title define करना
  • Character encoding set करना
  • CSS और JavaScript files link करना
  • SEO और responsiveness control करना

Basic head Element Structure

<head>
  <title>My Website</title>
</head>

यह page का title set करता है जो browser tab में दिखता है।

head के अंदर कौन-कौन से Elements होते हैं

<head> के अंदर commonly ये elements use होते हैं:

<title>
<meta>
<link>
<style>
<script>
<base>

Title Element

<title> page का नाम define करता है।

<title>HTML Tutorial</title>

यह browser tab और search results में दिखाई देता है।

Meta Element

<meta> element page की information provide करता है।

Character Encoding

<meta charset="UTF-8">

यह special characters और languages को correctly display करने के लिए जरूरी है।

Responsive Design Meta Tag

<meta name="viewport" content="width=device-width, initial-scale=1.0">

यह mobile-friendly layout के लिए mandatory है।

SEO Meta Tags

<meta name="description" content="Learn HTML step by step">
<meta name="keywords" content="HTML, Web Development">

Search engines को page समझने में मदद मिलती है।

Link Element

<link> element external resources को connect करता है, जैसे CSS file।

<link rel="stylesheet" href="style.css">

यह CSS file को HTML page से link करता है।

Style Element

<style> tag के अंदर internal CSS लिखी जाती है।

<style>
body {
  background-color: lightgray;
}
</style>

Small projects या testing के लिए useful होता है।

Script Element

JavaScript file या code include करने के लिए <script> use होता है।

<script src="script.js"></script>

Script को <head> या <body> में रखा जा सकता है।

Base Element

<base> element सभी relative URLs के लिए base path define करता है।

<base href="https://example.com/">

इसके बाद सभी relative links इसी base URL से resolve होंगे।

head Element और SEO

Search engines <head> information को heavily use करते हैं।
Correct title और meta description SEO ranking improve करने में मदद करते हैं।

head Element और Performance

Proper head configuration से:
Page faster load होता है
CSS early apply होती है
Rendering issues कम होते हैं

head Element में क्या नहीं होना चाहिए

Visible content
Images
Text paragraphs
Forms

ये सभी <body> के अंदर होने चाहिए।

Common Mistakes

<title> tag miss करना
Viewport meta tag न देना
Duplicate meta tags
Unnecessary scripts head में load करना

Best Practices

<head> को clean और organized रखें
Essential meta tags जरूर add करें
External CSS head में load करें
Heavy scripts को body के end में रखें

Summary

HTML <head> element page की hidden but critical information रखता है।
यह SEO, performance और responsiveness के लिए essential है।
Properly structured head element professional और optimized webpages बनाता है।