Meta Tag Generator: SEO मेटा टैग बनाएँ

Meta Tag Generator क्या है?

जब भी मैं कोई नया पेज पब्लिश कर रहा होता हूँ और लाइव होने से पहले देखना चाहता हूँ कि वह Google, Facebook और Twitter पर असल में कैसा दिखेगा, मैं इस टूल का उपयोग करता हूँ। यह टूल पूरा HTML मेटा टैग ब्लॉक (बेसिक SEO, Open Graph, Twitter Card) बनाता है और हर प्लेटफ़ॉर्म के पिक्सेल-सटीक प्रीव्यू साथ-साथ रेंडर करता है। आप Input टैब भरते हैं, Output से कॉपी करते हैं, और Preview में चेक करते हैं।

मुख्य विशेषताएँ

टूल एक ही इनपुट सेट से तीन टैग ब्लॉक बनाता है। बेसिक SEO ब्लॉक <meta name="title">, <meta name="description">, <meta name="keywords">, <meta name="author">, <meta name="robots"> और <link rel="canonical"> को कवर करता है। Open Graph ब्लॉक og:title, og:description, og:type, og:url, og:image, og:site_name और og:locale को कवर करता है, जिसमें website, article, product, video और music टाइप विकल्प हैं। Twitter Card ब्लॉक twitter:card, twitter:site, twitter:creator, twitter:title, twitter:description और twitter:image को कवर करता है, और Summary एवं Summary Large Image कार्ड्स को सपोर्ट करता है।

कैरेक्टर काउंटर सही लंबाई की ओर मार्गदर्शन करते हैं। Title current/60 दिखाता है और 30–60 रेंज में हरा, 30 से कम पर पीला, 60 से अधिक पर लाल हो जाता है। Description समान योजना के साथ 120–160 लक्ष्य का उपयोग करता है। टाइप करते समय तीन लाइव प्रीव्यू अपडेट होते हैं: असली लिंक नीला (#1a0dab), URL हरा (#006621) और डिस्क्रिप्शन ग्रे (#545454) उपयोग करने वाला Google SERP प्रीव्यू; आपके दिए OG इमेज से 1.91:1 इमेज कार्ड रेंडर करने वाला Facebook प्रीव्यू; और कार्ड टाइप सेटिंग के अनुसार Summary एवं Summary Large Image के बीच स्विच करने वाला Twitter Card प्रीव्यू।

Robots ड्रॉपडाउन चार स्टैंडर्ड डायरेक्टिव कॉम्बिनेशन प्रदान करता है: index, follow (डिफ़ॉल्ट), index, nofollow, noindex, follow और noindex, nofollow। Output टैब Basic, Open Graph और Twitter को अलग सेक्शन में बाँटता है, हर एक में अलग कॉपी बटन हैं, साथ में संयुक्त ब्लॉक के लिए Copy All बटन।

Meta Tag Generator का उपयोग कैसे करें

चरण 1: Input टैब भरें

जल्द आ रहा है: Meta Tag Generator खोलें। टूल Input टैब पर खुलता है, जिसमें तीन सेक्शन हैं।

बेसिक SEO सेक्शन:

• Title: आपका पेज टाइटल। कैरेक्टर काउंटर रियल-टाइम में अपडेट होता है। सर्च रिज़ल्ट में कटाव से बचने के लिए इसे 30–60 कैरेक्टर (हरे) के बीच रखें। उदाहरण: TrailMaster Pro Hiking Boots - Waterproof, Vibram Sole (53 कैरेक्टर, हरा)।
• Description: आपकी मेटा डिस्क्रिप्शन। पूर्ण प्रदर्शन के लिए 120–160 कैरेक्टर (हरी रेंज) का लक्ष्य रखें। उदाहरण: TrailMaster Pro boots combine a Vibram outsole with Gore-Tex waterproofing for serious hikers and trail runners. Free shipping over $75. (137 कैरेक्टर, हरा)।
• Keywords: कॉमा से अलग किए गए कीवर्ड। आधुनिक सर्च इंजन इस टैग को काफी हद तक नज़रअंदाज़ करते हैं, लेकिन इसे शामिल करना नुकसानदेह नहीं है। उदाहरण: hiking boots, trail running, waterproof boots, vibram outsole।
• Author: वैकल्पिक लेखक का नाम।
• Robots: चार robots डायरेक्टिव कॉम्बिनेशन में से चुनें। सार्वजनिक सामग्री के लिए index, follow रहने दें। प्राइवेट पेज, एडमिन क्षेत्र या डुप्लिकेट सामग्री जिसे आप इंडेक्स नहीं करना चाहते, के लिए noindex, nofollow का उपयोग करें।
• Canonical URL: इस पेज के लिए पसंदीदा URL। पूरा एब्सोल्यूट URL डालें (उदा. https://example.com/products/trailmaster-pro)।

चरण 2: Open Graph टैग कॉन्फ़िगर करें

Open Graph सेक्शन पर स्क्रॉल करें:

• OG Type: होमपेज और सामान्य पेज के लिए "website", ब्लॉग पोस्ट के लिए "article", ई-कॉमर्स पेज के लिए "product" चुनें।
• OG Site Name: आपकी साइट का प्रदर्शन नाम (उदा. "TrailMaster Outdoor Gear")।
• OG Image: सोशल शेयरिंग इमेज का पूरा URL। Facebook 1200×630 पिक्सेल की सिफारिश करता है। यदि आप पहुँच योग्य URL प्रदान करते हैं, तो Facebook प्रीव्यू असली इमेज रेंडर करता है।
• OG URL: Open Graph के लिए कैनोनिकल URL, आमतौर पर आपके canonical URL के समान।

चरण 3: Twitter Card टैग कॉन्फ़िगर करें

Twitter Cards सेक्शन पर स्क्रॉल करें:

• Twitter Card Type: "Summary" एक छोटा वर्गाकार थंबनेल दिखाता है। "Summary Large Image" बड़ी 2:1 इमेज दिखाता है, विज़ुअल एसेट वाली अधिकांश सामग्री के लिए बेहतर विकल्प।
• Twitter Site: साइट का Twitter/X यूज़रनेम (उदा. @trailmaster)।
• Twitter Creator: सामग्री लेखक का Twitter/X यूज़रनेम।

चरण 4: Output टैब की समीक्षा करें

Output टैब पर क्लिक करें। तीन सेक्शन जनरेटेड टैग दिखाते हैं:

बेसिक टैग उदाहरण:

<meta name="title" content="TrailMaster Pro Hiking Boots - Waterproof, Vibram Sole" />
<meta name="description" content="TrailMaster Pro boots combine a Vibram outsole with Gore-Tex waterproofing for serious hikers and trail runners. Free shipping over $75." />
<meta name="keywords" content="hiking boots, trail running, waterproof boots, vibram outsole" />
<meta name="robots" content="index, follow" />
<link rel="canonical" href="https://example.com/products/trailmaster-pro" />

Open Graph टैग उदाहरण:

<meta property="og:type" content="product" />
<meta property="og:url" content="https://example.com/products/trailmaster-pro" />
<meta property="og:title" content="TrailMaster Pro Hiking Boots - Waterproof, Vibram Sole" />
<meta property="og:description" content="TrailMaster Pro boots combine a Vibram outsole..." />
<meta property="og:image" content="https://example.com/images/trailmaster-og.jpg" />
<meta property="og:site_name" content="TrailMaster Outdoor Gear" />
<meta property="og:locale" content="en_US" />

अपने <head> में पेस्ट करने के लिए पूरा टैग ब्लॉक पाने के लिए Copy All पर क्लिक करें।

चरण 5: Preview टैब में सत्यापित करें

Preview टैब पर स्विच करें। तीन लाइव प्रीव्यू एक साथ रेंडर होते हैं:

• Google SERP प्रीव्यू: title नीले में, canonical URL हरे में, और description दो लाइनों में कटी हुई ग्रे में दिखाता है। यह Google के डेस्कटॉप सर्च रिज़ल्ट प्रारूप से मेल खाता है। यदि आपका title 60 कैरेक्टर पार करता है, तो यह यहाँ दृश्यतः कटेगा, छोटा करने का स्पष्ट संकेत।
• Facebook कार्ड प्रीव्यू: OG इमेज (यदि प्रदान की गई और लोड हो सकती है), साइट डोमेन बड़े अक्षरों में, title बोल्ड में और description दिखाता है।
• Twitter Card प्रीव्यू: twitter:card प्रारूप (Small या Large Image), URL डोमेन, title और description दिखाता है। प्रीव्यू इमेज twitterImage से आती है यदि सेट है, अन्यथा ogImage पर फॉलबैक होती है।

व्यावहारिक उदाहरण

उदाहरण 1: ब्लॉग पोस्ट

"10 Best Hikes in the Scottish Highlands" शीर्षक वाले ब्लॉग पोस्ट के लिए:

• Title: 10 Best Hikes in the Scottish Highlands - Complete Guide (53 chars, हरा)
• Description: The 10 most rewarding hiking routes in the Scottish Highlands, from Ben Nevis to the Isle of Skye. Trail grades, maps, and kit lists included. (143 chars, हरा)
• OG Type: article
• Robots: index, follow

SERP प्रीव्यू पुष्टि करता है कि title बिना कटाव के फिट होता है और description दो उपलब्ध लाइनें भरती है।

उदाहरण 2: ई-कॉमर्स प्रोडक्ट पेज

प्रोडक्ट पेज के लिए, OG type को "product" पर सेट किया जाता है और एक इमेज URL प्रदान किया जाता है। Facebook प्रीव्यू प्रोडक्ट इमेज को 1.91:1 अनुपात पर साइट के नाम, प्रोडक्ट title और description के साथ रेंडर करता है। Twitter Large Image Card 2:1 क्रॉपिंग पर वही इमेज दिखाता है।

उदाहरण 3: प्राइवेट स्टेजिंग पेज

इंडेक्सिंग के लिए तैयार न होने वाले स्टेजिंग एनवायरनमेंट पेज के लिए, Robots को noindex, nofollow पर सेट करें। जनरेटेड आउटपुट में <meta name="robots" content="noindex, nofollow" /> शामिल है, जो सर्च इंजन क्रॉलर्स को इस पेज को इंडेक्स न करने और लिंक्स फॉलो न करने को कहता है, भले ही वे इसे खोज लें।

टिप्स और सर्वोत्तम प्रथाएँ

• OG URL और canonical URL का मिलान करें: og:url और canonical <link> टैग के लिए वही एब्सोल्यूट URL उपयोग करें। मेल न होने से सोशल शेयरिंग ग़लत URL संदर्भ कर सकती है।
• कटाव के लिए title की लंबाई: Google उन titles को काटता है जो डेस्कटॉप रिज़ल्ट में लगभग 600px से ज़्यादा चौड़े रेंडर होते हैं। 30–60 कैरेक्टर लक्ष्य इसके लिए विश्वसनीय प्रॉक्सी है; हरा का अर्थ है आप सुरक्षित सीमा में हैं।
• OG इमेज आयाम: टूल आपके दिए किसी भी URL के लिए og:image टैग बनाता है लेकिन इमेज आयाम सत्यापित नहीं करता। Facebook के लिए 1200×630 पिक्सेल इमेज और Twitter Large Image Card के लिए 1200×600 इमेज उपयोग करें।
• twitter:image og:image पर फॉलबैक करता है: Preview टैब में, Twitter Card आपका twitter:image उपयोग करता है यदि प्रदान किया गया है, अन्यथा og:image। प्लेटफ़ॉर्म प्रति अलग सोशल इमेज चाहिए तो ही अलग twitter:image सेट करें।
• Keywords मेटा टैग: <meta name="keywords"> टैग बनता है लेकिन Google और Bing द्वारा 2009 से काफी हद तक नज़रअंदाज़ किया गया है। पूर्णता के लिए शामिल करें लेकिन इसके अनुकूलन में समय न लगाएँ।

सामान्य समस्याएँ और निदान

Title काउंटर लाल दिखता है लेकिन description ठीक है: title 60 कैरेक्टर से अधिक है। इसे छोटा करें या विवरण description में स्थानांतरित करें। title काउंटर स्पष्ट संकेतक के रूप में लाल में current/60 (long) दिखाता है।

Description काउंटर पीला दिखता है: description 120 कैरेक्टर से कम है। Google आपके पेज सामग्री से अपना स्निपेट प्रतिस्थापित कर सकता है। 20–40 अधिक कैरेक्टर प्रासंगिक सामग्री जोड़ें।

OG इमेज Facebook प्रीव्यू में नहीं दिख रही: Preview टैब वास्तविक इमेज URL को <img> टैग में लोड करता है। यदि URL आपके ब्राउज़र से सार्वजनिक रूप से पहुँच योग्य नहीं है (उदा. लोकल डेवलपमेंट URL), तो इमेज क्षेत्र "No image" प्लेसहोल्डर टेक्स्ट दिखाता है। टैग आउटपुट में सही ढंग से जनरेट होता है।

Twitter प्रीव्यू बड़ी इमेज होने पर भी केवल छोटा कार्ड दिखाता है: Twitter Card Type "Summary Large Image" के बजाय "Summary" पर सेट है। 2:1 अनुपात प्रीव्यू देखने के लिए Twitter Card Type ड्रॉपडाउन को "Summary Large Image" में बदलें।

Output टैब में जनरेटेड टैग ख़ाली दिखते हैं: Input टैब में कम से कम title और description भरें। आउटपुट केवल ख़ाली नहीं फ़ील्ड शामिल करता है; ख़ाली title फ़ील्ड कोई title टैग नहीं बनाता।

गोपनीयता और सुरक्षा

Meta Tag Generator आपके ब्राउज़र में पूरी तरह से चलता है। टैग जनरेशन React के useMemo हुक का उपयोग करके आपके इनपुट से आउटपुट की प्रतिक्रियात्मक गणना करता है, बिना सर्वर राउंडट्रिप के। यदि आप OG इमेज URL प्रदान करते हैं, तो Preview टैब उस इमेज को बिना प्रॉक्सी के सीधे स्रोत URL से लोड करता है। Supporter सदस्य लोकल IndexedDB स्टोरेज का उपयोग करके नामित प्रीसेट सहेज और पुनर्स्थापित कर सकते हैं।

अक्सर पूछे जाने वाले प्रश्न

title और description के लिए इष्टतम कैरेक्टर लंबाई क्या है?

टूल title के लिए 30–60 कैरेक्टर (हरी रेंज) और description के लिए 120–160 कैरेक्टर (हरी रेंज) उपयोग करता है। ये उन विशिष्ट रेंडर्ड पिक्सेल चौड़ाई सीमाओं से मेल खाते हैं जो Google SERP स्निपेट के लिए उपयोग करता है। 30 कैरेक्टर से कम title (पीला) पतले माने जा सकते हैं; 60 से ऊपर (लाल) कट सकते हैं। 120 से कम description (पीला) के कारण Google अपना ख़ुद का अंश उपयोग कर सकता है; 160 से ऊपर (लाल) कट जाएगा।

क्या टूल सभी Open Graph प्रॉपर्टी जनरेट करता है?

टूल मुख्य OG टैग जनरेट करता है: og:type, og:url, og:title, og:description, og:image, og:site_name और og:locale। यह article:published_time जैसे लेख-विशिष्ट टैग या product:price जैसे प्रोडक्ट-विशिष्ट टैग जनरेट नहीं करता। उनके लिए, जनरेटेड आउटपुट कॉपी करने के बाद आप उन्हें मैन्युअली जोड़ते हैं।

कौन से OG locale मान उपलब्ध हैं?

डिफ़ॉल्ट OG locale en_US है। locale फ़ील्ड एक टेक्स्ट इनपुट है जहाँ आप कोई भी मान्य locale कोड टाइप कर सकते हैं (उदा. fr_FR, de_DE, ja_JP)। टूल इस फ़ील्ड को ड्रॉपडाउन तक सीमित नहीं करता।

टूल कौन से Twitter Card प्रकारों का समर्थन करता है?

टूल summary (छोटा वर्गाकार थंबनेल, title, description और साइट नाम) और summary_large_image (पूर्ण-चौड़ाई 2:1 इमेज title, description और साइट नाम के साथ) जनरेट करता है। यह बहिष्कृत app और player कार्ड प्रकारों का समर्थन नहीं करता।

क्या मैं केवल Open Graph टैग बेसिक SEO टैग के बिना कॉपी कर सकता हूँ?

हाँ। Output टैब तीन अलग सेक्शन (Basic, Open Graph, Twitter) दिखाता है, हर एक का अपना कॉपी बटन है। केवल वे टैग कॉपी करने के लिए Open Graph सेक्शन के कॉपी बटन पर क्लिक करें। संयुक्त रूप से सब कुछ पाने के लिए "Copy All" का उपयोग करें।

मैं जनरेटेड टैग अपनी साइट में कैसे जोड़ूँ?

कॉपी किए गए टैग को अपने HTML के <head> सेक्शन के अंदर पेस्ट करें। यदि आप WordPress, Shopify या Webflow जैसा CMS उपयोग करते हैं, तो उन्हें अपनी थीम सेटिंग्स में कस्टम <head> कोड फ़ील्ड में पेस्ट करें या कस्टम मेटा टैग स्वीकार करने वाला SEO प्लगिन उपयोग करें। Next.js जैसे फ्रेमवर्क के लिए, <Head> कंपोनेंट में पेस्ट करें या metadata API उपयोग करें।

संबंधित टूल

• जल्द आ रहा है: पेज SEO एनालाइज़र: किसी मौजूदा लाइव पेज के वर्तमान मेटा टैग, हेडिंग संरचना और ऑन-पेज SEO संकेतों का ऑडिट करें ताकि आपके नए मेटा टैग जिन अंतरालों को संबोधित करना चाहिए, उनकी पहचान हो सके।
• जल्द आ रहा है: SERP प्रीव्यू: अपने मेटा टैग अपडेट करने से पहले और बाद में title और description प्रदर्शन को सूक्ष्म-समायोजित करने के लिए समर्पित SERP प्रीव्यू टूल।
• जल्द आ रहा है: Schema जनरेटर: अपने मेटा टैग के साथ संरचित डेटा मार्कअप जोड़ें ताकि लेख, उत्पाद, इवेंट्स और अधिक के लिए Google सर्च में रिच रिज़ल्ट सक्षम हों।

अभी Meta Tag Generator आज़माएँ: जल्द आ रहा है: Glyph Widgets Meta Tag Generator