it-swarm-vi.tech

Kích thước phần tử biểu mẫu có thể thao tác

Tôi không phải là một nhà thiết kế UI bằng mọi cách. Tôi đã nhận thấy trong một hoặc hai năm qua rằng các nút/liên kết quan trọng ... vv trên nhiều trang web hiện có các vùng nhấp chuột rất lớn. Tôi phải nói rằng tôi đánh giá cao nó, vì nhận được con trỏ chỉ để hành động là một nỗi đau. Tôi có thể nói nó có lẽ phù hợp hơn với di động, thậm chí có thể là trình điều khiển cho những thay đổi thiết kế này.

Vì vậy, có một quy tắc ngón tay cái cho kích thước nút/liên kết trên một trang web?

8
rick schott

Tất cả đều dựa trên luật của Fitts cung cấp cho bạn thời gian trung bình mà người dùng cần để đưa con trỏ đến nút. Bạn có thể tìm thấy các bài viết khác nhau về chủ đề như Luật UI của Fitts được áp dụng cho Web hoặc thậm chí là podcast của Jared Spool .

Và quy tắc của ngón tay cái rất dễ dàng: một nút quan trọng phải lớn đến mức có thể nhấn bằng ngón tay cái (xin chào, iPad) :-)

10
Kostya

Đây là quy tắc chung cho iPhone, từ Nguyên tắc giao diện con người của Apple .

Tạo các điều khiển cao ít nhất cao 29 pixel và cung cấp vùng mục tiêu 44 pixel cao.

Thông tin thêm từ cuốn sách, Tapworthy , nơi tôi thực sự phát hiện ra nó.

Nhưng chỉ cần lớn như thế nào là đủ lớn khi nói đến các mục tiêu của iPhone tap? Chà, kích thước của một đầu ngón tay là bao nhiêu? Apple chốt chính xác ở mức 44 pixel và biện pháp này xuất hiện đáng tin cậy trong các điều khiển iPhone tiêu chuẩn

5
Patrick McElhaney

Không có quá nhiều quy tắc vì có một nhận thức đang phát triển rằng không phải tất cả người dùng Internet đều có sự khéo léo và nhanh nhẹn của một nhà thiết kế giao diện toàn thời gian chuyên nghiệp. Quay trở lại năm 1999/2000, bạn đã thấy rất nhiều thiết kế "pixel" trong đó mọi thứ rất nhỏ và được sử dụng các nút lớn 8 x 8. Kể từ khi sự bùng nổ về khả năng sử dụng được lấy cảm hứng từ Steve Krug, Kathy Sierra, 37signals, Jakob Nielsen và những người khác trong suốt những năm 2000, mọi người đã nhận thức rõ hơn về cách sử dụng các ứng dụng và trang web của họ và đã bắt đầu thiết kế phù hợp.

Một khía cạnh khác của câu chuyện là màn hình và độ phân giải màn hình nói chung ngày càng lớn hơn. Trung bình ngày nay có thể là 1280x1024 trở lên, trong khi mười năm trước, bạn may mắn tìm thấy một khách truy cập 1280x1024 trên trang web của bạn vì hầu hết mọi người vẫn trung bình khoảng 800x600. Bởi vì độ phân giải lớn hơn, nhiều pixel phù hợp hơn trên màn hình và những gì trước đây khá dễ nhìn giờ trở nên nhỏ hơn (và như vậy, khó bấm hơn).

Và cuối cùng, việc giới thiệu các thiết bị dựa trên cảm ứng đã khiến rất nhiều nhà phát triển bắt đầu thực hiện nghiêm túc khu vực nhấp chuột, vì khó có thể bắn trúng mục tiêu nhỏ bằng thứ gì đó không chính xác như ngón tay khi so sánh với độ chính xác cực cao của con trỏ chuột.

Tất cả những thay đổi này có thể sẽ dẫn đến quy tắc ngón tay cái vào một lúc nào đó, nhưng nói chung, điều tốt nhất bạn có thể làm là xác định loại đối tượng nào đang truy cập trang web của bạn và thiết kế phù hợp, có tính đến họ là ai, họ là thiết bị gì sử dụng và các yếu tố khác như bạn có bao nhiêu không gian trên màn hình/cửa sổ.

4
Rahul

Ở một mức độ nào đó, kích thước của vùng nhấp chuột có liên quan đến các yếu tố khác trên trang. Tôi không có một tiêu chuẩn nghiêm ngặt, nhưng tôi thường thấy rằng các nút của tôi có chiều cao ít nhất 40px và kích thước văn bản của tôi thường ít nhất là 13px. Tôi cũng nghĩ rằng để điều hướng và các nút khác có ít nhất một số thành phần đồ họa, điều quan trọng là làm cho toàn bộ khu vực có thể nhấp được, thay vì chỉ văn bản.

0
Virtuosi Media