अधिकांश छवियां जो किसी वेबसाइट के लिए "बहुत बड़ी" लगती हैं, बुरी तरह से संपीड़ित नहीं होती हैं। वे आवश्यकता से कहीं अधिक चौड़े और लम्बे हैं। फ़ोन से सीधे ली गई एक तस्वीर 4000 पिक्सेल चौड़ी हो सकती है और फिर भी 700 पिक्सेल चौड़े बॉक्स में समाप्त हो सकती है। उस छवि का आकार बदलने से उसके फ़ाइल आकार पर किसी गुणवत्ता स्लाइडर को दबाने की तुलना में कहीं अधिक प्रभाव पड़ता है।
दोनों नौकरियां संबंधित हैं लेकिन समान नहीं हैं। आकार बदलने से पिक्सेल की संख्या बदल जाती है। संपीड़न यह बदलता है कि प्रत्येक पिक्सेल का वर्णन करने के लिए कितना डेटा उपयोग किया जाता है। पहले आयाम ठीक करें, फिर संपीड़ित करें—और आपकी छवियां समान फ़ाइल आकार में बेहतर दिखेंगी।
आयामों से प्रारंभ करें, गुणवत्ता स्लाइडर से नहीं
तय करें कि छवि वास्तव में कितनी चौड़ी दिखाई देगी, फिर उच्च-घनत्व वाली स्क्रीन पर ध्यान दें। यदि आप चाहते हैं कि घने डिस्प्ले वाले फोन और लैपटॉप पर यह तेज रहे तो सीएसएस चौड़ाई से दोगुनी चौड़ाई पर निर्यात करना एक व्यावहारिक नियम है। उदाहरण के लिए, 600-पिक्सेल चौड़ा कार्ड, 1200-पिक्सेल छवि से लाभान्वित होता है।
| जहां यह दिखाई देता है | सबसे लम्बी भुजा | टिप्पणियाँ |
|---|---|---|
| पूर्ण-चौड़ाई वाली नायक छवि | 1600–2000 px | अधिकांश साइटों के लिए 1600 पिक्सेल पर्याप्त है; बड़ा केवल बहुत चौड़ी स्क्रीन पर ही मदद करता है। |
| आलेख मुख्य छवि | 1200 px | 2× घनत्व पर, यह 600 पीएक्स सामग्री कॉलम को कवर करता है। |
| कार्ड या थंबनेल | 600 px | इससे छोटा बड़ा होने पर नरम दिखने लगता है। |
| ईमेल इनलाइन छवि | 800 px | 200 केबी से कम का लक्ष्य रखें; कई ग्राहक वैसे भी बड़ी छवियों को ब्लॉक कर देते हैं। |
| सामाजिक शेयर छवि | 1200 × 630 px | एक सामान्य परिदृश्य अनुपात जो अधिकांश प्लेटफ़ॉर्म अनुमानित रूप से क्रॉप करता है। |
आपको इसकी पूर्ण गणना करने की आवश्यकता नहीं है. यदि मूल 6000 पिक्सेल चौड़ा है और अब तक प्रदर्शित होने वाला सबसे बड़ा आकार 1600 के आसपास है, तो अतिरिक्त पिक्सेल रखने का कोई दृश्य लाभ नहीं है। लंबे पक्ष को कम करना उपलब्ध सबसे बड़ी बचत है।
गुणवत्ता सेटिंग वास्तव में क्या बदलती है
जेपीईजी के लिए, गुणवत्ता मान नियंत्रित करता है कि एनकोडर कितनी आक्रामकता से विवरण फेंकता है कि आंख को नोटिस करने की संभावना कम होती है। यह मूल गुणवत्ता का प्रतिशत नहीं है, और 80 का मतलब "80% उतना अच्छा" नहीं है। यह बस पैमाने पर एक बिंदु है जहां कम मान छोटी फ़ाइलें और अधिक दृश्यमान कलाकृतियाँ उत्पन्न करते हैं।
- लगभग 80-85 यह उन तस्वीरों के लिए एक आरामदायक रेंज है जिन्हें साफ़ दिखने की आवश्यकता है। सामान्य दृश्य आकार में मूल से अंतर देखना आम तौर पर कठिन होता है।
- लगभग 70-78 उन वेब छवियों के लिए अच्छा काम करता है जो एक लेआउट में बैठती हैं और जिनकी कभी बारीकी से जांच नहीं की जाती है। फ़ाइल का आकार काफ़ी कम हो जाता है।
- लगभग 60 से नीचे, कलाकृतियों को पहचानना आसान हो जाता है: चिकने आसमान में अवरुद्ध पैच, किनारों के चारों ओर प्रभामंडल, और अस्पष्ट पाठ। प्रकार वाले स्क्रीनशॉट या ग्राफ़िक्स के लिए, इतना नीचे जाने से बचें।
JPEG कम्प्रेशन भी कंपाउंड करता है। पहले से सहेजे गए JPEG को निम्न गुणवत्ता पर सहेजने से मूल विवरण फिर से प्रकट नहीं होता है; यह हानि की दूसरी परत जोड़ता है। आपके पास जो सबसे अच्छी कॉपी है उससे शुरुआत करें और एक बार अपनी ज़रूरत के आकार में निर्यात करें।
पीएनजी दोषरहित है, इसलिए गुणवत्ता वाला स्लाइडर लागू नहीं होता है। फोटोग्राफिक सामग्री के लिए पीएनजी आम तौर पर जेपीईजी से बड़ा होगा, लेकिन यह तेज किनारों और पारदर्शिता को बरकरार रखता है। WebP का उपयोग हानिपूर्ण या हानिरहित मोड में किया जा सकता है; समान गुणवत्ता पर, हानिपूर्ण वेबपी अक्सर जेपीईजी से छोटा होता है, हालांकि पुराने सॉफ़्टवेयर के साथ संगतता थोड़ी संकीर्ण होती है।
इसे बेहतर बनाने से पहले प्रारूप चुनें
प्रारूप का चुनाव संपीड़न सेटिंग्स से कहीं अधिक महत्वपूर्ण है। तस्वीरों, फोटोग्राफिक सामग्री वाले स्क्रीनशॉट और किसी भी छवि के लिए जेपीईजी या हानिपूर्ण वेबपी का उपयोग करें जहां निरंतर टोन मायने रखते हैं। फ्लैट-रंगीन ग्राफिक्स, लोगो, इंटरफ़ेस स्क्रीनशॉट और पारदर्शी पृष्ठभूमि की आवश्यकता वाली किसी भी चीज़ के लिए पीएनजी का उपयोग करें। JPEG में कोई पारदर्शिता नहीं है; जब कट-आउट पृष्ठभूमि वाली छवि को JPEG के रूप में सहेजा जाता है, तो वे क्षेत्र आमतौर पर सफेद रंग से भर जाते हैं।
एक सामान्य गलती टेक्स्ट के स्पष्ट स्क्रीनशॉट को JPEG के रूप में सहेजना है। संपीड़न अक्षरों के चारों ओर हल्का प्रभामंडल और धब्बा बनाता है, जिससे मध्यम सेटिंग पर भी छवि की गुणवत्ता कम महसूस होती है। पीएनजी या वेबपी प्रकार को साफ़ रखेगा और अक्सर इस प्रकार की सामग्री के लिए एक छोटी फ़ाइल तैयार करेगा। इसमें एक करीबी तुलना है जेपीजी, पीएनजी, या वेबपी?
एक समझदार कार्यप्रवाह
- मूल रखें. एक कॉपी से काम करें और जिस फोटो की आप परवाह करते हैं उसके एकमात्र संस्करण को कभी भी ओवरराइट न करें।
- इसे दिखाए जाने वाले सबसे बड़े आकार में बदलें। यदि आप चाहते हैं कि उच्च-घनत्व वाली स्क्रीन तेज बनी रहे, तो लेआउट की चौड़ाई का दोगुना उपयोग करें। केवल एक नंबर हिट करने के लिए क्रॉप या स्ट्रेच न करें; जब तक संरचना में बदलाव की आवश्यकता न हो, पक्षानुपात बनाए रखें।
- सामग्री के आधार पर प्रारूप चुनें. फोटो: जेपीईजी या वेबपी। फ़्लैट ग्राफ़िक या पारदर्शिता: PNG या WebP.
- गुणवत्ता 80 से प्रारंभ करें. यदि आप अनिश्चित हैं तो इसकी तुलना 75 और 85 से करें। केवल तभी नीचे जाएँ जब छवि अभी भी उस आकार में बनी रहे जिस आकार में लोग उसे देखेंगे।
- इसे 100% और लेआउट आकार पर देखें। ज़ूम आउट करने पर, लगभग सब कुछ ठीक दिखता है। ज़ूम इन करने पर, आप किनारों और चेहरों के आसपास कलाकृतियाँ देख सकते हैं। दोनों की जांच करें.
साथ छवि कंप्रेसर, सबसे लंबी साइड कैप और गुणवत्ता मान एक साथ दिखाई देते हैं, इसलिए आप संयोजन का परीक्षण कर सकते हैं और डाउनलोड करने से पहले पहले और बाद के आकार की तुलना कर सकते हैं। रीसाइज़र यह बेहतर विकल्प है जब आयाम सटीक होने की आवश्यकता होती है, जिसमें प्रतिशत स्केलिंग और निश्चित पहलू अनुपात शामिल हैं।
सामान्य गलतियाँ, और इसके बजाय क्या करें
आकार बदलने से पहले संपीड़ित करना
गुणवत्ता 50 पर 6000-पिक्सेल फोटो को सहेजने से एक फ़ाइल बनती है जो अभी भी बड़ी है, अब दृश्यमान क्षति के साथ। पहले आकार बदलें, फिर संपीड़ित करें. वही फ़ोटो 1600 पिक्सेल और गुणवत्ता 80 पर आमतौर पर बेहतर दिखेगी और उसका वज़न भी कम होगा।
सबसे छोटी संभव फ़ाइल का पीछा करना
"छोटा" अपने आप में लक्ष्य नहीं है। एक उत्पाद फोटो जो गुणवत्ता 40 पर मैला दिखता है, गुणवत्ता 78 पर एक से छोटा हो सकता है, लेकिन यह पृष्ठ पर भी खराब दिखता है। काफी छोटा करने का लक्ष्य रखें: पिक्सेल या मेगाबाइट बर्बाद किए बिना, दिखाए गए आकार में स्पष्ट।
पारदर्शिता को JPEG में परिवर्तित करना
यदि किसी लोगो की पृष्ठभूमि पारदर्शी है, तो JPEG उसे सफेद रंग से भर देगा। रंगीन पृष्ठ पर, वह एक स्पष्ट बॉक्स के रूप में दिखाई देता है। पीएनजी या वेबपी रखें, या एक विशिष्ट पृष्ठभूमि रंग के लिए डिज़ाइन किया गया संस्करण तैयार करें।
एक ही JPEG को बार-बार दोबारा सेव करना
प्रत्येक हानिपूर्ण बचत कलाकृतियाँ जोड़ती है। बैच संपादन मूल फ़ाइल से शुरू होना चाहिए, न कि अंतिम निर्यातित संस्करण से। एक उच्च-गुणवत्ता वाला मास्टर रखें और उससे वेब संस्करण तैयार करें।
मेटाडेटा भूल जाना
तस्वीरें अपने मेटाडेटा में कैमरा विवरण और स्थान डेटा ले जा सकती हैं। कैनवास के माध्यम से पुनः एन्कोडिंग, जैसा कि Lovely Tools करता है, उस संलग्न मेटाडेटा के बिना एक ताज़ा छवि तैयार करता है। यह अक्सर गोपनीयता के लिए अच्छा होता है, लेकिन इसका मतलब यह भी है कि यदि आपको अभिलेखीय या व्यावसायिक कारणों से मेटाडेटा की आवश्यकता है तो आपको मूल रखना चाहिए। आधुनिक ब्राउज़र किसी फ़ोटो को खींचते समय उसका ओरिएंटेशन लागू करते हैं, इसलिए पोर्ट्रेट फ़ोटो किनारे से नहीं आनी चाहिए।
जहां संपीड़न होता है
Lovely Tools में, छवि को आपके ब्राउज़र द्वारा डिकोड किया जाता है, चुने हुए आयामों पर एक कैनवास पर खींचा जाता है, और एक नई फ़ाइल के रूप में फिर से एन्कोड किया जाता है। कुछ भी अपलोड नहीं किया गया है. मूल अछूता रहता है, और संपीड़ित प्रतिलिपि केवल ब्राउज़र टैब में तब तक मौजूद रहती है जब तक आप इसे डाउनलोड नहीं करते।
वह सीमाएँ भी स्पष्ट करता है। सारा काम आपके डिवाइस की मेमोरी में होता है, इसलिए फ़ोन पर अत्यधिक बड़ी छवियां या बड़े बैच धीमे हो सकते हैं। ब्राउज़र के कैनवास इंजन का आकार भी अधिकतम होता है। यदि कोई छवि बहुत बड़ी है, तो उपकरण चुपचाप खराब परिणाम देने के बजाय छोटे आयाम के लिए पूछेगा।
इसे आज़माने के लिए तैयार हैं? किसी छवि को संपीड़ित करें या पढ़ें स्थानीय स्तर पर चलने का वास्तव में क्या मतलब है.