الدليل النهائي لنص ALT المصمم في البريد الإلكتروني
نشرت: 2016-10-31من أفضل الممارسات المقبولة عمومًا في عالم البريد الإلكتروني تضمين سمات ALT للصور. اختصار للنص البديل ، أصبح نص ALT في البريد الإلكتروني الآن هو الممارسة القياسية لهواة البريد الإلكتروني.
هناك عدة أسباب لذلك:
- يقوم معظم عملاء البريد الإلكتروني بحظر الصور افتراضيًا. في بعض الحالات ، بدلاً من إظهار الصورة ، سيعرض عميل البريد الإلكتروني بدلاً من ذلك نص ALT. هذا مفيد بالتأكيد ، خاصة في الحالات التي يتكون فيها تصميم البريد الإلكتروني في الغالب من الصور. يمكن أن يساعد نص ALT في توصيل الرسالة حتى لو لم تستطع الصور ذلك.
- في الحالة التي يتعذر فيها تحميل الصور أو لا يتم تحميلها بسبب اتصال سيء أو ارتباط معطل وما إلى ذلك ، سيظهر نص ALT بدلاً من الصورة.
- يدرك المسوقون والمصممين الحساسين لاحتياجات القراء ضعاف البصر أن برامج قراءة الشاشة تستخدم نص ALT. نظرًا لأن هؤلاء المستخدمين غير قادرين على عرض النص أو الصور ، يعمل نص ALT على وصف الصورة عبر قارئ الشاشة.
![]() | تحقق من أن صورك تحتوي على نص ALTباستخدام قائمة التحقق من Litmus ، ستحصل على معاينات لرسائل البريد الإلكتروني الخاصة بك مع إلغاء الصور ، وسيتم إعلامك إذا كانت أي من صورك تفتقد إلى نص ALT. أرسل بثقة في كل مرة. جرب Litmus مجانًا → |
إعداد نص ALT قياسي
يعد تعيين نص ALT للصور في بريد إلكتروني بتنسيق HTML أمرًا بسيطًا. تُعرف باسم سمة ، وهي جزء قياسي من بناء جملة HTML ، ويتم تضمينها في علامة الصورة:
<img src="logo.jpg" width="400" height="149" alt="Litmus" >من المهم تضمين قيم الطول والعرض لأن هذا يؤدي إلى إنشاء مربع عنصر نائب لنص ALT ليتم تثبيته عند تعطيل الصور.
عرض نص ALT قياسي
إليك ما تبدو الصور المعطلة في رسالة بريد إلكتروني بدون نص ALT المرسل إلى Gmail:

مقارنة بالصور المعطلة في رسالة بريد إلكتروني تحتوي على نص ALT :

أي واحد تفضل أن تحصل عليه؟
إضافة نمط إلى نص ALT
يمكنك أيضًا الاستمتاع بنص ALT الخاص بك ، مع إضافة القليل من CSS المضمنة لتغيير الخط واللون والحجم والنمط والوزن لنص ALT:
<img src="NAME OF IMAGE.PNG" width="500" height="462" alt="Litmus"/>إليك نفس المثال أعلاه ، ولكن مع تطبيق أنماط نص ALT:

دعم نصي ALT مصمم عبر عملاء البريد الإلكتروني
على الرغم من كونه أسلوبًا أنيقًا ، إلا أن هذا البريد الإلكتروني الذي نتحدث عنه ، لذلك من الطبيعي أن يكون الدعم مبعثرًا قليلاً بين برامج البريد الإلكتروني المختلفة. لقد اقترضت بعض العناصر من بريد Dreamforce المثير للإعجاب من Salesforce لاختبار نص ALT المصمم للأمثلة التالية.
دعم نصي ALT على غرار بريد الويب
| نص ALT في عملاء بريد الويب | |||
|---|---|---|---|
| عملاء بريد الويب | الصور محظورة بشكل افتراضي | يعرض نص ALT | يعرض نص ALT ذو نمط |
| بريد AOL (Internet Explorer) | ✘ | ||
| AOL Mail (Firefox) | |||
| بريد AOL (كروم) | |||
| Comcast (جميع المتصفحات) | ✘ | ✘ | |
| G-Suite و Gmail (Internet Explorer) | ✘ | ||
| G-Suite و Gmail (Firefox) | ✘ | ||
| G-Suite و Gmail (Chrome) | ✘ | ||
| GMX.de (إنترنت إكسبلورر) | ✘ | ||
| GMX.de (Firefox) | ✘ | ||
| GMX.de (كروم) | ✘ | ✘ | ✘ |
| Mail.ru (جميع المتصفحات) | ✘ | ✘ | ✘ |
| Office 365 (Internet Explorer) | |||
| Office 365 (Firefox) | ✘ | ||
| أوفيس 365 (كروم) | |||
| Outlook.com (إنترنت إكسبلورر) | بعض الأحيان* | ||
| Outlook.com (Firefox) | بعض الأحيان* | ||
| Outlook.com (Chrome) | بعض الأحيان* | ||
| Web.de (Internet Explorer) | ✘ | ||
| Web.de (Firefox) | ✘ | ||
| Web.de (Chrome) | ✘ | ✘ | ✘ |
| ياهو! البريد (Internet Explorer) | |||
| ياهو! البريد (Firefox) | |||
| ياهو! البريد (كروم) | |||
عملاء بريد الويب مثل Gmail هم الأكثر تنوعًا نظرًا لأنه يمكن الوصول إلى برامج البريد هذه في متصفحات مختلفة. في جميع عملاء بريد الويب ، يعتمد دعم نص ALT المصمم على المتصفح المستخدم. يتم دعم نص ALT ذي النمط في الإصدارات الحالية من Firefox و Chrome و Safari.
على سبيل المثال ، سيكون نص ALT المصمم مرئيًا للمشترك الذي يعرض Gmail في Firefox ، ولكن نوعًا من الأعمال فقط في Internet Explorer. في هذه الحالة ، يتم دعم اللون ، ولكن ليس الخط أو السمات الأخرى. يبدو أن Internet Explorer مستعرض غير مألوف لنص ALT المصمم بشكل عام. وجدنا أنه بينما كان اللون مدعومًا ، لم يكن الخط غالبًا:
- Gmail و G-Suite في Internet Explorer
- GMX.de في Internet Explorer
- Office 365 في Internet Explorer
- Outlook.com في Internet Explorer
- Web.de في Internet Explorer
- ياهو! البريد في Internet Explorer
نص ALT منمق في Gmail / Firefox:

نص ALT منمق في Gmail / IE:

نص ALT على الصور المرتبطة
قد يكون نص ALT للصور المرتبطة مسطرًا أو أزرق في بعض عملاء بريد الويب. ياهو! يقوم بتسطير نص ALT في الصور المرتبطة ، بينما يقوم Gmail بتسطير الألوان المحددة ويتجاهلها ، وبدلاً من ذلك يتحول إلى اللون الأزرق النابض بالحياة افتراضيًا:

Outlook.com
بدلاً من حظر جميع الصور ، يدعي Outlook.com "حظر المحتوى من المرسلين المشبوهين" ، على الرغم من أنني لست متأكدًا من كيفية تحديدهم لمن يبدو مريبًا! بشكل عشوائي ، يكون بعض المرسلين "موثوقين" ، ويعرضون الصور تلقائيًا ، بينما يقوم الآخرون بإرسال تحذير بشأن المحتوى المحظور:

يمكن للمستخدمين حظر الصور لأي شخص غير موجود في قائمة المرسلين الموثوق بهم في إعدادات Outlook.com الخاصة بهم. يتعامل Outlook.com مع هذين النوعين من تصفية المحتوى بشكل مختلف ، وذلك باستخدام سلوك حظر الصور الشبيه بـ Gmail لمرسلين "مريبين المظهر" أثناء استخدام المربعات الرمادية في Hotmail لحظر الصور للمستخدمين الذين لديهم إعدادات أكثر صرامة لحظر المحتوى.

دعم نصي ALT بنمط سطح المكتب
عملاء سطح المكتب أكثر موثوقية نظرًا لعدم وجود العديد من المتغيرات المعنية:
| نص ALT في عملاء سطح المكتب | |||
|---|---|---|---|
| عملاء سطح المكتب | الصور محظورة بشكل افتراضي | يعرض نص ALT | يعرض نص ALT ذو نمط |
| بريد أبل | ✘ | ||
| لوتس نوتس 8.5 | ✘ | ||
| توقعات 2000-2003 | نوعا ما* | ✘ | |
| برنامج Outlook 2007 | نوعا ما* | ✘ | |
| برنامج Outlook 2010 | نوعا ما* | ✘ | |
| Outlook 2011 (Outlook لنظام التشغيل Mac) | نوعا ما* | ||
| برنامج Outlook 2013 | نوعا ما* | ✘ | |
| توقعات 2016 | نوعا ما* | ✘ | |
| ثندربيرد | ✘ | ||
| بريد Windows 10 | ✘ | ✘ | ✘ |
* يضيف Outlook رسالة أمان إلى نص ALT. مزيد من التفاصيل أدناه.
بينما لا يحظر Apple Mail و Thunderbird الصور افتراضيًا ، يمكنك اختيار القيام بذلك في التفضيلات لكل تطبيق. لقد قمت يدويًا بتمكين حظر الصور على هؤلاء العملاء لمعرفة ما إذا كانوا يدعمون نص ALT المصمم.
كانت هناك بعض الاختلافات الطفيفة لدعم المتغيرات الأخرى ، لا سيما المتعلقة بخطوط الويب:
- لم يدعم Apple Mail الخطوط ذات الأنماط ، على الرغم من استمرار تضمين اللون والخصائص الأخرى.
- في Outlook 2000-2003 ، على الرغم من أنه يمكنك تغيير اللون ، لا يمكنك ضبط أي شيء آخر باستخدام نص ALT ذي النمط.
رسالة أمان Outlook
Outlook 2003 و 2007 و 2010 و 2013 و 2016 تمهيدًا لنص ALT مع رسالة أمان طويلة تنص على "انقر بزر الماوس الأيمن هنا لتنزيل الصور. للمساعدة في حماية خصوصيتك ، منع Outlook التنزيل التلقائي لهذه الصورة من الإنترنت. " لسوء الحظ ، هذا يجعل نص ALT في عملاء البريد الإلكتروني هؤلاء عديم الفائدة تقريبًا لأنه يظهر فقط في نهاية تحذير أمان Outlook:

تظهر هذه الرسالة أيضًا في نظام التشغيل Windows 10 ، مما يحظر تمامًا أي نص ALT.
دعم النص البديل على الهاتف المحمول
يتمتع عملاء الجوّال بدعم قوي لنص ALT المصمم ، وهو خبر سار - خاصةً للمسوقين الذين لديهم جماهير كثيفة من Android.
| نص ALT في عملاء الجوال | |||
|---|---|---|---|
| عملاء الجوال | الصور محظورة بشكل افتراضي | يعرض نص ALT | يعرض نص ALT ذو نمط |
| بريد Android الإلكتروني (4.4) | |||
| Android Gmail (4.4) | |||
| AOL Mail (متصفح Android) | |||
| AOL Mail (متصفح iPhone) | |||
| تطبيق AOL Alto Mail | |||
| نظام التشغيل بلاك بيري 6 | |||
| نظام التشغيل بلاك بيري 7 | |||
| بلاك بيري ز 10 | |||
| iOS 6.x (عميل البريد الإلكتروني الأصلي) | ✘ | ||
| iPhone 5s (iOS 7) | ✘ | ||
| iPhone 5s (iOS 8) | ✘ | ||
| أيفون 6 | ✘ | ||
| آيفون 6s | ✘ | ||
| iPhone 6s + | ✘ | ||
| iPad (iOS 9) | |||
| iPad Mini (iOS 9) | ✘ | ||
| تطبيق Gmail (iOS) | ✘ | ||
| تطبيق Gmail (متصفح iPhone) | ✘ | ||
| صندوق البريد (iOS) | ✘ | ✘ | ✘ |
| Outlook.com (مستعرض Android) | بعض الأحيان | ||
| Outlook.com (متصفح iPhone) | بعض الأحيان | ||
| ويندوز موبايل 7.5 | ✘ | ✘ | |
| هاتف ويندوز 8 | ✘ | ✘ | |
| ياهو! التطبيق (Android) | ✘ | ✘ | |
| ياهو! التطبيق (iOS) | |||
| ياهو! البريد (متصفح Android) | نوعا ما | نوعا ما | |
| ياهو! البريد (متصفح iPhone) | ✘ | ✘ | ✘ |
مثل Apple Mail و Thunderbird ، قمت يدويًا بتحديث إعدادات iOS الخاصة بي لحظر الصور من أجل ملاحظة كيفية تعامل نظام تشغيل الهاتف المحمول هذا مع نص ALT.
نص ALT منسق في Android (Samsung Galaxy Nexus):

يظهر نص ALT المصمم بشكل مماثل في تطبيقات البريد الإلكتروني و Gmail في Android.
نص ALT منمق في BlackBerry OS 6 (Torch 9810):

نص ALT منسق في iOS (iPhone 5):

حظر الصور في Windows Phone 7.5 (Nokia Lumia 900):

خصائص خط CSS والروابط والطول متغيرات
الغوص في التفاصيل ، يتم دعم معظم خصائص الخط التالية في العملاء الذين يعرضون نص ALT ذو نمط:
- خط العائلة
- حجم الخط
- وزن الخط
- اللون
- نوع الخط
كان هناك بعض الاختلاف في الاختبار عندما يتعلق الأمر بخصائص معينة مدعومة. دعم كل عميل تقريبًا خصائص اللون ، ولكن ليس الخط. هذا يختلف أيضًا بين المتصفحات. على سبيل المثال ، إليك ما بدا عليه Gmail / G-Suite في Chrome في اختباري لخطين منمقين بألوان مختلفة:

بينما يحترم Gmail / G Suite في Internet Explorer اللون وليس الخط:

اعلم أن بعض العملاء قد لا يدعمون جميع الخطوط أو الأحجام في نص ALT المصمم ، لكن هذا لا يعني أنه لا يمكنك إضافة بعض العلامات التجارية أو الذوق. تحقق من هذا المورد المفيد الذي كتبته أخصائية التسويق عبر البريد الإلكتروني Jaina Mistry لـ Campaign Monitor لمضاعفة التحقق من دعم خط الويب.
أوصي أيضًا بقائمة الخطوط المثبتة بشكل شائع على نظامي التشغيل Windows و Mac.
سلوكيات أخرى ملحوظة لحظر الصور
في العديد من عملاء البريد الإلكتروني ، سيختفي نص ALT بمجرد أن يتجاوز حجم النص أو طوله عرض و / أو ارتفاع حاوية الصورة. بسبب هذا السلوك ، من الأفضل الالتزام بأوصاف أقصر وأحجام خطوط أصغر لتجنب إزالة نص ALT تمامًا.
تسمح لك جميع برامج البريد الإلكتروني تقريبًا بتغيير إعداداتك لعرض الصور أو إخفائها تلقائيًا (على الرغم من أن الإخفاء / الحظر هو الإعداد الافتراضي في أغلب الأحيان) ، وسيطالبون المستخدمين بتشغيل الصور للرسائل الفردية. يسمح البعض أيضًا للمستخدمين بإضافة مرسلين محددين إلى قائمة السماح أو دفتر العناوين ، أو تحديد "عرض الصور دائمًا من ..."
معاينة بريدك الإلكتروني مع إيقاف تشغيل الصور (وتشغيل!)
كيف يبدو بريدك الإلكتروني مع تعطيل الصور؟ هل يتم عرض نص ALT الخاص بك بشكل صحيح؟ قم بمعاينة بريدك الإلكتروني في أكثر من 50 عميلاً لسطح المكتب والجوال وبريد الويب - بما في ذلك طرق عرض الصور - باستخدام Litmus.
ابدأ الاختبار →

