بناء التغطية حول مهام العملاء
سرد المسارات والنتائج التي تخلق قيمة: العثور على خدمة، البحث، إضافة عنصر، الحجز، تسجيل الدخول، طلب المساعدة، أو الدفع. لكلٍ منها، سَمّ المكوّنات التي يمكن أن تتغير شكلاً أو تفشل: التنقل، الفلاتر، البطاقات، الجداول، الصور، الشاشات الإعلانية، النماذج، الأدراج، والودجات المضمنة. اختبر العروض حيث يصبح المحتوى مقيدًا، وليس مجرد كتالوج لنماذج الهاتف الحالية. اختبر أسفل كل نقطة فاصل مباشرة، وعندها، وفوقها مباشرة.
ضمّن هواتف بعرض ضيق ومتوسط، عرض يشبه الجهاز اللوحي، لابتوب، شاشة عريضة، والوضع الأفقي عندما يغيّر التجربة.
استخدم عناوين طويلة، نتائج فارغة، أخطاء التحقق، شارات الأسعار، عناوين كاملة، وتسميات أطول متى وُجدت تلك الحالات.
إثبات إعادة التدفق والقراءة والتكبير
تأكد من أن الصفحة تحتوي على إعداد العرض المناسب (viewport)، ثم تفحص وجود تمرير أفقي على مستوى الصفحة. الصور الثابتة، الحقول العريضة، الهوامش السالبة، اللوحات خارج الكانفس، والشاشات الإعلانية أسباب شائعة. يصف معيار W3C's WCAG 2.1 Reflow شرط وجود محتوى قابل للتمرير عموديًا عند عرض مكافئ لـ 320 بكسل CSS، بما في ذلك عرض نافذة 1280 بكسل عند تكبير 400%. إذا كان هذا المعيار ضمن نطاق العمل، فاختبر سيناريو التكبير الفعلي. قد تحتاج خريطة أو فيديو أو جدول بيانات إلى تخطيط ثنائي الأبعاد، لكن اجعل ذلك التمرير محصورًا داخل المكوّن ودع الصفحة المحيطة تعيد التدفق.
تحقق من الرؤوس، المحتوى الرئيسي، التذييلات، الأشرطة اللاصقة، الحوارات، وملخّصات الأخطاء عند كل حد تم اختباره.
عدّل ترتيب المعلومات لشاشة ضيقة؛ لا تزيل مطلبًا أو تفصيل سعر أو مسار مساعدة بصمت.
تحميل المحتوى والنماذج
يمكن لعمليات المحتوى أن تسبب إخفاقات متجاوبة دون إصدار CSS. اختبر أطول عنوان معتمد، عدة شارات، صورة مفقودة، فلتر محدد، ملاحظة قانونية كبيرة، وحقل مملوء من المتصفح. عندما تتكدس الأعمدة، تأكد من أن ترتيب القراءة ولوحة المفاتيح لا يزال منطقيًا. أكمل النموذج الحقيقي على جهاز صغير: افتح عناصر التحكم، صحّح خطأ، وأرسل. اختبر الويدجات الخارجية على الصفحة المماثلة للإنتاج لأن حاويتهم، وحالة الموافقة، والخطوط، والأنماط يمكن أن تغيّر النتيجة.
عكس أطوال وتركيبات محتملة كحدٍ أقصى، لكن لا تدرج بيانات عملاء أو بيانات دفع كأدلة QA.
افتح الإشعارات، الدردشة، العروض الترويجية، ورسائل التحقق معًا؛ يجب ألا يغطي أي منها الإجراء الأساسي أو الحقل ذو التركيز.
اجعل كل مسار إدخال مُمارسًا
الشاشة الكبيرة لا تضمن فأرة، والشاشة الصغيرة لا تضمن اللمس وحده. تختبر ميزة الوسائط hover ما إذا كان الإدخال الأساسي يمكنه التحويم بشكل ملائم، لذلك يجب أن يعزز التحويم بدلاً من أن يكون الطريق الوحيد للإجراء أو الشرح. اختبر لوحة المفاتيح والمؤشر على سطح المكتب، والنقر والتمرير على جهاز لمس، والأجهزة ذات الإدخال المختلط عند الاقتضاء. راجع أزرار الإغلاق المدمجة، متخذي الخطوات (steppers)، الشرائح (chips)، التقويمات، وأفعال الأيقونات. يحدد معيار WCAG 2.2 Target Size (Minimum) حجم هدف لا يقلّ عن 24 في 24 بكسل CSS مع استثناءات محددة، بما في ذلك التباعد والروابط المتداخلة. إنه معيار لديه نطاق واستثناءات، وليس وعدًا بأن كل عنصر تحكّم بقياس 24 بكسل سهل لكل شخص بنفس الدرجة.
انتقل بعلامة التبويب عبر الصفحة. يجب أن يبقى التركيز مرئيًا، ويتبع ترتيبًا منطقيًا، ويدخل ويخرج من القوائم والحوارات بشكل قابل للتوقّع.
اجعل كشفًا أساسيًا بالتحويم متاحًا بالتركيز أو النقر أو عبر عنصر تحكم مرئي، وامنع سلوك اللمسة الأولى المربك.
تحقق من الأصول والأداء تحت القيود
قد تتناسب الصورة مع حاويتِها ومع ذلك تكون الملف الخاطئ للجهاز. تحقق أن الوسائط تبقى محتواة، تحجز مساحة التخطيط حيث ينطبق، تحافظ على الاقتصاص المفيد، وتطلب مرشحين مناسبين. تمنح srcset و sizes المتصفح معلومات للاختيار من بين مصادر الصورة المزودة؛ لكنها لا تضمن طلبًا معينًا. استخدم إبطاء أدوات المطور (DevTools throttling) لكشف المشكلات مبكرًا، لكن ضوابط المعالج والشبكة فيها تحاكي ظروفًا نسبةً إلى جهاز التطوير. أعد فحص المسارات الأساسية على جهاز واتصال حقيقي. تحقق من الخطوط، وسائط البطل (hero media)، الدوارات (carousels)، العمل على جانب العميل، وسكربتات الطرف الثالث لأجل التأخير أو التحولات أو النقرات المحجوبة.
التقط المسار، وحجم العرض، والاتصال الحقيقي أو المحاكى، وما أصبح بطيئًا أو غير مستقر؛ وقارن شروطًا متشابهة.
حيثما كان ذلك آمنًا، أجّل التضمينات غير الأساسية في بناء اختبار لتعلّم ما إذا كانت المهمة الأساسية لا تزال قابلة للاستخدام.
الإصلاح كعمل استباقي لاستمرارية الخدمة
بالنسبة لـ Status Is UP، فإن جاهزية الاستجابة هي تحسين استباقي للتوافر: حدّد مسار جهاز يمنع المستخدم، صحّح سببه، أثبت الإصلاح، ومنع تكراره. ليس هدفها الادّعاء بأن تنبيه مراقبة يستطيع الحكم على كل عيب في التخطيط أو التفاعل. أعطِ الأولوية حسب تأثير المهمة ونطاق الوصول. قبل النشر، اختبر العروض المجاورة والمسار المتغيّر على أجهزة فعلية. خطط لعملية استرجاع للتغييرات في التنقل المشترك، الأنماط، السكربتات، المدفوعات، أو التكاملات. بعد الإصدار، كرّر خطوات الإثبات وأرفق الدليل بسجل التغيير.
حدد المسار، والجهاز أو حجم العرض، والاتجاه، وطريقة الإدخال، والحالة، والنتيجة المتوقعة، والنتيجة الفعلية، ولقطة معاد صياغتها (حذفت منها البيانات الحساسة).
فضل إصلاح مكوّن أو قاعدة تخطيط أو رمز أو توصيلية الصور بدلاً من تجاوز مسار واحد فقط؛ أعطِ الاستثناءات مالكًا وخطة إزالة.