ईमेल न्यूजलेटर इमेज साइज और वेट लिमिट
Gmail 102 KB से बड़े संदेशों को काट देता है, और आमतौर पर इसका कारण छवियां होती हैं। प्रत्येक क्लाइंट क्या सहन करता है और इसके भीतर कैसे रहें।
प्रत्येक न्यूज़लेटर छवि को 100 KB से कम रखें, छवियों का आकार उनकी प्रदर्शन चौड़ाई से दोगुना करें, और WebP के बजाय JPG या PNG का उपयोग करें। Gmail किसी भी ऐसे संदेश को छोटा कर देता है जिसका Hypertext Markup Language (HTML) लगभग 102 KB से अधिक हो जाता है, और शेष भाग को View entire message लिंक से बदल देता है।
अधिकांश प्रेषक इस काटने की सीमा को कठिन तरीके से सीखते हैं, आमतौर पर तब जब अनसब्सक्राइब लिंक और ट्रैकिंग पिक्सेल इस सीमा के नीचे चले जाते हैं। अक्सर छवियां ही इसका कारण होती हैं, या तो इसलिए कि वे सीधे संदेश में एम्बेड की गई होती हैं या फिर उनके आस-पास का मार्कअप कई अभियानों के दौरान बढ़ गया होता है।
Gmail की काटने की सीमा वास्तव में क्या मापती है
Gmail संदेश के HTML स्रोत को मापता है, न कि उन छवियों को जिनसे वह लिंक करता है। 10 बड़ी तस्वीरों को लिंक करने वाला न्यूज़लेटर सीमा के भीतर रहता है, जबकि भारी इनलाइन स्टाइलिंग और एम्बेडेड छवियों वाला संदेश ऐसा नहीं कर पाता।
यह अंतर महत्वपूर्ण है क्योंकि इसका समाधान अलग है। लिंक की गई छवियां 102 KB के आंकड़े में नहीं गिनी जाती हैं, इसलिए काटना आमतौर पर बार-बार उपयोग की जाने वाली इनलाइन शैलियों, प्रत्येक लिंक पर लंबे ट्रैकिंग पैरामीटर, या base64 डेटा के रूप में एम्बेड की गई छवियों के कारण होता है। एम्बेडेड छवियों को हटाने और मार्कअप को छोटा करने से कटने की समस्या हल हो जाती है, जबकि लिंक की गई तस्वीरों को कंप्रेस करने से लोड होने का समय सुधरता है।
ईमेल के लिए अनुशंसित छवि आकार
ईमेल बॉडी को 600 पिक्सेल चौड़ा डिज़ाइन करें और उच्च घनत्व वाली स्क्रीन के लिए छवियों को 1200 पिक्सेल पर निर्यात करें। 600 पिक्सेल का मानक वर्षों से चला आ रहा है क्योंकि यह बिना क्षैतिज स्क्रॉलिंग के प्रत्येक डेस्कटॉप क्लाइंट पूर्वावलोकन फलक में फिट बैठता है।
| प्लेसमेंट | प्रदर्शन चौड़ाई | निर्यात चौड़ाई | लक्षित फ़ाइल आकार |
|---|---|---|---|
| पूर्ण चौड़ाई हेडर | 600 px | 1200 px | 80 KB से 100 KB |
| बॉडी के अंदर की तस्वीर | 600 px | 1200 px | 60 KB से 100 KB |
| दो कॉलम वाली छवि | 280 px | 560 px | 30 KB से 50 KB |
| उत्पाद थंबनेल | 150 px | 300 px | 15 KB से 25 KB |
| लोगो | 200 px | 400 px | 20 KB से कम |
निर्यात चौड़ाई को दोगुना करने से उच्च घनत्व वाले डिस्प्ले कवर हो जाते हैं और यह पर्याप्त है। प्रदर्शन चौड़ाई से 3 गुना पर निर्यात करने से ऐसा भार बढ़ता है जिसे कोई भी ईमेल क्लाइंट बेहतर तरीके से रेंडर नहीं करता है, और ईमेल ही एकमात्र ऐसा माध्यम है जहां प्रत्येक किलोबाइट फोन पर डाउनलोड होता है।
ईमेल में WebP अभी भी गलत विकल्प क्यों है
WebP के लिए ईमेल क्लाइंट का समर्थन अभी भी असमान है, और विशेष रूप से Outlook अप्रत्याशित रहता है। ईमेल उन कुछ जगहों में से एक है जहां पुराने सुरक्षित प्रारूप ही सही विकल्प हैं।
वेब ब्राउज़र सभी WebP का समर्थन करते हैं, जिससे लोग यह मान लेते हैं कि ईमेल क्लाइंट भी ऐसा करते हैं। डेस्कटॉप Outlook संदेशों को पूरी तरह से अलग इंजन के साथ रेंडर करता है, और कई कॉर्पोरेट मेल सिस्टम उन प्रारूपों को हटा देते हैं या उन पर विफल हो जाते हैं जिन्हें वे नहीं पहचानते हैं। न्यूज़लेटर में एक टूटी हुई छवि उस 30 प्रतिशत फ़ाइल बचत की तुलना में कहीं अधिक नुकसानदेह है जो WebP प्रदान करता है, इसलिए यहाँ JPG और PNG ही सही बने हुए हैं।
ईमेल के भीतर प्रारूप का चयन
तस्वीरों के लिए JPG और लोगो, बटन और टेक्स्ट वाली किसी भी चीज़ के लिए PNG का उपयोग करें। नियम वही है जो वेब पर है, और इसके परिणाम अधिक दिखाई देते हैं क्योंकि ईमेल छवियां अक्सर छोटी होती हैं।
- उत्पाद तस्वीरों, हेडर इमेजरी और किसी भी वास्तविक दृश्य की तस्वीर के लिए JPG।
- लोगो, आइकन और फ्लैट रंग या तीखे टेक्स्ट किनारों वाले ग्राफिक्स के लिए PNG।
- एनिमेटेड GIF केवल तभी जब एनीमेशन का कोई अर्थ हो, और इसे 1 MB से कम रखा जाए।
- WebP और AVIF से बचें, क्योंकि दोनों ही सभी मेल क्लाइंट्स पर विश्वसनीय रूप से रेंडर नहीं होते हैं।
- SVG से पूरी तरह बचें, क्योंकि अधिकांश ईमेल क्लाइंट सुरक्षा कारणों से इसे ब्लॉक कर देते हैं।
कई क्लाइंट्स में छवियां डिफ़ॉल्ट रूप से ब्लॉक होती हैं
कई प्राप्तकर्ता आपके ईमेल को छवियों के बंद होने पर देखते हैं, इसलिए संदेश को अभी भी टेक्स्ट के रूप में काम करना चाहिए। कॉर्पोरेट मेल सिस्टम और गोपनीयता के प्रति जागरूक उपयोगकर्ता दोनों ही रिमोट छवियों को तब तक ब्लॉक करते हैं जब तक कि पाठक उन्हें लोड करना न चुने।
प्रत्येक छवि पर alt टेक्स्ट लिखें, क्योंकि ब्लॉक की गई छवियां इसके बजाय उस टेक्स्ट को प्रदर्शित करती हैं। कभी भी आवश्यक जानकारी, जिसमें ऑफ़र, समय सीमा या कॉल टू एक्शन शामिल है, केवल एक छवि के भीतर न रखें। पूरी तरह से एक बड़े ग्राफिक से बना न्यूज़लेटर सूची के एक महत्वपूर्ण हिस्से के लिए एक खाली आयत बन जाता है, और यह स्क्रीन रीडर्स के साथ भी खराब प्रदर्शन करता है।
न्यूज़लेटर छवियों को कैसे तैयार करें
न्यूज़लेटर को तेज़ और पठनीय बनाए रखने के लिए, इन 7 चरणों का पालन करें।
- ईमेल को 600 पिक्सेल चौड़ा डिज़ाइन करें, जिसे प्रत्येक डेस्कटॉप क्लाइंट बिना स्क्रॉलिंग के रेंडर करता है।
- प्रत्येक छवि को उसी सटीक आकार में क्रॉप करें जो वह लेआउट में लेगी।
- प्रदर्शन चौड़ाई से दोगुने आकार में बदलें, और उससे आगे नहीं।
- तस्वीरों के लिए JPG या टेक्स्ट वाले ग्राफिक्स के लिए PNG में बदलें।
- प्रत्येक फ़ाइल को 100 KB से कम के लक्ष्य पर कंप्रेस करें।
- छवियों को संदेश में एम्बेड करने के बजाय अपने सेंडिंग प्लेटफॉर्म या अपने स्वयं के सर्वर पर होस्ट करें।
- अभियान को शेड्यूल करने से पहले Gmail, Outlook और एक फोन पर एक परीक्षण भेजें।
ईमेल का कुल वजन किसी भी एकल छवि से अधिक मायने रखता है
छवियों सहित पूरे संदेश को 600 KB से कम रखें, क्योंकि ग्राहक फोन पर न्यूज़लेटर खोलते हैं, अक्सर खराब कनेक्शन पर। 5 MB का न्यूज़लेटर धीरे-धीरे लोड होता है और रेंडर होने से पहले ही बंद कर दिया जाता है।
किसी भी चीज़ को कंप्रेस करने से पहले छवियों की गणना करें। 100 KB की 12 तस्वीरें ले जाने वाला न्यूज़लेटर पहले से ही 1.2 MB पर है, जो यह दर्शाता है कि लेआउट को छोटी छवियों के बजाय कम छवियों की आवश्यकता है। छवियों की संख्या कम करने से आमतौर पर प्रदर्शन और पठनीयता दोनों में सुधार होता है, क्योंकि लंबे और छवियों से भरे न्यूज़लेटर शायद ही कभी अंत तक पढ़े जाते हैं।
डार्क मोड बदल देता है कि छवियां कैसी दिखती हैं
कई क्लाइंट डार्क मोड में रंगों को उलट देते हैं या समायोजित करते हैं, और सफेद पृष्ठभूमि पर एक लोगो डार्क संदेश में एक चमकीला आयत बन जाता है। भेजने से पहले डार्क मोड में प्रत्येक अभियान का परीक्षण करें।
लोगो और आइकन के लिए पारदर्शी पृष्ठभूमि वाली PNG फ़ाइलों का उपयोग करें ताकि वे दोनों में से किसी भी रंग पर सही ढंग से बैठें। सफेद पृष्ठभूमि वाली छवियों से बचें जहां डिज़ाइन यह मान लेता है कि उनके पीछे का पेज भी सफेद है। तस्वीरें आम तौर पर सुरक्षित होती हैं, क्योंकि क्लाइंट शायद ही कभी फोटोग्राफिक सामग्री को बदलते हैं, जबकि फ्लैट ग्राफिक्स और टेक्स्ट छवियों में डार्क मोड की समस्याएं दिखाई देती हैं।
रेटिना स्क्रीन और छवि स्पष्टता
प्रदर्शन चौड़ाई से दोगुनी चौड़ाई पर निर्यात करें ताकि छवियां उच्च घनत्व वाली स्क्रीन पर स्पष्ट रहें, फिर अतिरिक्त पिक्सेल की भरपाई के लिए अधिक कंप्रेस करें। गुणवत्ता 70 पर 1200 पिक्सेल की छवि आमतौर पर गुणवत्ता 95 पर 600 पिक्सेल की छवि की तुलना में बेहतर दिखती है और उसका वजन कम होता है।
मार्कअप में चौड़ाई विशेषता को फ़ाइल आकार के बजाय प्रदर्शन आकार पर सेट करें, ताकि क्लाइंट अतिरिक्त विवरण का उपयोग करते हुए छवि को 600 पिक्सेल पर रेंडर करे। चौड़ाई विशेषता को छोड़ने से कुछ क्लाइंट छवि को उसके पूर्ण पिक्सेल आकार में प्रदर्शित करते हैं, जिससे डेस्कटॉप पर लेआउट टूट जाता है।
भेजने से पहले अभियान की जाँच करना
- Gmail, Outlook, Apple Mail और कम से कम एक फोन पर एक परीक्षण भेजें।
- छवियों के ब्लॉक होने पर परीक्षण देखें, यह पुष्टि करते हुए कि संदेश अभी भी समझ में आता है।
- जांचें कि संदेश Gmail में कटा हुआ तो नहीं है, जो कटने पर View entire message लिंक दिखाता है।
- पुष्टि करें कि प्रत्येक छवि में alt टेक्स्ट है जो यह बताता है कि वह क्या दिखाती है।
- डार्क मोड रेंडरिंग की जांच करें, विशेष रूप से लोगो और फ्लैट ग्राफिक्स के लिए।
- सभी छवियों का कुल वजन जोड़ें और पुष्टि करें कि यह 600 KB से कम रहता है।
एक बैच में अभियान तैयार करना
न्यूज़लेटर में प्रत्येक छवि को एक साथ संसाधित करें ताकि पूरा अभियान एक ही विनिर्देश साझा करे। एक न्यूज़लेटर में आमतौर पर 5 से 15 छवियां होती हैं, और एक साप्ताहिक प्रेषक एक वर्ष में सैकड़ों छवियां तैयार करता है।
चौड़ाई और KB लक्ष्य को एक बार सेट करें, छवियों को छोड़ें, और प्रत्येक फ़ाइल मिलान होकर वापस आती है। सब कुछ आपके अपने प्रोसेसर पर आपके ब्राउज़र के अंदर चलता है, इसलिए अघोषित ऑफ़र, छवियों के रूप में रेंडर की गई ग्राहक सूचियां और क्लाइंट अभियान कार्य कभी भी सर्वर तक नहीं पहुंचते हैं। लॉन्च की तैयारी करने वाली एजेंसी के लिए, उन फ़ाइलों को स्थानीय रखना उस प्रकटीकरण से बचाता है जिसे कोई भी कंप्रेशन बचत उचित नहीं ठहरा सकती।
प्रत्येक आवर्ती लेआउट ब्लॉक के लिए सही आकार के प्लेसहोल्डर्स का एक टेम्प्लेट फ़ोल्डर रखें, जैसे कि हेडर, 2 कॉलम उत्पाद पंक्ति और पाद लेख लोगो। साप्ताहिक प्रेषक अनिश्चित काल तक उन्हीं 4 या 5 आकृतियों का पुन: उपयोग करते हैं, और नए आर्टवर्क को मौजूदा विनिर्देश से मिलाना हर अभियान के लिए फिर से आयाम तय करने की तुलना में कम समय लेता है।