واي أريا (Web Accessibility Initiative – Accessible Rich Internet Application)

 

واي أريا (Web Accessibility Initiative – Accessible Rich Internet Application)

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

 

ما هي واي أريا (WIA-ARIA)؟

لنلقي نظرة عن ماهية واي أريا، وما الذي يمكنها فعله.

 

مجموعة جديدة من المشاكل:

 

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

 

على سبيل المثال، HTML5 قدمت مجموعة من العناصر الدلالية؛ لتعريف الخواص الشائعة لصفحة الويب (<nav>، و <footer>، وما إلى ذلك)، قبل ظهور هذه العناصر كان المطورون ببساطة يستخدمون <div> بـ طبقات ومعرفات مثل (<div class=”nav”>، )ولكن كانت هذه إشكالية؛ لعدم وجود طريقة سهلة لإيجاد خاصية معينة في الموقع مثل الخاصية الأساسية للتصفح برمجياً.

 

كان الحل البدائي هو إضافة واحد، أو أكثر من الروابط المخفية في مقدمة كل صفحة لربط التصفح (أو أي خاصية أخرى)، على سبيل المثال:

 

<a href=”#hidden” class=”hidden”>Go to navigation</a>

 

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

 

وفي مثال آخر، إذا قامت التطبيقات بتحكمات معقدة مثل اختيار التاريخ، أو قائمة لاختيار أحد القيم..إلخ. تدعم HTML5 أنواع خاصة من المدخلات لتسهيل التحكم كـ:

 

<input type=”date”>

<input type=”range”>

 

 

هذه الخواص غير مدعمة بشكل كافي عبر متصفحات الويب، ومن الصعب أيضاً تنسيقها؛ مما يجعلها غير مفيدة عند دمجها مع تصميم موقع الويب. وكنتيجة، يعتمد المطورون غالباً على مكتبات JavaScript، التي تولد سلسلة متداخلة من الـ <div> أو جدول باسماء الفئات، والتي يتم تنسيقها فيما بعد باستخدام CSS ويتم التحكم بها باستخدام JavaScript.

 

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

 

إدخال واي أريا WAI-ARIA:

 

 

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

 

قواعد التي تعرف ماهية أو ماذا تفعل العناصر. لذا تُسمى أغلبها قواعد مُعرّفة، والتي تقوم بمضاعفة القيمة الدلالية لبناء عناصر HTML5، مثل role=”navigation” (<nav>)s أو role=”complementary” (<aside>)s، وهناك بعض القواعد الأخرى التي تقوم بوصف أجزاء الصفحة المختلفة، مثل قاعدة “banner”، قاعدة “search” ، قاعدة “tabgroup”، قاعدة “tab”، إلخ. والتي غالباً ما توجد في واجهة المستخدم.

 

خصائص تُعرّف خصائص العناصر، والتي تستخدم لإعطاء العناصر معاني ودلالات إضافية. و كمثال، aria-required=”true” والتي تخصص لزوم ملء خانة في استمارة لتكون صحيحة، بينما aria-labelledby=”label” والتي تسمح بإدخال معرفات أو عناصر، وإرجاع كونها عنوان لأي شيء آخر في الصفحة، والتي تتضمن عدة عناصر ( غير ممكنة باستخدام <label for=”input>).

 

حالات خصائص مخصصة في تحديد الحالة الحالية للعناصر، مثل aria-disabled=”true“، والتي تخبر برامج قراءة الشاشة أن المدخل غير مُمَكّن. وتختلف الحالات عن الخصائص في كون الخصائص لا تتغير مع الزمن في نفس التطبيق، أما الحالات فقد تتغير، عامة بشكل برمجي من خلال JavaScript.

 

لا تقوم سمات واي أريا بالتأثير على أي شيء في صفحة الويب، في ما عدا المعلومات المكشوفة لإمكانية الوصول الخاصة بالمتصفح (API) ( من حيث يمكن لبرامج قراءة الشاشة إحضار البيانات). لا تقوم راي أريا بالتأثير على بناء موقع الويب، ومع ذلك قد تُستخدم سماتها في تحديد العناصر باستخدام CSS.

 

أين يتم دعم راي أريا؟

 

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

 

  1. هناك العديد من الخواص في مواصفات واي أريا.
  2. يجب الأخذ في الاعتبار العديد والعديد من التركيبات ( أنظمة تشغيل، برامج قراءة الشاشة، والمتصفحات).


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

 

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

 

  1. تقوم المتصفحات بتدعيم إمكانية الوصول بشكل جيد – في وقت كتابة موقع caniuse.com، تم رصد دعم المتصفحات لـ واي أريا بنسبة تصل لـ 88%.
  2. لا تصل برامج قراءة الشاشة لهذه النسبة مع خواص أريا، ولكن معظم برامج قراءة الشاشة في طريقها إلى هناك.

 

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

 

هل قمت باختبار إمكانية الوصول عند القيام بتصميم موقع الويب؟

 

شاركنا بتجربتك!

 

WhatsApp chat