ইমেইল মার্কেটিং এবং অটোমেশনবিপণন ও বিক্রয় ভিডিও

HTML ইমেল ডিজাইনের চ্যালেঞ্জ (এবং হতাশা) বোঝা

আপনি যদি ওয়েব পৃষ্ঠাগুলি তৈরি করার জন্য একটি বিষয়বস্তু ব্যবস্থাপনা সিস্টেম খুলেন, এটি একটি খুব সহজ প্রক্রিয়া। আধুনিক ওয়েব ব্রাউজার সমর্থন এইচটিএমএল, সিএসএস, এবং জাভাস্ক্রিপ্ট কঠোর ওয়েব মান। এবং তারা কেবলমাত্র কয়েকটি ব্রাউজার যা ডিজাইনারদের চিন্তা করতে হবে। ব্যতিক্রম আছে, অবশ্যই... এবং সেই ব্রাউজারগুলির জন্য নির্দিষ্ট কিছু সাধারণ সমাধান বা ফাংশন।

সামগ্রিক মানগুলির কারণে, বিষয়বস্তু ব্যবস্থাপনা সিস্টেমে পৃষ্ঠা নির্মাতাদের বিকাশ করা সহজ। ব্রাউজারগুলি HTML5, CSS, এবং JavaScript মেনে চলে... এবং ডেভেলপাররা এমন ওয়েব পৃষ্ঠাগুলি তৈরি করতে অবিশ্বাস্যভাবে শক্তিশালী সমাধান তৈরি করতে পারে যা ডিভাইসগুলির জন্য প্রতিক্রিয়াশীল এবং ব্রাউজার জুড়ে সামঞ্জস্যপূর্ণ। দুই দশক আগে, কার্যত প্রতিটি ওয়েব ডিজাইনার ওয়েব পেজ তৈরি করতে ডেস্কটপ সফটওয়্যার ব্যবহার করত। এখন, একজন ওয়েব ডিজাইনারের জন্য একটি ওয়েব পৃষ্ঠা তৈরি করা খুবই অস্বাভাবিক – প্রায়শই নয়, তারা টেমপ্লেট তৈরি করছে এবং বিষয়বস্তু পূরণ করতে বিষয়বস্তু সিস্টেমে সম্পাদক ব্যবহার করছে। ওয়েবসাইট সম্পাদক চমত্কার.

কিন্তু ইমেল সম্পাদকরা খুবই পিছিয়ে। কারণটা এখানে…

HTML ইমেল ডিজাইন করা একটি ওয়েবসাইটের চেয়ে অনেক বেশি জটিল

আপনার কোম্পানী যদি একটি সুন্দর HTML ইমেল ডিজাইন করতে চায়, তবে প্রক্রিয়াটি বিভিন্ন কারণে একটি ওয়েব পৃষ্ঠা তৈরি করার চেয়ে দ্রুতগতিতে আরও জটিল:

  • কোন মান নেই - এইচটিএমএল ইমেল প্রদর্শন করে এমন ইমেল ক্লায়েন্টদের দ্বারা ওয়েব স্ট্যান্ডার্ডের কঠোরভাবে আনুগত্য নেই। কার্যত প্রতিটি ইমেল ক্লায়েন্ট এবং প্রতিটি ইমেল ক্লায়েন্টের প্রতিটি সংস্করণ ভিন্নভাবে কাজ করে। কেউ কেউ সিএসএস, বাহ্যিক ফন্ট এবং আধুনিক এইচটিএমএলকে সম্মান করবে। অন্যরা কিছু ইনলাইন স্টাইলিংকে সম্মান করে, শুধুমাত্র ফন্টের একটি সংগ্রহ প্রদর্শন করে এবং টেবিল-চালিত কাঠামো ছাড়া সবকিছু উপেক্ষা করে। এটা বেশ হাস্যকর যে এই বিষয়ে কেউ কাজ করছে না। ফলস্বরূপ, ক্লায়েন্ট এবং ডিভাইসগুলিতে ধারাবাহিকভাবে রেন্ডার করা টেমপ্লেটগুলি ডিজাইন করা বড় ব্যবসায় পরিণত হয়েছে এবং এটি বেশ ব্যয়বহুল হতে পারে।
  • ইমেল ক্লায়েন্ট নিরাপত্তা - সম্প্রতি, অ্যাপল মেল আপডেট করা হয়েছে এইচটিএমএল ইমেলে থাকা সমস্ত ছবিকে ডিফল্টরূপে ব্লক করতে যা ইমেলে এম্বেড করা নেই। আপনি হয় তাদের একবারে একটি ইমেল লোড করার অনুমতি দিন বা এই সেটিংটি অক্ষম করতে সেটিংস সক্ষম করতে হবে৷ ইমেল ক্লায়েন্ট নিরাপত্তা সেটিংসের পাশাপাশি কর্পোরেট সেটিংসও রয়েছে৷
  • আইটি সুরক্ষা - আপনার আইটি টিম একটি ইমেলে আসলে কোন বস্তু রেন্ডার করা যেতে পারে তার উপর কঠোর নিয়মকানুন স্থাপন করতে পারে। যদি আপনার ছবিগুলি, উদাহরণস্বরূপ, একটি নির্দিষ্ট ডোমেন থেকে আসে যা কর্পোরেট ফায়ারওয়ালে সাদা তালিকাভুক্ত নয়, ছবিগুলি কেবল আপনার ইমেলে প্রদর্শিত হবে না৷ কখনও কখনও, আমাদের ইমেলগুলি বিকাশ করতে হয়েছিল এবং কর্পোরেশনের সার্ভারে সমস্ত চিত্র হোস্ট করতে হয়েছিল যাতে তাদের নিজস্ব কর্মচারীরা চিত্রগুলি দেখতে পারে।
  • ইমেল পরিষেবা সরবরাহকারী - বিষয়গুলি আরও খারাপ করার জন্য, ইমেল নির্মাতারা যে ইমেল পরিষেবা প্রদানকারীরা (ESPs) আসলে সমস্যাগুলিকে সীমাবদ্ধ করার পরিবর্তে প্রবর্তন করুন। যখন তারা তাদের সম্পাদককে প্রচার করে যে আপনি যা দেখেন তা হল আপনি যা পান (WYSIWYG), ইমেল ডিজাইনের ক্ষেত্রে প্রায়শই বিপরীতটি সত্য। আপনি তাদের প্ল্যাটফর্মে ইমেলটির পূর্বরূপ দেখতে পাবেন এবং প্রাপক ডিজাইনের সমস্ত সমস্যা দেখতে পাবেন। কোম্পানিগুলি প্রায়ই অজান্তেই লক-ডাউনের পরিবর্তে একটি বৈশিষ্ট্য-সমৃদ্ধ সম্পাদক বেছে নেয়, এই ভেবে যে একজনের আরও বৈশিষ্ট্য রয়েছে। বিপরীতটি সত্য... আপনি যদি এমন ইমেল চান যা সমস্ত ইমেল ক্লায়েন্ট জুড়ে ধারাবাহিকভাবে রেন্ডার হয়, তত সহজ, ভাল, কারণ কম ভুল হতে পারে।
  • ইমেল ক্লায়েন্ট রেন্ডারিং - শত শত ইমেল ক্লায়েন্ট ডেস্কটপ, অ্যাপস, মোবাইল ডিভাইস এবং ওয়েবমেইল ক্লায়েন্ট জুড়ে HTML ভিন্নভাবে রেন্ডার করে। যদিও আপনার ইমেল পরিষেবা প্রদানকারীর নিফটি টেক্সট এডিটর আপনার ইমেলে একটি শিরোনাম রাখার জন্য একটি সেটিং থাকতে পারে, প্যাডিং, মার্জিন, লাইনের উচ্চতা এবং ফন্টের আকার প্রতিটি ইমেল ক্লায়েন্টের জন্য আলাদা হতে পারে। ফলস্বরূপ, ধারাবাহিকভাবে রেন্ডার করার জন্য একটি ইমেল পেতে আপনাকে এইচটিএমএল ডাউন করতে হবে এবং প্রতিটি একক উপাদানকে আলাদাভাবে কোড করতে হবে (নীচের উদাহরণটি দেখুন) - এবং প্রায়শই ব্যতিক্রমগুলিতে লিখতে হবে যা ইমেল ক্লায়েন্ট-নির্দিষ্ট। কোনও সাধারণ ব্লকের ধরন নেই, আপনাকে টেবিল-চালিত লেআউটগুলি করতে হবে যা ত্রিশ বছর আগে ওয়েব তৈরির সমতুল্য। এই কারণেই যেকোনো নতুন লেআউটের জন্য ডেভেলপমেন্ট এবং ক্রস-ইমেল ক্লায়েন্ট এবং ডিভাইস টেস্টিং উভয়ই প্রয়োজন। আপনি আপনার ইনবক্সে যা দেখছেন আমি আমার ইনবক্সে যা দেখছি তা সম্পূর্ণ ভিন্ন হতে পারে। তাই রেন্ডারিং টুলস পছন্দ করে ইমেইল অন অ্যাসিড or litmus আপনার নতুন ডিজাইন সমস্ত ইমেল ক্লায়েন্ট জুড়ে কাজ করে তা নিশ্চিত করার জন্য একটি আবশ্যক। এখানে জনপ্রিয় ইমেল ক্লায়েন্ট এবং তাদের রেন্ডারিং ইঞ্জিনগুলির একটি সংক্ষিপ্ত তালিকা রয়েছে:
    • অ্যাপল মেল, ম্যাকের জন্য আউটলুক, অ্যান্ড্রয়েড মেল এবং iOS মেল ব্যবহার ওয়েবকিট.
    • আউটলুক 2000, 2002 এবং 2003 ব্যবহার করে ইন্টারনেট এক্সপ্লোরার.
    • আউটলুক 2007, 2010 এবং 2013 ব্যবহার করে মাইক্রোসফ্ট ওয়ার্ড (হ্যাঁ, শব্দ!)
    • ওয়েবমেইল ক্লায়েন্টরা তাদের ব্রাউজারের সংশ্লিষ্ট ইঞ্জিন ব্যবহার করে (উদাহরণস্বরূপ, সাফারি ওয়েবকিট ব্যবহার করে এবং ক্রোম ব্লিঙ্ক ব্যবহার করে)।

ওয়েব বনাম জন্য HTML এর একটি উদাহরণ। ইমেইল

আপনি যদি এমন একটি উদাহরণ চান যা ইমেল বনাম ওয়েবে ডিজাইন করার জটিলতাকে চিত্রিত করে, এখানে Mailbakery এর নিবন্ধ থেকে একটি নিখুঁত উদাহরণ রয়েছে ইমেল এবং ওয়েব HTML এর মধ্যে 19 বড় পার্থক্য:

ইমেল HTML

বোতামটি সঠিকভাবে স্থাপন করার জন্য এবং ইমেল ক্লায়েন্ট জুড়ে এটি ভাল দেখায় তা নিশ্চিত করার জন্য প্রয়োজনীয় সমস্ত ইনলাইন স্টাইলিং অন্তর্ভুক্ত করে আমাদের অবশ্যই একটি সিরিজ তৈরি করতে হবে। একটি সহগামী শৈলী ট্যাগও ক্লাসগুলিকে অন্তর্ভুক্ত করার জন্য এই ইমেলের শীর্ষে থাকবে৷

<table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td align="left">
         <table border="0" cellspacing="0" cellpadding="0" bgcolor="#43756e">
            <tr>
               <td class="text-button"  style="padding: 5px 20px; color:#ffffff; font-family: 'Oswald', Arial, sans-serif; font-size:14px; line-height:20px; text-align:center; text-transform:uppercase;">
                  <a href="#" target="_blank" class="link-white" style="color:#ffffff; text-decoration:none"><span class="link-white" style="color:#ffffff; text-decoration:none">Find Out More</a>
               </td>
            </tr>
         </table>
      </td>
   </tr>
</table>

ওয়েব এইচটিএমএল

আমরা একটি বাটন হিসাবে উপস্থিত একটি অ্যাঙ্কর ট্যাগের কেস, প্রান্তিককরণ, রঙ এবং আকার নির্ধারণ করতে ক্লাস সহ একটি বহিরাগত স্টাইলশীট ব্যবহার করতে পারি।

<div class="center">
   <a href="#" class="button">Find Out More</a>
</div>

কীভাবে ইমেল ডিজাইনের সমস্যাগুলি এড়ানো যায়

একটি শালীন প্রক্রিয়া অনুসরণ করে ইমেল ডিজাইনের সমস্যাগুলি এড়ানো যেতে পারে:

  1. টেমপ্লেট টেস্টিং - আপনার গ্রাহকরা যে ইমেল ক্লায়েন্টগুলি ব্যবহার করে তা বোঝা এবং নিশ্চিত করা যে আপনার HTML ইমেল সম্পূর্ণরূপে মোবাইল এবং ডেস্কটপ জুড়ে পরীক্ষা করা হয়েছে যে কোনও টেমপ্লেট স্থাপন করার আগে গুরুত্বপূর্ণ৷ আমরা একটি ফটোশপ লেআউট থেকে আক্ষরিক অর্থে একটি ইমেল ডিজাইন করতে পারি… তবে এটিকে একটি টেবিল-চালিত, ক্রস-ইমেল ক্লায়েন্টে টুকরো টুকরো করা এবং ডাইসিং করা ইমেল ডিজাইনগুলি স্থাপন করার জন্য প্রয়োজনীয় যা সর্বোত্তম এবং সামঞ্জস্যপূর্ণ।
  2. অভ্যন্তরীণ পরীক্ষা - একবার আপনার টেমপ্লেট ডিজাইন এবং পরীক্ষা করা হলে, এটি পর্যালোচনা এবং অনুমোদনের জন্য সংস্থার মধ্যে একটি অভ্যন্তরীণ বীজ তালিকায় পাঠানো উচিত। অভ্যন্তরীণভাবে ইমেল রেন্ডার করার সাথে জড়িত ফায়ারওয়াল বা নিরাপত্তা সমস্যা নেই তা নিশ্চিত করার জন্য আপনি এমনকি ব্যক্তিদের খুব সীমিত উপসেট দিয়ে শুরু করতে চাইতে পারেন। যদি এটি একটি নতুন ইমেল পরিষেবা প্রদানকারীর উপর একটি উদাহরণ তৈরি করে, আপনি এমনকি ইনবক্সে আপনার ইমেল পাওয়ার সাথে সম্পর্কিত কিছু ফিল্টারিং বা ব্লক করার সমস্যাও খুঁজে পেতে পারেন।
  3. টেমপ্লেট সংস্করণ - আপনার টেমপ্লেটের একটি নতুন সংস্করণে কাজ না করে আপনার লেআউট বা ডিজাইন পরিবর্তন করবেন না যা ডিজাইন, সঠিকভাবে পরীক্ষা করা এবং স্থাপন করা যেতে পারে। অনেক ব্যবসা প্রতিটি প্রচারাভিযানের জন্য একমুখী ডিজাইন পছন্দ করে... কিন্তু এর জন্য প্রতিটি ইমেল প্রতিটি প্রচারের জন্য ডিজাইন, ডেভেলপ করা এবং স্থাপন করা প্রয়োজন। এটি অভ্যন্তরীণ ইমেল বিপণন প্রক্রিয়ায় এক টন সময় যোগ করে। এবং, আপনার ইমেলের কোন উপাদানগুলি কোন উপাদানগুলি নয় তার থেকে ভাল পারফরম্যান্স করছে তা আপনি বুঝতে পারবেন না। ধারাবাহিকতা প্রক্রিয়াটিকে সহজ করার উপায় নয়, এটি আপনার গ্রাহকদের আচরণের জন্যও গুরুত্বপূর্ণ।
  4. ইমেল পরিষেবা প্রদানকারী ব্যতিক্রম - কার্যত প্রতিটি ইমেল পরিষেবা প্রদানকারীর কাছে তাদের ইমেল নির্মাতা প্রবর্তিত সমস্যাগুলির উপর কাজ করার একটি উপায় রয়েছে। আমরা প্রায়শই একটি অ্যাকাউন্টে কাঁচা CSS যোগ করতে পারি – অথবা এমনকি একটি বিষয়বস্তু ব্লকও থাকতে পারে যা প্রতিটি ইমেলে অন্তর্ভুক্ত করতে হবে – যাতে কোম্পানিটি অন্তর্নির্মিত ইমেল সম্পাদক ব্যবহার করতে পারে এবং এটি আপনার ইমেলের নকশাকে ভেঙে না দেয়। অবশ্যই, সেগুলি মেনে চলছে তা নিশ্চিত করার জন্য সেই পদক্ষেপগুলি স্থাপন করার জন্য কিছু প্রশিক্ষণ এবং প্রক্রিয়া নিয়ন্ত্রণের প্রয়োজন হতে পারে। অথবা - আপনি আক্ষরিক অর্থে আপনার ইমেল ডিজাইনকে এমন একটি সমাধানে বিকাশ করতে চাইতে পারেন যা ক্লায়েন্ট এবং ডিভাইস জুড়ে কাজ করে প্রমাণিত হয়, তারপর এটি আপনার ইমেল পরিষেবা প্রদানকারীতে পেস্ট করুন।

ইমেল ডিজাইন প্ল্যাটফর্ম

যেহেতু ইমেল পরিষেবা প্ল্যাটফর্মগুলি ক্রস-ক্লায়েন্ট এবং ক্রস-ডিভাইস ক্রমাগতভাবে রেন্ডার করা বিল্ডার তৈরি এবং বজায় রাখার ক্ষেত্রে একটি খারাপ কাজ করেছে, তাই বেশ কয়েকটি দুর্দান্ত প্ল্যাটফর্ম বাজারে এসেছে। আমরা ব্যাপকভাবে ব্যবহার করেছি যে এক স্ট্রিপো.

স্ট্রিপো শুধুমাত্র একটি ইমেল নির্মাতা নয়, তাদের 900 টিরও বেশি টেমপ্লেটের একটি লাইব্রেরি রয়েছে যা সহজেই আমদানি করা যায়। একবার আপনি ইমেল ডিজাইন করলে, আপনি 60+ ইএসপি এবং ইমেল ক্লায়েন্টদের ইমেল করতে পারেন, এর মধ্যে রয়েছে Intuit Mailchimp, HubSpot, প্রচারাভিযান মনিটর, AWeber, eSputnik, চেহারা, এবং জিমেইল. সর্বোত্তম স্ট্রিপো টেমপ্লেটগুলি ইমেল রেন্ডারিং পরীক্ষার সাথে আসে যাতে আপনি নিশ্চিত করতে পারেন যে সেগুলি পরীক্ষা করা হয়েছে এবং 40 টিরও বেশি ইমেল ক্লায়েন্ট জুড়ে ধারাবাহিকভাবে কাজ করছে৷

স্ট্রিপো এডিটর ডেমোতে লগইন করুন

Douglas Karr

Douglas Karr এর CMO হয় ওপেনইনসাইটস এবং এর প্রতিষ্ঠাতা Martech Zone. ডগলাস কয়েক ডজন সফল MarTech স্টার্টআপকে সাহায্য করেছে, Martech অধিগ্রহণ এবং বিনিয়োগে $5 বিলিয়নেরও বেশি যোগ্য পরিশ্রমে সহায়তা করেছে এবং কোম্পানিগুলিকে তাদের বিক্রয় ও বিপণন কৌশলগুলি বাস্তবায়ন এবং স্বয়ংক্রিয় করতে সহায়তা করে চলেছে৷ ডগলাস একজন আন্তর্জাতিকভাবে স্বীকৃত ডিজিটাল রূপান্তর এবং MarTech বিশেষজ্ঞ এবং স্পিকার। ডগলাস একজন ডামি'স গাইড এবং একটি ব্যবসায়িক নেতৃত্ব বইয়ের একজন প্রকাশিত লেখকও।

সম্পরকিত প্রবন্ধ

শীর্ষ বোতামে ফিরে যান
ঘনিষ্ঠ

অ্যাডব্লক সনাক্ত করা হয়েছে

Martech Zone আমরা বিজ্ঞাপন রাজস্ব, অনুমোদিত লিঙ্ক, এবং স্পনসরশিপ মাধ্যমে আমাদের সাইট নগদীকরণ কারণ বিনা খরচে আপনাকে এই সামগ্রী প্রদান করতে সক্ষম. আপনি যদি আমাদের সাইট দেখার সাথে সাথে আপনার বিজ্ঞাপন ব্লকারকে সরিয়ে দেন তবে আমরা কৃতজ্ঞ।