लेख
गति और Core Web Vitals के लिए वेबसाइट मीडिया को ऑप्टिमाइज़ करें
इमेज और वीडियो आमतौर पर किसी वेब पेज के कुल भार का 60 से 80 प्रतिशत हिस्सा होते हैं. इन्हें सही करना लोडिंग गति, Core Web Vitals स्कोर और सर्च रैंकिंग के लिए सबसे ज़्यादा प्रभाव डालने वाली एकमात्र चीज़ है. अच्छी खबर यह है: इसमें से किसी के लिए भी विशेष सॉफ्टवेयर या सर्वर की ज़रूरत नहीं, और आपकी फाइलों को कभी आपके डिवाइस से बाहर जाने की ज़रूरत नहीं.
किसी भी चीज़ से पहले सही फॉर्मैट चुनें
फॉर्मैट का चुनाव किसी भी गुणवत्ता स्लाइडर से ज़्यादा मायने रखता है. किसी वेब पेज पर फोटो के लिए, WebP सही डिफ़ॉल्ट है: यह समान दृश्य गुणवत्ता पर JPEG से 25 से 35 प्रतिशत छोटा होता है और हर आधुनिक ब्राउज़र इसका समर्थन करता है. AVIF इससे भी आगे कंप्रेस करता है, JPEG से 50 प्रतिशत तक बेहतर, धीमी एन्कोडिंग की कीमत पर. उन हीरो इमेज और प्रोडक्ट फोटो के लिए AVIF का उपयोग करें जिन्हें आप एक बार कंप्रेस करते हैं; जो कुछ भी आप बैच में प्रोसेस करते हैं या जल्दी चाहिए उसके लिए WebP का उपयोग करें. PNG की जगह केवल वहीं है जहां आपको लॉसलेस सटीकता या पारदर्शी बैकग्राउंड चाहिए. लोगो, आइकन और चित्रण के लिए SVG ही एकमात्र समझदार विकल्प है: यह किसी भी आकार तक स्केल होता है और अक्सर कुछ किलोबाइट का होता है जबकि किसी रास्टराइज़्ड समकक्ष के लिए सैकड़ों किलोबाइट लगते हैं.
बिना दिखने वाली गुणवत्ता खोए इमेज कंप्रेस करें
वास्तविक प्रदर्शन आयामों तक रीसाइज़ करके शुरुआत करें: 1280 पिक्सेल चौड़ी प्रदर्शित होने वाली हीरो इमेज को 4000 पिक्सेल डेटा की ज़रूरत नहीं. पहले रीसाइज़ करें, फिर कंप्रेस करें. फोटो के लिए, WebP या JPEG में गुणवत्ता 80 व्यावहारिक न्यूनतम है जिसके नीचे सामान्य दर्शक फर्क महसूस करने लगते हैं, इसलिए 75 से 85 का लक्ष्य रखें और प्रकाशित करने से पहले आउटपुट को पूरे ज़ूम पर देखें. टेक्स्ट और सपाट क्षेत्रों वाले ग्राफिक्स के लिए, PNG लॉसलेस या SVG उस तीखेपन को बनाए रखता है जिसे लॉसी फॉर्मैट धुंधला कर देते हैं. इस साइट का इमेज कंप्रेसर इन सभी फॉर्मैट को संभालता है, पूरी तरह आपके ब्राउज़र में चलता है, और समर्पित डेस्कटॉप टूल जैसे ही एल्गोरिदम लागू करता है.
बिना अपलोड किए वेब के लिए वीडियो कन्वर्ट करें
बैकग्राउंड लूप और एम्बेड किए गए वीडियो वहीं हैं जहां वेब मीडिया ऑप्टिमाइज़ेशन अक्सर अधूरा रह जाता है. H.264 के साथ एक MP4 हर जगह चलता है, लेकिन VP9 के साथ एक WebM समान गुणवत्ता पर 20 से 40 प्रतिशत छोटा होता है, जो सीमित कनेक्शन वाले मोबाइल उपयोगकर्ताओं के लिए मायने रखता है. व्यावहारिक तरीका यह है कि एक बार WebM में कन्वर्ट करें, इसे वीडियो एलिमेंट में पसंदीदा स्रोत के रूप में परोसें, और MP4 को फॉलबैक के रूप में रखें. यहां का वीडियो कन्वर्टर WebAssembly में संकलित FFmpeg का उपयोग करता है: कन्वर्ज़न आपके ब्राउज़र के भीतर चलता है, कुछ भी अपलोड नहीं होता, और किसी भी आकार की फाइलें तब तक काम करती हैं जब तक आपके डिवाइस में पर्याप्त मेमोरी है. इनलाइन बैकग्राउंड वीडियो के लिए, एन्कोडिंग से पहले मृत सेकंड काटने के लिए वीडियो ट्रिमर पर भी विचार करें: फाइल आकार का सबसे बड़ा कारक अवधि होती है.
इनलाइन एसेट: base64 और SVG
HTML या CSS में सीधे base64 स्ट्रिंग के रूप में एम्बेड की गई बहुत छोटी इमेज, आइकन और फ़ेविकॉन प्रति एसेट एक नेटवर्क राउंड-ट्रिप समाप्त कर देती हैं. यह उन एसेट के लिए समझदारी है जो लगभग 2 KB से कम हैं और हर पेज पर दिखती हैं, जैसे एक लोगो स्प्राइट या लोडिंग संकेतक. बड़े एसेट को अलग फाइलों के रूप में ही रहना चाहिए क्योंकि base64, बाइनरी से 33 प्रतिशत बड़ा एन्कोड होता है, और ब्राउज़र फाइल संदर्भों को कैश करते हैं लेकिन इनलाइन डेटा को स्वतंत्र रूप से नहीं. SVG ऑप्टिमाइज़र, एक्सपोर्ट किए गए SVG से एडिटर का कचरा हटाता है बिना दृश्य आउटपुट को छुए. image-to-base64 कन्वर्टर आपके ब्राउज़र में चिपकाने के लिए तैयार data URI तैयार करता है.
इस लेख में उल्लेखित टूल्स
- इमेज संपीड़ित करें बिना अपलोड किए इमेज का फ़ाइल आकार कम करें। गुणवत्ता स्लाइडर या KB में लक्ष्य आकार। बैच समर्थित।
- छवियाँ रीसाइज़ करें अपनी छवियों (JPEG, PNG, WebP) को अपलोड किए बिना रीसाइज़ और कन्वर्ट करें।
- SVG ऑप्टिमाइज़र SVGO के साथ सीधे अपने ब्राउज़र में SVG फ़ाइलें अनुकूलित और minify करें। कोई अपलोड नहीं।
- वीडियो कन्वर्टर अपने ब्राउज़र में MP4, WebM, MKV और MOV (H.264/H.265/VP9) के बीच वीडियो बदलें। कोई अपलोड नहीं।
- Image से Base64 छवियों को सीधे अपने ब्राउज़र में Base64 data URI में (और वापस) बदलें। कॉपी करें, CSS स्निपेट, कोई अपलोड नहीं।
अक्सर पूछे जाने वाले सवाल
क्या इमेज कंप्रेशन मेरी सर्च रैंकिंग को प्रभावित करता है?
Google, Core Web Vitals का उपयोग एक रैंकिंग संकेत के रूप में करता है, और Largest Contentful Paint लगभग हमेशा एक इमेज या वीडियो पोस्टर होता है. वह पेज जिसकी हीरो इमेज एक सेकंड से कम में लोड होती है, उससे बेहतर स्कोर करता है जहां इसमें तीन सेकंड लगते हैं. कंप्रेशन और सही फॉर्मैट सीधे इस मेट्रिक को प्रभावित करते हैं, इसलिए हां, इमेज ऑप्टिमाइज़ेशन का मापने योग्य SEO प्रभाव होता है. यह प्रभाव मोबाइल पर सबसे ज़्यादा होता है, जहां कनेक्शन धीमे होते हैं और भारी इमेज का दंड बड़ा होता है.
वेब सेवा के बजाय मीडिया को स्थानीय रूप से क्यों प्रोसेस करें?
ज़्यादातर ऑनलाइन मीडिया टूल आपकी फाइलों को किसी दूरस्थ सर्वर पर अपलोड करवाते हैं, जिसमें समय लगता है, बैंडविड्थ खर्च होती है, और इसका मतलब है कि आपकी फाइल की एक प्रति ऐसे बुनियादी ढांचे पर मौजूद है जिसे आप नियंत्रित नहीं करते. इस साइट के टूल पूरी तरह आपके ब्राउज़र में चलते हैं: आपकी इमेज और वीडियो आपके डिवाइस पर प्रोसेस होते हैं और आउटपुट सीधे डाउनलोड हो जाता है. कोई खाता नहीं, कोई अपलोड इंतज़ार नहीं, और आपकी फाइलों के बारे में कुछ भी कभी किसी सर्वर पर नहीं भेजा जाता.