Xây dựng phạm vi bao phủ quanh các nhiệm vụ của khách hàng
Liệt kê các lộ trình và kết quả tạo giá trị: tìm dịch vụ, tìm kiếm, thêm mục, đặt chỗ, đăng nhập, yêu cầu trợ giúp hoặc thanh toán. Với mỗi trường hợp, đặt tên các thành phần có thể thay đổi hình dạng hoặc bị lỗi: điều hướng, bộ lọc, thẻ, bảng, hình ảnh, banner, biểu mẫu, ngăn kéo (drawer) và widget nhúng. Kiểm thử các chiều rộng nơi nội dung của bạn trở nên bị bó hẹp, không chỉ là danh mục các mẫu điện thoại hiện có. Kiểm thử ngay dưới, tại và ngay trên mỗi điểm ngắt (breakpoint).
Bao gồm các điện thoại hẹp và cỡ trung, một chiều rộng giống máy tính bảng, laptop, desktop rộng và chế độ ngang khi nó thay đổi nhiệm vụ.
Dùng tiêu đề dài, kết quả rỗng, lỗi xác thực, huy hiệu giá, địa chỉ đầy đủ và nhãn dài khi các trạng thái đó tồn tại.
Chứng minh việc chạy lại bố cục, khả năng đọc và phóng to
Xác nhận trang có cài đặt viewport phù hợp, sau đó kiểm tra cuộn ngang ở cấp trang. Hình ảnh cố định, trường rộng, margin âm, bảng điều khiển ngoài màn hình và banner là những nguyên nhân phổ biến. Tiêu chí Reflow của WCAG 2.1 mô tả nội dung cuộn dọc ở chiều rộng tương đương 320 CSS pixels, bao gồm viewport 1280-pixel ở mức phóng to 400%. Nếu tiêu chí đó trong phạm vi, hãy kiểm thử kịch bản phóng to thực tế. Một bản đồ, video hoặc bảng dữ liệu có thể cần bố cục hai chiều, nhưng giữ cuộn trong thành phần và để trang xung quanh chạy lại bố cục.
Kiểm tra header, nội dung chính, footer, thanh cố định (sticky), hộp thoại và tóm tắt lỗi ở mọi ranh giới đã kiểm thử.
Tổ chức lại thông tin cho màn hình hẹp; không được âm thầm loại bỏ yêu cầu, chi tiết giá hoặc đường dẫn trợ giúp.
Đặt áp lực lên nội dung và biểu mẫu
Các thao tác nội dung có thể gây lỗi đáp ứng mà không cần phát hành CSS. Kiểm thử tiêu đề dài nhất được phê duyệt, vài huy hiệu, một hình ảnh bị thiếu, bộ lọc được chọn, một thông báo pháp lý lớn và một trường được trình duyệt điền. Khi các cột xếp chồng, xác nhận thứ tự đọc và thứ tự phím vẫn hợp lý. Hoàn thành biểu mẫu thực trên thiết bị nhỏ: mở điều khiển, sửa lỗi và gửi. Kiểm thử widget bên thứ ba trên trang giống như bản sản xuất vì container, trạng thái đồng ý, phông chữ và kiểu của chúng có thể thay đổi kết quả.
Phản ánh các độ dài và kết hợp có khả năng tối đa, nhưng không bao gồm dữ liệu khách hàng hoặc thanh toán trong bằng chứng QA.
Mở thông báo, chat, khuyến mãi và thông báo xác thực cùng lúc; không lớp phủ nào nên che hành động chính hoặc trường đang có tiêu điểm.
Thực thi mọi đường dẫn nhập liệu
Màn hình lớn không đảm bảo có chuột, và màn hình nhỏ không đảm bảo chỉ có chạm. Media feature hover kiểm tra liệu một đầu vào chính có thể hover thuận tiện hay không, nên hover chỉ nên bổ trợ chứ không phải là con đường duy nhất đến một hành động hoặc giải thích. Kiểm thử sử dụng bàn phím và con trỏ trên desktop, chạm và cuộn trên thiết bị cảm ứng, và các thiết bị hỗn hợp khi cần. Xem xét các nút đóng nhỏ, bộ tăng giảm (steppers), chip, lịch và hành động biểu tượng. WCAG 2.2 Target Size (Minimum) chỉ định kích thước mục tiêu 24 by 24 CSS-pixel với các ngoại lệ xác định, bao gồm khoảng cách và liên kết nội tuyến. Đây là một tiêu chí có phạm vi và ngoại lệ, không phải lời hứa rằng mọi điều khiển 24-pixel đều dễ dùng như nhau cho tất cả mọi người.
Tab qua trang. Tiêu điểm nên luôn hiện rõ, theo thứ tự hợp lý, và vào ra menu và hộp thoại một cách dự đoán được.
Làm cho việc tiết lộ cần thiết khi hover có thể thực hiện được bằng focus, tap hoặc một điều khiển hiển thị, và ngăn hành vi chạm lần đầu gây nhầm lẫn.
Xác minh tài sản và hiệu năng trong điều kiện hạn chế
Một hình ảnh có thể vừa khung chứa nhưng vẫn là file sai cho thiết bị. Kiểm tra rằng media giữ trong container, dành không gian bố cục khi áp dụng, giữ crop hữu dụng và yêu cầu các ứng viên thích hợp. Srcset và sizes cung cấp thông tin cho trình duyệt chọn giữa các nguồn hình ảnh được cung cấp; chúng không đảm bảo một request cụ thể. Dùng DevTools throttling để phát hiện vấn đề sớm, nhưng các điều khiển CPU và mạng của nó mô phỏng điều kiện tương đối với máy phát triển. Kiểm tra lại các hành trình chính trên thiết bị và kết nối thực. Kiểm tra phông chữ, media hero, carousel, công việc phía khách hàng và script bên thứ ba để tìm chậm trễ, dịch chuyển hoặc chạm bị chặn.
Ghi lại lộ trình, viewport, kết nối thực hoặc mô phỏng, và thứ gì trở nên chậm hoặc không ổn định; so sánh trong các điều kiện tương đồng.
Khi an toàn, trì hoãn các nhúng không thiết yếu trong bản thử nghiệm để biết liệu nhiệm vụ lõi có vẫn sử dụng được hay không.
Sửa chữa như công việc chủ động cho thời gian hoạt động (uptime)
Với Status Is UP, sẵn sàng đáp ứng là tối ưu hóa thời gian hoạt động chủ động: xác định đường dẫn thiết bị chặn người dùng, sửa nguyên nhân, chứng minh khắc phục và ngăn tái phát. Đây không phải là tuyên bố rằng một cảnh báo giám sát có thể đánh giá mọi lỗi bố cục hoặc tương tác. Ưu tiên theo tác động và phạm vi tiếp cận của nhiệm vụ. Trước khi triển khai, kiểm thử các chiều rộng lân cận và hành trình đã thay đổi trên phần cứng thực. Lên kế hoạch rollback cho các thay đổi tới điều hướng chia sẻ, style, script, thanh toán hoặc tích hợp. Sau khi phát hành, lặp lại các bước chứng minh và đính kèm bằng chứng vào bản ghi thay đổi.
Nêu rõ lộ trình, thiết bị hoặc viewport, hướng, phương thức nhập, trạng thái, kết quả mong đợi, kết quả thực tế và một ảnh chụp đã được làm mờ (redacted).
Ưu tiên sửa thành phần, quy tắc bố cục, token hoặc giao diện phân phối hình ảnh hơn là ghi đè chỉ cho một lộ trình; giao cho ngoại lệ một người chịu trách nhiệm và kế hoạch gỡ bỏ.
