Bạn bật chế độ tối trên điện thoại, mở vài website và thấy có nơi chuyển sang nền tối rất đẹp, có nơi vẫn trắng chói, có nơi lại bị lỗi: chữ đen trên nền xám, logo biến mất. Từ đó nảy ra câu hỏi: website của mình có cần dark mode không? Câu trả lời ngắn: với phần lớn doanh nghiệp nhỏ, đây là phần “có thì tốt”, không phải bắt buộc. Nhưng nếu làm, cần làm đúng, vì một dark mode website làm vội có thể khó đọc hơn không có.
Dark mode là gì? Phân biệt hai kiểu “giao diện tối”
Chế độ tối tự chuyển theo thiết bị
Website có hai bộ màu: sáng và tối. Trình duyệt cho website biết người dùng đang chọn chế độ nào trong cài đặt của điện thoại hay máy tính (về kỹ thuật, thông qua thiết lập prefers-color-scheme trong CSS), và website tự hiển thị bộ màu tương ứng. Một số website còn có thêm nút để người dùng tự đổi.
Giao diện tối cố định
Website được thiết kế nền tối ngay từ đầu, ai mở cũng thấy như nhau. Đây là lựa chọn thương hiệu, không phải tính năng. Mẫu landing page Aura trong kho demo của WebCut là một ví dụ: nền tối, chữ sáng, điểm nhấn màu xanh.
Vì sao người dùng thích chế độ tối?
- Đỡ chói khi xem buổi tối, nhất là trong phòng tối.
- Đồng bộ với thiết bị: người đã bật chế độ tối thường thấy khó chịu khi một trang trắng toát bật lên.
- Cảm giác hiện đại với một số ngành như công nghệ, giải trí, âm nhạc, nhiếp ảnh.
Cũng có người đọc chữ dài trên nền tối thấy mỏi hơn. Vì vậy chế độ tối nên là lựa chọn tôn trọng thiết lập của người xem, không phải ép mọi người.
Khi nào đáng làm, khi nào chưa cần?
Đáng cân nhắc khi
- Thương hiệu của bạn vốn dùng tông tối: quán bar, phòng thu, studio ảnh, cửa hàng đồ công nghệ.
- Khách hay dùng website vào buổi tối trong thời gian dài: đọc tài liệu, xem danh mục lớn.
- Bạn đang nâng cấp giao diện và có ngân sách để thiết kế, kiểm tra cả hai bộ màu.
Chưa cần khi
- Website giới thiệu vài trang, khách chủ yếu xem nhanh để lấy số điện thoại, địa chỉ.
- Ngân sách có hạn: ưu tiên nội dung, ảnh thật, tốc độ tải và nút liên hệ trước.
- Không có người kiểm tra lại mỗi khi thêm trang mới. Hai bộ màu nghĩa là gấp đôi việc kiểm tra.
Những lỗi hay gặp khi bật chế độ tối
Chữ không đủ tương phản
Chữ xám trên nền xám đậm rất khó đọc. Hướng dẫn tiếp cận WCAG khuyến nghị tỷ lệ tương phản tối thiểu 4.5:1 cho chữ thường; nên dùng công cụ kiểm tra tương phản cho cả hai bộ màu.
Logo biến mất
Logo màu đen hoặc xanh đậm sẽ chìm vào nền tối. Cần chuẩn bị một phiên bản logo sáng màu hoặc có viền.
Ảnh nền trong suốt bị lỗi
Ảnh sản phẩm tách nền, biểu tượng màu đen sẽ “tan” vào nền tối. Kiểm tra từng ảnh quan trọng.
Màu thương hiệu quá rực
Một màu cam hay đỏ trông vừa mắt trên nền trắng có thể chói trên nền tối. Thường cần chỉnh nhẹ độ đậm của màu nhấn cho bộ màu tối.
Form và bảng
Ô nhập liệu, bảng giá, bản đồ nhúng hay khung từ dịch vụ bên ngoài đôi khi không đổi màu theo, tạo ra những mảng trắng lạc lõng.
Làm dark mode thế nào cho gọn?
- Bắt đầu từ bộ màu sáng đã ổn định.
- Định nghĩa màu theo vai trò (nền, chữ chính, chữ phụ, màu nhấn, viền) thay vì đặt màu riêng lẻ ở từng chỗ, để đổi bộ màu chỉ cần đổi một nơi.
- Tạo bộ màu tối tương ứng; nhiều nhà thiết kế chọn xám rất đậm thay vì đen tuyệt đối cho nền.
- Chuẩn bị logo, biểu tượng cho nền tối.
- Kiểm tra trên điện thoại thật ở cả hai chế độ, đặc biệt các trang có form, bảng giá.
Nếu website hiện tại đã cũ và bạn muốn làm mới giao diện, có thể kết hợp việc này trong gói nâng cấp giao diện website. Muốn xem các phong cách sáng và tối khác nhau, hãy lướt kho mẫu giao diện trước khi quyết định.
Doanh nghiệp ở Quảng Ngãi có thể trao đổi trực tiếp với chi nhánh Bình Sơn; xem thêm tại trang làm web cho doanh nghiệp ở Quảng Ngãi.
Phân vân giữa giao diện sáng, tối hay cả hai? Nhắn Zalo 0947805184 hoặc gọi 0947588971 để được tư vấn theo ngành và khách hàng của bạn.
Câu hỏi thường gặp
Dark mode có giúp website lên Google tốt hơn không?
Không có cơ sở để nói vậy. Chế độ tối là yếu tố trải nghiệm người dùng; điều quan trọng hơn là nội dung, tốc độ tải và hiển thị tốt trên điện thoại.
Dark mode có tiết kiệm pin không?
Trên màn hình OLED, hiển thị nhiều điểm tối có thể tốn ít điện hơn; trên màn hình LCD khác biệt không đáng kể. Đây không nên là lý do chính để làm.
Có nên làm website nền tối hoàn toàn?
Chỉ khi hợp với thương hiệu và khách hàng. Với ngành cần cảm giác sạch sẽ, sáng sủa như y tế, thực phẩm, giao diện sáng nhiều khi dễ tạo thiện cảm hơn.
