Nielsen Norman Group nhận thấy rằng người dùng dành 57% thời gian xem trang ở phần above the fold, với sự chú ý giảm mạnh sau màn hình đầu tiên. Đối với các landing page, con số này thậm chí còn cực đoan hơn — khách truy cập quyết định ở lại hay rời đi chỉ trong vòng 2-3 giây.
Điều này có nghĩa là thiết kế above-the-fold thực sự là cơ hội duy nhất để bạn giữ chân khách truy cập.
Những gì các nghiên cứu Eye-Tracking tiết lộ
Các nghiên cứu eye-tracking của Djamasbi et al. (2010) đã xác định các yếu tố thu hút sự chú ý ở phần above the fold:
| Yếu tố | Thời gian cố định mắt TB | Lần cố định mắt đầu tiên |
|---|---|---|
| Ảnh Hero / Hình ảnh minh họa | 1.2s | 67% nhìn vào đây đầu tiên |
| Tiêu đề chính | 0.8s | 22% nhìn vào đây đầu tiên |
| Nút CTA | 0.4s | 3% nhìn vào đây đầu tiên |
| Thanh điều hướng | 0.3s | 8% nhìn vào đây đầu tiên |
Hình ảnh Hero thu hút sự chú ý nhiều nhất, nhưng chuyển đổi lại xảy ra ở nút CTA. Thách thức đặt ra là thiết kế một lộ trình thị giác từ Hero → Tiêu đề → CTA.
5 yếu tố của một màn hình đầu tiên có tỷ lệ chuyển đổi cao
1. Hình ảnh Hero khơi gợi mong muốn
Hình ảnh Hero nên hiển thị kết quả, không phải sản phẩm. Adaval & Wyer (1998) đã chứng minh rằng hình ảnh mô tả trạng thái cuối cùng (khách hàng hạnh phúc khi sử dụng sản phẩm) tạo ra ý định mua hàng cao gấp 2 lần so với các bức ảnh chỉ chụp sản phẩm.
2. Tiêu đề là lời hứa giá trị duy nhất
Theo nghiên cứu về conversion copywriting của Copyhackers, các tiêu đề khớp với cuộc đối thoại nội tâm của khách truy cập có hiệu quả vượt trội hơn các lời hứa giá trị chung chung từ 3-5 lần. Tiêu đề nên hoàn thiện câu nói: "Tôi cần một thứ gì đó sẽ..."
3. Thứ bậc thị giác dẫn dắt ánh nhìn
Nghiên cứu của Faraday (2000) về thứ bậc thị giác trong thiết kế web cho thấy kích thước, độ tương phản và vị trí tạo ra một "thứ tự đọc" có thể đo lường và tối ưu hóa được. Luồng chuyển động nên là: Điểm neo thị giác → Vấn đề/Giải pháp → CTA.
4. CTA với độ tương phản tối đa
Ling & van Schaik (2006) nhận thấy rằng các nút CTA có độ tương phản màu sắc cao nhất so với nền của chúng nhận được nhiều hơn 21% lượt nhấp chuột, bất kể màu sắc cụ thể được sử dụng là gì. Quan trọng là ở độ tương phản, không phải màu sắc.
5. Bằng chứng xã hội (Social Proof) ở phần Above the Fold
Việc đặt một tín hiệu tin cậy (số lượng khách hàng, đánh giá, thanh logo) ở phần above the fold giúp giảm bớt sự đánh giá rủi ro của vỏ não tiền trán, như đã được chỉ ra trong Klucharev et al. (2009). Một dòng chữ đơn giản như "Được tin dùng bởi hơn 10.000 marketer" có thể tăng tỷ lệ chuyển đổi thêm 15-20%.
Kiểm tra Landing Page của bạn
Dán URL landing page của bạn vào FlowDx để xem chính xác mắt của khách truy cập sẽ hướng vào đâu. Bản đồ nhiệt chú ý (attention heatmap) sẽ tiết lộ liệu CTA của bạn có nằm trong "vùng nóng" hay đang bị mờ nhạt giữa các yếu tố khác.
Tài liệu tham khảo
- Nielsen Norman Group. Scrolling and Attention.
- Djamasbi, S. et al. (2010). Generation Y, web design, and eye tracking. Int. Journal of Human-Computer Studies.
- Klucharev, V. et al. (2009). Reinforcement learning signal predicts social conformity. Neuron.