يمكن الحفاظ على ألوان الشركة وخطوطها وترتيب الواجهة دون إلزام كل مستخدم بالمؤثرات نفسها. عندما يختار المستخدم تقليل الحركة في نظامه، ينبغي أن تظل الأزرار والحالات والمحتوى مفهومة. المطلوب تصميم بديل يؤدي الوظيفة، وليس حذف إشارات النجاح أو ترك فراغ مكان عنصر كان يظهر بالحركة.
ميز الحركة عن المعنى
احصر المؤثرات: انتقال صفحات، تكبير بطاقات، تحريك خلفية، عداد أرقام، ومؤشر تحميل. أمام كل مؤثر اكتب وظيفته. إذا كان يؤكد اكتمال إجراء، وفر نصًا أو رمزًا واضحًا للحالة بدل الاعتماد على الحركة وحدها. وإذا كان زخرفيًا، فكر في نسخة ثابتة تحافظ على التكوين والهوية.
راجع كذلك الحركة الناتجة عن التمرير أو تحريك المؤشر، لا النقر فقط. اختبر رحلة المستخدم كاملة من فتح القائمة إلى إرسال نموذج، لأن مؤثرًا صغيرًا يتكرر في كل خطوة قد يكون أكثر حضورًا من فيديو كبير يراه المستخدم مرة واحدة.
افهم نطاق المعيار والتفضيل
تشرح W3C معيار Animation from Interactions في WCAG 2.2، وهو معيار بالمستوى AAA للحركة غير الضرورية الناتجة عن التفاعل. وتوضح أن الحركة التلقائية تدخل في متطلبات أخرى أيضًا. لذلك لا تعتبر دعم تقليل الحركة شهادة توافق شاملة، ولا تخلط اختبار هذا التفضيل مع مراجعة الفيديو التلقائي بأكملها.
تعرض تقنية CSS C39 من W3C استخدام prefers-reduced-motion واحترام إعداد النظام. يمكن تصميم الحالة الثابتة أولًا ثم إتاحة الحركة لمن لم يطلب تقليلها، أو توفير بديل مناسب عند اختيار reduce. المهم أن يظل المحتوى والحالة متاحين في الحالتين.
صمم بدائل محددة لكل مكون
| المكون | بديل مقترح للمراجعة |
|---|---|
| بطاقة تكبر عند التركيز | حد واضح أو تغير لون يحافظ على موضعها |
| عداد يتحرك إلى رقم النتيجة | عرض القيمة النهائية مباشرة |
| دخول محتوى من خارج الشاشة | محتوى ظاهر دون انتقال مكاني |
| رسالة نجاح متحركة | نص ورمز ثابتان مع إعلان مناسب للحالة |
هذه بدائل مقترحة وليست تغييرات مطبقة تلقائيًا على كل موقع. راجعها مع المصمم حسب وظيفة المكون. لا تكتف بجعل مدة جميع الحركات صفرًا عبر قاعدة شاملة؛ قد يعتمد كود المكون على حدث نهاية الحركة أو يخفي المحتوى حتى اكتمالها.
اختبر بإعداد نظام حقيقي
فعّل تقليل الحركة على جهاز الاختبار وأعد تنفيذ التفاعلات بلوحة المفاتيح والمؤشر. راجع ظهور المحتوى والتركيز ورسائل الخطأ وعدم فقد خطوات النموذج. عطّل التفضيل وكرر الرحلة للتأكد من سلامة التجربتين. اختبر تغير الإعداد أثناء الاستخدام إذا كان ذلك ضمن نطاق الدعم.
ضمن تصميم UI وUX سلّم حالات المكونات والبدائل الثابتة، ثم راجع تنفيذها في الموقع. افحص الفيديو والحركة التلقائية والتحكم في الإيقاف بصورة مستقلة. القبول هنا تجربة مفهومة تحترم التفضيل وتحافظ على الهوية؛ تظل مراجعات التباين ولوحة المفاتيح والتسميات مطلوبة لتقييم إمكانية الوصول على نطاق أوسع.
