एक सामान्य वेब पेज पर, डाउनलोड किए गए अधिकांश बाइट्स के लिए छवियां जिम्मेदार होती हैं। यह छवि अनुकूलन को उच्चतम-लीवरेज प्रदर्शन फिक्स बनाता है जिसे आप कर सकते हैं - यह लोड समय को गति देता है, आपके सुधार में सुधार करता है कोर वेब वाइटल्स, और SEO में मदद करता है, क्योंकि Google पेज अनुभव को रैंकिंग सिग्नल के रूप में उपयोग करता है।
क्यों छवियाँ पृष्ठ भार पर हावी हैं
HTML, CSS और JavaScript को आमतौर पर किलोबाइट में मापा जाता है। एक एकल अअनुकूलित हीरो फोटो को मेगाबाइट में मापा जा सकता है। छवि भार को शेव करने का लोड समय पर लगभग किसी भी अन्य परिवर्तन की तुलना में कहीं अधिक बड़ा प्रभाव पड़ता है।
तीन-चरणीय अनुकूलन जो अधिकांश साइटों को ठीक करता है
- 1. आकार बदलें: छवियों को उनके प्रदर्शित आयामों पर प्रदर्शित करें (उच्च-डीपीआई स्क्रीन के लिए ×2) - मूल कैमरा रिज़ॉल्यूशन नहीं।
- 2. सार्वभौमिक आधुनिक-ब्राउज़र समर्थन के साथ, समान दृश्य गुणवत्ता पर WebP JPEG से 25-35% छोटा परिवर्तित करें।
- 3. कंप्रेस:गुणवत्ता 75-82% स्क्रीन पर दिखने में समान है जबकि नाटकीय रूप से हल्की है।
यह कोर वेब वाइटल्स को कैसे मदद करता है
आपका सबसे बड़ा कंटेंटफुल पेंट (एलसीपी) तत्व अक्सर नायक छवि होता है। एक छोटा, उचित आकार का हीरो तेजी से लोड होता है, सीधे एलसीपी में सुधार करता है - कोर वेब वाइटल्स में सबसे अधिक छवि-संवेदनशील। संपीड़न को इसके साथ जोड़ें loading="lazy" तह के नीचे की छवियों और स्पष्ट पर width/height विशेषताएँ आपके सीएलएस स्कोर की भी सुरक्षा करती हैं।
टिप: अपने संपूर्ण छवि फ़ोल्डर को एक बार में बैच-संपीड़ित करें और एक ज़िप डाउनलोड करें। अधिक गहराई से जानने के लिए, वेब के लिए सर्वोत्तम छवि प्रारूप और छवि फ़ाइल का आकार कैसे कम करें पढ़ें।
प्रतिक्रियाशील छवियां न भूलें
कंप्रेस करने के बाद मल्टीपल साइज के साथ सर्व करें srcset इसलिए फ़ोन छोटे संस्करण डाउनलोड करते हैं और डेस्कटॉप बड़े संस्करण डाउनलोड करते हैं। कंप्रेशन प्लस रिस्पॉन्सिव डिलीवरी तेज़, स्पष्ट छवियों के लिए संपूर्ण नुस्खा है।
वेब के लिए छवियों का अनुकूलन कैसे करें
आयाम प्रदर्शित करने के लिए आकार बदलें
कभी भी 4000px की छवि को 800px स्लॉट में न रखें। प्रत्येक छवि का आकार उस सबसे बड़े आकार में बदलें जिस पर वह वास्तव में दिखाई गई है (रेटिना के लिए ×2)।
WebP में कनवर्ट करें और संपीड़ित करें
WebP में कनवर्ट करें और 75-82% गुणवत्ता पर संपीड़ित करें। यह आमतौर पर एक ही लुक में छवि का वजन JPEG से 25-35% कम कर देता है।
अपने संपूर्ण एसेट फ़ोल्डर को बैच-प्रोसेस करें
अपनी सभी साइट छवियां एक साथ डालें और एक ज़िप डाउनलोड करें - फिर अनुकूलित संस्करण भेजें।
🔧 इमेज कंप्रेस करने का प्रयास करें - मुफ़्त, निजी, कोई अपलोड नहीं
अपनी फ़ाइलें छोड़ें और सेकंडों में छोटे संस्करण प्राप्त करें। गुणवत्ता स्लाइडर, प्रारूप स्विचिंग, और बैच प्रोसेसिंग - सब कुछ आपके ब्राउज़र में।
कंप्रेस इमेज खोलें →अक्सर पूछे जाने वाले प्रश्न
छवि संपीड़न मेरी साइट को कितना तेज़ कर सकता है?
बहुत-सी छवियां आमतौर पर पृष्ठ के अधिकांश वजन की होती हैं। आकार बदलने, वेबपी में परिवर्तित करने और संपीड़ित करने से कुल पृष्ठ का आकार आधा या उससे अधिक कम हो सकता है, जिससे सीधे लोड समय में सुधार होगा।
क्या छवि संपीड़न SEO में मदद करता है?
हाँ, अप्रत्यक्ष रूप से। तेज़ पेज और बेहतर कोर वेब वाइटल्स (विशेषकर एलसीपी) Google के पेज-अनुभव संकेतों का हिस्सा हैं।
वेबसाइट छवियों के लिए सबसे अच्छा प्रारूप क्या है?
अधिकांश फ़ोटो और ग्राफ़िक्स के लिए WebP - यह समान गुणवत्ता में JPEG से 25-35% छोटा है और सभी आधुनिक ब्राउज़रों द्वारा समर्थित है।
क्या छवियों को संपीड़ित करने से स्क्रीन पर गुणवत्ता ख़राब होती है?
उचित आकार की छवियों पर गुणवत्ता 75-82% पर, अंतर स्क्रीन पर अदृश्य है जबकि फ़ाइल बहुत हल्की है।