HTML ईमेल [बंद] लिखते समय सर्वश्रेष्ठ अभ्यास और विचार


83

मैं अब एक दशक से अधिक समय से वेबसाइट विकसित कर रहा हूं, लेकिन जल्दी ही पाया गया कि वेब के लिए विकसित होने की मेरी कई आदतें ईमेल क्लाइंट के लिए विकसित होने पर बेकार हैं। इससे मुझे भारी निराशा हुई है, इसलिए मैंने सोचा कि मैं एक प्रश्न पूछूंगा:

दूसरों के लिए सर्वोत्तम अभ्यास और आवश्यक विचार क्या हैं जो समय-समय पर खुद को जीमेल, आउटलुक, आदि के लिए डिजाइन कर सकते हैं?

उदाहरण: <style>...</style> बनाम इनलाइन सीएसएस।

संक्षेप में: क्या वेब-दुनिया से ईमेल-दुनिया में स्थानांतरित हो जाता है, और क्या नहीं?

जवाबों:


131

यह HTML ईमेल सीखने की कोशिश करने वाले किसी भी व्यक्ति के लिए कुछ संसाधनों को सूचीबद्ध करने के लिए एक शानदार जगह की तरह लगता है। यह (शायद) HTML ईमेल संसाधनों की सबसे व्यापक सूची है जो आपको वेब पर मिलेगी। खुश सीखने।

आरंभ करने के लिए मार्गदर्शिकाएँ:

सीएसएस समर्थन और सामान्य मार्गदर्शिकाएँ:

आपको html-email में अपने CSS को हमेशा इनलाइन करना चाहिए। यहाँ CSS Inlining Tools की सूची दी गई है

उत्तरदायी मार्गदर्शिकाएँ:

टेम्प्लेट और फ़्रेमवर्क:

उत्तरदायी वैकल्पिक उदाहरण:

इसके अलावा ऊपर टेड Goas उत्तरदायी लिंक एक उत्कृष्ट तरल उदाहरण है।

समस्या निवारण और सामान्य मार्गदर्शिकाएँ:

आपको आउटलुक में काम करने वाले पृष्ठभूमि के चित्र ( बॉडी टैग को छोड़कर) में वीएमएल का उपयोग करना होगा । यहाँ कुछ VML लिंक दिए गए हैं:


37

मैं अपने काम के लिए ये (काफी समय से) कर रहा हूं। HTML ईमेल के साथ कई नुकसान हैं। विभिन्न ईमेल क्लाइंट HTML को एक-दूसरे से अलग तरीके से प्रस्तुत करते हैं और IE6 को उन्नत बनाते हैं।

यहाँ मैंने अब तक जो भी सीखा है उसकी एक गर्मी है।

  • इन-लाइन सीएसएस का उपयोग करें : शैलियाँ हमेशा समर्थित नहीं होती हैं।
  • टेबल लेआउट का उपयोग करें : मुझे पता है, लेकिन div लेआउट सीएसएस पर निर्भर हैं और कई ईमेल क्लाइंट सामना नहीं कर सकते हैं।
  • रौशन का उपयोग न करें : यह अजीब रिक्ति मुद्दों का कारण बनता है।
  • पृष्ठभूमि छवियों का उपयोग न करें : इनके लिए समर्थन सीमित है।
  • "डिस्प्ले: ब्लॉक" के साथ स्टाइल इमेज टैग : यह हॉटमेल के साथ अजीब रिक्ति मुद्दों को ठीक करता है।
  • यदि एक से अधिक टेबल का उपयोग करके उन्हें एक मूल तालिका में घोंसला बनाया जाता है: यह अधिक अजीब रिक्ति मुद्दों को रोकता है।
  • जावास्क्रिप्ट का उपयोग न करें : फिर से बहुत अच्छी तरह से समर्थित नहीं है।
  • सुनिश्चित करें कि आपका ईमेल बिना किसी चित्र के सुपाठ्य है : उपयोगकर्ता उन्हें लोड नहीं कर सकता है।
  • एक ऑनलाइन संस्करण प्रदान करें और इसे लिंक करें : यह उपयोगकर्ताओं को इच्छित सामग्री को देखने देता है, भले ही उनका ईमेल क्लाइंट भयानक हो।
  • परीक्षण, परीक्षण, परीक्षण : सिर्फ इसलिए कि यह एक ईमेल क्लाइंट में काम करता है इसका मतलब यह नहीं है कि यह दूसरों में काम करता है। आउटलुक 2007 एक बड़ा मिला है। यह HTML (आहें) रेंडर करने के लिए शब्द का उपयोग करता है।

यह एक व्यापक सूची से दूर है, लेकिन अधिकांश लोगों को सही रास्ते पर सेट करना चाहिए।


5

इनलाइन css और टेबल - सोचें कि वेब डेवलपमेंट लगभग 2000 और आप ठीक हो जाएंगे। अभियान मॉनीटर के पास एक उत्कृष्ट संसाधन है कि ईमेल ग्राहक किस सामान से निपट सकते हैं। इसके अलावा परीक्षण के लिए http://www.emailonacid.com/ का उपयोग करें - परीक्षणों के भार को भेजने से बचाता है।


mailchimp द्वारा उपलब्ध कराए गए कुछ दिशा-निर्देश भी: mailchimp.com/articles/email_marketing_guide
Dal Hundal
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.