वेबसाइट के लिए पारदर्शी WebP या PNG?

प्रकाशित

WebP और PNG दोनों में बैकग्राउंड पारदर्शी रखा जा सकता है। वेब पेज पर WebP की फ़ाइल छोटी हो सकती है। अगर डिज़ाइन ऐप या साइट PNG माँगती है, तो उसी कटआउट का PNG रखें। दोनों को समान आयाम पर तुलना करें।

इस पेज पर

फ़ाइल साइज़ और पारदर्शिता की तुलना करें

  1. कटआउट खोलें, फ़ाइल के बैकग्राउंड में ‘पारदर्शी’ चुनें और PNG डाउनलोड करें।
  2. फ़ॉर्मैट को WebP पर बदलें और फ्रेम व रिज़ॉल्यूशन वैसे ही रखकर फिर डाउनलोड करें। दोनों फ़ाइलों का साइज़ देखें और उन्हें हल्के व गहरे रंग पर खोलें।
  3. चुनी हुई फ़ाइल किसी ड्राफ़्ट पेज में डालें। प्रीव्यू में किनारे और पारदर्शी जगहें जाँचें। अगर वेबसाइट WebP बदलती है या नहीं लेती, तो PNG आज़माएँ।

छोटी फ़ाइल चुनने से पहले बारीक किनारे देखें

लोगो के अक्षर और पतली रेखाएँ उसी आकार पर देखें जिस पर साइट में दिखेंगी। वह फ़ाइल रखें जिसमें ज़रूरी जानकारी साफ़ रहे और जो साइट में ठीक दिखे। आगे नए आकार में एक्सपोर्ट करने के लिए मूल फ़ाइल भी रखें।

वेबसाइट के ड्राफ़्ट में दोनों फ़ाइल देखें

समान आकार की दो फ़ाइल को अलग रंगों पर रखें। वेबसाइट ने फ़ॉर्मैट बदला तो अपलोड के बाद भी किनारे और पारदर्शिता देखें।

पारदर्शी WebP और PNG आज़माएँ

स्रोत · MDN Web Docs

संबंधित गाइड