لمن تبني؟

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

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

لمن تبني

تقدّر منظمة الصحة العالمية أن نحو 1.3 مليار شخص، أي قرابة واحد من كل ستة، يعيشون مع إعاقة ملموسة. هذا الرقم وحده يجعل إمكانية الوصول (accessibility) قضية عامة لا هامشية، لكنه يقلّل من عدد المستفيدين الحقيقي. فالإعاقة كثيرًا ما تكون مؤقتة أو ظرفية:

• الرؤية: العمى وضعف البصر وعمى الألوان، وأيضًا شاشة هاتف مشروخة أو وهج الشمس على رصيف المحطة.
• السمع: المستخدمون الصمّ وضعاف السمع، وأيضًا أي شخص في مقهى صاخب أو في مكتبة هادئة بلا سمّاعات.
• الحركة: الرعاش أو الشلل أو فقدان أحد الأطراف، وأيضًا معصم مكسور، أو أمّ تحمل رضيعها بذراع واحدة.
• الفهم والتذكّر: عُسر القراءة (dyslexia) واضطراب فرط الحركة وتشتّت الانتباه (ADHD) وإصابات الدماغ، وأيضًا الإرهاق أو التوتّر أو القراءة بلغة ثانية.

حين تصمّم للعمود الأيسر، يحصل أصحاب العمود الأيمن على الفائدة مجانًا. بُنيت الترجمة النصية المصاحبة للفيديو (captions) في الأصل للمشاهدين الصمّ؛ واليوم يُشاهَد جزء كبير من فيديو الشبكات الاجتماعية والصوت مكتوم.

حال الويب اليوم

تُجري WebAIM كل عام فحصًا آليًا للصفحات الرئيسية لأشهر مليون موقع. وجد فحص 2026 إخفاقات WCAG قابلة للرصد في 95.9% منها، بمتوسط 56 خطأً في الصفحة الواحدة. اللافت هو مدى عادية هذه الأخطاء. وتكاد ست فئات تستأثر بها كلها: نص منخفض التباين، وصور بلا نص بديل (alt text)، وحقول إدخال بلا labels، وروابط فارغة، وأزرار فارغة، وغياب لغة الصفحة. لا يحتاج أيٌّ منها إلى متخصّص. كلٌّ منها يُصلَح في دقائق بمجرد أن تعرف أين تنظر.

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

تعرّف إلى Ticketly

على طول الدورة ستفحص Ticketly وتُصلحه، وهو موقع حجز من صفحة واحدة لمهرجان Harbour Lights، مهرجان موسيقي يقام في عطلة نهاية الأسبوع. يبدو Ticketly سليمًا حين تستخدمه بالفأرة. لكن تحت السطح توجد فيه مشكلات WebAIM الست الكلاسيكية كلها، إضافةً إلى منتقي مقاعد لا يستجيب إلا للنقر، ونافذة «احجز الآن» تترك تركيز لوحة المفاتيح خلفها في الصفحة، ورسائل خطأ تظهر بصمت، وعنوان فعالية بالعربية يُقرأ بصوت إنجليزي.

كل درس يتناول شريحة واحدة من Ticketly. القسم 2 يعيد بناء هيكله بـ HTML دلالي. القسم 3 يجعله قابلًا للتشغيل بالكامل من لوحة المفاتيح وقارئ الشاشة. القسم 4 يُصلح ما يراه الناس ويقرؤونه. القسم 5 يختبر النتيجة باستخدام axe ولوحة المفاتيح وVoiceOver وNVDA، ويحوّل الدروس إلى عادات لفريق كامل.

لكن قبل أن تغيّر سطرًا واحدًا من الكود، عليك أن تعرف ما الذي يستخدمه زوّار Ticketly للوصول إليه. يتناول الدرس التالي التقنيات المساعدة (assistive technology) وشجرة إمكانية الوصول (accessibility tree) التي تقرؤها.