يستخدم العديد من الأشخاص عملية التطوير المستندة إلى المكوّنات باستخدام أدلة أنماط الأنماط أو مكتبات المكوّنات أو أنظمة التصميم الكاملة في عملية تطويرهم. حتى إذا لم تكن قد استخدمت هذه الأدوات رسميًا، من المرجّح أنّك تستخدم عملية مماثلة لتقسيم تصميم كبير لموقع إلكتروني أو تطبيق أو منتج رقمي آخر إلى أجزاء قابلة للإدارة.
مثل بناء بنية مادية، من المهم إنشاء قطعة واحدة في كل مرة. أولاً، الأساس والهيكل والجدران والنوافذ والسقف وكل ما يتعلّق بهم. تتيح لنا أدوات التطوير المستندة إلى المكوّنات إجراء ذلك للمواقع الإلكترونية والتطبيقات والمنتجات الرقمية الأخرى.
تشمل بعض مزايا التطوير المستنِد إلى المكوّنات تقسيم المهام إلى أجزاء قابلة للإدارة، ما يقلل من وقت التطوير باستخدام هذه المكوّنات القابلة لإعادة الاستخدام. ويسمح للمصمّمين ومطوّري الواجهة الأمامية والخلفية وخبراء ضمان الجودة بالعمل معًا في الوقت نفسه. ويحبّذ العملاء والمصمّمون ومدراء المشاريع وغيرهم من المستخدمين هذا الأسلوب لأنّه يمكنهم معاينة عملية التصميم واستخدام دليل الأنماط المتغير كمرجع بعد إطلاق الموقع الإلكتروني.
ومع ذلك، عند النظر إلى الأنماط والمكونات وأنظمة التصميم مع مراعاة سهولة الاستخدام، تطرح بعض الأسئلة. كيف يمكنك معرفة النماذج الأفضل من حيث تسهيل الاستخدام؟ هل يجب استخدام نمط أو مكتبة راسخة، أم إنشاء أنماط أو مكتبات جديدة؟ كيف يمكنك معرفة ما إذا كانت هذه الأنماط ستساعد المستخدمين حقًا؟
مع كثرة الخيارات المتاحة، من السهل الخلط بين النماذج والمكوّنات وأنظمة التصميم. تهدف هذه الوحدة إلى تقديم معلومات عامة حول كيفية تقييم الأنماط والمكوّنات وأنظمة التصميم من أجل اتّباع مبادئ تسهيل الاستخدام، كما تقدّم لك نقطة بداية لمساعدتك في اتخاذ خيارات اتّباع مبادئ تسهيل الاستخدام بشكلٍ أكبر.
التفكير بشكل نقدي
إنّ اختيار نمط أو مكوّن أو نظام تصميم سهل الاستخدام ليس علمًا صعصعًا، ولكنه يتطلّب الوقت والتفكير النقدي. في الواقع، لا يوجد "نمط مثالي" واحد، ولكن قد يكون هناك العديد من الخيارات التي يمكن أن تؤدي إلى تحقيق النجاح. إنّ الأمر يتعلق بتعلم اختيار الخيار الأفضل لحالتك الفردية.
في وحدات الاختبار اللاحقة، ستقرأ المزيد عن التقنيات وال methods حول كيفية تقييم الأنماط والمكوّنات وأنظمة التصميم لأجل سهولة الاستخدام. قبل الوصول إلى هذا المستوى، عليك طرح بعض الأسئلة الأساسية، مثل:
- هل سبق أن تم تحديد نمط أو مكوّن أو نظام تصميم سهل الاستخدام؟
- ما هي المتصفحات والتكنولوجيا المساعِدة (AT) التي أقدّمها؟
- هل هناك أي قيود على الرموز البرمجية أو إطار العمل؟ هل هناك عمليات دمج أو عوامل أو احتياجات أخرى للمستخدمين يجب أخذها في الاعتبار؟
استنادًا إلى بيئة المطوّرين واحتياجات المستخدمين، قد تكون لديك أسئلة إضافية أو مختلفة عن هذه الأسئلة. يمكنك استخدام هذه الأسئلة كنقطة بداية في تقييم تسهيل الاستخدام.
الموارد الراسخة
قبل إنشاء عنصر جديد تمامًا، عليك إجراء التدقيق اللازم ومراجعة ما هو متوفّر حاليًا من أنماط ومكونات وأنظمة تصميم يمكن الوصول إليها. من خلال إجراء القليل من البحث، قد تفاجأ بالعثور على حلّ (أو حلول متعددة) تناسب احتياجاتك.
تشمل بعض المصادر الرائعة للأنماط والمكونات وأنظمة التصميم التي يمكن الوصول إليها ما يلي:
- المكوّنات القابلة للوصول
- مكتبة ARIA في Deque University
- نظام التصميم في Gov.UK
- المكوّنات الشاملة
- MagentaA11y
- نظام تصميم الويب في الولايات المتحدة (USWDS)، الذي تم إنشاؤه للحكومة الفيدرالية الأمريكية
- قائمة بالأنماط القابلة للوصول من Smashing Magazine
بالنسبة إلى إطارات عمل JavaScript، يمكن الوصول إلى المَراجع التالية بشكلٍ معقول تلقائيًا أو يمكن تخصيصها لتسهيل الاستخدام:
- متطلبات JavaScript للمكوّنات التي يمكن الوصول إليها عندما لا تكون خدمة مقارنة الأسعار (CSS) كافية
- التفاعل
- Angular: مكتبة Material
- Vue: Vuetensils
ومع ذلك، يجب عدم نسخ/لصق الرمز البرمجي فقط والافتراض أنّه سيتوافق مع بيئتك وسيلبي تلقائيًا احتياجات المستخدمين. وينطبق ذلك على جميع الأنماط والمكوّنات وأنظمة التصميم، حتى إذا تم تصنيفها على أنّها قابلة للوصول إليها بالكامل.
يجب اعتبار جميع المراجع نقطة بداية. احرص على اختبار كل العناصر.
المتصفّحات والتكنولوجيا المساعِدة (AT) المتوافقة
بعد البحث عن بعض الأنماط الأساسية أو المكوّنات أو نظام التصميم الكامل الذي قد يكون مناسبًا لبيئة التطوير، يمكنك الانتقال إلى دعم تكنولوجيات المساعِدة. أحد أنواع تكنولوجيات مساعدة المستخدمين الرئيسية التي يجب التركيز عليها عند تقييم النماذج والمكونات وأنظمة التصميم هي برامج قراءة الشاشة.
تم تصميم برامج قراءة الشاشة مع مراعاة متصفحات معيّنة، وتعمل بشكل أفضل عند استخدامها مع هذه المتصفحات. سنتناول هذا الموضوع بالتفصيل في القسم المخصص لاختبار AT، ولكن لأغراض تقييم الأنماط، من المفيد معرفة أنّه يمكن الجمع بين هذه العناصر، وبالتالي معرفة ما تحتاجه من الدعم.
| قارئ الشاشة | نظام التشغيل | توافُق المتصفح | التكلفة |
|---|---|---|---|
| Job Access with Speech (JAWS) | Windows | Chrome وFirefox وEdge | يلزم توفُّر ترخيص (تتوفّر نسخة مجانية مدتها 40 دقيقة) |
| Non-Visual Desktop Access (NVDA) | Windows | Chrome وFirefox | مجاني (يتطلب التنزيل) |
| الراوي | Windows | Edge | مجاني (مضمّن في أجهزة Windows) |
| VoiceOver | نظام التشغيل Mac | Safari | مجاني (مضمّن في أجهزة macOS) |
| Orca | Linux | Firefox | مجاني (مضمّن في التوزيعات المستندة إلى Gnome) |
| Talkback | Android | Chrome وFirefox | مجاني (مُدمج في إصدارات معيّنة من نظام التشغيل Android) |
| VoiceOver | iOS | Safari | مجاني (مضمّن في أجهزة iOS) |
إنّ توافق المتصفّحات مع التكنولوجيا بشكل عام معقّد، وتصبح الأمور أكثر تعقيدًا عند إضافة أجهزة AT ومواصفات ARIA إلى المزيج.
ولكن هناك أخبار سارّة. لحسن الحظ، تتوفّر موارد رائعة مثل تسهيل الاستخدام في HTML5 و تسهيل الاستخدام و قائمة التحقّق من تسهيل الاستخدام في عناصر التحكّم المخصّصة ضمن إرشادات WCAG، والتي تساعدنا على فهم مدى توافق المتصفحات الحالية وأجهزة تكنولوجيات المساعدة بشكل أفضل، ومعرفة متى يجب استخدام ARIA في المقام الأول.
توضّح هذه المراجع العناصر الفرعية المختلفة لنموذج HTML وARIA المتوفّرة، بما في ذلك اختبارات المجتمع المفتوح المصدر. يمكنك أيضًا مراجعة بعض مثال على النماذج لمتصفّحات أجهزة الكمبيوتر المكتبي والأجهزة الجوّالة وأجهزة AT. وبالتالي، يمكن أن تساعدك هذه الموارد في اتخاذ قرار أكثر سهولة بشأن الأنماط والمكونات وأنظمة التصميم التي قد تريد استخدامها.
اعتبارات أخرى
بعد اختيار بعض الأنماط أو المكوّنات الأساسية التي يمكن الوصول إليها، والأخذ في الاعتبار مدى توفّر المتصفّح وأجهزة تكنولوجيات المساعدة، يمكنك الانتقال إلى أسئلة سياقية أكثر تحديدًا حول النمط والمكوّن ونظام التصميم وبيئة المطوّرين.
على سبيل المثال، إذا كنت تعمل في نظام إدارة (CMS) أو كان لديك رمز برمجي قديم، قد تكون هناك بعض القيود على الأنماط التي يمكنك استخدامها. بعد المراجعة، قد يتم تقليل خيارات الأنماط المتعددة بسرعة إلى خيار واحد أو خيارَين.
تسمح العديد من إطارات عمل JavaScript للمطوّرين باستخدام أي نمط يصعدونه. في مثل هذه الحالات، قد تكون القيود المفروضة عليك أقلّ، ويمكنك اختيار خيار النمط الأسهل استخدامًا.
هناك اعتبارات إضافية يجب مراعاتها عند اختيار نمط أو مكوّن أو نظام تصميم، مثل:
- الأداء
- الأمان
- تحسين محركات البحث
- إتاحة ترجمة النصوص
- عمليات الدمج مع جهات خارجية
ستؤثّر هذه العوامل بلا شك في اختيارك للنمط، ولكن عليك أيضًا مراعاة المستخدمين الذين ينشئون المحتوى والرمز البرمجي نفسه. يجب أن يكون النمط الذي تختاره قويًا بما يكفي للتعامل مع أيّ قيود محتملة حول المحتوى الذي ينشئه المحرّرون أو المستخدمون، بالإضافة إلى أنّه يجب إنشاؤه بطريقة يمكن للمطوّرين الذين لديهم كلّ المعرفة المتعلّقة بإمكانية الاستخدام استخدامها.
التحقّق من فهمك
اختبِر معلوماتك حول الأنماط
هل تظل المكوّنات القابلة للوصول متاحة للمستخدمين في جميع الأوقات؟