Đặt tên nội dung từng tab
Tabs phù hợp các vùng cùng ngữ cảnh; trang khác cấp nên dùng điều hướng.
Tabs Design system
Chuyển giữa các vùng nội dung cùng cấp.
Nội dung checklist
Tiến độ kiểm tra
01
Cấu trúc và ý nghĩa
Đối chiếu thông tin và cách trình bày trong ngữ cảnh sử dụng.
02
Tương tác và khả năng sử dụng
Thử thao tác, thay đổi trạng thái và đường tiếp tục công việc.
03
Hoàn thiện trải nghiệm
Kiểm tra những chi tiết dễ bỏ sót khi đưa thiết kế vào sử dụng.
Tiến độ được lưu tự động trên trình duyệt này.
HƯỚNG DẪN
Cách kiểm tra
VÍ DỤ
Ví dụ áp dụng
Đặt tên nội dung từng tab
Chi tiết dự án gồm “Tổng quan”, “Thành viên” và “Hoạt động”.
Các biến thể và tình huống
Điểm đến và tab đang chọn
Cho biết tab được chọn bằng dấu hoặc vị trí, giữ nhãn rõ khi bỏ màu.
Đổi theme và thử tab có nhãn dài; dấu chọn vẫn gắn đúng nội dung.
Ví dụ Gạch dưới tab Hóa đơn khi panel hóa đơn đang hiện.
Dự án của bạn
Có cập nhật mới
Đã lưu thay đổi
Dự án của bạn
Có cập nhật mới
Đã lưu thay đổi
Nội dung tải theo tab
Giữ trạng thái tải và lỗi riêng cho tab, tránh thay nội dung bằng response của tab cũ.
Đổi tab nhanh khi request đầu chậm; chỉ response của tab hiện tại được hiển thị.
Ví dụ Đang xem Lịch sử thì phản hồi muộn của Tổng quan không đổi panel.
Dự án của bạn
Có cập nhật mới
Đã lưu thay đổi
Focus, chọn và không khả dụng
Phân biệt focus với tab được chọn; tab không dùng được cần lý do dễ tìm.
Thao tác Tab và phím mũi tên; screen reader đọc đúng tab được chọn.
Ví dụ Viền focus có thể nằm ở Báo cáo trong khi Tổng quan còn đang được chọn.
Dự án của bạn
Có cập nhật mới
Đã lưu thay đổi