إضافة نص بديل إلى الصور

إضافة وصف منسق إلى الصور والرسوم البيانية لتحسين الفهم

يمكن أن تكون الصور وسيلة رائعة لجذب الزوار ويمكن أن تساعد في توصيل الأفكار المعقدة.

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

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

يرتب Ally المشكلات، فيبدأ بالخطيرة ثم الرئيسية ثم الثانوية.

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

يعتبر النص البديل المفقود للصور مشكلة رئيسية.

استخدام Ally للبحث عن الأوصاف المفقودة للصور

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

يوجد جدول "مشكلات إمكانية وصول ذوي الاحتياجات الخاصة" في كل من علامتي التبويب "نظرة عامة" و"المجال". ابدأ في علامة التبويب "المجال" للاطلاع على المشكلات الخاصة بالمجال. 

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

إذا بدأت في علامة التبويب نظرة عامة، فحدد المشكلة ثم المجال الذي يحتوي على المشكلة.

يمكن أن تبدأ مشكلات وصف الصورة باستخدام الصورة أو المستند أو HTML في القائمة.

من قائمة مشكلات أوصاف الصور في المجال، حدد مؤشر الدرجة بجوار عنصر يحتوي على المشكلة. تظهر لوحة ملاحظات محرر المحتوى.

معاينة الصور بدون أوصاف

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

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

أدوات المعاينة

استخدم أدوات المعاينة لاستكشاف المشكلات في المستند.

• تنقل عبر المعاينة صفحة تلو الأخرى.
• تعرف على عدد المرات التي تظهر فيها مشكلة محددة.
• تنقل بين مواضع تمييز المشكلة.
• قم بإخفاء أو إظهار المواضع المميزة.
• قم بتكبير محتوى المعاينة أو تصغيره.
• إذا كانت المشكلة في مستند مرفق، فقم بتنزيل الملف الأصلي.

اتباع الخطوات الإرشادية الخاصة بـ Ally لإضافة أوصاف للصور

يفترض Ally أن لديك معرفة أساسية بـ HTML وكيفية استخدام نظام إدارة المحتوى (CMS). لاتباع الخطوات الإرشادية، تحتاج إلى معرفة كيفية تحرير صفحة ويب في HTML أو التعليمة البرمجية المصدر في نظام إدارة المحتوى.

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

حدد كيفية إضافة الأوصاف، لاتباع الخطوات الإرشادية.

طرق لإضافة أوصاف الصور على صفحات الويب

هناك أكثر من طريقة لإضافة أوصاف الصور أو تحريرها على صفحات الويب لديك.

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

تفضل بزيارة w3schools لمعرفة المزيد عن HTML وCSS

لماذا لا أرى "img src" في HTML لديَّ؟

تتمثل الطريقة الأكثر شيوعًا لإضافة الصور إلى صفحة الويب في استخدام سمة HTML img src. وتعد Img src سمة HTML التي تستخدم عنوان URL لملف الصورة لوضع الصورة على صفحة الويب. ولكن يختلف كل نظام من أنظمة إدارة المحتوى عن غيره. قد يستخدم موقعك تعليمات برمجية أو سمات مختلفة. 

على سبيل المثال، في Drupal قد ترى شيئًا كهذا بدلاً من ذلك:

<drupal-entity data-embed-button="media_browser" data-entity-embed-display="view_mode:media.embedded" data-entity-type="media" data-entity-uuid="2961e3a2-8fbe-4e3f-baeb-953d69f70750"></drupal-entity>

أضف نصًا بديلاً إلى بداية السمة. على سبيل المثال،

<drupal-entity alt="أضف وصف الصورة هنا" data-embed-button="media_browser" data-entity-embed-display="view_mode:media.embedded" data-entity-embed-display-settings="" data-entity-type="media" data-entity-uuid="2961e3a2-8fbe-4e3f-baeb-953d69f70750"></drupal-entity>

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

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