Web Utilities
Developer Toolsاختبار التنقل بلوحة المفاتيح
اختبر إمكانية الوصول بلوحة المفاتيح مع تتبع الأحداث في الوقت الفعلي وتصور التركيز واكتشاف ترتيب Tab. ضمان الامتثال لمعايير WCAG.
التحكم
التركيز الحالي
Noneنصائح الاستخدام
- • استخدم Tab للتقدم عبر العناصر القابلة للتركيز
- • استخدم Shift + Tab للتراجع عبر العناصر القابلة للتركيز
- • اضغط Enter أو المسافة لتفعيل الأزرار والروابط
- • استخدم أسهم الاتجاه للتنقل داخل مجموعات عناصر النموذج
- • تحقق من ترتيب Tab لضمان تدفق التنقل المنطقي
- • تحقق من إمكانية الوصول لجميع العناصر التفاعلية بلوحة المفاتيح
منطقة الاختبار
حاول التنقل عبر هذه العناصر بلوحة المفاتيح (Tab، Shift+Tab، Enter، المسافة، أسهم الاتجاه):
أحداث لوحة المفاتيح (0)
لم يتم تسجيل أي أحداث للوحة المفاتيح بعد. ابدأ التتبع لرؤية الأحداث.
أحداث التركيز (0)
لم يتم تسجيل أي أحداث تركيز بعد. ابدأ التتبع وانتقل بـ Tab.
أدوات ذات صلة
حول اختبار التنقل بلوحة المفاتيح
كيف يعمل
- تتبع جميع أحداث لوحة المفاتيح في الوقت الفعلي
- مراقبة تغييرات التركيز أثناء التنقل
- اكتشاف وعرض ترتيب Tab للعناصر القابلة للتركيز
- تحديد المفاتيح المعدِّلة في التوليفات
- اختبار إمكانية الوصول مع عناصر نموذجية تفاعلية
حالات الاستخدام الشائعة
- اختبار إمكانية الوصول بلوحة المفاتيح للتطبيقات الويب
- التحقق من ترتيب Tab الصحيح في النماذج والواجهات
- تصحيح معالجات أحداث لوحة المفاتيح
- ضمان الامتثال لـ WCAG للتنقل بلوحة المفاتيح
- تدريب المستخدمين على اختصارات لوحة المفاتيح
الأسئلة الشائعة
ما هو التنقل بلوحة المفاتيح ولماذا هو مهم؟
التنقل بلوحة المفاتيح هو القدرة على استخدام موقع ويب أو تطبيق باستخدام إدخالات لوحة المفاتيح فقط دون الحاجة إلى الماوس. وهذا ضروري لإمكانية الوصول لأن كثيراً من المستخدمين ذوي الإعاقات يعتمدون على التنقل بلوحة المفاتيح.
كيف يعمل اختبار التنقل بلوحة المفاتيح؟
تتبع الأداة وتعرض جميع أحداث لوحة المفاتيح في الوقت الفعلي، بما في ذلك ضغطات المفاتيح والإفراج والمفاتيح المعدِّلة. كما تراقب تغييرات التركيز أثناء التنقل بين العناصر.
ما أحداث لوحة المفاتيح التي تتبعها هذه الأداة؟
تتبع الأداة أحداث keydown وkeyup لجميع المفاتيح، بما في ذلك المفاتيح الأبجدية الرقمية والرموز الخاصة ومفاتيح التنقل. كما تلتقط مجموعات المفاتيح المعدِّلة.
ما هو ترتيب Tab ولماذا يجب اختباره؟
ترتيب Tab هو التسلسل الذي تتلقى فيه العناصر التفاعلية التركيز عند ضغط المستخدم على مفتاح Tab. يضمن الترتيب المنطقي تنقل المستخدمين بكفاءة عبر موقعك.
كيف يمكنني استخدام هذه الأداة لاختبار الامتثال لـ WCAG؟
ابدأ التتبع وانتقل عبر صفحتك باستخدام لوحة المفاتيح فقط. تحقق من إمكانية الوصول لجميع العناصر التفاعلية عبر Tab، ومن المنطقية الترتيب، ومن وضوح مؤشرات التركيز.
ماذا يجب أن أبحث عنه في سجل أحداث التركيز؟
تحقق من أن جميع العناصر التفاعلية يمكنها تلقي التركيز، وأن الترتيب يتبع تسلسلاً منطقياً، وأنه لا يتم تخطي أي عناصر بشكل غير متوقع.
ما الغرض من قسم منطقة الاختبار؟
توفر منطقة الاختبار مجموعة من العناصر التفاعلية الشائعة لتدرب التنقل بلوحة المفاتيح ورؤية كيفية تتبع الأداة للأحداث.
هل يمكنني اختبار موقعي الخاص بهذه الأداة؟
نعم! بمجرد بدء التتبع، تراقب الأداة أحداث لوحة المفاتيح والتركيز عبر الصفحة بأكملها. يمكنك أيضاً استخدام ميزة اكتشاف ترتيب Tab.
ما هي المفاتيح المعدِّلة وكيف تُعرض؟
المفاتيح المعدِّلة هي Ctrl وShift وAlt وMeta التي تعدِّل سلوك المفاتيح الأخرى. تعرضها الأداة في سجل أحداث لوحة المفاتيح عند ضغطها مع مفاتيح أخرى.
ما هو tabindex وكيف يؤثر على التنقل؟
tabindex هو سمة HTML تتحكم في إمكانية التركيز على العنصر بلوحة المفاتيح. القيمة 0 تجعل العنصر قابلاً للتركيز بترتيبه الطبيعي، و-1 تزيله من التنقل بـ Tab.
كيف يمكنني تحديد مشاكل إمكانية الوصول بلوحة المفاتيح؟
تشمل المشاكل الشائعة: العناصر التفاعلية التي لا تظهر في أحداث التركيز، وترتيب Tab غير المنطقي، ومؤشرات التركيز غير المرئية، وفخاخ لوحة المفاتيح.
ما اختصارات لوحة المفاتيح التي يجب اختبارها لإمكانية الوصول؟
اختبر Tab (للأمام)، وShift+Tab (للخلف)، وEnter (تفعيل الأزرار/الروابط)، والمسافة (تفعيل الأزرار/مربعات الاختيار)، وأسهم الاتجاه، وEscape (إغلاق مربعات الحوار).