جداول HTML في البريد الإلكتروني: ما الخطأ المحتمل؟

نشرت: 2017-08-01

إذا كنت تعمل في صناعة البريد الإلكتروني لأي فترة من الوقت ، فمن المحتمل أنك واجهت عددًا من المشكلات في حملات البريد الإلكتروني الخاصة بك. من الصور المفقودة إلى مشاكل التسليم ، فإن التسويق عبر البريد الإلكتروني محفوف بالتحديات. هناك شيء ربما لم تفكر فيه ، على الرغم من ذلك ، هو الخطأ الذي يمكن أن يحدث في الجداول - الرمز الفعلي - وهذا هو أساس رسائل البريد الإلكتروني الخاصة بك.

لسوء الحظ ، هناك الكثير الذي يمكن أن يحدث بشكل خاطئ في جداول HTML. اليوم ، أردنا تفصيل بعض المشاكل الأكثر شيوعًا التي تظهر في جداول HTML وإعطائك بعض النصائح لضمان عدم مواجهة نفس المشكلات في رسائل البريد الإلكتروني الخاصة بك.

لماذا نستخدم الجداول

أولاً ، تجديد سريع حول سبب استخدامنا لجداول HTML لترميز رسائل البريد الإلكتروني. كما ناقشنا في الماضي ، تتطلب حملات التسويق عبر البريد الإلكتروني اعتبارات خاصة بشأن الترميز. بينما يتم إنشاء الويب والبريد الإلكتروني على نفس التقنيات (HTML و CSS) ، لا تلتزم تطبيقات البريد الإلكتروني بنفس معايير متصفحات الويب. يحتوي كل تطبيق بريد إلكتروني على محرك العرض الخاص به والذي يحدد الرمز المدعوم وكيفية عرض رسائل البريد الإلكتروني. الخبر السيئ بالنسبة لنا هو أن جميع محركات العرض هذه تدعم علامات HTML وخصائص CSS المختلفة.

لهذا السبب ، لا يمكننا إلى حد كبير استخدام نفس مبادئ الترميز المستخدمة في تصميم الويب. لضمان عرض رسائل البريد الإلكتروني بشكل صحيح عبر معظم عملاء البريد الإلكتروني ، يتعين علينا استخدام جداول HTML لإنشاء هيكل حملة البريد الإلكتروني.

على الرغم من أن هذا قد تغير مؤخرًا ، خاصة مع التحديث الرئيسي لـ Gmail العام الماضي ، لا يزال بعض عملاء البريد الإلكتروني لا يدعمون الكثير من HTML و CSS. أبرزها: عائلة Microsoft Outlook من عملاء البريد الإلكتروني ، والتي تستخدم Microsoft Word كمحرك العرض الخاص بهم. نظرًا لأن Outlook لا يزال يتمتع بشعبية كبيرة (حاليًا رقم 5 على متتبع مشاركة سوق عميل البريد الإلكتروني لدينا) ، لا يزال يتعين على مصممي البريد الإلكتروني استخدام الجداول في بعض القدرات إذا كانوا يريدون عرض حملاتهم بشكل صحيح للمشتركين.

وعندما يتعين علينا الاعتماد على جداول HTML ، فهناك عدد من الأشياء التي يمكن أن تسوء ...

جعل الأمور معقدة

من أكثر المشاكل شيوعًا التي نراها عند استخدام الجداول التخطيطات شديدة التعقيد. هذا ينطبق بشكل خاص على قوالب البريد الإلكتروني القديمة التي لم يتم تحديثها في بضع سنوات.

حتى وقت قريب نوعًا ما ، كانت معظم رسائل البريد الإلكتروني تحتوي على الكثير من الجداول. الجداول الموجودة داخل الجداول - ممارسة تُعرف باسم التداخل.

جداول HTML في البريد الإلكتروني - جداول متداخلة
يمكن أن يصل تداخل الجداول داخل الجداول فقط حتى الآن قبل تقديم المشاكل.

عندما تقوم بتداخل جداول متعددة في جدول آخر ، فمن المحتمل أن تقوم بإدخال مشاكل في التعليمات البرمجية الخاصة بك. من السهل جدًا وضع جدول عن طريق الخطأ في المكان الخطأ أو لصقه فوق علامة HTML أساسية عند تغيير الأشياء. وبالنسبة لبعض العملاء (الذين ينظرون إليك ، لوتس نوتس) ، يمكنك رؤية رسائل البريد الإلكتروني تظهر بشكل سيء عندما تقوم بتداخل الجداول بعمق شديد. لهذا السبب نوصي ببناء رسائل بريد إلكتروني بنهج معياري ، وهو شيء كتب عنه صديقنا براين جريفز. وحاول الاحتفاظ بالجداول المتداخلة عند الحد الأدنى. لا يمكن تجنب استخدام الجداول المتداخلة تقريبًا ، ولكن الحفاظ على عمق التعشيش عند 4-6 طاولات كحد أقصى سيساعد في تجنب أي مشاكل.

على غرار التداخل المعقد ، يمكن أن تكون التصميمات شديدة التعقيد مشكلة أيضًا. ليس من غير المألوف رؤية رسائل بريد إلكتروني متعددة الأعمدة ، ولكن عندما تبدأ في إضافة عدد كبير جدًا من الأعمدة إلى رسالة بريد إلكتروني ، فأنت تقوم بإعداد نفسك للفشل المحتمل.

جداول HTML في البريد الإلكتروني - يمكن أن يؤدي حشر عدد كبير جدًا من الأعمدة في رسالة بريد إلكتروني إلى حدوث مشكلات أيضًا.
يمكن أن يؤدي حشو عدد كبير جدًا من الأعمدة في رسالة بريد إلكتروني إلى حدوث مشكلات أيضًا.

يواجه بعض عملاء البريد الإلكتروني مشكلات حتى في العمليات الحسابية الأساسية. من المعروف أن إصدارات معينة من Microsoft Outlook تضيف مسافات إضافية إلى أعمدة الجدول ، مما يؤدي إلى كسر تخطيطات البريد الإلكتروني. على الرغم من أنك قد تعتقد أن استخدام أربع خلايا جدول مضبوطة على عرض 25٪ أمر منطقي ، فإن Outlook سيضيف مساحة إضافية إلى تلك الخلايا ويتسبب في أن يكون التخطيط أوسع من 100٪. سيؤدي البريد الإلكتروني الناتج إلى إسقاط بعض هذه الخلايا في صفها الخاص ، مما يؤدي إلى تدمير حملة البريد الإلكتروني المصممة جيدًا والمخطط لها بشكل مثالي.

يساعد الحفاظ على تخطيطات البريد الإلكتروني الخاصة بك بسيطة على تجنب المشاكل المحتملة في حملاتك ويبقي المشتركين سعداء.

علامات مفقودة

عادةً ما تحتوي رسائل البريد الإلكتروني على الكثير من التعليمات البرمجية. وتعمل معظم فرق البريد الإلكتروني وفقًا لجداول زمنية سريعة للغاية. يمكن أن يؤدي هذا المزيج إلى أخطاء يمكن أن تدمر حملة البريد الإلكتروني.

كتحديث سريع ، دعنا نلقي نظرة على كيفية كتابة HTML. يتكون HTML من علامات تحيط بالمحتوى. في معظم الحالات ، يتطلب الترميز الصحيح كلاً من علامة الفتح والإغلاق. خذ جدول HTML هذا كمثال:

 <table> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> </table>

يمكنك أن ترى أن هناك ثلاث علامات مختلفة: الجدول وصف الجدول وخلية الجدول. يتم فتح هذه العلامات ثم إغلاقها (يُشار إليها بالرمز /).

على الرغم من أن HTML هي لغة ترميز متسامحة ، إلا أن عملاء البريد الإلكتروني ومحركات العرض الخاصة بهم غالبًا ما تختنق عندما تكون علامات HTML مفقودة. للأسف ، يعد فقدان علامات الإغلاق مشكلة شائعة جدًا في رسائل البريد الإلكتروني. يمكن أن تؤدي أوقات التحول السريع هذه إلى قيام مصممي البريد الإلكتروني بالتشفير بسرعة كبيرة ونسيان إغلاق جدول أو صف أو خلية. في حين أن هذا يمكن أن يكون جيدًا في بعض العملاء ، إلا أنه في البعض الآخر سيؤدي إلى تعطيل الحملات.

يمكن أن تساعد أدوات مثل W3C Markup Validation Service في تحديد أي علامات مفقودة. العلامات المفقودة والترميز الذي تم تشكيله بشكل غير صحيح هو سبب نوصي باستخدام قوالب البريد الإلكتروني أو أدوات مثل Builder's Partials و Snippets للمساعدة في إنشاء رسائل بريد إلكتروني. فهي لا تساعد فقط في ضمان كتابة التعليمات البرمجية الخاصة بك بشكل جيد واختبارها بشكل صحيح ، ولكن لها فائدة إضافية تتمثل في تسريع سير العمل - مما يتيح لك الالتزام بالمواعيد النهائية الضيقة وإبقاء فريقك سعيدًا.

سمات مفقودة

تمامًا كما يمكن أن تتسبب العلامات المفقودة في حدوث مشكلات ، يمكن أن يؤدي فقدان سمات HTML على الجداول إلى تصميمات ذات مظهر غير تقليدي.

سمات HTML هي خصائص إضافية يمكن تعيينها على علامات HTML. تتحكم هذه الخصائص في أشياء مثل عرض العناصر وارتفاعاتها والمحاذاة وحتى التباعد. يعد التباعد غير المتوقع حول خلايا الجدول أحد أكثر المشكلات شيوعًا التي ستراها في جداول HTML.

تضيف جميع تطبيقات البريد الإلكتروني تقريبًا (ومتصفحات الويب) أنماطها الخاصة إلى جداول HTML. تُستخدم جداول HTML بشكل تقليدي لعرض البيانات الجدولية ولم يكن الغرض منها في الأصل تخطيط المحتوى وتصميمه. لهذا السبب ، نحتاج إلى تجاوز السلوك الافتراضي للمتصفحات وتطبيقات البريد الإلكتروني لضمان عرض الجداول بشكل صحيح.

من خلال إضافة سمات تباعد الخلايا وغطاء الهاتف الخلوي إلى الجدول - وضبط كلاهما على الصفر - يمكننا التأكد من عدم إضافة عملاء بريد إلكتروني مساحة إضافية إلى أي خلايا جدول أو حولها.

 <table cellpadding="0" cellspacing="0"> </table>

وبالمثل ، إذا كنت تواجه مشكلات في عرض الجدول أو محاذاة محتوى الجدول ، فيجب أن تتأكد من أنك لم تنسَ العرض أو محاذاة السمات في الجداول أو خلايا الجدول.

تعرف على كيفية استكشاف الأخطاء وإصلاحها

هل تريد معرفة كيفية استكشاف أخطاء حملات البريد الإلكتروني الخاصة بك وإصلاحها وتجنب أي مشاكل محرجة للمشتركين لديك؟ انضم إلينا في Litmus Live للحصول على ورشة عمل كاملة حول استكشاف أخطاء البريد الإلكتروني وإصلاحها مثل المحترفين. سنتطرق إلى أكثر أخطاء البريد الإلكتروني شيوعًا وحلولها وأفضل الطرق لاستكشاف الأخطاء وإصلاحها للحملات.

Litmus Live - سجل الآن

احصل على تذاكر Litmus Live الخاصة بك!

سجل اليوم للاحتفال بالبريد الإلكتروني معنا!

سجل الآن →