HTML Document या Blog Posts को Readers के लिए लिखा जाता हैं. इनमे सारी Information/जानकारी हमारे पाठकों को ध्यान में रखकर लिखि जाती हैं लेकिन, इस जानकारी को हमारे पाठकों के सामने Search Engines ढूँढकर लाते हैं. इसलिए कुछ Information सर्च इंजन के लिए भी लिखि जाती हैं. इस Information को Meta Data या Meta Information कहते हैं. और Meta Data को HTML Meta Tags द्वारा Define किया जाता हैं.
इस Tutorial में हम आपको HTML Meta Tags के बारे में पूरी जानकारी देंगे. Meta Element को आसानी से समझने के लिए हमने इस Tutorial को निम्न भागों में विभाजित किया हैं.
Meta Tag का परिचय – Meta Tag Introduction in Hindi
HTML Meta Tag द्वारा HTML Document की Meta Information को Define किया जाता हैं. Meta Information Data (Content) के बारे में Data (Information About Content). अगर आसान शब्दों में कहें तो Meta Data एक Webpage के बारे में जानकारी होती हैं. जिसे Search Engines के लिए लिखा जाता हैं.
Meta Data में Document Title, Keywords, Description, Author Information, Last Modified Date आदि को सम्मिलित किया जाता हैं. इसके अलावा भी आप सैंकडों प्रकार का Meta Data एक HTML Document के बारे में Describe कर सकते हैं. इस जानकारी का उपयोग Search Engines हमारे Content को Index और उसको ढूँढने के लिए करते हैं.
Meta Data पाठकों को दिखाई नही देता हैं. इसे केवल Search Engines और Web Browsers द्वारा ही Read किया जा सकता हैं.
Meta Tags का महत्व – Importance of Meta Tags
अभी हमने बताया कि Meta Information हमारे Content को पाठकों के सामने लाने में इस्तेमाल होती हैं. इसके अलावा भी Meta Tags के अन्य महत्वपूर्ण उपयोग हैं, जिनके बारे में नीचे बताया जा रहा हैं.
Meta Tag द्वारा Document Title, Content Description (Summary), Keywords, आदि को Define किया जाता हैं.
Viewport (Readers को दिखाई देने वाली स्क्रीन) Setting को Meta Tag द्वारा Define किया जाता हैं. /li>
Cookies, URLs Redirection आदि को भी Meta Tags द्वारा ही Define किया जाता हैं.
Meta Information हमारे वेबपेजों को Index कराने में सहायक हैं.
SEO – Search Engine Optimization के लिए भी Meta Data आवश्यक होता हैं.
General Syntax of Meta Tag
नीचे हमने Meta Tag का General Syntax दिया हैं.
<meta attribute=”value”>
Meta Tag एक Empty HTML Tag होता हैं. जिसका कोई साथी Tag यानि Closing Tag नहीं होता हैं. इसमें सिर्फ Opening Tag ही होता हैं. ऊपर जो Syntax दिया गया हैं, हमने अन्य HTML Tag की भांति ही Meta Tag को Define किया हैं. इसमें सारी Information Attributes द्वारा ही Define की जाती हैं.
अगर आप Meta Tags को HTML में इस्तेमाल कर रहे हैं तो आपको इसे Close करने की जरूरत नहीं हैं. और यदि आप XHTML में Meta Tag को Define कर रहे हैं तो इसे Close करना जरूरी हैं.
Commonly Used Attributes of Meta Tag
Meta Element द्वारा Global Attributes और Event Attributes दोनों को Support किया जाता हैं. इनके अलावा कुछ Element Specific Attributes भी हैं, जिनको सिर्फ Meta Element में ही Define किया जाता हैं. जिनकी जानकारी नीचे दी जा रही हैं.
charset – इसका पूरा नाम Character Setting हैं. इस Attribute द्वारा HTML Document की Character Encoding को Define किया जाता हैं. अगर आप Encoding Define नहीं करते हैं तो Browser Default Encoding को इस्तेमाल करता हैं.
content – इस Attribute द्वारा name और http-equiv Attributes की Value Define की जाती हैं.
text – इस Attribute द्वारा Meta Data का नाम Define किया जाता हैं. इसकी संभावित Value application name, author, description, generator, keywords, viewport हो सकती हैं.
http-equiv – इस Attribute द्वारा Content Attribute द्वारा Define Value के लिए HTTP Header Define किया जाता हैं.
Defining Meta Tags
Meta Tags को हमेशा Webpage के Header में Define किया जाता हैं. Meta Tag का Syntax आप ऊपर जान ही गए हैं. अब हम यहाँ आपको कुछ सामान्य और उपयोगी Meta Tags को Define करने के बारे में जानकारी देंगे.
Define Keyword Meta Tag
Keyword Meta Tag के द्वारा HTML Document से कुछ मुख्य शब्दों को छांटकर यहाँ लिखा जाता हैं. जैसे यह Tutorial Meta Tags के बारे में हैं, तो आप Meta Tag, HTML, Meta Element आदि शब्द छांट सकते हैं. और इन्हे Meta Keywords के रूप में इस्तेमाल कर सकते हैं. Meta Tag को इस प्रकार Define किया जाता हैं.
<!DOCTYPE html> <html> <head><meta name=”keyword” content=”meta tag, meta data, meta element”>
</head> <body>
</body> </html>
Example को समझिए
Keyword Meta Data Define करने के लिए Meta Tag में name Attribute की Value keyword हैं, और content Attribute द्वारा Keywords को Define किया गया हैं. आप भी इसी तरह अपने HTML Document या फिर Blog Post के लिए Keywords Define कर सकते हैं.
Define Description Meta Tag
Description Meta Tag द्वारा HTML Document के बारे में लिखा जाता हैं. इसे आप Summary भी कह सकते हैं. हमे लगभग 150 शब्दों के भीतर अपने पूरे HTML Document को Describe करना पडता हैं. इस जानकारी को Search Engines अपने Search Engine Result Pages में पाठकों को दिखाते हैं. इसलिए इसे समझदारी से लिखना चाहिए.
<!DOCTYPE html> <html> <head><meta name=”description” content=”In this tutorial you can learn about HTML Meta Tags.”>
</head> <body>
</body> </html>
Example को समझिए
Description Meta Data Define करने के लिए Meta Tag में name Attribute की Value description हैं, और content Attribute द्वारा Description को Define किया गया हैं. आप भी इसी तरह अपने HTML Document या फिर Blog Post के लिए Description Define कर सकते हैं.
Define Viewport
वर्तमान समय Mobile Web का हैं. इसलिए Website/Blog को Mobile Friendly होना जरूरी हैं. जिसमें viewport Value की अहम भूमिका हैं. इससे आप अपनी साईट को प्रत्येक डिवाईस के लिए Responsive बना सकते हैं. जिसे आपके पाठक भी पसंद करेंगे. Viewport को इस प्रकार Define किया जाता हैं.
Viewport Define करने के लिए Meta Tag में name Attribute की Value viewport हैं, और content Attribute द्वारा Viewport को Define किया गया हैं. जिसमें width को device-width Set किया गया हैं. ताकि हमारी वेबसाईट जिस उपकरण में खुल रही हैं अपने आपको उसी की width के अनुसार Adjust हो जाए. और intial-scale को 1.9 लिखा गया हैं. इससे साईट Zoomable बन जाती हैं.
Define Character Encoding
HTML Document के Character Encoding को Define करने के लिए charset Attribute का इस्तेमाल किया जाता हैं. अगर आप Encoding Set नहीं करते हैं तो ब्राउजर आपके Content को Default Encoding में दिखाता हैं. इसलिए इसे Define करना सही कार्य हैं.
वर्तमान समय Mobile Web का हैं. इसलिए Website/Blog को Mobile Friendly होना जरूरी हैं. जिसमें viewport Value की अहम भूमिका हैं. इससे आप अपनी साईट को प्रत्येक डिवाईस के लिए Responsive बना सकते हैं. जिसे आपके पाठक भी पसंद करेंगे. Viewport को इस प्रकार Define किया जाता हैं.
Character Encoding Define करने के लिए Meta Tag में charset Attribute का इस्तेमाल किया जाता हैं और इसकी Value में Character Encoding को लिखा जाता हैं. वर्तमान में UTF-8 सबसे ज्याद प्रचलित Character Encoding हैं. और हमने भी इसी का इस्तेमाल किया हैं.
Define Page Redirection
Page Redirection द्वारा आप पाठक को Landing URL से किसी दूसरे URL पर Redirect कर सकते हैं. मतलब आप उसे एक वेबपते से दूसरे वेबपते पर बिना उसे बताये भेज सकते हैं. इस कार्य के लिए Redirection Meta Data का इस्तेमाल किया जाता हैं.
Redirection Define करने के लिए Meta Tag में http-equiv Attribute का इस्तेमाल किया जाता हैं और इसकी Value को refresh Define किया जाता हैं. मतलब इस वेबपते को पुन: Load होना हैं. कैसे? इसको content Attribute द्वारा Define किया गया हैं. हमने यहाँ समय 5 सैकण्ड और URL में इसी साईट के होमपेज का पता लिखा है. जब आप इस पेज को अपने ब्राउजर में खोलेंगे तो आप अपने आप 5 सैकण्ड बाद TutorialPandit.com पर Redirect हो जाऐंगे. आप इसी तरह एक URL को दुसरे-तीसरे या अन्य पर Redirect करा सकते हैं.
आपने क्या सीखा?
इस Tutorial में हमने आपको HTML Meta Tags की पूरी जानकारी दी हैं. आपने Meta Tag क्या होता हैं? Meta Tag को Define करने का तरीका, Examples of Meta Tags आदि के बारे में जाना हैं. हमे उम्मीद हैं कि यह Tutorial आपके लिए उपयोगी साबित होगा.
काफी अच्छी पोस्ट लिखी अपने , शुक्रिया
Nice information on this blog
Thanks kaafi acchi tarike se aapne samjhaya hai.
Thanks Aaj ham ye hi question ka answer Jan ne ke liye serch kiye the .aap ne achi tarah samjha diya.
I liked your website, and I got to learn a lot, always be thankful to you
धनंजय जी, आपका स्वागत है. आप इसी तरह सीखते रहिए. और अपने प्रेरणा भरे शब्दों से हमे प्रेरित करते रहिए.