SVG फ़ाइल क्या है और इसे कैसे बदलें?

आप एक लोगो या आइकॉन डाउनलोड करते हैं और वह आपके कंप्यूटर पर logo.svg के रूप में सेव होता है। इसे किसी सामान्य फोटो व्यूअर में खोलने की कोशिश करते हैं, पर प्रीव्यू तक नहीं दिखता। किसी ऐसी जगह अपलोड करने की कोशिश करते हैं जो "सामान्य" इमेज चाहती है, और साइट फाइल को रिजेक्ट कर देती है। SVG फाइल खराब नहीं है, यह बस JPG या PNG से पूरी तरह अलग तरह की इमेज फाइल है, और यह फर्क समझना ही इसे सही तरीके से इस्तेमाल करने की कुंजी है।

SVG असल में क्या है#

SVG का मतलब है Scalable Vector Graphics (स्केलेबल वेक्टर ग्राफिक्स), और यह नाम बिल्कुल बता देता है कि यह क्या है: एक ऐसी इमेज जो पिक्सेल की ग्रिड से नहीं बल्कि गणितीय आकारों (रेखाएं, वक्र, बिंदु, फिल) से बनी होती है। एक JPG या PNG इमेज को एक फिक्स्ड पिक्सेल एरे के रूप में सेव करता है, इसलिए काफी ज़ूम करने पर आपको ब्लॉकी चौकोर दिखने लगते हैं। SVG आकारों को बनाने के निर्देश सेव करता है, इसलिए व्यूअर इमेज को किसी भी साइज में फिर से बना सकता है: 16 पिक्सेल के फेविकॉन से लेकर दीवार जितनी बड़ी बैनर तक, हर बार बिल्कुल साफ किनारों के साथ।

अंदर से देखें तो एक SVG फाइल सादा टेक्स्ट है, ठीक से कहें तो XML, इसलिए आप इसे टेक्स्ट एडिटर में खोलकर आकारों की परिभाषाएं सचमुच पढ़ सकते हैं। इसका मतलब यह भी है कि SVG बेहद अच्छे से कंप्रेस होते हैं और बहुत छोटे हो सकते हैं: एक सिंपल आइकॉन अक्सर सिर्फ कुछ किलोबाइट का होता है, जो बराबर वाले PNG से भी छोटा है।

लोगो और आइकॉन में SVG हर जगह क्यों है#

तीन खूबियां SVG को फोटो के अलावा हर चीज़ के लिए डिफॉल्ट चॉइस बनाती हैं:

• बिना क्वालिटी गंवाए अनंत स्केलिंग। एक लोगो को बिज़नेस कार्ड पर भी शार्प दिखना चाहिए और बिलबोर्ड पर भी। एक ही SVG दोनों संभाल लेता है; रास्टर फॉर्मेट में हर साइज के लिए अलग, हाई-रिज़ॉल्यूशन फाइल चाहिए होगी।
• सिंपल आकारों के लिए बेहद छोटी फाइल साइज। फ्लैट-कलर आइकॉन, लोगो और लाइन आर्ट, पिक्सेल ग्रिड की तुलना में वेक्टर पाथ के रूप में कहीं ज्यादा कुशलता से एनकोड होते हैं।
• कोड से एडिट और स्टाइल किया जा सकना। टेक्स्ट-बेस्ड होने की वजह से SVG के रंग, स्ट्रोक, यहां तक कि एनिमेशन भी सीधे CSS और JavaScript से कंट्रोल किए जा सकते हैं, जो किसी भी रास्टर इमेज में मुमकिन नहीं।

यही वजह है कि लगभग हर वेबसाइट का लोगो, नेविगेशन आइकॉन और इलस्ट्रेशन SVG के रूप में शिप होते हैं, जबकि फोटो हमेशा JPG या WebP के रूप में। वेक्टर और रास्टर फॉर्मेट एक ही काम के लिए एक-दूसरे से मुकाबला नहीं कर रहे; वे बिल्कुल अलग तरह के कंटेंट के लिए बनाए गए हैं।

SVG किस चीज़ में कमज़ोर है#

SVG की ताकत ही इसकी सीमा भी है: यह सिर्फ उन इमेज के लिए काम करता है जो बताए जा सकने लायक आकारों से बनी हों। सूर्यास्त की एक फोटो में कोई साफ पाथ नहीं होता जिसे बताया जा सके, बस लाखों अलग-अलग पिक्सेल वैल्यू होती हैं, इसलिए फोटो JPG जैसे रास्टर फॉर्मेट पर ही निर्भर रहती हैं। किसी फोटो को SVG में "बदलने" की कोशिश करने से न वह छोटी होती है, न शार्प; इससे या तो छोटे-छोटे आकारों से भरी, भारी-भरकम फाइल बनती है, या फिर धुंधला, अनुमानित सा ट्रेस बनता है जिसमें डिटेल खो जाती है। SVG का इस्तेमाल उन ग्राफिक्स के लिए करें जिन्हें आपने बनाया है, और रास्टर फॉर्मेट का इस्तेमाल उस हर चीज़ के लिए जिसे आपने फोटो खींचा है।

SVG को PNG या JPG में कैसे बदलें#

वेक्टर फाइल को रास्टर फाइल में बदलने को रास्टराइज़ेशन कहते हैं: आकारों को एक तय पिक्सेल साइज पर रेंडर करके नतीजे को पिक्सेल ग्रिड में ढालना। SVG को रास्टराइज़ करने की जरूरत तब पड़ती है जब आप इसे किसी ऐसी जगह भेज रहे हों जो सिर्फ "सामान्य" इमेज समझती हो, जैसे सोशल मीडिया अपलोड, ईमेल सिग्नेचर, या कोई पुराना फॉर्म जो .svg अपलोड रिजेक्ट कर देता हो।

बिना कोई सॉफ्टवेयर इंस्टॉल किए, सबसे भरोसेमंद फ्री तरीका यह है:

1. SVG फाइल को किसी ब्राउज़र में खोलें (Chrome, Firefox और Edge, सभी SVG को सीधे रेंडर करते हैं; बस फाइल को एक नए टैब में ड्रैग कर दें)।
2. रेंडर हुई इमेज पर राइट-क्लिक करें और "Save image as" चुनें, फॉर्मेट में PNG सेलेक्ट करें।
3. कुछ ब्राउज़र इसे सिर्फ SVG के डिफॉल्ट साइज में ही सेव करते हैं। किसी खास पिक्सेल साइज के लिए, Figma या Inkscape जैसे फ्री टूल में SVG खोलकर अपनी पसंद के रिज़ॉल्यूशन पर एक्सपोर्ट करें।

PNG मिल जाने के बाद आमतौर पर दो काम होते हैं। अगर फाइल वेब के लिए जरूरत से बड़ी है, तो उसे इमेज कंप्रेस करें टूल से गुजारें, जो क्वालिटी में साफ फर्क डाले बिना साइज छोटा कर देता है, क्योंकि हाई-रिज़ॉल्यूशन में एक्सपोर्ट किया गया आइकॉन भी जरूरत से ज्यादा बाइट्स लेकर चल सकता है। अगर आप किसी लोगो से फेविकॉन बना रहे हैं, तो PNG को ICO में बदलें इस एक्सपोर्ट की गई PNG को उस .ico फॉर्मेट में बदल देता है जिसकी ब्राउज़र और बुकमार्क बार को जरूरत होती है; आइकॉन को हर साइज में शार्प रखने के लिए पहले SVG को 256x256 या उससे बड़े साइज में एक्सपोर्ट करें।

SVG बनाम PNG बनाम JPG, एक नज़र में#

अगर आप अपनी खुद की इमेज के लिए PNG की तुलना किसी और रास्टर फॉर्मेट से कर रहे हैं, तो हमारा WebP फाइल एक्सप्लेनर इस तुलना को और गहराई से समझाता है; यहां का वेक्टर-बनाम-रास्टर वाला सवाल एक अलग फैसला है जो PNG या JPG तक पहुंचने से पहले लिया जाता है।

क्या SVG फाइल खोलना सुरक्षित है#

ज्यादातर मामलों में हां, पर एक बात जानना जरूरी है: क्योंकि SVG XML-बेस्ड है और ब्राउज़र एक SVG के अंदर <script> टैग एम्बेड करने की इजाज़त देते हैं, एक नुकसानदेह SVG तकनीकी रूप से चलने लायक कोड ले जा सकता है। किसी भरोसेमंद सोर्स से डाउनलोड किए गए लोगो के लिए यह शायद ही कभी चिंता की बात होती है, पर यही वजह है कि कुछ ईमेल क्लाइंट और CMS प्लेटफॉर्म डिफॉल्ट रूप से SVG अपलोड ब्लॉक कर देते हैं; और अगर बच सके, तो किसी अनजान सोर्स से आई SVG को सीधे ब्राउज़र टैब में न खोलें। किसी भरोसेमंद न लगने वाली SVG को पहले PNG में बदलना, ऐसे टूल से जो सिर्फ पिक्सेल रास्टराइज़ करता है, एम्बेडेड स्क्रिप्ट को चलाता नहीं, इस खतरे को पूरी तरह टाल देता है।

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

SVG फाइल कौन सा प्रोग्राम खोलता है? कोई भी आधुनिक वेब ब्राउज़र (Chrome, Firefox, Safari, Edge) SVG फाइल को नए टैब में ड्रैग करके सीधे खोल और दिखा देता है, और Figma, Inkscape, Adobe Illustrator जैसे डिज़ाइन टूल इसे एडिटिंग के लिए खोलते हैं।

क्या मैं SVG को फ्री में PNG में बदल सकता हूं? हां, SVG को ब्राउज़र में खोलकर रेंडर हुई इमेज सेव करना, या Inkscape या Figma जैसे फ्री टूल से अपनी पसंद के पिक्सेल साइज में एक्सपोर्ट करना, बिना किसी पेड सॉफ्टवेयर के इसे PNG में बदल देता है।

कोई साइट मुझे SVG फाइल अपलोड क्यों नहीं करने देती? कई अपलोड फॉर्म और CMS प्लेटफॉर्म खासतौर पर SVG को ब्लॉक करते हैं क्योंकि यह चलने लायक स्क्रिप्ट कोड एम्बेड कर सकता है, जो रास्टर फॉर्मेट में नहीं होता; इसलिए वे पहले SVG को PNG या JPG में बदलने को कहते हैं।

क्या SVG, PNG से बेहतर है? लोगो, आइकॉन और इलस्ट्रेशन के लिए SVG बेहतर है क्योंकि यह बिना धुंधले हुए किसी भी साइज में स्केल हो जाता है और छोटा रहता है; वहीं फोटो, स्क्रीनशॉट और ऐसी हर इमेज के लिए PNG बेहतर है जो आकारों में नहीं बताई जा सकने वाली लगातार पिक्सेल डिटेल से बनी हो।

SVG को PNG में बदलने से क्वालिटी घटती है? अगर आप PNG को उसके इस्तेमाल के लिए काफी बड़े पिक्सेल साइज में एक्सपोर्ट करें तो कोई डिटेल नहीं खोती, पर बना हुआ PNG अब उस रिज़ॉल्यूशन पर फिक्स हो जाता है और असली SVG के उलट, आगे बड़ा करने पर धुंधला हो जाएगा।

क्या मैं SVG फाइल के रंग एडिट कर सकता हूं? हां, क्योंकि SVG सादा टेक्स्ट है, इसके रंग और आकार सीधे टेक्स्ट एडिटर में, Figma या Inkscape जैसे डिज़ाइन टूल में, या अगर यह किसी वेबपेज में एम्बेड है तो CSS से डायनामिक रूप से एडिट किए जा सकते हैं।

चाहे आपको हर साइज में शार्प आइकॉन चाहिए हो या बस एक ऐसा PNG जिसे कोई फॉर्म स्वीकार कर ले, SVG बदलने में सिर्फ एक एक्सपोर्ट स्टेप लगता है। रास्टर फाइल मिल जाने के बाद, इमेज कंप्रेस करें और PNG को ICO में बदलें बाकी काम संभाल लेते हैं: फ्री, प्राइवेट, और पूरी तरह आपके ब्राउज़र में चलते हुए। या ब्लॉग पर सभी फाइल फॉर्मेट गाइड देखें।