الموارد · 66
الرسوم المتحركة: التحقق من تقليل الحركة والإيقاف المؤقت والفهم
راقب حركة النظام، وقدّم سلوكًا مُخفّضًا، واختبر ما إذا كان التقدم والحالة والتنقل يظلون مفهومين بدون رسوم متحركة.
مُحدَّث · 3 min
ما يُساعد هذا الدليل على تحقيقه
- محفزات المخزون
- تحديد السلوك المُخفَّض
- فصل معايير WCAG
- اختبار جميع التطبيقات
فحص سريع
- هل يمنع تقليل الحركة استخدام الرسوم المتحركة نهائيًا؟
- هل المعيار 2.3.3 من المستوى AA؟
- هل قاعدة CSS عامة كافية؟
طريقة خطوة بخطوة
- 1
محفزات المخزون
سرد الحركات التلقائية، والحركات التي يتم تفعيلها بالتفاعل، والحركات المرتبطة بالتمرير. فصل معلومات الحالة عن العناصر الزخرفية. فحص رسوميات جافا سكريبت المتحركة، والفيديو، والعناصر المضمنة أيضًا.
المخرج: المخرجات: سجل التأثيرات والغرض منها.
- 2
تحديد السلوك المُخفَّض
يشير خيار "تفضيل الحركة المخففة" إلى الرغبة في تقليل الحركة غير الضرورية. تقديم بديل ثابت أو أكثر هدوءًا مع الحفاظ على المعلومات وعناصر التحكم. تجنب استبدال عمليات النقل الكبيرة بتأثير آخر مشتت للانتباه.
المخرج: المخرجات: تقليل السلوك لكل مكون.
- 3
فصل معايير WCAG
معيار الرسوم المتحركة التفاعلية 2.3.3 هو المستوى AAA. يغطي معيار المستوى A 2.2.2، من بين أمور أخرى، بعض الحركات التلقائية التي تستمر لأكثر من خمس ثوانٍ بجانب محتوى آخر، ما لم تكن ضرورية. تحقق من شروط المعيار المطبق.
المخرج: المخرجات: المعايير وعناصر التحكم لكل تأثير.
- 4
اختبار جميع التطبيقات
محاكاة التفضيلات قبل التحميل وأثناء الجلسة. فحص الأنماط، والبرامج النصية، والتمرير البرمجي. إذا كانت حالة النظام تعتمد على اكتمال الرسوم المتحركة، فيجب ضمان الوصول إلى نتيجة موثوقة حتى عند إزالة الرسوم المتحركة.
المُخرَج: تجارب التحميل البارد، والتغيير المباشر، والحالة النهائية.
- 5
الحفاظ على المعلومات وعناصر التحكم.
اختبار القراءة، ولوحة المفاتيح، وردود الفعل عند حدوث خطأ في كلا الوضعين. بالنسبة للحركة التلقائية المتأثرة، اختبر الإيقاف المؤقت، أو الإيقاف، أو الإخفاء، والثبات أثناء القراءة. وثّق الاستثناءات بدلاً من تصنيف كل رسم متحرك على أنه أساسي.
المُخرَج: الأدلة والقيود.
ورقة عمل قابلة لإعادة الاستخدام
أكمل بملاحظاتك المعتمدة. هذه الحقول عبارة عن نموذج عمل، وليست نتائج مُلاحظة.
| الحقل | المعلومات المطلوب تسجيلها |
|---|---|
| التأثير | المُشغِّل والمدة والمعلومات |
| بديل | النسخة المُخفَّضة والحالة النهائية |
| المعيار | المستوى والشروط والتحكم |
| التجربة | التفضيلات ولوحة المفاتيح والنتيجة والحد |
مثال عملي افتراضي
حالة توضيحية
مثال افتراضي: تصبح اللوحة نشطة فقط بعد اكتمال انتقالها.
القرار والأدلة المتوقعة
يكشف قبول الوضع المُخفَّض عن الانتظار؛ يُكمل المكون تغيير حالته دون الاعتماد على مدة الرسوم المتحركة.
تمييز الآليات
| الآلية | الغرض | التحقق أو التقييد |
|---|---|---|
| تفضيل الحركة المخفّضة | التكيف مع خيارات النظام | فحص البرامج النصية أيضًا |
| التحكم في الإيقاف المؤقت | التحكم في الحركة التلقائية المتأثرة | جعلها قابلة للتشغيل بواسطة لوحة المفاتيح |
| حالة ثابتة | الاحتفاظ بالمعلومات بدون حركة | عدم إزالة معلومات التقدم أو الأخطاء |
مؤشرات الإدارة
| المؤشر | ما يقيسه | الإجراء الأول |
|---|---|---|
| التأثيرات المُكيّفة | الحركة مع البدائل المُتحقق منها | تضمين العناصر المضمنة والتمرير |
| المهام المحفوظة | الرحلات المكتملة في الوضع المخفّض | فحص الحالات المعتمدة على الرسوم المتحركة |
| عناصر التحكم العاملة | الإيقاف المؤقت أو الإيقاف الفعلي | فحص الاستئناف ولوحة المفاتيح |
الأخطاء الشائعة
- فحص البرامج النصية أيضًا
- جعلها قابلة للتشغيل بواسطة لوحة المفاتيح
- عدم إزالة معلومات التقدم أو الأخطاء
الأسئلة المتكررة
هل يمنع تقليل الحركة استخدام الرسوم المتحركة نهائيًا؟
لا، إنه يعبر عن تفضيل؛ اختر تكييفًا متناسبًا واحتفظ بالمعلومات الضرورية.
هل المعيار 2.3.3 من المستوى AA؟
لا، إنه AAA. قد تنطبق معايير أخرى على الحركة التلقائية أو الوميض.
هل قاعدة CSS عامة كافية؟
يمكن تقليل العديد من التأثيرات، ولكن قد لا يتحكم في البرامج النصية أو مقاطع الفيديو أو عمليات التكامل. اختبر المكونات الفعلية.
المراجع الرسمية
تدعم المراجع الطريقة. قم بتكييف عمليات التحقق مع سياقك؛ فهي ليست شهادة. قد تكون عناوين المراجع الأصلية والوثائق المصدرية بلغة أخرى.
تاريخ مراجعة المراجع .
