لماذا تبدو رسائل البريد الإلكتروني سيئة مع عميل Outlook؟
نشرت: 2018-07-04دعونا نواجه الحقيقة. يعد إنشاء رسائل البريد الإلكتروني مهمة سهلة للغاية. لكن تنسيق رسائل البريد الإلكتروني هذه لتكون متوافقة مع Outlook يعد مهمة كبيرة. إنفاكت ، أصعب مما تعتقد.
Outlook هو عميل البريد الإلكتروني الأكثر استخدامًا ، ولكنه قديم ، ستجده على الإطلاق. ومع ذلك ، فإنه لا يدعم العديد من التطورات التي تجدها في عملاء البريد الإلكتروني الآخرين مثل Gmail.
عينة من هذا:
إذا كنت قد استخدمت صورة PNG مع شفافية الخلفية ، فسوف يفزع برنامج Outlook! إنها لا تعرف كيفية تقديم مثل هذه الصور. وبالمثل ، قد تتساءل لماذا تبدو الأزرار المستديرة (التي تم إنشاؤها باستخدام خاصية CSS ذات نصف قطر الحدود) مربعة في عميل Outlook. لأن Outlook لا يدعم border-radius والعديد من خصائص CSS الأخرى.
فيما يلي الأسباب التي تجعل رسائل البريد الإلكتروني الخاصة بك تبدو رهيبة وما يمكنك القيام به لتحسين تصميم البريد الإلكتروني الخاص بك.
لماذا تبدو رسائل البريد الإلكتروني الخاصة بي سيئة مع Outlook؟
التحدي الأكبر الذي يواجه جهات التسويق عبر البريد الإلكتروني الآن هو إنشاء قالب بريد إلكتروني لبرنامج Outlook. هذا لأنه ، من Outlook 2007 ، توقفت Microsoft عن استخدام Internet Explorer لتقديم رسائل البريد الإلكتروني وبدأت في استخدام Microsoft Word كمحرك العرض الخاص بهم. كان هذا التغيير أكثر ملاءمة لمستخدمي Microsoft office لأنه سمح لهم فقط بنسخ المحتوى أو لصقه من Word أو Excel في رسائل البريد الإلكتروني في Outlook. ولكن ، جعل السيناريو صعبًا بالنسبة لمنشئ البريد الإلكتروني المستند إلى HTML. نظرًا لأن البريد الإلكتروني بتنسيق HTML يبدو مختلفًا في التوقعات ، للتغلب على بعض التحديات ، اتبع الخطوات التالية لتحسين حملات البريد الإلكتروني.
التحديات في عرض البريد الإلكتروني باستخدام Outlook
يحتاج مسوق البريد الإلكتروني إلى أخذ الكثير في الاعتبار قبل تصميم حملة بريد إلكتروني. يحتاج إلى معرفة اشتراك العميل الذي يستخدم Outlook. يختلف إصدار سطح المكتب وإصدار الهاتف المحمول وإصدار الويب من Outlook تمامًا عن بعضها البعض في تقديم بريد إلكتروني. عندما يتعلق الأمر بتقديم البريد الإلكتروني باستخدام Outlook ، فإن ما يلي هو الأشياء التي يجب النظر إليها.
لماذا يتم قص الصورة وبطيئة التحميل
عندما يتعلق الأمر بتضمين الصور في رسائل البريد الإلكتروني ، فإن Outlook لديه قيود معينة على حجم الصورة.
تلعب الرسائل الإخبارية عبر البريد الإلكتروني دورًا رئيسيًا في حملات التسويق عبر البريد الإلكتروني. يتم جعلها ديناميكية عن طريق إضافة الصور إليها. في بعض الأحيان ، عند إضافة صورة طويلة إلى قالب الحملة ، يتم قصها أو إعادة قياسها عند الطرف المستلم. هذا بسبب مقاطع Outlook من الجزء العلوي من الصورة الذي يتجاوز ارتفاعه 1728 بكسل. لذلك ، في هذه الحالة ، نحتاج إلى تغيير حجم الصورة إلى أقل من 1728 بكسل لإظهارها دون اقتطاع.
في الحالات التي لا يمكن فيها تغيير حجم الصورة ، فإن أفضل بديل هو قص الصورة إلى صورتين منفصلتين ثم استخدامها في الحملة.
لا يتم تغيير حجم الصورة
لا يعمل Outlook بشكل جيد مع الصور المقيدة بتنسيق HTML. أي إذا تمت إضافة قالب البريد الإلكتروني مع صورة تم تغيير حجمها باستخدام HTML ، فسيعرض Outlook الصورة بالحجم الأصلي فقط وليس في القيمة التي تم تغيير حجمها. لذلك ، نحتاج إلى التأكد من تغيير حجم الصورة جيدًا قبل استخدامها في أي من أتمتة البريد الإلكتروني.
صور الخلفية
تتمثل أفضل استراتيجية "لإبهار" العميل في إنشاء بريد إلكتروني به صورة خلفية للعلامة التجارية. يمكننا أن نجعل صور الخلفية أكثر فائدة من خلال تراكب النصوص الحية على الصورة. سيساعدنا النص المباشر أيضًا في نقل الغرض من البريد الإلكتروني حتى في الأوقات التي لا يتم فيها عرض العميل مع الصورة.
ومع ذلك ، لا يدعم Outlook صور الخلفية باستخدام HTML. نحتاج إلى استخدام VML (لغة توصيف المتجهات) لعرض صور الخلفية من قبل المشترك.
أدخل الكود أدناه في علامة <body> في HTML لصورة الخلفية لتغطية نافذة البريد الإلكتروني بالكامل
<div> <!--[if gte mso 9]> <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t"> <v:fill type="tile" src="/IMAGE.png" color="#000000"/> </v:background> <![endif]--> <table height="100%" width="100%" cellpadding="0" cellspacing="0" border="0"> <tr> <td valign="top" align="left" background="IMAGE.png">عمل الكود أعلاه بشكل مثالي في عرض صورة الخلفية مع رسائل البريد الإلكتروني المفتوحة في Outlook 2007 و 2010 و 2013. لكن Windows Mail 10 احتاج إلى بعض التعديل في الكود لإضافة الصورة مع مصدرها الذي يسمح بصورة الخلفية.
سيمكن الكود أدناه الطبقة العليا من الصورة لتكون شفافة ويساعد في إصلاح صورة الخلفية.
<td valign="top" height="700" background="Image Live URL Here" bgcolor="#f7901e"> <!--[if gte mso 9]> <v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" src="/Image Live URL Here" /> <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false"> <v:fill opacity="0%" color="#f7901e" /> <v:textbox inset="0,0,0,0"> <![endif]--> <div> <!-- HTML Content Here --> </div> <!--[if gte mso 9]> </v:textbox> </v:fill> </v:rect> </v:image> <![endif]--> </td>لا تناسب صور GIF المتحركة
الفيديو يتحدث أكثر من الكلمات.
ولكن ، من الناحية الفنية ، يحتاج قالب البريد الإلكتروني إلى ترميز معقد لدعم مقاطع الفيديو. التفكير في البدائل ، بصفتي مسوق بريد إلكتروني ، أرى أن GIF خيار ديناميكي. صور GIF هي صور متحركة لنقل رسالة في أبسط أشكالها. Outlook لا يدعم GIF.
يتم تحميل صورة GIF ولكن يتم عرض الإطار الأول فقط من GIF للعميل.
إذا كان لديك مشتركون في Outlook في قائمة البريد الإلكتروني ، فتأكد من مشاركة الإطار الأول للصورة في السياق الرئيسي لصورة GIF.
ضع في اعتبارك استخدام جزء الرسوم المتحركة ليكون ميزة إضافية للمشتركين مع عملاء البريد الإلكتروني الآخرين.
خاصية نصف قطر الحدود
عند الحديث عن التسويق عبر البريد الإلكتروني ، فإن زر الحث على اتخاذ إجراء هو ميزة تجعل البريد الإلكتروني يولد عميلاً محتملاً. كم مرة نقرنا على زر الحث على اتخاذ إجراء ذي الرؤوس المستديرة؟
تعد خاصية Border radius خاصية CSS شائعة ولكنها لا تعمل بشكل جيد مع Outlook. مع Outlook ، يتم تزويد المشتركين بأزرار الحث على الشراء بحدود مربعة.
مساحات فارغة إضافية
أحيانًا تكون المساحات الفارغة أعلى الصورة كما اعتدنا أن نراها في خيار معاينة الطباعة بعد عرض البريد الإلكتروني مع Outlook.
كما ذكرنا سابقًا في المدونة ، هذا لأن Outlook 2007 يستخدم Microsoft Word لتقديم رسائل بريد إلكتروني بتنسيق HTML.
ومن ثم يبدو البريد الإلكتروني مختلفًا قليلاً عن التصميم الفعلي.
مشكلة الخط الأساسي
إذا كان جهاز المشترك يفتقر إلى نمط الخط الأساسي ، فسيعرض Outlook البريد الإلكتروني بالكامل في Times New Roman ، متجاهلاً الخط الاحتياطي المذكور في الكود.
<!--[if mso]> <style> h1 { font-family: Primary font, Fallback font; } </style> <![endif]-->يجب أن يكون قالب البريد الإلكتروني مثاليًا
تقوم بتشغيل حملة بريد إلكتروني لمتجر التجارة الإلكترونية. يجب أن يساعد النموذج الذي تصممه في إرسال بريد إلكتروني فعال لأن هذا ليس التسويق الميداني التقليدي حيث يقابلك العملاء شخصيًا.
مظهر الشخص التسويقي يحدد مصداقية العلامة التجارية. إذن ، ما الذي نرسله الآن لتمثيل علامتنا التجارية؟
رسائل البريد الإلكتروني. يعطي قالب تصميم البريد الإلكتروني الخاص بك الانطباع الأول عن علامتك التجارية للعميل. كلما كان البريد الإلكتروني يبدو أفضل مع المحتوى ، كانت العلامة التجارية أفضل
ومع ذلك ، لا نتمتع بحرية استخدام خيارات التنسيق المتقدمة لجعل بريدنا الإلكتروني يبدو جذابًا. قد نرى البريد الإلكتروني يبدو مثاليًا في Outlook ، ولكن لن يكون هذا هو السيناريو عندما يتم تقديمه من قبل مستلمي البريد الإلكتروني الآخرين.
يجب عليك التمسك باستخدام الجداول في html البريد الإلكتروني الخاص بك. لا تحاول استخدام عناصر div ذات الموضع والعوامات لأن Outlook لا يدعمها. لسوء الحظ ، لا يوجد حل بديل لهذا حتى الآن.
خيار إلغاء الاشتراك أمر لا بد منه
من خلال إدارة متجر للتجارة الإلكترونية ، نرغب دائمًا في الحفاظ على تفاعل عملائنا مع علامتنا التجارية.
كيف افعلها؟
النشرات الإخبارية. امنح العملاء معلومات محتملة حول الاتجاه والتحديثات في مجال عملك.
ولكن في النهاية ، فإن العميل هو الذي يقرر متابعة علامتك التجارية أم لا. بمجرد اشتراك العميل معنا ، يجب تزويده بخيار إلغاء الاشتراك من قائمة الاشتراك في أي وقت.
يعد زر إلغاء الاشتراك أمرًا ضروريًا في كل رسالة إخبارية نرسلها إلى عملائنا وإذا لم يتمكن عملاؤنا من رؤية هذا الزر ،
توقع ماذا؟
قد نتلقى رسائل غير مرغوب فيها!
يؤدي إرسال رسائل البريد الإلكتروني من Outlook إلى وضع علامتنا التجارية في هذه المخاطر لأنها لا تعطي هذا الخيار القياسي.
يتم تغيير الروابط إلى نص ملون تحته خط أزرق / بنفسجي
بصفتنا مسوقين عبر البريد الإلكتروني ، نحتاج إلى الاستفادة الكاملة من البريد الإلكتروني الذي نرسله إلى العملاء.
يمكننا تضمين روابط الاشتراك وروابط إلى مدوناتنا الشائعة وروابط إعادة التوجيه إلى موقعنا على الويب لتحقيق مشاركة العملاء.
عند إرسال بريد إلكتروني بتنسيق HTML من Outlook ، تظهر هذه الروابط بنص أزرق / أرجواني مسطر عند عرضها على عملاء بريد إلكتروني مختلفين.
لتجنب هذه المشكلة ، استخدم علامة <font> وقم بلف النص بعلامة <span> وسمة نمط.
حاول استخدام الكود التالي-
<a> <span> <font color="#E3A216"> Click me </font> </span> </a>قد يكون Outlook على ما يرام لملء علبة الوارد الشخصية الخاصة بك.
ولكن ، الحديث عن الأعمال التجارية - انظري خارج الصندوق.