वेब के लिए छवि अनुकूलन: संपूर्ण मार्गदर्शिका
धीमे पेज लोड से रूपांतरण समाप्त हो जाते हैं। अध्ययनों से पता चलता है कि 40% उपयोगकर्ता 3 सेकंड से अधिक समय लेने वाली साइट को छोड़ देते हैं। सबसे बड़ा कारण? अअनुकूलित छवियाँ. आपके होमपेज पर एक 5 एमबी फोटो तेज कनेक्शन पर भी लोड समय को बढ़ा सकता है।
छवि अनुकूलन चेकलिस्ट
- सही आयाम - जहां आप 800px प्रदर्शित करते हैं, वहां 4000px की छवि न भेजें
- सही प्रारूप - आधुनिक WebP/AVIF, फ़ॉलबैक JPG/PNG
- सही संपीड़न - फ़ोटो के लिए 75-85% गुणवत्ता, ग्राफ़िक्स के लिए दोषरहित
- सही डिलीवरी — आलसी लोडिंग, रिस्पॉन्सिव srcset
2026 में अनुशंसित आयाम
- हीरो छवियां: 1920×1080 (पूर्ण HD) या 2560×1440 (2K) अधिकतम
- ब्लॉग पोस्ट हीरो: 1200×675 (16:9)
- उत्पाद फ़ोटो: ज़ूम समर्थन के साथ 1500×1500, 800×800 डिफ़ॉल्ट डिस्प्ले
- अवतार: 256×256 (थंबनेल डाउनस्केल होंगे)
- ओपन ग्राफ़ (सोशल शेयर): 1200×630
- फ़ेविकॉन: 32×32, 192×192, 512×512 पीएनजी
अपलोड करने से पहले हमारे image resize टूल के साथ इन आयामों में फ़ोटो का आकार बदलें।
प्रारूप: कब क्या उपयोग करना है
- वेबपी: 95% वेब छवियों के लिए डिफ़ॉल्ट। समान गुणवत्ता पर JPG से 25-35% छोटा। यूनिवर्सल ब्राउज़र समर्थन.
- AVIF: इससे भी छोटा (JPG से 50% छोटा)। नायक छवियों के लिए उपयोग करें. नए ब्राउज़र इसका समर्थन करते हैं।
- JPG: बिना पारदर्शिता वाली तस्वीरें। उत्कृष्ट अनुकूलता.
- PNG: लोगो, स्क्रीनशॉट, पारदर्शिता के साथ कुछ भी। दोषरहित.
- एसवीजी: वेक्टर ग्राफिक्स, आइकन, सरल चित्र। छोटी फ़ाइल का आकार, अनंत स्केलिंग।
इन प्रारूपों के बीच PDF7 Image Convert के साथ कनवर्ट करें।
संपीड़न: कितना आक्रामक कितना आक्रामक है?
फ़ोटो के लिए: 85% गुणवत्ता से प्रारंभ करें। बैंडविड्थ-महत्वपूर्ण पृष्ठों के लिए 75% तक कम करें। 70% से नीचे, कलाकृतियाँ दृश्यमान हो जाती हैं। सही संतुलन खोजने के लिए हमारे इमेज कंप्रेस टूल का उपयोग करें।
srcset के साथ प्रतिक्रियाशील छवियां
फ़ोन पर 2K छवि न दिखाएं. HTML की srcset विशेषता का उपयोग करें:
ब्राउज़र सबसे छोटी छवि चुनता है जो फिट बैठती है। आपको प्रति छवि 3 आकारों की आवश्यकता होगी।
आलसी लोडिंग
फ़ोल्ड के नीचे की सभी छवियों में loading="lazy" जोड़ें। आधुनिक ब्राउज़र उन्हें तब तक लोड नहीं करते जब तक उपयोगकर्ता पास स्क्रॉल नहीं करता, जिससे प्रत्येक पृष्ठ लोड पर बैंडविड्थ की बचत होती है।
100KB नियम
100KB से कम की व्यक्तिगत छवियों का लक्ष्य रखें। हीरो की छवियां 200KB तक फैल सकती हैं। यदि एक भी फोटो 500KB से अधिक है, तो आपने गड़बड़ कर दी है - पुनः आकार बदलें और पुनः संपीड़ित करें।
