Kể từ đầu những năm 2000, ẩn dụ máy tính để bàn về duyệt web theo tab đã thống trị cách chúng ta điều hướng web. Với Browser.html, một dự án nghiên cứu của Mozilla nhằm xây dựng giao diện trình duyệt bằng HTML cho các bản nightly của Servo, chúng tôi đang thử nghiệm tiến hóa trình duyệt tab tiêu chuẩn sang mô hình dựa trên dấu vết (trails).
Mục tiêu của dấu vết là xây dựng không chỉ một cửa sổ nhìn vào nội dung web mà một câu chuyện về hoạt động của người dùng. Hy vọng công việc của chúng tôi có thể giúp đưa trạng thái duyệt web gần hơn với lý tưởng của một công cụ tăng cường quá trình nhận thức, thay vì tăng gánh nhận thức.
Để minh họa kịch bản chúng tôi nghĩ đến, hãy gặp bạn của chúng tôi, Nala.
Tìm kiếm chiếc bánh pizza hoàn hảo
Nala đang tìm quán pizza. Trên trình duyệt tab truyền thống, cô bắt đầu bằng một lần tìm kiếm (1) đưa đến trang kết quả tìm kiếm (2).
Cô bấm vào liên kết đến danh sách nhà hàng trên Yelp (3), và xem một quán pizza hứa hẹn (4).
Các liên kết ngoài trên Yelp mở trong tab riêng, vậy khi Nala bấm vào liên kết trang web nhà hàng, nó mở tab mới (5).
Tab mới không có lịch sử, cũng không có liên kết với tab đầu tiên. Tất cả lịch sử về cách Nala đến trang web nhà hàng đều bị mất!
Sự hay quên của trình duyệt càng tăng khi cô xem thêm lựa chọn: chuyển lại tab đầu (6) và quay lại kết quả Yelp (7), cô tìm quán khác.
Khi cô chọn quán mới (8), một phần lịch sử điều hướng của tab hiện tại cũng bị mất:
Bấm liên kết ngoài đến trang web quán tiếp theo lại mở tab mới (9), và lại cắt đứt liên kết từ lịch sử trước đó.
Để xem lại kết quả tìm kiếm ban đầu, Nala lùi vài bước trong lịch sử tab đầu và mở quán pizza khác trực tiếp từ đó (10).
Trong ví dụ tìm kiếm phổ biến này, hơn một phần ba lịch sử bị mất!
Tất nhiên, trình duyệt thường cung cấp công cụ như xem lịch sử và menu "tab gần đây", nhưng không cái nào trình bày câu chuyện khớp với hành trình thực tế của Nala.
Từ tab sang dấu vết (trails)
Với Browser.html, chúng tôi đang làm nguyên mẫu giao diện không chỉ kể những mảnh lịch sử mà trình duyệt tab bảo lưu (Phiên bản 1), mà kể tất cả (Phiên bản 2):
Nhưng những cây này dễ trở nên phức tạp. Chúng tôi nghĩ điều quan trọng nhất không phải là nơi mỗi cuộc khám phá tách ra, mà là đường dẫn hoàn chỉnh dẫn đến kết quả. Đó là thứ chúng tôi hiển thị cho người dùng (Phiên bản 3):
Mỗi hàng đại diện cho một dấu vết từ gốc của cây điều hướng đến một kết quả. Lợi ích là một dấu vết kể một câu chuyện tự chứa từ trái sang phải. Mặt khác, trùng lặp gây ra nhiều nhiễu thị giác. May mắn là có thể loại bỏ bằng cách tập trung vào một dấu vết và gập các dấu vết khác.
Đây là thứ Nala thực sự sẽ thấy:
Tab và dấu vết: giống nhau, nhưng khác biệt.
Nếu bỏ qua các đường dẫn dẫn đến từng chủ đề khám phá, dấu vết không khác gì tab thông thường. Đây là cố ý: mục tiêu là nâng cao trải nghiệm hiện có, không thay thế. Người dùng tiếp tục dùng trình duyệt như thường. Và lại mỗi dấu vết điều hướng là một tab kể câu chuyện hoàn chỉnh từ đầu đến cuối. Điều này mở ra cơ hội khám phá nâng cao trải nghiệm hơn. Dưới đây là vài ý tưởng chúng tôi đang xem xét:
- Chia sẻ không chỉ URL mà cả dấu vết toàn bộ.
- Làm mờ dấu vết khi không còn liên quan và cuối cùng di chuyển chúng ra khỏi lưới.
- Lưu giữ dấu vết dưới dạng như lúc truy cập, để có thể truy xuất lại (offline).
- Cho phép ghi chú trên dấu vết để người dùng ghi lại suy nghĩ khi nghiên cứu chủ đề.
- Nghiên cứu chủ đề cộng tác.
- Tùy chọn mở trang trong dấu vết mới.
Con đường đến Dấu vết (Trails)
Ý tưởng hình dung hành trình người dùng trên web như một dấu vết không phải mới. Ngay từ bảy mươi năm trước, trong bài luận kinh điển "As We May Think" phổ biến ý tưởng dữ liệu siêu liên kết, Vannevar Bush đã mô tả một "máy memex". Ông thiết tưởng máy này giúp thu thập và chia sẻ dữ liệu qua thư viện cá nhân giúp chúng ta để lại dấu vết qua quá trình nghiên cứu.
Kể từ đó, đã có vài nỗ lực tạo ra công cụ như vậy, bắt đầu với Trailmeme của Xerox Trails. Khái niệm này được tiếp tục bởi Trailblazer của MacWarriors năm 2004, hiện tiếp tục bởi Trailblazer.io. Hy vọng bằng cách kết nối ý tưởng dấu vết với thành ngữ tab quen thuộc, chúng tôi sẽ xây dựng trên quy trình làm việc hiện có và làm ý tưởng này hấp dẫn rộng rãi. Và Browser.html đóng vai trò thử nghiệm tuyệt vời cho những ý tưởng này.
Mô hình Không gian (Spatial Model)
Tôi đang làm việc trên một mô hình không gian thông qua các tương tác và hoạt ảnh người dùng. Điều này sẽ giúp người dùng hiểu rõ hơn những gì đang diễn ra và cách điều hướng web hiệu quả nhất.
Bạn có thể đọc thêm về điều này ở đây.
Tham gia cùng chúng tôi!
Chúng tôi đang xây dựng nguyên mẫu hoạt động đầu tiên. Nếu điều này nghe thú vị, hãy ghé dự án Browser.html! Bạn có thể tìm danh sách issues mở trên GitHub, hoặc ghé Slack của chúng tôi trò chuyện.
Học lập trình miễn phí. Chương trình mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người tìm được việc làm lập trình viên. Bắt đầu ngay