النماذج والحالات

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

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

يضيف مطوّر outline: none على حقول الإدخال «لمظهر أنظف». بصريًا، عند النقر في حقل لم يعد هناك ما يشير إلى الحقل النشط — الإطار الأزرق اختفى. هذا أيضًا انتهاك لمعايير الوصول WCAG. التحقّق يدويًا من حالة التركيز لكل حقل في كل نموذج غير واقعي. Delta-QA يلتقط حالة التركيز لكل حقل ويقارن لقطات الشاشة: اختفاء الإطار الأزرق يظهر فورًا في diff البصري.