توصية للمادة التعليمية:

تسمية العلامة <img> HTML

خصائص HTML <img> alt

ملاحظات وتعليقات تعريف والاستخدام

الخاصية هي خاصية مطلوبة، وتحدد النص البديل عند عدم قدرة العرض على عرض الصورة.

  • تقدير أن المستخدم لا يمكنه رؤية الصورة بسبب الأسباب التالية:
  • سرعة الاتصال البطيئة
  • خطأ في خاصية src
  • عند تعطيل الصور في المتصفح

المستخدم يستخدم ماسح الشاشة

<img> خاصية alt تحدد النص البديل الذي سيتم عرضه في المتصفح عند عدم قدرة العرض على عرض الصورة أو عند تعطيل عرض الصور.

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

!

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

التعليقات:عندما يتحرك المستخدم بمدخل الفأرة فوق عنصر img، سيقوم متصفح Internet Explorer بإظهار قيمة الخاصية alt. هذا السلوك غير صحيح. جميع المتصفحات الأخرى تتقارب مع المعيار، حيث سيتم عرض النص البديل فقط عندما لا يمكن عرض الصورة.

تنبيه:إذا كنت بحاجة إلى إنشاء ملاحظة للصورة، استخدم خصائص العنوان。

مثال

مثال 1

<img src="/i/eg_tulip.jpg" alt="مدينة زهور شانغهاي - التوليب" />

جرب بنفسك

إذا لم يتم عرض الصورة، سيقوم المتصفح بعرض النص البديل، مثل هذا:

مدينة نباتات شانغهاي - التوليب

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

يمكنك تحريك الفأرة فوق الصورة أدناه لرؤية التأثير المتبادل:

مدينة نباتات شانغهاي - التوليب

نص الدائرة الحمراء هو النتيجة التي تظهر عند تحريك الفأرة فوق الصورة في متصفح Internet Explorer 7:

مدينة نباتات شانغهاي - التوليب

مثال 2

تم تحديد صورة تحتوي على نص استبدالها:

<img src="img_girl.jpg" alt="Girl in a jacket" width="500" height="600">

جرب بنفسك

النحو

<img alt="text">

قيمة الخاصية

القيمة وصف
text

تحديد نص استبدال الصورة.

أصول استخدام نص alt:

  • إذا كانت الصورة تحتوي على معلومات - استخدم alt لوصف الصورة
  • إذا كانت الصورة في عنصر a - استخدم alt لوصف رابط الهدف
  • إذا كانت الصورة تستخدم فقط للزينة - استخدم alt=""

دعم المتصفحات

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم

تسمية العلامة <img> HTML