هُناك مواقع تكون صعبة أو مُستحيلة الاستخدام على بعض الأشخاص، و السبب هو عدم اتباع المواقع للمعايير العالمية في إمكانية الوصول(Web Accessibility) .
تابعوا الثريد لمعرفة المزيد 🙏
تابعوا الثريد لمعرفة المزيد 🙏
الـ #web_accessibility تعني أنه في إمكان الأشخاص ذوي الاحتياجات الخاصة استخدام الويب والوصول إليه باستخدام التقنيات المساعدة ..
منهم اشخاص يعانون من مشاكل جسدية أو إعاقات بصرية او سمعية يمكنهم استخدام الويب دون حواجز.
منهم اشخاص يعانون من مشاكل جسدية أو إعاقات بصرية او سمعية يمكنهم استخدام الويب دون حواجز.
ليس فقط الأشخاص ذوي الاحتياجات الخاصة أيضاً الأشخاص الطبيعيين محتاجين إلى سهولة الوصول في المواقع ، مثلاً:
شخص يعاني من "إعاقة مؤقتة" مثل كسر الذراع، او لديه "قيود ظرفية" كما هو الحال في ضوء الشمس الساطع أو في بيئة لا يمكنه الاستماع إلى الصوت وغيرهم ..
شخص يعاني من "إعاقة مؤقتة" مثل كسر الذراع، او لديه "قيود ظرفية" كما هو الحال في ضوء الشمس الساطع أو في بيئة لا يمكنه الاستماع إلى الصوت وغيرهم ..
الهدف الأساسي من تصميم الويب هو استخدامه من قبل جميع الأشخاص، بغض النظر عن أجهزتهم أو برامجهم أو قدراتهم العقلية والجسدية ..
تعد الـ #accessibility ضرورية للمطورين والمؤسسات اللي ترغب في إنشاء مواقع ويب وأدوات ويب عالية الجودة ، ولا تستبعد أي شخص من استخدام منتجاتهم وخدماتهم.
أيضاً تعتبر الـ #accessibility من أحسن المُعززات لتجربة المستخدم #UX.
أيضاً تعتبر الـ #accessibility من أحسن المُعززات لتجربة المستخدم #UX.
يمكن تحقيق الـ #accessibility من خلال توظيف الأدوات والتقنيات المطورة لمساعدة المستخدمين ذوي الاحتياجات الخاصة في عملية الإدراك والفهم والمشاركة والتنقل والتفاعل مع الويب.
⚡الـ #W3C وفرت معايير مُساعدة في جعل الويب #accessibility .
والأكثر شُهرة هي WCAG
- Web Content Accessibility Guidelines
مبنية على أربعة مبادئ رئيسية :
1️⃣ Perceivable
القدرة على رؤية المحتوى أو السماع إليه.
2️⃣ Operable
إمكانية الاستخدام عن طريق لوحة المفاتيح أو الصوت.
والأكثر شُهرة هي WCAG
- Web Content Accessibility Guidelines
مبنية على أربعة مبادئ رئيسية :
1️⃣ Perceivable
القدرة على رؤية المحتوى أو السماع إليه.
2️⃣ Operable
إمكانية الاستخدام عن طريق لوحة المفاتيح أو الصوت.
3️⃣ Understandable
محتوى واضح وبسيط.
4️⃣ Robust
قوي أي يمكن استخدام تقنيات مساعدة مثل ( Screen Reader ).
محتوى واضح وبسيط.
4️⃣ Robust
قوي أي يمكن استخدام تقنيات مساعدة مثل ( Screen Reader ).
⚡أيضاً من المعايير المُساعدة التي وفرتها الـ #W3C هي WIA-ARIA.
تقنية تسمح لأجزاء من صفحات الويب التعريف عن نفسها لبرامج Screen Reader ليتمكن من قراءتها بشكل مفيد للمستخدم.
هناك ثلاث خصائص رئيسية:
تقنية تسمح لأجزاء من صفحات الويب التعريف عن نفسها لبرامج Screen Reader ليتمكن من قراءتها بشكل مفيد للمستخدم.
هناك ثلاث خصائص رئيسية:
1️⃣ Role
- والتي تقوم بمضاعفة القيمة الدلالية لبناء عناصر HTML5، والتي تساعد ( Screen Reader ) ببدء القراءة من الأعلى. مثلاً:
<nav role="navigation">
يوجد قواعد أخرى تصف أجزاء مُختلفة مثل "search"
او "banner" وغيرها.
- والتي تقوم بمضاعفة القيمة الدلالية لبناء عناصر HTML5، والتي تساعد ( Screen Reader ) ببدء القراءة من الأعلى. مثلاً:
<nav role="navigation">
يوجد قواعد أخرى تصف أجزاء مُختلفة مثل "search"
او "banner" وغيرها.
2️⃣ Properties
- الخصائص تعطي معاني ودلالات إضافية للعنصر.
مثلاً في HTML ، توجد خاصية تعرض نصًا بديلاً (alt) إذا تعذر عرض الصورة لسبب ما.
تساعد هذه الخاصية في حالات الإعاقات ، مثل الإعاقات البصرية ، والتي تتطلب تقنيات مساعدة مثل ( Screen Reader ) لتحويل النص إلى كلام .
- الخصائص تعطي معاني ودلالات إضافية للعنصر.
مثلاً في HTML ، توجد خاصية تعرض نصًا بديلاً (alt) إذا تعذر عرض الصورة لسبب ما.
تساعد هذه الخاصية في حالات الإعاقات ، مثل الإعاقات البصرية ، والتي تتطلب تقنيات مساعدة مثل ( Screen Reader ) لتحويل النص إلى كلام .
3️⃣ Properties to define live regions
- خصائص مخصصة في تحديد الحالة الحالية للعناصر والتي قد تتغير مع الزمن، مثلاً:
aria-disabled="true"
والتي تخبر ( Screen Reader ) أن المدخل غير مُمَكّن وقد يتغير بشكل برمجي من خلال JavaScript.
- خصائص مخصصة في تحديد الحالة الحالية للعناصر والتي قد تتغير مع الزمن، مثلاً:
aria-disabled="true"
والتي تخبر ( Screen Reader ) أن المدخل غير مُمَكّن وقد يتغير بشكل برمجي من خلال JavaScript.
⚡طريقة اختبار الموقع من ناحية الـ Accessbility ⬇
⚡أخيرا أشاركم بعض المصادر🙏
- المصدر المُستند عليه الثريد
w3.org
- مجموعة تحديات في منصة freecodecamp لتطبيق accessibility
#applied-accessibility" target="_blank" rel="noopener" onclick="event.stopPropagation()">freecodecamp.org
- مقالة عن الـ web accessibility
uxdesign.cc
- المصدر المُستند عليه الثريد
w3.org
- مجموعة تحديات في منصة freecodecamp لتطبيق accessibility
#applied-accessibility" target="_blank" rel="noopener" onclick="event.stopPropagation()">freecodecamp.org
- مقالة عن الـ web accessibility
uxdesign.cc
هناك أكثر من مليار شخص ذوي الاحتياجات الخاصة، و الـ #accessibility هي حق من حقوقهم🙏
Loading suggestions...