كيف تختبر إمكانية الوصول إلى موقعك: أدوات مجانية وفحوص يدوية

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

يبيّن هذا الدليل كيف تختبر موقعك كما ينبغي بميزانية صغيرة: أي الأدوات المجانية تشغّل، وروتين يدوي في 15 دقيقة، وأول تجربة لك مع قارئ الشاشة، ومتى تدفع مقابل تدقيق لإمكانية الوصول.

هل تستطيع أداة فحص آلي أن تخبرني إن كان موقعي سهل الوصول؟

لا. أدوات الفحص الآلي تجد بعض المشكلات بسرعة، لكن كثيرًا من أسئلة إمكانية الوصول تحتاج إلى إنسان يجيب عنها. فحين اختبرت خدمة الحكومة الرقمية في المملكة المتحدة (GDS) عشر أدوات على صفحة فيها 143 خطأً معروفًا، وجدت أفضلها 41% منها. ويقولها W3C بوضوح: أدوات التقييم «لا تستطيع أن تحدد إمكانية الوصول، بل تستطيع فقط أن تساعد في ذلك».

يعود اختبار GDS (يُفتح في علامة تبويب جديدة) إلى فبراير 2017، ونسبة 41% فيه (التي حققتها أداة Asqatasun) شملت تنبيهات الأداة إلى فحوص يدوية. وقد تحسنت الأدوات منذ ذلك الحين، لكن الفجوة لها السبب نفسه. فالبرنامج يستطيع أن يعرف أن صورة ما ليس لها نص بديل. لكنه لا يستطيع أن يعرف أن «فستان أحمر» وصف خاطئ لصورة بدلة زرقاء، ولا إن كان ترتيب التركيز في صفحتك منطقيًا.

لذا تعامل مع أداة الفحص كأنها جهاز إنذار للدخان، لا معاينة هندسية كاملة للمبنى. ومع ذلك يستحق تشغيلها: فقد وجد WebAIM Million 2026 (يُفتح في علامة تبويب جديدة) أخطاء يمكن رصدها في 95.9% من أكثر مليون صفحة رئيسية زيارةً، أي أن في معظم المواقع إصلاحات سهلة وسريعة تنتظر من يُجريها. وكما يقول دليل W3C لاختيار الأدوات (يُفتح في علامة تبويب جديدة): «الحكم البشري ضروري».

ما الأدوات المجانية لاختبار إمكانية الوصول التي أستخدمها؟

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

ما الذي يمكنني فحصه يدويًا في 15 دقيقة؟

الكثير. فـالفحوص السهلة (Easy Checks) (يُفتح في علامة تبويب جديدة) من W3C تغطي عناوين الصفحات، والنص البديل، والعناوين، والتباين، وروابط التخطي، وظهور تركيز لوحة المفاتيح، ولغة الصفحة، والتكبير، والترجمة المصاحبة، وتسميات النماذج. اختر صفحة واحدة مهمة، مثل صفحة منتج أو نموذج الحجز، وامنح كل فحص دقيقة أو اثنتين. وستجد أمورًا لا تُبلغ عنها أي أداة فحص.

يقول W3C إن هذه الفحوص «لا تغطي إلا عددًا قليلًا من مشكلات إمكانية الوصول»، فهي ليست تقييمًا كاملًا. لكنها مع ذلك أفضل ربع ساعة يمكنك أن تقضيها:

1. عنوان الصفحة (دقيقة واحدة). هل تقول علامة التبويب في المتصفح ما هي الصفحة، مثل «احجز طاولة | مطبخ سلمى»، بدل «الرئيسية» في كل مكان؟
2. الصور (دقيقتان). اعرض النص البديل باستخدام WAVE أو أداة مشابهة. هل هو دقيق؟ وهل تُتخطّى الصور الزخرفية؟
3. العناوين (دقيقتان). اعرض قائمة العناوين واقرأها وحدها. هل تصلح فهرسًا للمحتوى؟
4. التباين (دقيقتان). افحص نص المتن، والنص الرمادي الصغير، ونصوص الأزرار، والنص فوق الصور.
5. لوحة المفاتيح (4 دقائق). ضع الفأرة جانبًا وتنقّل في الصفحة بمفتاح Tab (انظر القسم التالي).
6. التكبير (دقيقتان). عند 200%، ثم 400%، هل ما زال بإمكانك قراءة كل شيء واستخدام القائمة دون تمرير أفقي؟
7. النماذج واللغة (دقيقتان). انقر على تسمية كل حقل؛ ففي النموذج المبني جيدًا ينقل ذلك المؤشر إلى الحقل. وراجع تقرير الأداة بحثًا عن لغة صفحة غير محددة.

كيف أختبر موقعي بلوحة المفاتيح؟

أبعِد الفأرة. اضغط Tab للتقدم، وShift+Tab للرجوع، وEnter لفتح الروابط، والمسافة أو Enter لضغط الأزرار، ومفاتيح الأسهم داخل القوائم وأزرار الاختيار. يجب أن تتمكن من الوصول إلى كل عنصر تفاعلي، وأن ترى دائمًا أين أنت، وألّا تعلق أبدًا.

على أجهزة Mac، يتخطى Safari الروابط عند الضغط على Tab حتى تفعّل خيار «اضغط على Tab لتمييز كل عنصر في صفحة الويب» (Press Tab to highlight each item on a webpage) في إعداداته المتقدمة. ثم افحص ما يلي:

• هل ترى دائمًا أين أنت؟ إذا اختفى إطار التركيز، ضاع مستخدم لوحة المفاتيح.
• هل الترتيب منطقي؟ يجب أن يتبع التركيز ترتيب القراءة.
• هل يُحجب شيء؟ إذا غطّت ترويسة ثابتة أو شريط ملفات تعريف الارتباط العنصرَ الذي عليه التركيز، فهذا إخفاق في معيار Focus Not Obscured (عدم حجب التركيز) في WCAG 2.2.
• هل تستطيع الخروج مرة أخرى؟ افتح كل قائمة ونافذة منبثقة وأداة اختيار تاريخ، ثم حاول المغادرة. يجب أن يغلق مفتاح Escape نوافذ الحوار.
• هل يعمل المسار كله؟ أضف منتجًا، وغيّر الكمية، وطبّق قسيمة خصم، وصِل إلى الدفع، كل ذلك دون الفأرة.

دوّن كل إخفاق بدقة: فعبارة «لا يمكن فتح أداة اختيار المقاس في صفحة المنتج بمفتاح Enter أو المسافة» تُصلَح أسرع بكثير من «لوحة المفاتيح لا تعمل».

كيف أختبر موقعي بقارئ الشاشة لأول مرة؟

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

• Mac: يشغّل Command+F5 قارئ VoiceOver ويوقفه؛ ويفتح Control+Option+U «الدوّار» (rotor)، وهو قائمة بالعناوين والروابط وعناصر النماذج.
• Windows: في NVDA، اضغط H للقفز بين العناوين، وInsert+F7 لعرض قائمة الروابط والعناوين.
• الهاتف: فعّل VoiceOver (على iPhone) أو TalkBack (على Android) واسحب إلى اليمين للانتقال من عنصر إلى آخر. وتعلّم أولًا كيف توقفه.

أنصت لما يهم أكثر. ففي استطلاع WebAIM لمستخدمي قارئات الشاشة لعام 2024 (يُفتح في علامة تبويب جديدة)، قال 71.6% من المشاركين إنهم يتنقلون في الصفحة الطويلة أولًا عبر عناوينها، فابدأ من هناك. ثم اعرض قائمة الروابط: خمسة روابط باسم «اقرأ المزيد» لا تخبر أحدًا بشيء. زر «أضف إلى السلة، كنزة كحلية» مفيد؛ أما «زر» فلا. وأخيرًا، املأ نموذجًا وتحقق من أن كل حقل وكل رسالة خطأ تُقرأ بصوت مسموع.

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

كيف أفحص التكبير وإعادة ترتيب المحتوى وتباعد النص؟

كبّر متصفحك إلى 200% وتحقق من أن النص يكبر دون أن يُقصّ أو يتداخل. ثم اختبر إعادة ترتيب المحتوى (reflow): عند تكبير 400% في نافذة بعرض 1,280 بكسل، يجب أن يتسع المحتوى دون تمرير أفقي. وأخيرًا، زِد التباعد بين الحروف والكلمات والأسطر والفقرات، وتحقق من أن شيئًا لا ينكسر أو يختفي.

تقابل هذه الفحوص معايير WCAG التالية: Resize Text (تغيير حجم النص، 1.4.4)، وReflow (إعادة ترتيب المحتوى، 1.4.10) (يُفتح في علامة تبويب جديدة)، وText Spacing (تباعد النص، 1.4.12) (يُفتح في علامة تبويب جديدة). ويستخدم معيار Reflow عرضًا قدره 320 بكسل CSS، وهو كما يشير W3C «يعادل عرض إطار عرض ابتدائيًا قدره 1280 بكسل CSS عند تكبير 400%». أما Text Spacing فيطلب ألّا يضيع شيء حين يضبط القارئ ارتفاع السطر على 1.5 ضعف حجم الخط، والتباعد بين الفقرات على ضعفين، والتباعد بين الحروف على 0.12 من حجم الخط، والتباعد بين الكلمات على 0.16 منه.

تطبّق «علامة مرجعية برمجية» (bookmarklet) لتباعد النص، وهي نص برمجي صغير يُحفظ علامةً مرجعية في المتصفح، القيم الأربع بنقرة واحدة. ابحث عن نص يفيض خارج الأزرار، وتسميات مقصوصة عند الحافة. وعند تكبير 400% يعرض الحاسوب المحمول تقريبًا ما يعرضه هاتف صغير، لذا فالموقع المتجاوب المبني جيدًا يجتاز كثيرًا من هذا مسبقًا.

كيف أفحص النماذج ورسائل الخطأ وإتمام الشراء؟

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

• رسائل الخطأ. عبارة «إدخال غير صالح» باللون الأحمر لا تكفي. أما «أدخل تاريخ الانتهاء بصيغة MM/YY» بجانب الحقل فتكفي. وبعد الإرسال، يجب أن ينتقل التركيز إلى ملخص الأخطاء أو إلى أول حقل فيه مشكلة.
• تسجيل الدخول والرموز. بموجب معيار Accessible Authentication (المصادقة سهلة الوصول) (يُفتح في علامة تبويب جديدة) في WCAG 2.2، يُعدّ منع اللصق أو منع مديري كلمات المرور إخفاقًا ما لم تتوفر طريقة أخرى للدخول.
• CAPTCHA والمهل الزمنية. صنّف مستخدمو قارئات الشاشة CAPTCHA أكثر العناصر إشكالًا على الويب في استطلاع WebAIM. تحقق من وجود بديل سهل الوصول، ومن إمكانية تمديد المهل الزمنية.

وتتضمن قائمة التحقق من إمكانية الوصول إلى موقعك قائمة أوفى للمتاجر، تشمل أشرطة ملفات تعريف الارتباط والنوافذ المنبثقة.

ماذا يشمل التدقيق الاحترافي لإمكانية الوصول، ومتى أحتاج إليه؟

تدقيق إمكانية الوصول مراجعة منهجية يجريها مختص وفق معيار محدد، عادةً WCAG 2.1 أو 2.2 في المستوى AA. ويجمع بين الفحوص الآلية والاختبار اليدوي والاختبار بالتقنيات المساعدة لقوالبك ومساراتك الأساسية، وينتهي بتقرير مرتّب حسب الأولوية. وتحتاج إليه حين ينطبق عليك القانون، أو قبل إطلاق كبير، أو حين يطلب عملاؤك دليلًا.

قبل أن تتفق على السعر، اسأل:

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

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

لماذا تختبر مع مستخدمين من ذوي الإعاقة؟

لأن استيفاء معيار ما وسهولة الاستخدام ليسا الشيء نفسه. فقد تجتاز صفحة الدفع كل معايير WCAG، ومع ذلك تستغرق من مستخدم قارئ الشاشة عشرين دقيقة. ويقول W3C إن التقييم مع مستخدمين من ذوي الإعاقة «يكشف مشكلات في سهولة الاستخدام لا يكتشفها تقييم المطابقة وحده»، كما أنه يُري فريقك كيف يستخدم الناس الموقع فعلًا.

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

ماذا أفعل بالنتائج؟

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

1. حدّد الأولويات. العوائق في المسارات الأساسية (إتمام الشراء، والحجز، والتسجيل) أولًا، ثم القوالب المشتركة، ثم الصفحات المنفردة.
2. أصلح من المصدر. غيّر القالب أو المكوّن أو المحتوى، لا العَرَض وحده.
3. أعد الاختبار. كرّر الفحوص نفسها، يدويًا وبالأدوات معًا.
4. وثّق. اسرد المشكلات المعروفة، مع تواريخها، في بيان إمكانية الوصول. ويشرح دليلنا إلى WCAG 2.2 المعايير الأحدث.
5. كرّر. أضف فحصًا بلوحة المفاتيح وفحصًا آليًا إلى كل إصدار جديد.

إذا كنت تستخدم أداة لإمكانية الوصول، بما فيها أداتنا، فاختبر وهي مغلقة. فلوحة مثل SiteAccessible تمنح الزوار وسائل إضافية لتعديل الصفحة، لكن WCAG يسأل إن كانت الصفحة تعمل في حالتها الافتراضية. وبعض أنظمة التدقيق لا تقيّم الصفحات التي يعمل فيها نص برمجي من أدوات الطبقة العلوية (overlay)، فاستوضح ذلك من المدقق أولًا.