التصميم المتجاوب

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

القائمة المتنقّلة (هامبرغر) تعمل بشكل ممتاز على 375px. لكن على 820px (iPad)، تظهر قائمة سطح المكتب... التي تتجاوز الشاشة لأنها مصمّمة لـ1024px كحد أدنى. عناصر القائمة مقطوعة، زوّار iPad لا يستطيعون التنقّل. التحقّق يدويًا من كل مكوّن على كل نقطة كسر غير واقعي. Delta-QA يلتقط الموقع على 820px ويقارن اللقطات: القائمة التي تتجاوز الشاشة تظهر فورًا في diff.

يعدّل مطوّر media query وfont-size الهاتف (14px) يُطبّق الآن حتى 1024px بدل 768px. على الحاسوب المحمول، كل النص أصغر قليلًا — الزوّار يحدّقون دون أن يفهموا لماذا. المطوّر كان يختبر على شاشته 1440px، عنده كل شيء كان طبيعيًا. Delta-QA يلتقط الموقع على 1024px ويقارن اللقطات: النص المتقلّص والإزاحات الناتجة تظهر عند التراكب.