• Blog
  • Mô hình quét nội dung (Phần 1) - F-Pattern & Spotted Pattern là gì?

Mô hình quét nội dung (Phần 1) - F-Pattern & Spotted Pattern là gì?

Mô hình quét nội dung (Phần 1) - F-Pattern & Spotted Pattern là gì?

 

Các mô hình quét nội dung cơ bản - Spotted Pattern là gì?

 

Năm 2006, khi tiến hành nghiên cứu eye-tracking theo dõi chuyển động của mắt, các nhà nghiên cứu của NNGroup đã nhận thấy 4 cách scan nội dung phổ biến trên các trang web, được xếp theo mức độ hiệu quả từ thấp đến cao:

  • F-Pattern
  • Spotted Pattern
  • Layer-Cake Pattern
  • Commitment Pattern

 

Tại sao F-Pattern là mô hình quét nội dung không tốt?

 

F-Pattern là mô hình thường gặp nhưng lại là cách scan kém hiệu quả, bởi vì người dùng sẽ chỉ đọc lướt nội dung ở góc trên cùng bên trái và bỏ qua nội dung ở góc dưới cùng bên phải của trang, khiến họ dễ bỏ sót nhiều thông tin quan trọng mà trang web cần truyền tải.

 

 

F-Pattern xuất hiện khi người dùng phải xem một trang rất nhiều chữ nhưng không được định dạng tốt và cách viết không phù hợp với hành vi đọc trên web.

Khi đó, người dùng sẽ có xu hướng scan nhanh theo cách mà họ tin là có thể đọc ít chữ nhất nhưng vẫn biết được nhiều thông tin nhất có thể.

Các điểm nghỉ của mắt được thể hiển trên heatmap sẽ tạo thành hình dạng giống chữ F.

 

Để tránh F-Pattern xuất hiện, nội dung của trang cần được định dạng tốt bằng các cách như: phân chia đề mục rõ ràng, tạo danh sách gạch đầu dòng cho các ý chính, in đậm các từ quan trọng…

 

Spotted Pattern là gì? 

 

Spotted Pattern hay mô hình scan dạng đốm là cách scan hiệu quả hơn so với F-pattern.

Spotted Pattern xuất hiện khi người dùng tập trung vào các chi tiết cụ thể trên trang web.

 

 

Người dùng tập trung vào các chi tiết này là do:

  • Chúng có định dạng nổi bật, khác biệt.

Ví dụ: các từ có gắn link, danh sách gạch đầu dòng, hoặc các từ được in đậm…

  • Chúng có các đặc điểm liên quan đến mục tiêu tìm kiếm của người dùng.

Ví dụ: nếu người dùng đang tìm kiếm số điện thoại thì sẽ chú ý đến những chỗ có dạng chữ số hoặc nếu đang tìm email thì sẽ chú ý những chỗ có biểu tượng @.

 

 

---

Nội dung được bảo chứng kiến thức bởi GV Lê Minh Quang, khóa học Figma UI Design tại Keyframe.

Bài viết được biên soạn & thiết kế minh họa bởi Keyframe Team.