UX – Nút Cancel – Tại sao không nên có màu

Written by

in

Lỗi thường gặp: nút Cancel có màu

Bài này giải thích công dụng của nút Cancel, và tại sao không nên dùng màu cho nút này.

cancel_button-non_action.png

Nút Cancel thường xuất hiện ở những màn hình cần sự xác nhận

Nút Cancel hay còn có những tên khác như “Not Now”, “No Thanks”, “Maybe Later”, or “Skip” tùy ngữ cảnh. Tuy nhiên, chúng có chung một tác dụng: bỏ qua (dismiss) màn hình hiện tại mà người dùng đang sử dụng, đưa người dùng về màn hình trước đó. Nút Cancel đóng vai trò như một cái phao cứu sinh để không tạo ra những thay đổi không mong muốn trên hệ thống.

Do đó, nút Cancel nên tạo cảm giác an toàn cho người dùng, bằng cách thể hiện sự dự phòng an toàn (a fallback to safety), chứ không phải là một lời kêu gọi hành động (a call to action).

Phân biệt nút Cancel và những loại nút khác:

  • Normal button: khi nhấn vào sẽ tạo ra thay đổi trên hệ thống. Dấu hiệu thể hiện điều này là màu trên button.
  • Cancel button: khi nhấn vào không tạo ra thay đổi trên hệ thống. Do đó, nếu dùng dùng màu, người dùng sẽ bối rối: “nhấn vô cái nút này có thay đổi data gì không ta”. Thay vào đó, ấn tượng đúng cần được tạo ra ở đây là “yên tâm, nhấn vô đây, không có thay đổi gì đâu”.cancel_button-non_action

Đối với nút button, nên:

  • Dùng màu trung tính, để phân biệt với các nút CTA khác. Càng nhiều nút thì màu trung tính này phải đủ nổi bật để người dùng nhận diện nhanh hơn. Đối với người lỡ bấm nhầm và cần thoát ra nhanh thì màu xám này giúp họ nhận ra ngay để nhấn vào. Đối với những người sẵn sàng hành động thì màu xám này giúp họ bỏ qua nó, tập trung vào các nút CTA.
  • Dùng màu xám đủ tối, để dễ đọc và không bị nhầm với trạng thái disable. Để đảm bảo dễ đọc thì nên kiểm tra độ tương phản bằng một công cụ WCAG 2.0 contrast ratio chẳng hạn như Contrast Checker. Công cụ này giúp chỉ ra màu xám đang dùng có đạt chuẩn màu dễ đọc không.cancel_button-gray

 

cancel_button-gray

Tóm lại: hãy trung lập (neutralize) nút Cancel

Đa số trường hợp người dùng kích hoạt màn hình xác nhận, họ đã sẵn sàng hành động. Tuy nhiên khi họ bấm nhầm và không muốn làm hành động đó, nút Cancel cần đưa cho họ sự an toàn.

Một nút Cancel có màu đem đến tín hiệu sai. Nó khiến người dùng xem nó là một lời kêu gọi hành động thay vì một sự rút lui an toàn. Hãy trung lập nút Cancel để người dùng có cảm giác họ kiểm soát tốt hơn và tự do hơn khi sử dụng ứng dụng.

Nguồn: https://uxmovement.com/buttons/why-cancel-buttons-should-never-have-a-color/

Lược dịch, phóng tác, sắp xếp, chém gió: Giang Nguyễn

 

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *