إجابة سريعة
النص البديل (alt text) هو وصف مكتوب للصورة يُخزَّن في خاصية alt في HTML. يقرأه قارئ الشاشة بدلا من عرض الصورة، ويعرضه المتصفح إذا تعذر تحميل الصورة — فهو مكافئ نصي للصورة، وليس تسمية توضيحية ولا رموز تسمية.

ما هو النص البديل؟
يوجد النص البديل لأن الصورة تنقل معناها عبر البصر. ومن لا يستطيع رؤية الصورة يحتاج إلى الوصول للمعنى نفسه بطريقة أخرى. النص البديل هو تلك الطريقة الأخرى: مكافئ نصي، لا تسمية توضيحية ولا رموز تسمية.
لهذا السبب يجب أن يصف النص البديل المعنى لا المحتويات فحسب. فصورة رسم بياني يُظهر نمو المبيعات تحتاج إلى نص بديل يقول إن المبيعات نمت، لا نص بديل يقول "خط يتجه إلى الأعلى". الصورة تنقل حقيقة، وعلى النص البديل أن ينقل الحقيقة ذاتها.
ما هي خاصية alt (alt="")؟
خاصية alt هي خاصية HTML التي تحتوي فعليا على النص البديل. وتُكتب مباشرة داخل وسم الصورة على هذا النحو:
<img src="quarterly-report.png" alt="رسم بياني شريطي يوضح ارتفاع الإيرادات بنسبة 12% مقارنة بالربع السابق">الخاصية والنص الموجود داخلها شيئان مختلفان. فـ"النص البديل" هو المحتوى الذي يقصده الناس عادة عند استخدام المصطلح، أما خاصية alt فهي الوعاء الذي يحمله. ويهم هذا التمييز في حالة واحدة بعينها: حين تكون الصورة زخرفية بحتة، فالتصرف الصحيح ليس حذف الخاصية، بل إدراجها فارغة على صورة alt="". الخاصية الفارغة تخبر قارئ الشاشة بأن "هذه الصورة زخرفية، تجاوزها"، أما الخاصية المفقودة فلا تخبره بشيء، وعندها تلجأ بعض قارئات الشاشة إلى قراءة اسم الملف.
لماذا يُعد النص البديل مهما؟
النص البديل هو الشيء الوحيد الذي يفصل المستخدم غير البصري عن معنى الصورة. فمن دونه لا يصله ذلك المعنى — ليس بصورة منقوصة، بل لا يصله إطلاقا.
وتظهر هذه الفجوة بطرق عملية محددة. فصورة منتج بلا نص بديل تعني أن مستخدم قارئ الشاشة الذي يتسوق عبر الإنترنت لا يعرف ما هو على وشك شرائه. ورسم بياني بلا نص بديل يعني أن محللا كفيفا يقرأ تقريرا لا يعرف ما تقوله البيانات. وزر "إرسال" مبني على أيقونة بلا نص بديل يجعل قارئ الشاشة يعلن "زر" دون أي إشارة إلى وظيفته، فيتحول إجراء بنقرة واحدة إلى تخمين.
وللنص البديل بعد قانوني أيضا. فمتطلب البدائل النصية في WCAG من أكثر المعايير ورودا في شكاوى ودعاوى إمكانية الوصول، تحديدا لأن غياب النص البديل سهل الاكتشاف وصعب الدفاع عنه. غير أن هذا التعرض القانوني أثر لاحق؛ فالسبب الجوهري لأهمية النص البديل هو أنه الآلية التي يصبح بها معنى الصورة متاحا لمن لا يستطيع رؤيتها.
من يستفيد من النص البديل؟
يُكتب النص البديل لمستخدمي قارئات الشاشة، لكن أثره يتجاوز هذه الفئة وحدها، ولكل فئة سبب مختلف للاستفادة منه.
مستخدمو قارئات الشاشة من المكفوفين وضعاف البصر
يحصلون على الفائدة الأساسية: مكافئ منطوق للصورة، يُقدَّم في الموضع الدقيق من الصفحة الذي توجد فيه الصورة.
المستخدمون الذين يعطلون عرض الصور
وهو أمر شائع على الاتصالات البطيئة أو محدودة البيانات؛ فيرون النص البديل معروضا كنص نائب مرئي في مكان الصورة التي كان من المفترض أن تُحمَّل.
المستخدمون ذوو الإعاقات المعرفية أو المرتبطة بالانتباه
يعتمدون أحيانا على أدوات تحويل النص إلى كلام رغم قدرتهم على رؤية الشاشة؛ والنص البديل يمنح هذه الأدوات شيئا دقيقا تقرأه بدلا من لا شيء.
محركات البحث
تستخدم النص البديل لفهم ما تعرضه الصورة، لأن زاحف البحث لا يستطيع تفسير البكسلات كما يفعل الإنسان — وهي فائدة ثانوية، لا الغرض من النص البديل.
كل مستخدم، بصورة مؤقتة
يستفيد عند فشل تحميل صورة — رابط معطوب، خادم بطيء، خطأ مطبعي في مسار الملف — لأن النص البديل هو ما يظهر مكان الصورة بدلا من مربع فارغ.
كيف تستخدم قارئات الشاشة النص البديل؟
يقرأ قارئ الشاشة الصفحة عبر شجرة إمكانية الوصول الخاصة بها، لا عبر ما يُعرض بصريا. وعندما يصل مستخدم قارئ الشاشة إلى صورة — بالانتقال إليها بمفتاح Tab إن كانت رابطا أو زرا، أو بالتنقل داخل المحتوى — يعلن قارئ الشاشة قيمة خاصية alt بدلا من الصورة نفسها.
كما تعلن معظم قارئات الشاشة أن العنصر صورة قبل قراءة النص البديل، فتقول مثلا "صورة، غروب الشمس فوق شاطئ" بدلا من "غروب الشمس فوق شاطئ" فقط. ولهذا لا يبدأ النص البديل الجيد أبدا بعبارة "صورة لـ" أو "لقطة لـ" — فقارئ الشاشة قال "صورة" بالفعل، وتكرارها يضاعف الإعلان دون فائدة.
وإذا كانت خاصية alt فارغة (alt="")، تتجاوز معظم قارئات الشاشة الصورة بالكامل وتنتقل إلى المحتوى التالي، معتبرة إياها زخرفية. أما إذا كانت الخاصية غائبة تماما، فالسلوك أقل اتساقا: إذ تعلن بعض قارئات الشاشة اسم الملف بدلا منها، وهو بالضبط الناتج المربك وعديم المعنى الذي يهدف النص البديل الفارغ أو الوصفي إلى منعه.
كيف تكتب نصا بديلا جيدا؟
يجيب النص البديل الجيد عن سؤال واحد: ما الذي تنقله هذه الصورة ويفوت المستخدم غير البصري لولاه؟ وكل ما عداه يتفرع عن هذا السؤال.
ابدأ بالوظيفة لا بالمظهر
صورة منتج ليست مجرد "غلاية حمراء" — فبحسب السياق قد تكون التفصيلة المفيدة هي بطاقة السعر الظاهرة في اللقطة، أو تصميم فوهة الصب الذي يجري عرضه، أو لا شيء أكثر من "غلاية كهربائية حمراء".
اجعله موجزا
لا يوجد حد رسمي لعدد الأحرف، لكن بعض قارئات الشاشة اعتادت تاريخيا اقتطاع الإعلانات الطويلة جدا. وجملة أو جملتان تكفيان عادة؛ أما التفاصيل الأطول فمكانها النص المجاور، لا خاصية alt.
طابق الوصف مع غرض الصورة
قد تحتاج صورة الجسر نفسها إلى "منظر جوي لجسر البوابة الذهبية عند الغروب" في مدونة سفر، بينما يكفي "جسر البوابة الذهبية" — أو لا شيء على الإطلاق — إذا كانت ترويسة زخرفية صغيرة.
لا تتركه عاما أبدا
عبارات مثل "Image123.jpg" أو "صورة" أو "رسم" تخبر المستخدم بوجود شيء دون أن تخبره ما هو — وهو غالبا أسوأ من غياب النص البديل، لأنه يستهلك انتباهه بلا فائدة.
ما أنواع الصور التي تحتاج إلى نص بديل؟
لا تحتاج كل صورة إلى النوع نفسه من النص البديل، لأن الصور لا تؤدي الغرض ذاته في الصفحة. وتصنف WCAG الصور في فئات وظيفية قليلة، تغير كل منها معنى النص البديل "الجيد".
الصور المعلوماتية
تنقل محتوى محددا — صورة فوتوغرافية أو رسما توضيحيا أو لقطة شاشة — يضيف معنى يتجاوز الزخرفة. فلقطة شاشة لقائمة إعدادات تحتاج إلى نص بديل يسمي القائمة والإعداد تحديدا، لا "لقطة شاشة لبرنامج" بصيغة عامة.
الصور الوظيفية
تعمل كعنصر تحكم — زر أو رابط أو أيقونة تطلق إجراء. وينبغي أن يصف النص البديل الإجراء أو الوجهة لا المظهر: "بحث"، لا "عدسة مكبرة".
الصور الزخرفية
تضيف طابعا بصريا دون محتوى معلوماتي. وينبغي أن تحصل على alt="" فارغة، لا على نص وصفي ولا على خاصية مفقودة — أي أن نطلب من قارئ الشاشة تجاوزها بصمت.
الصور المركبة
يحمل الرسم البياني أو المخطط عادة معلومات أكثر مما تتسع له خاصية alt القصيرة. فقدم ملخصا موجزا في النص البديل، وضع التفاصيل الكاملة في جدول بيانات أو في فقرة مجاورة.
ما أمثلة النص البديل الجيد؟
رؤية الصورة نفسها معالَجة بإتقان ثم بإهمال تجعل الفرق ملموسا.
صورة منتج في صفحة تجارة إلكترونية
ضعيف — alt="shoe.jpg"
أفضل — alt="حذاء أوكسفورد رجالي من الجلد البني، منظر جانبي"
النسخة الضعيفة لا تمنح مستخدم قارئ الشاشة سوى اسم ملف. أما النسخة الأفضل فتخبره بالضبط بما كان سيراه.
زر "إغلاق" أيقوني في نافذة منبثقة
ضعيف — alt="أيقونة X"
أفضل — alt="إغلاق مربع الحوار"
النسخة الضعيفة تصف شكل الأيقونة. أما النسخة الأفضل فتصف ما يحدث فعلا عند الضغط عليها.
فاصل زخرفي بين أقسام مدونة
ضعيف — alt="فاصل زخرفي على شكل خط متموج أخضر"
أفضل — alt=""
النسخة الضعيفة تفرض الاستماع إلى شيء لا يحمل معلومة. أما النسخة الأفضل فتتيح لقارئ الشاشة تجاوزه تماما.
رسم بياني شريطي يوضح زيارات الموقع شهريا
ضعيف — alt="رسم بياني"
أفضل — alt="رسم بياني شريطي: ارتفعت الزيارات باطراد من يناير إلى يونيو، وبلغت ذروتها في يونيو"
النسخة الأفضل تقدم الخلاصة في النص البديل وتحيل إلى جدول بيانات مجاور للأرقام الكاملة.
ما الأخطاء الشائعة في النص البديل؟
حذف خاصية alt بالكامل
أسوأ من تركها فارغة، لأن غياب الخاصية يدفع بعض قارئات الشاشة إلى إعلان اسم الملف بدلا من الصمت.
كتابة "صورة لـ" أو "لقطة لـ"
يعلن قارئ الشاشة أن العنصر صورة قبل قراءة النص البديل، فتكرر العبارة معلومة سمعها المستخدم بالفعل.
حشو النص البديل بالكلمات المفتاحية لأغراض السيو
يخذل مستخدم قارئ الشاشة الذي يُفترض أن يخدمه، كما أن محركات البحث صارت أقدر على تمييز هذا النمط باعتباره تلاعبا لا وصفا.
منح الصور الزخرفية نصا بديلا وصفيا
تحتاج الخلفية الزخرفية أو الرسم التزييني إلى alt="" كي يتجاوزها قارئ الشاشة بدلا من مقاطعة انسياب القراءة.
تكرار تسمية توضيحية مرئية داخل خاصية alt
إذا كانت التسمية التوضيحية تذكر ما تعرضه الصورة، فإن نصا بديلا مطابقا يجعل قارئ الشاشة يعلن الجملة نفسها مرتين متتاليتين.
كتابة نص بديل مطول يدفن الفكرة
تحتاج الصورة عادة إلى فكرة واحدة واضحة تُنقل بإيجاز، لا إلى فقرة كاملة — خاصة أن بعض قارئات الشاشة قد تقتطع الإعلانات الطويلة جدا.
النص البديل مقابل وصف الصورة مقابل التسمية التوضيحية
تُستخدم هذه المصطلحات الثلاثة أحيانا بالتبادل، لكن كلا منها يخدم قارئا مختلفا، ويوجد في موضع مختلف من الصفحة، ويؤدي وظيفة مختلفة.
| النص البديل مقابل وصف الصورة مقابل التسمية التوضيحية | النص البديل | وصف الصورة | Caption |
|---|---|---|---|
| لمن هو موجه | مستخدمو قارئات الشاشة، وكل من تفشل لديه الصور في التحميل | مستخدمو قارئات الشاشة، حين تكون الصورة أعقد من أن تتسع لها خاصية alt قصيرة | كل قارئ، مبصرا كان أم غير مبصر |
| أين يوجد | داخل خاصية alt في HTML، وغير مرئي للمستخدمين المبصرين | في النص المحيط، أو في صفحة مرتبطة، أو عبر إحالة aria-describedby | معروض بوضوح في الصفحة، أسفل الصورة مباشرة أو بجوارها |
| ما وظيفته | يحل محل الصورة نفسها | يتوسع في تفاصيل أقصر من أن تتسع لها خاصية alt | يضيف سياقا أو نسبا أو تعليقا لا تُظهره الصورة وحدها |
| Length | جملة واحدة أو أقل عادة | بالطول الذي يتطلبه المحتوى فعلا | يتفاوت، لكنه عادة مرئي وسهل التصفح |
ينشأ الالتباس الحقيقي من التداخل بينها، لأن التسمية التوضيحية مرئية للجميع، بمن فيهم مستخدمو قارئات الشاشة الذين يصلون إليها كنص عادي — وهو ما يدفع البعض إلى افتراض أن وجودها يغني عن النص البديل. وهذا غير صحيح. فقارئ الشاشة يعلن خاصية alt عند الصورة نفسها، ويعلن التسمية التوضيحية منفصلة باعتبارها نصا مستقلا؛ وتجاهل خاصية alt لمجرد وجود تسمية توضيحية يعني أن الصورة نفسها ستُعلن بلا شيء، أو باسم ملف، إلى أن يصل القارئ إلى التسمية التوضيحية بعد لحظة.
كيف تعرّف WCAG النص البديل؟
WCAG addresses alternative text directly in Success Criterion 1.1.1, Non-text Content, at Level A — the base level of conformance and the one referenced most consistently across accessibility laws and standards. The criterion requires that all non-text content have a text alternative that serves the same purpose, with a short list of specific exceptions: purely decorative content, CAPTCHA (which needs an alternative test method, not alt text), and content where a test would be invalidated by the alt text itself.
WCAG's own language matters here because it doesn't just require "a description" — it requires a text alternative that serves an equivalent purpose. That's a higher bar than a literal visual description. It's the reason "photo of a woman smiling" is often the wrong alt text for a photo whose actual purpose on the page is to show a customer testimonial — the equivalent purpose is conveyed by naming who's speaking and what they said, not by describing the photo.
WCAG is a technical standard, not a law by itself. Whether it's legally required depends on which law or regulation is in play and which jurisdiction applies — some laws reference it directly, others only get connected to it through case law or procurement policy. What's consistent across nearly all of them is that 1.1.1's requirement for text alternatives shows up as a baseline expectation, which is why it's worth treating as a practical requirement even where no single law spells it out by name.
الأسئلة الشائعة
كل صورة تحتاج إلى خاصية alt. أما ما يوضع بداخلها فيعتمد على الصورة: نص وصفي للصور المعلوماتية أو الوظيفية، وقيمة فارغة (alt="") للصور الزخرفية البحتة. ولا تعني أي من الحالتين حذف الخاصية.
طويل بما يكفي لنقل معنى الصورة، وقصير بما يكفي ليبقى سهل التصفح — جملة واحدة أو أقل عادة. وإذا احتاجت الصورة إلى شرح أوسع، فضع التفاصيل الإضافية في النص المجاور بدلا من إطالة خاصية alt نفسها.
قد يساعد، لأن محركات البحث تستخدمه لفهم محتوى الصورة. لكن النص البديل المكتوب للكلمات المفتاحية قبل الدقة يأتي ضعيفا أمام مستخدمي قارئات الشاشة الذين يُفترض أن يخدمهم، وأمام محركات البحث التي يُفترض أن يؤثر فيها.
يختلف السلوك من قارئ شاشة إلى آخر، لكن غياب خاصية alt يعني غالبا أن قارئ الشاشة يلجأ إلى قراءة اسم الملف، أو يعلن الصورة بلا أي وصف — فيترك المستخدم غير البصري دون أي فكرة عما صادفه.
لا. التسمية التوضيحية نص مرئي يُعرض قرب الصورة لكل قارئ. أما النص البديل فغير مرئي للمستخدمين المبصرين، ووجوده مخصص ليحل محل الصورة لمن لا يستطيع رؤيتها. ويمكن أن تحمل الصورة الاثنين معا، وغالبا ينبغي ذلك.
لا — ينبغي أن تتضمن الخاصية بقيمة فارغة، alt=""، بدلا من حذفها. فالقيمة الفارغة هي ما يخبر قارئ الشاشة بشكل موثوق بتجاوز الصورة، أما الخاصية المفقودة فلا تضمن النتيجة نفسها.

