القاعدة الأولى: لا ARIA أفضل من ARIA سيئة
تعرّف إلى سبب كون HTML الأصلي الخيار الأفضل في معظم الحالات.
القاعدة الأولى: لا ARIA أفضل من ARIA سيئة درس مجاني في Web Accessibility Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Web Accessibility Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Web Accessibility Academy 4 دروس في المجموع.
ما هي ARIA فعلًا
إن ARIA مجموعة من سمات HTML تخبر التقنيات المساعدة بماهية العنصر ووظيفته، عندما لا يستطيع الترميز وحده التعبير عن ذلك.
لا تغيّر ARIA السلوك
لكن انتبه إلى النقطة المهمة: تغيّر ARIA ما يتم الإعلان عنه فقط. فهي لا تضيف النقر أو التركيز أو دعم لوحة المفاتيح من تلقاء نفسها.
<div role="button">Save</div>
<!-- looks like a button, does nothing -->القاعدة الأولى لـ ARIA
القاعدة الرسمية الأولى هي: إذا كان عنصر HTML أصلي يستطيع تنفيذ المهمة، فاستخدمه بدلًا من إعادة إنشائه باستخدام ARIA.
تأتي العناصر الأصلية مكتملة الوظائف
يكون الزر الحقيقي قابلًا للتركيز، ويستجيب لـ Enter وSpace، ويعلن دوره مجانًا. ولا تحتاج إلى كتابة أي من ذلك بنفسك.
<button>Save</button>
<!-- focus, keyboard, role: all built in -->لماذا تكون ARIA السيئة أسوأ
الدور الخاطئ يكذب على المستخدمين فعليًا. ولا تكون ARIA السيئة أفضل من عدم استخدام ARIA إلا في زيادة الضرر؛ إذ قد تخفي المحتوى أو تصفه بشكل غير صحيح.
فخ التجاوز
تتجاوز ARIA الدلالات الأصلية. فإذا أضفت role=presentation إلى عنوان، يتوقف قارئ الشاشة عن التعامل معه كعنوان تمامًا.
<h2 role="presentation">Pricing</h2>
<!-- no longer a heading to AT -->ثلاثة أشياء توفرها ARIA
توفر ARIA ثلاثة أنواع من المعلومات فقط: دور (ماهيته)، وحالات، وخصائص. وهذه هي مجموعة الأدوات كاملة.
ARIA لا تمس CSS
يؤدي ضبط aria-hidden على عنصر إلى إخفائه عن قارئات الشاشة، لكنه يظل ظاهرًا بالكامل على الشاشة. فالطبقتان منفصلتان.
<span aria-hidden="true">decorative star</span>
<!-- seen, not heard -->متى تكون ARIA هي الخيار الصحيح
استخدموا ARIA عندما لا يناسبكم أي عنصر أصلي، مثل tablist أو شريط تمرير مخصص. ثم استخدموها بدقة واختبروها.
اجمعوا ARIA مع JavaScript
إذا اضطررتم إلى إنشاء أداة مخصصة، فـARIA مع JavaScript يعملان معًا. تسمّي ARIA الأداة، بينما يوفر JS منطق التركيز ولوحة المفاتيح.
الأقل أفضل
غالبًا ما تحتوي أفضل الصفحات الميسّرة على قدر قليل جدًا من ARIA. ابدؤوا بـHTML الدلالي أولًا، واستخدموا ARIA فقط لسد الفجوات المتبقية.
تحقق سريع
تحتاجون إلى عنصر Save قابل للنقر. ما الخيار الأكثر إتاحة؟
مراجعة: استخدام ARIA بحكمة
تعلمتم أن ARIA تصف ولا تحدد السلوك أبدًا. فضّلوا HTML الأصلي، وأضيفوا ARIA فقط لسد الفجوات الحقيقية، واختبروها في كل مرة. 🎯
تعلم HTML مع معلم ذكاء اصطناعي — مجانًا
اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.
- الدورات
- 30
- الدروس
- 120
الأسئلة الشائعة
هل درس «القاعدة الأولى: لا ARIA أفضل من ARIA سيئة» مجاني؟
نعم — نص درس «القاعدة الأولى: لا ARIA أفضل من ARIA سيئة» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Web Accessibility Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Web Accessibility Academy 4 دروس في المجموع.
ماذا ستتعلم في «القاعدة الأولى: لا ARIA أفضل من ARIA سيئة»؟
تعرّف إلى سبب كون HTML الأصلي الخيار الأفضل في معظم الحالات. تتمرن على Web Accessibility Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Web Accessibility Academy؟
لا تُشترط خبرة سابقة. Web Accessibility Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «القاعدة الأولى: لا ARIA أفضل من ARIA سيئة»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Web Accessibility Academy هذا؟
نعم. كل درس في Web Accessibility Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- القاعدة الأولى: لا ARIA أفضل من ARIA سيئة
- الأدوار تحدد ماهية الشيء
- الحالات والخصائص: موسّع، محدد، معطّل
- قراءة شجرة إمكانية الوصول لتصحيح ARIA