أداة مجانية: إمكانية الوصول

فحص إمكانية الوصول للموقع

أدخل عنوان موقعك، وسنختبر تلك الصفحة وما يصل إلى أربع صفحات أساسية أخرى في متصفح حقيقي وفق قواعد WCAG 2.2 للمستويين A وAA. يأتي كل عائق مع العنصر والصفحة ولقطة شاشة وشرح لمن يتأثر به.

مجاني. يختبر حتى خمس صفحات أساسية في نحو دقيقة.

ما تفحصه هذه الأداة

  • خمس صفحات تمثّل موقعك

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

  • قواعد WCAG على الصفحة بعد عرضها

    تُحمَّل كل صفحة في Chromium بأبعاد 1366 × 900، ثم يشغّل axe-core، وهو محرك القواعد مفتوح المصدر من Deque، قواعده الخاصة بالمستويين A وAA في WCAG 2.0 و2.1 و2.2 بعد تنفيذ النصوص البرمجية للصفحة. وبذلك يلتقط المشكلات التي لا يُنشئها القالب أو التطبيق إلا بعد بناء الصفحة في المتصفح.

  • مدى التأثير ومعايير النجاح

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

  • العنصر الفاشل محاطًا بإطار

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

  • عناصر يجب أن يحسمها شخص

    عندما يجد axe-core شيئًا لا يستطيع الحسم فيه، مثل نص فوق صورة خلفية لا يمكنه قياس تباينها، يُدرَج العنصر بحالة «يحتاج إلى مراجعة». ولا يُحتسب أبدًا إخفاقًا.

  • اختبار لوحة المفاتيح

    في الصفحة الأولى نضغط 40 مرة على مفتاح Tab ونسجّل أين ينتقل التركيز: هل يتحرك أصلًا، وهل يعلق في حلقة مفرغة (غالبًا داخل شريط ملفات تعريف الارتباط)، وهل المحطة الأولى رابط تخطٍّ، وأي العناصر لا تُظهر مؤشر تركيز مرئيًا عند تركيزها. هذا الفحص الأخير تقديري، لذا يُعرض بحالة «يحتاج إلى مراجعة».

ما لا يمكنها فحصه

  • سماع ما يعلنه برنامج قراءة الشاشة. يمكن للبرنامج التأكد من أن للزر اسمًا، لا من أن هذا الاسم مفهوم عند قراءته بصوت عالٍ.
  • تقييم التسميات التوضيحية أو النصوص المفرّغة أو الوصف الصوتي لمقاطع الفيديو والصوت.
  • تقييم المعايير المعرفية ومعايير المحتوى، مثل وضوح التعليمات أو ما إذا كانت رسائل الخطأ تساعد الناس على تدارك أخطائهم.
  • اختبار الصفحات المحمية بتسجيل دخول أو كلمة مرور أو حماية من الروبوتات، أو المرور بخطوات إتمام الشراء.
  • إخبارك ما إذا كان موقعك مطابقًا لـ WCAG أو ممتثلًا لأي قانون. تجد القواعد الآلية جزءًا من المشكلات؛ ويحتاج الباقي إلى أشخاص.

لماذا يهم ذلك

كثيرًا ما تكون عوائق إمكانية الوصول أخطاءً صغيرة في القوالب ذات آثار كبيرة. فزر سلة التسوق المكوَّن من أيقونة فقط دون اسم قابل للوصول يُعلَن عنه بكلمة «زر» فحسب، فلا يستطيع مستخدم برنامج قراءة الشاشة معرفة وظيفته. والنص الرمادي على خلفية بيضاء الذي لا يبلغ نسبة التباين 4.5:1 يصعب قراءته على كثير من ضعاف البصر، وعلى أي شخص يستخدم هاتفه تحت أشعة الشمس الساطعة.

ولأن رأس الصفحة وبطاقة المنتج والتذييل نفسها تظهر في كل صفحة، فقد يزيل إصلاح واحد في القالب مئات الإخفاقات دفعة واحدة. لهذا تُجمَّع النتائج حسب القاعدة، مع عدد العناصر والصفحات، بدلًا من سرد كل حالة على أنها مشكلة منفصلة.

ولإمكانية الوصول جانب قانوني أيضًا في كثير من الدول. لا يستطيع الفحص أن يخبرك ما إذا كان قانون ما ينطبق عليك أو ما إذا كنت تستوفيه. ما يقدّمه لك هو قائمة مؤرَّخة بعوائق حقيقية في صفحاتك أنت، وهي نقطة البداية العملية في كل الأحوال.

كيف تقرأ النتائج

حرج
قد يمنع العائق بعض الأشخاص من استخدام العنصر تمامًا، مثل حقل نموذج بلا تسمية أو زر بلا اسم. أصلح هذه أولًا.
خطير
يجعل العائق المهمة أصعب بكثير على بعض الأشخاص، مثل نص المحتوى الذي لا يحقق نسبة التباين.
متوسط
يسبب العائق صعوبة أو التباسًا، لكن الناس يستطيعون عادةً الالتفاف عليه.
طفيف
مشكلة صغيرة أو مصدر إزعاج. ومع ذلك يستحق الإصلاح في المرة القادمة التي تعدّل فيها ذلك القالب.
معايير نجاح WCAG
الأرقام المجاورة للقاعدة، مثل 1.1.1 أو 1.4.3، هي المعايير التي تختبرها. والقاعدة التي لا يظهر بجانبها أي معيار هي ممارسة فضلى وليست متطلبًا من متطلبات WCAG.
العناصر والصفحات
عدد العناصر التي فشلت في القاعدة، وعدد الصفحات المختبَرة التي حدث فيها ذلك. والقاعدة التي تفشل في كل صفحة تقع عادةً في جزء مشترك مثل رأس الصفحة أو القائمة أو التذييل.
يحتاج إلى مراجعة
وجد axe-core شيئًا لم يستطع الحسم فيه. افحص العنصر بنفسك: فقد ينجح أو يفشل. لا تُحتسب هذه العناصر إخفاقات.
مصيدة تركيز
ظل مفتاح Tab يدور بين العناصر القليلة نفسها. إذا كانت تابعة لشريط ملفات تعريف الارتباط، فقد لا يتمكن مستخدمو لوحة المفاتيح من الوصول إلى بقية الصفحة.
التركيز لا يتحرك (Focus doesn’t move)
لم يؤدِّ الضغط على Tab إلى تركيز أي عنصر. قد تكون الروابط والأزرار مبنية من عناصر div أو span، أو قد يكون هناك نص برمجي يبتلع ضغطة المفتاح.
رابط التخطي
ما إذا كانت محطة Tab الأولى رابطًا من نوع «الانتقال إلى المحتوى» (Skip to content). وبدونه يضطر مستخدمو لوحة المفاتيح إلى المرور بمفتاح Tab عبر رأس الصفحة كاملًا في كل صفحة. ويمكن أيضًا للمعالم (landmarks) والعناوين أن تستوفي المعيار WCAG 2.4.1 Bypass Blocks.
لا يوجد مؤشر تركيز مرئي
عناصر حصلت على التركيز لم نرَ فيها إطارًا خارجيًا (outline) أو ظلًا (box shadow) أو خطًا سفليًا. قد يظل نمط مختلف، مثل تغيّر اللون، مرئيًا، لذا تنقّل بين هذه العناصر بمفتاح Tab بنفسك للتأكد.

كيف تصلح أكثر المشكلات شيوعًا

  • نص لا يحقق نسبة التباين

    يحتاج النص العادي إلى نسبة 4.5:1 على الأقل مقابل خلفيته، ويحتاج النص الكبير (نحو 24 px، أو نحو 18.7 px بخط عريض) إلى 3:1. غيّر اللون في إعدادات القالب أو في رموز التصميم (design tokens) بدلًا من تغييره عنصرًا عنصرًا، ثم افحص مجددًا النص النائب (placeholder) وحالات التمرير بالمؤشر والنص فوق الصور.

  • صور بلا نص بديل

    امنح كل صورة ذات معنى سمة alt تصف ما تعرضه أو ما تفعله، مثل اسم المنتج ولونه. أما الصور الزخرفية فتأخذ سمة alt فارغة (alt="") كي تتجاوزها برامج قراءة الشاشة. في Shopify تضيف النص البديل من الصورة في قسم الوسائط (Media) الخاص بالمنتج؛ وفي WordPress من حقل النص البديل (Alternative Text) في مكتبة الوسائط.

  • حقول نماذج بلا تسميات

    اربط تسمية بكل حقل إدخال باستخدام <label for> مطابق لمعرّف الحقل (id)، أو استخدم aria-label حين لا يوجد نص مرئي. لا تعتمد على النص النائب (placeholder) وحده تسميةً: فهو يختفي بمجرد أن يبدأ الشخص الكتابة. وعادةً ما تكون نماذج الاشتراك في النشرة البريدية ومربعات البحث في رأس الصفحة هي مصدر المشكلة.

  • أزرار وروابط بلا اسم قابل للوصول

    كثيرًا ما تحتوي عناصر التحكم الأيقونية الخاصة بالسلة أو البحث أو القائمة أو الحسابات الاجتماعية على SVG فقط. أضف نصًا مرئيًا أو aria-label يوضح وظيفة العنصر («افتح السلة»، وليس «أيقونة»)، وأضف aria-hidden="true" إلى عنصر SVG نفسه.

  • شريط ملفات تعريف الارتباط يحتجز التركيز

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

  • إطارات التركيز المحذوفة في CSS

    ابحث في ملفات الأنماط عن outline: none أو outline: 0 على الروابط والأزرار و:focus، واستبدل بها نمطًا مرئيًا مثل :focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }.

أسئلة حول هذه الأداة

هل أداة فحص إمكانية الوصول هذه مجانية؟

نعم. لا حاجة إلى التسجيل؛ كل ما عليك هو تأكيد أنك تملك الموقع أو تديره. ويضيف تقرير إصلاح إمكانية الوصول المدفوع ما يصل إلى 20 صفحة أخرى من خريطة موقعك، ومسار تنقل بلوحة المفاتيح وحدها، وفحص إعادة التدفق (reflow) بعرض 320 px، وكودًا قبل الإصلاح وبعده مبنيًا على الترميز الفاشل لديك، وأوامر (prompts) للذكاء الاصطناعي، وملف PDF، و5 إعادات اختبار.

ما الجزء الذي يمكن لأداة فحص آلية اختباره من WCAG؟

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

إذا لم يجد الفحص شيئًا، فهل موقعي ممتثل لقانون ADA أو مطابق لـ WCAG؟

لا. لا يمكن لأي اختبار آلي أن يُثبت أن موقعًا مطابق لـ WCAG أو ممتثل لقانون ADA أو للقانون الأوروبي لإمكانية الوصول (European Accessibility Act) أو لأي قانون آخر. النتيجة الخالية من الإخفاقات تعني أن القواعد الآلية لم تجد إخفاقات في الصفحات المختبَرة.

هل يمكنني فحص موقع تجريبي (staging) أو صفحات تتطلب تسجيل الدخول؟

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

أصلحتُ مشكلة، فلماذا تبدو النتيجة كما هي؟

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

يبدأ تقرير إصلاح إمكانية الوصول ($174، دفعة واحدة) من الفحص المجاني الكامل، ويضيف صفحات أكثر، والتغيير المطلوب لكل نتيجة، وملف PDF، وإعادة اختبار للتحقق من إصلاحاتك.

عن تقرير إصلاح إمكانية الوصول