الصور مع النص البديل: شرح وتمارين وأخطاء شائعة

ماذا يعلّم هذا الدرس فعلًا

أضف صوراً مع نص بديل ذي معنى لإمكانية الوصول. هذا الدرس جزء من مسار «أساسيات الويب (Web)».

الشرح المتعمّق

عنصر img يحتاج src وغالباً نصاً بديلاً مدروساً. البديل يصف دور الصورة لمن لا يرونها وعند فشل التحميل. الصور الزخرفية قد تستخدم بديلاً فارغاً ليتخطاها قارئ الشاشة. لا تحشُ كلمات مفتاحية في البديل. أضف صورة محتوى ببديل وصفي وفاصلاً زخرفياً بـ alt="". ابنِ بطاقة ملف بصورة بديلها يصف الشخص/الدور لا كلمة «صورة». استخدم حلقة علّم←اشرح←بيّن←طبّق في كل مرة تدرس فيها هذه المهارة. تنبّأ بالنتيجة قبل التحقق ثم صحّح الخطوة

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

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

تطبيق عملي

**مثال** <img src="team.jpg" alt="أمينة حسن، قائدة الدعم">

أخطاء شائعة

• alt='صورة' أو اسم ملف • حشو كلمات في البديل • غياب البديل عن صور معلوماتية