SVG को WebP में बदलें - कहीं छोटा, फिर भी पारदर्शी
जब SVG को पिक्सेल बनना हो और नतीजा वेब पर जाना हो, तो WebP ही वह प्रारूप है जिसकी ओर हाथ बढ़ाना चाहिए। यह वही पूरा अल्फ़ा चैनल रखता है जो PNG देता है, और वज़न के एक अंश में - हमारी तीनों परीक्षण फ़ाइलों में ठीक उन्हीं मापों वाली PNG के मुक़ाबले WebP 81% से 97% तक छोटी निकली। ये आँकड़े इसी टूल से मापे गए हैं, किसी विनिर्देश से उद्धृत नहीं, और पूरी तालिका इसी पन्ने पर नीचे है, साथ में यह भी कि सबसे बड़ी बचत उसी फ़ाइल से आती है जिससे आप सबसे कम उम्मीद करेंगे। बदलाव पूरी तरह आपके अपने डिवाइस पर होता है, इसलिए कुछ अपलोड नहीं होता, कुछ कतार में नहीं लगता, और फ़ाइल कभी आपकी मशीन से बाहर नहीं जाती। कोई गुणा या सटीक पिक्सेल चौड़ाई चुनिए, पारदर्शिता के बारे में तय कीजिए, और चित्र उसी माप पर वेक्टर से दोबारा बन जाएगा।
इस टूल का उपयोग कैसे करें
अपनी SVG छोड़ें
ऊपर वाले बक्से पर SVG खींचकर छोड़ें या चुनने के लिए क्लिक करें। प्रति फ़ाइल 5 MB तक, और एक साथ कई भी। कुछ भी बनने से पहले हर फ़ाइल एक्सटेंशन से नहीं, सामग्री से जाँची जाती है।
आउटपुट आकार तय करें
1×, 2×, 4× या अपनी लिखी हुई कोई गुणा चुनिए, या सटीक आकार पर जाकर तय पिक्सेल चौड़ाई दीजिए, अनुपात लॉक के साथ। कलाकृति छोटे रेंडर से खींची नहीं जाती बल्कि उसी माप पर वेक्टर से दोबारा बनती है, इसलिए बारीकी सचमुच बढ़ती है।
पृष्ठभूमि रखें या बदलें
पारदर्शिता डिफ़ॉल्ट रूप से चालू है और WebP उसे ठीक-ठीक रखता है, इसलिए बिना रंगे हिस्से आर-पार दिखते रहते हैं। ठोस रंग पर चपटा करना हो तो टिक हटा दीजिए, और साथ में रंग चुनने वाला दिख जाएगा।
गुणवत्ता तय करें
स्लाइडर 85 पर रहता है, जहाँ WebP का आकार-लाभ सबसे ज़्यादा है और नुक़सान दिखता नहीं। हमारी ग्रेडिएंट वाली परीक्षण फ़ाइल गुणवत्ता 90 पर 3,998 बाइट, 50 पर 1,872 और 20 पर 1,394 निकली, यानी नीचे जाने में कुछ ख़ास बचत नहीं।
बदलें और डाउनलोड करें
“WebP में बदलें” दबाइए। हर फ़ाइल अपनी प्रगति दिखाती है। एक-एक करके डाउनलोड कीजिए, या पूरा जत्था एक ही ZIP संग्रह में ले जाइए।
अक्सर पूछे जाने वाले प्रश्न
WebP असल में PNG से कितना छोटा होता है?
हमने 512 पिक्सेल चौड़ाई और डिफ़ॉल्ट सेटिंग पर तीन फ़ाइलें मापीं। स्ट्रोक वाला एक आइकन PNG में 20.8 KB से घटकर WebP में 3.8 KB हुआ, यानी 81% की बचत। सघन पिक्सेल-आर्ट चिह्न 44.6 KB से 7.0 KB, यानी 84%। ग्रेडिएंट वाला चित्र 152.3 KB से 4.2 KB, पूरे 97%।
ग्रेडिएंट वाली फ़ाइल में बचत इतनी ज़्यादा क्यों है?
क्योंकि मुलायम ग्रेडिएंट PNG के लिए सबसे बुरी स्थिति है। PNG दोहराए गए पिक्सेल पैटर्न ढूँढकर बिना नुक़सान दबाता है, और ग्रेडिएंट में लगभग कुछ नहीं दोहराता, इसलिए वह क़रीब-क़रीब हर पिक्सेल अलग से रखता है। WebP उसी मुलायम ढलान को मुट्ठी भर गुणांकों में लिख देता है - इसीलिए 152 KB गिरकर 4 KB हो जाता है।
क्या WebP पारदर्शिता बनाए रखता है?
हाँ, पूरी तरह। WebP में 8-बिट अल्फ़ा चैनल होता है, इसलिए पारदर्शी और आधी-पारदर्शी जगहें ठीक वैसे ही बचती हैं जैसे PNG में - हम हर आउटपुट पर यह जाँचते हैं। मुलायम छायाएँ और आंशिक अपारदर्शिता सही-सलामत आती हैं। JPG के मुक़ाबले WebP चुनने की मुख्य वजह यही है, क्योंकि JPG में अल्फ़ा है ही नहीं।
यह WebP लॉसी है या लॉसलेस?
लॉसी, उसी गुणवत्ता पर जो आप स्लाइडर से तय करते हैं। यह जान-बूझकर चुना गया है: लॉसलेस WebP PNG से जीतता तो है, पर आम तौर पर 20–30% से, जबकि गुणवत्ता 85 पर लॉसी WebP 80% या उससे ज़्यादा से जीतता है और सामान्य देखने के आकार पर कोई फ़र्क़ नहीं दिखता। अल्फ़ा चैनल दोनों हालात में लॉसलेस ही रहता है।
क्या WebP हर उस जगह चलेगा जहाँ मुझे चाहिए?
वेब पर, हाँ। सभी मौजूदा ब्राउज़र सालों से WebP संभालते हैं, Safari 2020 से। ब्राउज़र के बाहर तस्वीर बिखरी हुई है: कुछ पुराने डेस्कटॉप सॉफ़्टवेयर, प्रिंट वर्कफ़्लो और कुछ अपलोड फ़ॉर्म आज भी इसे ठुकराते हैं। तय करने से पहले मंज़िल जाँच लीजिए और जहाँ न चले वहाँ PNG पर लौट आइए।
WebP के बजाय PNG कब चुनना चाहिए?
जब फ़ाइल ऐसी जगह जा रही हो जो WebP न ले, या जब आपको पिक्सेल-दर-पिक्सेल लॉसलेस आउटपुट चाहिए - जैसे दस्तावेज़ीकरण के लिए स्क्रीनशॉट, या ऐसी कलाकृति जिसे आगे भी कई बार संपादित और सहेजा जाएगा। बार-बार लॉसी एन्कोडिंग जुड़ती जाती है, इसलिए संपादन का मास्टर PNG या मूल SVG में रखिए।
मुझे कौन-सी गुणवत्ता रखनी चाहिए?
जब तक कोई ख़ास वजह न हो, इसे 85 पर ही रहने दीजिए। मध्यम मानों पर WebP JPEG से कहीं बेहतर टिकता है, और 100 तक ले जाने पर फ़ाइल आम तौर पर दोगुनी हो जाती है उस फ़र्क़ के लिए जो आपको दिखेगा नहीं। 60 की ओर सिर्फ़ बड़ी सजावटी पृष्ठभूमि छवियों में जाइए जहाँ पूरी तीक्ष्णता मायने नहीं रखती।
मेरी SVG एनिमेटेड है - क्या WebP भी एनिमेट होगी?
नहीं। WebP एनिमेशन संभालता तो है, पर SVG का एनिमेशन SMIL टैग या CSS में रहता है जो तभी चलता है जब फ़ाइल को दस्तावेज़ माना जाए, छवि नहीं। रेंडर करने पर शुरुआती अवस्था का एक ठहरा हुआ फ़्रेम ही पकड़ा जाता है। हिलती-डुलती चीज़ के लिए अपने डिज़ाइन टूल से वीडियो या एनिमेटेड GIF निर्यात कीजिए।
क्या मुझे अपनी साइट पर सीधे SVG ही नहीं रखनी चाहिए?
अक्सर हाँ। किसी लोगो, आइकन या सपाट चित्र के लिए SVG आम तौर पर उसके किसी भी रास्टर रूप से छोटी होती है, हर ज़ूम पर साफ़ रहती है और CSS से दोबारा सजाई जा सकती है। WebP में तब बदलिए जब तय आकार का रास्टर चाहिए: Open Graph छवियाँ, ईमेल, या कैनवास और गेम की टेक्सचर।
आपको इनकी भी ज़रूरत हो सकती है
कुछ काम नहीं कर रहा? बग रिपोर्ट करें