كيف يؤثر التصميم الرائع على إمكانية الوصول إلى موقع الويب

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

ما هو الوصول؟

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

هذا الجمهور المتنوع "يمتد إلى أي شخص يعاني من أي إعاقة دائمة أو مؤقتة أو ظرفية ، على سبيل المثال ، وجود ذراع واحدة هو حالة دائمة ، وجود ذراع مصابة مؤقت ، وحمل طفل في ذراع واحدة هو موقف - في كل حالة ، يستطيع المستخدم إكمال المهام بيد واحدة فقط ". (أفيناش كور ، 2018).

لماذا الولوج مهم؟

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

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

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

كيف نحقق الوصول؟

ستحتاج إلى إجراء بعض التعديلات واتباع إطار عمل للتأكد من أنك تصمم مجموعة متنوعة من القدرات والأعمار ومستوى الخبرة مع الأجهزة.

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

سنلقي نظرة عميقة على 5 مجالات كبيرة:

1. تباين اللون
2. نص بديل
3. حالات التركيز
4. نماذج
5. الطباعة

تباين اللون

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

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

من أجل الحفاظ على تباين لائق بين النص والخلفية ، فإن النسبة الجيدة للمتابعة بحد أدنى 4.5 إلى 1. وهذا يسمح بالوضوح للمستخدمين الذين يعانون من ضعف في الرؤية أو عمى الألوان للتمييز بين الاثنين.

نسبة التباين 4.5 إلى 1 تلتزم بمستوى المطابقة AA (من المستويات الثلاثة: A و AA و AAA) ولكن هذا يتغير بناءً على حجم الخط ومستوى المطابقة الذي ترغب في تحقيقه. تتطلب الخطوط الأكبر حجمًا نسبة تباين أصغر تبلغ 3 إلى 1 فقط إذا كان النوع 18 نقطة (أو 14 نقطة بالخط العريض).

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

نص بديل

بالنسبة للمستخدمين الذين يصلون إلى الويب باستخدام برامج قراءة الشاشة ، لا يتم دائمًا نقل المحتوى المعروض بشكل صحيح. النص البديل (alt) هو ما يستخدمه قارئ الشاشة لإعلام المستخدم بالصور الموجودة على الصفحة.

يمكن القيام بذلك عن طريق تحويل النص البديل إلى طريقة برايل أو وصف صوتي أو قراءة النص بصريًا. هذا يعني أنه من المهم وصف ما يحدث في الصورة بدقة لأولئك الذين لا يمكنهم رؤيتها.

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

حالات التركيز

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

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

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

نماذج

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

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

الطباعة

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

كما ترى ، من الصعب قراءة 9 قروش.

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

• تباعد الأحرف : x0.12 حجم الخط
• تباعد الكلمات : x0.16 حجم الخط
• تباعد الأسطر: X1.5 حجم الخط
• تباعد الفقرات : x2 حجم الخط

استنتاج

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

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

إذا كنت بحاجة إلى مساعدة بشأن Creative ، فلا تتردد في الاتصال بنا.