it-swarm-vi.tech

Trải nghiệm người dùng tốt hơn: Bảng có thể cuộn hoặc bảng có kích thước đầy đủ cho phép cửa sổ trình duyệt thực hiện cuộn?

Trải nghiệm người dùng tốt hơn là gì:

  1. Một bảng có thể cuộn bằng cách sử dụng cài đặt css tràn trong DIV?
  2. Một bảng kích thước đầy đủ cho phép cửa sổ trình duyệt để cuộn?
11
7wp

Bảng kích thước đầy đủ cho phép thanh cuộn của trình duyệt (2) thực hiện cuộn dữ liệu là trải nghiệm người dùng tốt hơn, vì nhiều thanh cuộn trên cùng một trang sẽ có xu hướng gây nhầm lẫn cho người dùng và gây ra một chút tức giận.

Tất nhiên, điều này chỉ áp dụng nếu dữ liệu chúng ta đang nói về việc cuộn ở đây là trọng tâm chính của trang, trong trường hợp đó, có thể chấp nhận có một thanh cuộn dành riêng cho phần đó của màn hình.

13
Ryan Shripat
  1. Nhiều thanh cuộn dọc trong cùng một cửa sổ trình duyệt có thể gây nhầm lẫn, đặc biệt là khi sử dụng bánh xe cuộn.
3
Mattias Kihlström

Miễn là nó có ý nghĩa trong ngữ cảnh của giao diện, một trong hai phương thức có thể được sử dụng. Tuy nhiên, tôi cố gắng không sử dụng các DIV cuộn trong DIV làm quy tắc chung vì chúng trở nên lộn xộn. Khi người dùng cuộn chạm vào đáy của một DIV, trình duyệt thường bắt đầu cuộn DIV tiếp theo hoặc trang có thể bị giật.

Theo kinh nghiệm của tôi, một giao diện ít phức tạp hơn sẽ có thời gian chấp nhận/học tập ngắn hơn, tất cả các yếu tố khác đều bằng nhau.

2
Matt

Tôi sẽ nói rằng nếu bạn có một bảng dữ liệu rất lớn, cách tốt nhất để làm điều đó là sử dụng CSS để đặt tràn trên thẻ <tbody> Trong bảng. Bằng cách đó, tiêu đề của bạn (được lưu trữ trong <thead>) Sẽ vẫn hiển thị cho dù người dùng có cuộn bao nhiêu. Điều này sẽ cung cấp cho người dùng trải nghiệm tương tự như những gì có thể được cung cấp trong một ứng dụng tiêu chuẩn khi xem dữ liệu dạng bảng.

Tôi nghĩ rằng đây là giải pháp tốt nhất vì với nhiều thao tác cuộn, người dùng nhất định phải nhớ những tiêu đề cột đó là gì và nếu bạn có thể làm cho nó để họ luôn có thể nhìn thấy các tiêu đề, thì bạn chắc chắn sẽ cho họ trải nghiệm tốt hơn (Hãy nhớ những lời bất hủ của Steve Krug - "Đừng làm tôi suy nghĩ").

2
Charles Boyung

Đã xảy ra khi ví dụ hoàn hảo về việc triển khai rất tệ một cửa sổ có thể cuộn trong cửa sổ trình duyệt ngay sau khi đọc bài đăng này. Tôi nghĩ rõ ràng là nó khó sử dụng như thế nào.

Trước tiên tôi đã thử sử dụng thanh cuộn bên ngoài để cuộn tất cả những con chó đi, di chuyển con chuột trong cửa sổ bên trong cuộn những con chó nhưng bây giờ tôi chỉ thấy một nửa cửa sổ và phải quay lại thanh cuộn đầu tiên để di chuyển nó trở lại. Nội dung chính không nên được chuyển xuống một khung nhỏ bên trong như thế này.

2
scauer

Đi với tùy chọn 2. Cuộn trong cuộn luôn khiến người dùng bối rối và khó chịu khi bạn xuống đến đáy và trang bay xuống.

Câu hỏi của tôi là, bạn có cách nào để sắp xếp dữ liệu để bắt đầu tập dữ liệu nhỏ hơn không? Hoặc bằng cách ẩn với sự pha trộn của JavaScript và CSS hoặc bằng cách sử dụng một số loại kịch bản lệnh? Hiển thị nhiều hàng dữ liệu không bao giờ thân thiện với người dùng. Trừ khi người dùng hiểu được những điều kỳ diệu của ctrl + f, rất nhiều thời gian có thể bị lãng phí khi di chuyển xung quanh.

Bạn cũng có thể suy nghĩ về việc thêm các tiêu đề nổi ở đầu danh sách khi chúng cuộn. Bằng cách đó, người dùng sẽ không phải cuộn ngược lên trên cùng để tìm hiểu tên cột là gì.

2
LoganGoesPlaces

Nói chung các thanh cuộn lồng nhau nên tránh. Thời gian duy nhất chúng thực sự nên được sử dụng là nếu bạn có các điều khiển bên dưới bảng có thể bị bỏ lỡ nếu bảng quá dài.

2
Tom R

Nó phụ thuộc vào cách sử dụng bạn dự tính.

Có rất nhiều lý do tốt để tránh các thanh cuộn lồng nhau, nhưng cũng có trường hợp bảng nên được cuộn. Đây là một số:

  1. Ngoài cái bàn, mọi thứ khác đều vừa vặn trên màn hình. Nếu đây là trường hợp thì bạn không có các thanh cuộn lồng nhau (nghĩa là trình duyệt không có chúng) và có thể có những lý do chính đáng để chỉ có thể cuộn bảng.
  2. Công dụng chính của bảng là để tham chiếu một phần nhỏ của nó so với một cái gì đó khác trên trang. Ví dụ: bạn phải điền ba thông tin dựa trên một cái gì đó trong bảng mà người dùng phải tìm kiếm ('cái gì đó' quá trực quan để tự động hóa). Nếu bạn làm cho toàn bộ trang có thể cuộn được thì người dùng phải tìm kiếm bảng cho những gì họ muốn, sau đó cuộn lên trên cùng để điền thông tin, sau đó tìm kiếm lại, v.v. Nếu bạn làm cho bảng có thể cuộn được thì phần 'điền vào' của UI vẫn ở trên màn hình.
2
DJClayworth

cuộn dọc cho phép trình duyệt xử lý cuộn ngang (bạn nên loại bỏ hoàn toàn) sử dụng cài đặt tràn css để xử lý.

Các nghiên cứu đã chỉ ra rằng người dùng không ngại cuộn xuống mà ghét cuộn qua.

1
Sruly