Category: UI/UX Design

حالة الامتثال

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

To fulfill this, we aim to adhere as strictly as possible to the World Wide Web Consortium’s (W3C) Web Content Accessibility Guidelines 2.1 (WCAG 2.1) at the AA level. These guidelines explain how to make web content accessible to people with a wide array of disabilities. Complying with those guidelines helps us ensure that the website is accessible to all people: blind people, people with motor impairments, visual impairment, cognitive disabilities, and more.

This website utilizes various technologies that are meant to make it as accessible as possible at all times. We utilize an accessibility interface that allows persons with specific disabilities to adjust the website’s UI (user interface) and design it to their personal needs.

Additionally, the website utilizes an AI-based application that runs in the background and optimizes its accessibility level constantly. This application remediates the website’s HTML, adapts Its functionality and behavior for screen-readers used by the blind users, and for keyboard functions used by individuals with motor impairments.

If you’ve found a malfunction or have ideas for improvement, we’ll be happy to hear from you. You can reach out to the website’s operators by using the following email

قارئ الشاشة والتنقل عبر لوحة المفاتيح

Our website implements the ARIA attributes (Accessible Rich Internet Applications) technique, alongside various different behavioral changes, to ensure blind users visiting with screen-readers are able to read, comprehend, and enjoy the website’s functions. As soon as a user with a screen-reader enters your site, they immediately receive a prompt to enter the Screen-Reader Profile so they can browse and operate your site effectively. Here’s how our website covers some of the most important screen-reader requirements, alongside console screenshots of code examples:

1. تحسين قارئ الشاشة: نحن ندير عملية خلفية تتعلم مكونات الموقع من الأعلى إلى الأسفل، لضمان الامتثال المستمر حتى عند تحديث الموقع. في هذه العملية، نوفر لقارئات الشاشة بيانات ذات مغزى باستخدام مجموعة سمات ARIA. على سبيل المثال، نقدم تسميات دقيقة للنماذج؛ وأوصافًا للأيقونات القابلة للتنفيذ (أيقونات الوسائط الاجتماعية، وأيقونات البحث، وأيقونات عربة التسوق، وما إلى ذلك)؛ وإرشادات التحقق من صحة مدخلات النماذج؛ وأدوار العناصر مثل الأزرار والقوائم والحوارات المنبثقة وغيرها. بالإضافة إلى ذلك، تقوم عملية الخلفية بمسح جميع صور الموقع الإلكتروني وتوفر وصفًا دقيقًا وذا مغزى يعتمد على التعرف على كائنات الصورة كعلامة ALT (نص بديل) للصور غير الموصوفة. كما ستستخرج النصوص المضمنة داخل الصورة، باستخدام تقنية التعرف الضوئي على الحروف (OCR). لتشغيل تعديلات قارئ الشاشة في أي وقت، يحتاج المستخدمون فقط إلى الضغط على تركيبة لوحة المفاتيح Alt+1. يحصل مستخدمو قارئ الشاشة أيضًا على إعلانات تلقائية لتشغيل وضع قارئ الشاشة بمجرد دخولهم إلى الموقع الإلكتروني.

   تتوافق هذه التعديلات مع جميع برامج قراءة الشاشة الشائعة، بما في ذلك JAWS وNVDA.

2. تحسين التنقل عبر لوحة المفاتيح: كما تعمل عملية الخلفية على ضبط لغة ترميز النص التشعبي للموقع، وإضافة سلوكيات مختلفة باستخدام كود JavaScript لجعل الموقع قابلاً للتشغيل بواسطة لوحة المفاتيح. ويشمل ذلك القدرة على التنقل عبر الموقع باستخدام مفتاحي Tab وShift+Tab، وتشغيل القوائم المنسدلة باستخدام مفاتيح الأسهم، وإغلاقها باستخدام Esc، وتشغيل الأزرار والروابط باستخدام مفتاح Enter، والتنقل بين عناصر الراديو ومربعات الاختيار باستخدام مفاتيح الأسهم، وملؤها باستخدام مفتاح المسافة أو مفتاح Enter. بالإضافة إلى ذلك، سيجد مستخدمو لوحة المفاتيح قوائم التنقل السريع وتخطي المحتوى، والتي تتوفر في أي وقت بالنقر فوق Alt+1، أو كأول عناصر الموقع أثناء التنقل باستخدام لوحة المفاتيح. كما تتعامل عملية الخلفية مع النوافذ المنبثقة التي يتم تشغيلها عن طريق تحريك تركيز لوحة المفاتيح نحوها بمجرد ظهورها، وعدم السماح للتركيز بالانحراف خارجها.

   Users can also use shortcuts such as “M” (menus), “H” (headings), “F” (forms), “B” (buttons), and “G” (graphics) to jump to specific elements.

ملفات تعريف الإعاقة المدعومة في موقعنا

• الوضع الآمن للصرع: يتيح هذا الملف الشخصي للأشخاص المصابين بالصرع استخدام الموقع بأمان من خلال القضاء على خطر الإصابة بالنوبات التي تنتج عن الرسوم المتحركة الوامضة أو المتقطعة ومجموعات الألوان الخطرة.
• وضع المكفوفين: يقوم هذا الوضع بضبط موقع الويب لراحة المستخدمين الذين يعانون من إعاقات بصرية مثل ضعف البصر، ورؤية النفق، وإعتام عدسة العين، والزرق، وغيرها.
• وضع الإعاقة المعرفية: يوفر هذا الوضع خيارات مساعدة مختلفة لمساعدة المستخدمين الذين يعانون من إعاقات معرفية مثل عسر القراءة، والتوحد، والسكتة الدماغية، وغيرها، للتركيز على العناصر الأساسية للموقع الإلكتروني بسهولة أكبر.
• الوضع الملائم لاضطراب نقص الانتباه وفرط الحركة: يساعد هذا الوضع المستخدمين الذين يعانون من اضطراب فرط الحركة ونقص الانتباه واضطرابات النمو العصبي على القراءة والتصفح والتركيز على العناصر الرئيسية للموقع الإلكتروني بسهولة أكبر مع تقليل عوامل التشتيت بشكل كبير.
• وضع العمى: يقوم هذا الوضع بتكوين موقع الويب ليكون متوافقًا مع برامج قراءة الشاشة مثل JAWS وNVDA وVoiceOver وTalkBack. برنامج قراءة الشاشة هو برنامج للمستخدمين المكفوفين يتم تثبيته على جهاز كمبيوتر وهاتف ذكي، ويجب أن تكون مواقع الويب متوافقة معه.
• ملف تعريف التنقل باستخدام لوحة المفاتيح (ذوي الإعاقة الحركية): يتيح هذا الملف التعريفي للأشخاص ذوي الإعاقة الحركية تشغيل الموقع باستخدام لوحة المفاتيح Tab وShift+Tab ومفاتيح Enter. يمكن للمستخدمين أيضًا استخدام اختصارات مثل "M" (القوائم) و"H" (العناوين) و"F" (النماذج) و"B" (الأزرار) و"G" (الرسومات) للانتقال إلى عناصر محددة.

تعديلات إضافية على واجهة المستخدم والتصميم والقابلية للقراءة

1. Font adjustments – يمكن للمستخدمين زيادة حجمه وتقليله، وتغيير عائلته (النوع)، وضبط المسافات، والمحاذاة، وارتفاع الخط، والمزيد.
2. Color adjustments – يمكن للمستخدمين اختيار ملفات تعريف تباين الألوان المختلفة مثل الفاتح والغامق والمقلوب والأحادي اللون. بالإضافة إلى ذلك، يمكن للمستخدمين تبديل أنظمة الألوان للعناوين والنصوص والخلفيات، مع أكثر من 7 خيارات تلوين مختلفة.
3. Animations – يمكن للمستخدمين المصابين بالصرع إيقاف جميع الرسوم المتحركة الجارية بنقرة زر واحدة. تتضمن الرسوم المتحركة التي يتم التحكم فيها بواسطة الواجهة مقاطع فيديو وصور GIF وانتقالات CSS الوامضة.
4. Content highlighting – يمكن للمستخدمين اختيار التركيز على العناصر المهمة مثل الروابط والعناوين. كما يمكنهم اختيار إبراز العناصر المحددة أو التي يتم تحريك المؤشر عليها فقط.
5. Audio muting – قد يعاني المستخدمون الذين يستخدمون أجهزة سمعية من الصداع أو مشكلات أخرى بسبب التشغيل التلقائي للصوت. يتيح هذا الخيار للمستخدمين كتم صوت الموقع بالكامل على الفور.
6. Cognitive disorders – نحن نستخدم محرك بحث مرتبط بـ Wikipedia و Wiktionary، مما يسمح للأشخاص الذين يعانون من اضطرابات معرفية بفك معاني العبارات والأحرف الأولى واللغة العامية وغيرها.
7. Additional functions – نحن نقدم للمستخدمين خيار تغيير لون المؤشر وحجمه، واستخدام وضع الطباعة، وتمكين لوحة المفاتيح الافتراضية، والعديد من الوظائف الأخرى.

التوافق بين المتصفح والتكنولوجيا المساعدة

نهدف إلى دعم أكبر مجموعة ممكنة من المتصفحات وتقنيات المساعدة، حتى يتمكن مستخدمونا من اختيار أفضل الأدوات المناسبة لهم، مع أقل قدر ممكن من القيود. لذلك، عملنا بجدية شديدة لنتمكن من دعم جميع الأنظمة الرئيسية التي تشكل أكثر من 95% من حصة سوق المستخدمين بما في ذلك Google Chrome وMozilla Firefox وApple Safari وOpera وMicrosoft Edge وJAWS وNVDA (قارئات الشاشة)، لكل من مستخدمي Windows وMAC.

الملاحظات والتعليقات والملاحظات

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