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 बनाता है।