المدونةمقال

النص البديل للصور ALT: كيف تكتبه لمتجرك في سلة وزد وشوبيفاي

غلاف مقالة النص البديل للصور ALT: كيف تكتبه لمتجرك في سلة وزد وشوبيفاي

ما هو النص البديل للصور ALT باختصار؟ هو وصف مكتوب تضعه في خاصية alt داخل وسم الصورة، يقرؤه قارئ الشاشة لمن لا يرى الصورة، ويظهر مكانها إذا لم تُحمَّل، ويساعد جوجل على فهم موضوعها. وكلما كان النص البديل للصور وصفًا صادقًا ومحددًا للمنتج، كانت صورك أوضح لعملائك ولمحركات البحث.

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

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

“اكتب النص البديل كأنك تصف المنتج لعميل على الهاتف لا يرى الصورة.”

ما هو النص البديل للصور بالضبط؟

النص البديل (Alternative Text) قيمة تكتبها داخل خاصية alt في وسم الصورة img. لا يراه الزائر في الحالات العادية، لكنه يعمل في ثلاثة مواقف: عندما يستخدم العميل قارئ شاشة، وعندما تفشل الصورة في التحميل، وعندما يقرأ جوجل الصفحة. هذا مثال لصورة منتج في متجر عطور:

<img src="cambodian-oud-oil.webp" alt="دهن عود كمبودي 12 مل في علبة خشبية داكنة">

ماذا يحدث إذا لم تُحمَّل الصورة؟

توضح وثائق MDN عن وسم الصورة أن المتصفح يعرض النص البديل مكان الصورة إذا تعذر عرضها، بسبب رابط خاطئ أو صيغة غير مدعومة أو اتصال ضعيف. وتذكر أيضًا أن بعض قارئات الشاشة قد تقرأ اسم الملف عندما تغيب خاصية alt، وهكذا يصل "IMG 4471" إلى أذن عميلك.

هل اسمه ALT Tag أم خاصية alt؟

الاسم المتداول هو "ALT Tag" أو "وسم ALT"، والأدق تقنيًا أنه خاصية داخل وسم img. والتسمية لا تغير شيئًا في التطبيق:

  • في لوحة تحكم متجرك: قد تجده باسم "النص البديل" أو "Alt" أو "Alt text".
  • في كود الصفحة: تجده بالشكل alt="..." داخل وسم الصورة.

لماذا يهم النص البديل لمتجرك؟

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

لجوجل وبحث الصور وإجابات الذكاء الاصطناعي

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

معلومة

تصف جوجل النص البديل بأنه أهم خاصية لتقديم معلومات وصفية عن الصورة، وتحذر في الوقت نفسه من حشوه بالكلمات المفتاحية.

وفي إرشادات جوجل للظهور في ميزات البحث التوليدية توضح جوجل أن اتباع أفضل ممارسات سيو الصور يعني أنك تحسّن صورك لبحث الذكاء الاصطناعي أيضًا. وإن أردت فهم هذه العلاقة بشكل أوسع، فاقرأ الفرق بين SEO وGEO.

لعملائك من ذوي الإعاقة البصرية

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

للصور التي تعمل كروابط

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

كيف تكتب نصًا بديلًا جيدًا؟

القاعدة الأساسية: صف ما في الصورة بدقة وباختصار، بالكلمات التي سيستخدمها عميلك. وهذه خطوات تطبيقها:

  1. صف ما تراه فعلًا: ابدأ بنوع المنتج ثم ما يميزه. جوجل نفسها تضرب مثالًا يتدرج من كلمة عامة مثل "puppy" إلى وصف محدد مثل "Dalmatian puppy playing fetch".
  2. أضف التفاصيل التي يبحث بها المشتري: اللون والحجم والمادة وبلد المنشأ ودرجة التحميص. هذه التفاصيل غالبًا هي نفسها الكلمات المفتاحية الطويلة التي تجذب زوارًا جاهزين للشراء.
  3. استخدم الكلمة المفتاحية حين تناسب الصورة فقط: تطلب جوجل محتوى مفيدًا يستخدم الكلمات المفتاحية بشكل مناسب وفي سياق الصفحة. ولمعرفة الكلمات التي يكتبها عملاؤك فعلًا، جرّب أداة اقتراحات بحث جوجل.
  4. لا تبدأ بكلمة "صورة": تشرح إرشادات W3C أن قارئ الشاشة يعلن وجود الصورة بنفسه، فعبارة "صورة لـ" تكرار لا فائدة منه.
  5. اكتب بلغة الصفحة: صفحة المنتج العربية يناسبها نص بديل عربي، والنسخة الإنجليزية من المتجر يناسبها نص بديل إنجليزي.
  6. لا تكرر النص نفسه لكل صور المنتج: صورة الواجهة وصورة العلبة وصورة التفاصيل، لكل واحدة وصف يذكر الزاوية أو الجزء الظاهر.

ما الطول المناسب للنص البديل؟

لا تحدد جوجل في توثيقها عددًا معينًا من الأحرف، والرقم المتداول "125 حرفًا" ليس قاعدة من جوجل. الحدود الفعلية تأتي من المنصات نفسها، وتختلف من منصة لأخرى:

سلة
  • زر (Alt) أسفل كل صورة
  • الحد الأقصى 70 حرفًا
  • اختصر: نوع المنتج ثم أهم ميزة
شوبيفاي
  • خيار Add alt text في معاينة الصورة
  • الحد 512 حرفًا والموصى به 125 أو أقل
  • تعديل جماعي عبر ملف CSV
زد
  • لا يشرح مركز المساعدة الخطوات حاليًا
  • راجع خيارات الصورة في لوحة التحكم
  • أو اسأل الدعم أو مطور القالب

ومن خبرتنا العملية، عبارة واحدة من 5 إلى 12 كلمة تكفي لمعظم صور المنتجات.

أمثلة نص بديل جيد وضعيف لمنتجات سعودية

هذا الجدول يقارن بين نص بديل ضعيف وآخر جيد لمنتجات شائعة في المتاجر السعودية:

المنتجنص بديل ضعيفنص بديل جيد
عطرعطر عطور عود رخيص الرياض أفضل عطردهن عود كمبودي 12 مل في علبة خشبية داكنة
عبايةIMG_2231عباية كريب سوداء بأكمام واسعة وتطريز ذهبي
قهوة مختصةقهوةكيس بن إثيوبي مختص 250 غرام بتحميص فاتح
جوالجوال جوال سامسونج سعر عرضجوال سامسونج باللون الرمادي من الخلف
تمور هداياصورةعلبة تمر سكري مغلفة بشريط أخضر لهدايا اليوم الوطني

لاحظ أن المثال الضعيف للعطر مجرد كلمات بحث متراكمة لا تصف صورة واحدة، وهذا هو النمط الذي تحذر منه جوجل. وهذا الفرق نفسه في صورة منتج واحد:

قبل

alt="عطر عطور عود عطر رجالي أفضل عطر الرياض"

بعد

alt="دهن عود كمبودي 12 مل في علبة خشبية داكنة"

الشعار

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

البانرات التي تحتوي نصًا

إذا كان البانر يقول "خصم 30% على عطور العيد"، فاكتب الرسالة نفسها في النص البديل، لأن النص المرسوم داخل الصورة لا يُقرأ كما يُقرأ النص العادي.

<a href="/eid-offers"><img src="eid-perfume-offer.webp" alt="خصم 30% على عطور العيد"></a>

الصور الزخرفية

الفواصل والزخارف والخلفيات التي لا تضيف معلومة تأخذ نصًا بديلًا فارغًا، دون أي مسافة بين علامتي التنصيص، حتى يتجاهلها قارئ الشاشة كما توصي W3C:

<img src="gold-divider.webp" alt="">

الإنفوجرافيك والصور المعقدة

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

“اقرأ النص البديل دون أن تنظر إلى الصورة: إن تخيلت المنتج فهو جيد، وإن شعرت أنك تقرأ كلمات بحث فأعد كتابته.”

ما الفرق بين alt وtitle والتعليق واسم الملف؟

أربعة عناصر ترتبط بالصورة، ولكل منها دور مختلف:

العنصرأين يظهردوره
النص البديل altلا يظهر عادة، يقرؤه قارئ الشاشة ويظهر عند فشل التحميلأهم وصف للصورة عند جوجل، ونص الرابط في الصور المرتبطة
خاصية titleنافذة صغيرة عند تمرير الفأرة على الكمبيوترمعلومة إضافية فقط، وليست بديلًا عن alt حسب MDN
التعليق (Caption)نص ظاهر أسفل الصورة للجميعيضيف سياقًا للقارئ، وجوجل تستفيد من النص المحيط بالصورة
اسم الملفداخل رابط الصورةيعطي جوجل تلميحًا خفيفًا عن موضوعها

الخلاصة: النص البديل ضروري لكل صورة تحمل معلومة، والتعليق إضافة مفيدة حين يحتاجها القارئ، واسم الملف الوصفي عادة جيدة قبل الرفع، أما title فلا تعتمد عليه.

كيف تضيف النص البديل في سلة وزد وشوبيفاي؟

في سلة

حسب مركز مساعدة سلة: افتح المنتج، واضغط زر (Alt) أسفل الصورة أو الفيديو، واكتب النص في المربع الذي يظهر، على ألا يتجاوز 70 حرفًا. لذلك ابدأ بنوع المنتج ثم أهم ميزة فيه. وتفاصيل أكثر عن تحسين هذه المنصة تجدها في صفحة سيو متاجر سلة.

في زد

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

في شوبيفاي

حسب مركز مساعدة شوبيفاي: اذهب إلى Products واختر المنتج، ثم اضغط على الصورة لتفتح صفحة معاينة الوسائط، واختر Add alt text، واكتب النص واحفظه. ويمكنك تعديل النصوص البديلة دفعة واحدة عبر ملف CSV. وإن اقترحت المنصة نصًا تلقائيًا فراجعه، لأن الاقتراح الآلي لا يعرف اسم العطر أو نوع البن عندك. والمزيد في صفحة سيو متاجر شوبيفاي.

أخطاء شائعة في النص البديل

  • حشو الكلمات المفتاحية: مثل "عباية عبايات عباية سوداء عباية الرياض". تحذر جوجل من أن هذا يضر تجربة المستخدم وقد يجعل موقعك يُعامل كموقع مزعج. والصواب وصف واحد طبيعي.
  • ترك اسم الملف الافتراضي: IMG_4471.jpg لا يقول شيئًا لجوجل ولا لعميلك. سمّ الملف بوصف قصير قبل رفعه.
  • نسخ اسم المنتج في كل الصور: ست صور بنص واحد تضيع فرصة وصف الزوايا والتفاصيل.
  • وصف لا يطابق الصورة: كتابة "عطر رجالي فاخر" على بانر التوصيل المجاني تضلل قارئ الشاشة وجوجل معًا.
  • مسافة داخل alt الفارغ: alt=" " بمسافة قد تجعل قارئ الشاشة يعلن عن صورة زخرفية. اكتبه alt="" بلا مسافة.
  • الاعتماد على title بدل alt: خاصية title لا تقوم مقام النص البديل.
  • وضع العرض داخل الصورة فقط: سعر عرض رمضان وتاريخ انتهائه يجب أن يكونا نصًا في الصفحة أيضًا، لا مرسومين في البانر وحده.

خطة عملية لمراجعة صور متجرك

طبّق هذه الخطوات بالترتيب، وابدأ بالمنتجات التي تجلب لك أكثر المبيعات:

  1. اجرد الصوراستخدم أداة زحف مثل Screaming Frog، وصفِّ الصور التي ينقصها النص البديل أو التي تفتقد الخاصية أصلًا، ثم صدّر القائمة.
  2. رتب حسب الأولويةابدأ بالمنتجات الأكثر مبيعًا، ثم منتجات الموسم القادم مثل رمضان والعيد واليوم الوطني، ثم البانرات والشعار.
  3. جهّز الملفات قبل الرفعسمّ كل ملف باسم وصفي بالإنجليزية، وخفف حجمه بأداة تحويل الصور إلى WebP المجانية.
  4. اعتمد قالبًا ثابتًا للكتابةنوع المنتج، ثم الميزة الأهم، ثم اللون أو الحجم. مثال: "عباية كتان بيج بحزام جانبي".
  5. عالج الحالات الخاصةالشعار باسم المتجر، والبانر بنص العرض، والزخارف بنص بديل فارغ، والإنفوجرافيك بوصف قصير ونص كامل في الصفحة.
  6. اجعلها عادة مع كل منتج جديدلا يُنشر منتج دون نص بديل لكل صوره، وأضف هذه الخطوة لقائمة من يرفع المنتجات في فريقك.

ولتخفيف حجم الصور قبل رفعها، استخدم أداة تحويل الصور إلى WebP. وقبل نشر أي منتج جديد، راجع هذه القائمة:

  • اسم الملف وصفي وليس IMG_1234
  • لكل صورة نص بديل مختلف يصف ما يظهر فيها
  • النص ضمن حد المنصة (70 حرفًا في سلة)
  • لا تكرار للكلمات ولا كلمة "صورة" في البداية
  • نص العرض المكتوب على البانر موجود في النص البديل

كلمة أخيرة: وصف صادق يكفي

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

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


الأسئلة الشائعة

1 هل يعاقب جوجل المتجر إذا لم يضع نصًا بديلًا؟

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

2 كم عدد الأحرف المناسب للنص البديل؟

لا يوجد حد رسمي من جوجل. التزم بحدود منصتك: 70 حرفًا في سلة، و125 حرفًا أو أقل كما تنصح شوبيفاي. وعبارة واحدة واضحة تكفي في الغالب.

3 هل أكتب النص البديل بالعربي أم بالإنجليزي؟

اكتبه بلغة الصفحة التي تظهر فيها الصورة. صفحة المنتج العربية يناسبها وصف عربي، والنسخة الإنجليزية يناسبها وصف إنجليزي.

4 هل أستخدم الذكاء الاصطناعي لكتابة النص البديل؟

يمكنك استخدامه لكتابة مسودة، ثم راجع كل نص بنفسك. فالأداة قد تكتب "زجاجة سوداء" بينما عميلك يبحث عن "دهن عود كمبودي". والكلمات التي تختارها هنا تتبع نفس مبادئ اختيار الكلمات المفتاحية لمتجرك.

5 هل تحتاج كل الصور إلى نص بديل؟

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


المصادر:

  1. Google Search Central. Google image SEO best practices.
  2. Google Search Central. Link best practices for Google.
  3. W3C WAI. Images Tutorial.
  4. Shopify Help Center. Adding alt text to media.
أنس راشد خبير سيو المتاجر الإلكترونية
كاتب المقال أنس راشد

خبير سيو المتاجر الإلكترونية ومؤلف دليل السيو الشامل لأصحاب المتاجر. أساعد متاجر سلة وزد وشوبيفاي تتصدر جوجل.

تبي متجرك يطبّق هالكلام بدون ما تتعب؟

اكتب رابط متجرك، وأرجع لك بتقرير عن حالة السيو فيه مع عيّنة من الإصلاحات.

  1. قراءة رابط متجرك
  2. تجهيز طلب الفحص
  3. فتح أداة الفحص

فحص مجاني لـ 50 صفحة من متجرك خلال أقل من دقيقة

اطلب تقرير متجرك الكتاب