10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1)

10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1)

Giỏ hàng là một phần rất quan trọng trong việc kinh doanh trực tuyến. Dù cho sản phẩm của bạn có long lanh đến đâu, hấp dẫn thế nào mà phần giỏ hàng lại không được thiết kế tối ưu, sẽ là một cản trở lớn để thúc đẩy doanh số của shop. Sau đây là 10 lời khuyên sẽ giúp bạn cải thiện được đáng kể doanh thu, chỉ từ việc tối ưu thiết kế giỏ hàng.

1. Giỏ hàng kích thước đầy đủ và nhỏ gọn

Trên thực tế, khách hàng cần phải biết rằng có hai loại giỏ hàng có thể được hiển thị trên một trang web. Chúng là “chức năng” có không gian riêng của mình trên toàn bộ trang hoặc chỉ là một phần nhỏ trên trang. Điều cần thiết là bạn làm quen được với cả hai hình thức này.

 

Giỏ hàng nhỏ gọn chỉ chiếm phần nhỏ ở một góc của trang và thường có thể được tìm thấy ở phía bên phải. Khi việc mua hàng được thực hiện, ngay lập tức các sản phẩm sẽ được hiển thị trong giỏ hàng. Sự khác biệt duy nhất giữa giỏ hàng đầy đủ và nhỏ gọn là số lượng tính năng hiển thị cho việc đặt các sản phẩm vào đó.

 

Với giỏ hàng đầy đủ, bạn có thể cung cấp nhiều thông tin và lựa chọn hơn giỏ hàng nhỏ gọn. Ví dụ, thông tin về chi tiết sản phẩm, loại bỏ/chỉnh sửa mặt hàng, giá chưa thuế và các tùy chọn vận chuyển đều có thể được đưa vào trong giỏ trang đầy đủ. Giỏ hàng đầy đủ ở ví dụ dưới đây cũng hiển thị cả một giỏ hàng nhỏ gọn ở góc trên bên phải.

 

tối ưu giỏ hàng  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang

2. Trang thanh toán: theo từng bước hoặc trên cùng một trang

Sử dụng phương pháp từng bước giúp cho quá trình thanh toán dễ dàng để khách hàng làm theo. Hãy nhìn vào trang thanh toán của Apple.com dưới đây. Thủ tục thanh toán được thực hiện trong bốn bước khác nhau: Sign In(đăng ký), Billing & Shipping  (hóa đơn và vận chuyển), Payment  (thanh toán) và cuối cùng Verify/Edit(xác nhận hoặc chỉnh sửa).

 

Đây là một quá trình có cấu trúc tốt và bạn chắc chắn nên xem xét việc sử dụng điều gì đó tương tự như vậy khi thiết kế trang thanh toán theo từng bước.

 

tối ưu giỏ hàng 1  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 1

 

Bên cạnh phương thức thanh toán theo từng bước, một tùy chọn khác là đưa vào giỏ hàng, thông tin cá nhân và thông tin vận chuyển/thanh toán trên cùng một trang duy nhất.

 

Điều này có thể có tác dụng độc đáo nếu được thực hiện với bố cục tốt. Trang web sau đây sử dụng tốt quá trình thanh toán trên một trang duy nhất. Có một bảng ở phía trên chứa giỏ hàng với các biểu mẫu thông tin mua hàng ở phía dưới.

 

tối ưu giỏ hàng 2  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 2

3. Liên kết từ giỏ hàng nhỏ gọn đến đầy đủ bằng một biểu tượng

Khi xây dựng giỏ hàng, có những tính năng rất nhỏ tác động đến trải nghiệm của khách hàng. Nhấp vào giỏ hàng nhỏ gọn nên liên kết đến giỏ hàng đầy đủ và một biểu tượng nên xuất hiện bên cạnh giỏ hàng nhỏ gọn để thu hút sự chú ý của khách hàng vào giỏ nhỏ gọn và liên kết này.

 

Trang web sau đây là một ví dụ hoàn hảo về điều này. Các nút này sử dụng ngôn ngữ tiếng Nhật nhưng biểu tượng giỏ hàng có thể dễ dàng được nhận ra bởi bất cứ ai.

 

toi-uu-gio-hang-3  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 3

4. Hiển thị rõ ràng nút thanh toán/ thêm vào giỏ hàng

Khi thiết kế thanh toán và giỏ hàng thương mại điện tử, điều quan trọng là đưa vào các liên kết dễ dàng truy cập để hướng dẫn khách hàng đi qua quá trình thanh toán. Tốt nhất là sử dụng các nút lớn rõ ràng. Đảm bảo rằng các nút chứa văn bản rõ ràng dễ đọc và dễ hiểu, chẳng hạn như “Thêm vào giỏ hàng” hoặc “Tiếp tục thanh toán”.

 

Các nút dưới đây được tạo kiểu tốt và được đặt trực tiếp dưới thông tin của từng sản phẩm. Nếu khách hàng không thể tìm thấy nút thanh toán, họ không thể mua sản phẩm của bạn!

 

tối ưu giỏ hàng 4  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 4

5. Sử dụng bố cục kiểu bảng có thể đọc được

Khi thiết kế giỏ hàng đầy đủ, sẽ luôn luôn tốt nhất khi sử dụng cấu trúc dựa trên kiểu bảng. Cách bố trí này sẽ hiển thị một cách hiệu quả các thông tin mà không bị gián đoạn. Sử dụng phông chữ chuẩn và tránh sử dụng hình nền phức tạp.

 

Luôn đảm bảo sử dụng đường viền đậm để phân tách các ô riêng biệt nhưng đừngtạo kiểu cho đường viền. Thông tin trong bảng giỏ hàng nên dễ nhìn mà không bị mất tập trungbởi các yếu tố khác hoặc tạo kiểu phức tạp.

 

Dưới đây là một giỏ hàng rất gọn gàng. Bảng có thể đọc được dễ dàng và có tất cả các yếu tố cần thiết. Quan trọng hơn, hãy lưu ý hình ảnh. Hình ảnh của sản phẩm cung cấp cho khách hàng một trực quan tốt về những gì họ đang mua, có thể giúp khách hàng xác nhận rằng họ thực sự đang mua sản phẩm mà họ dự định.

 

tối ưu giỏ hàng 5  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 5

6. Liên kết “Tiếp tục mua hàng”

Một tính năng nữa là liên kết “Tiếp tục mua hàng”. Khi nhấn vào, liên kết sẽ đưa khách hàng trở lại cửa hàng và danh mục. Liên kết này thường được đặt phía dưới bảng của giỏ hàng đầy đủ, nơi mà khách hàng có thể dễ dàng tìm thấy nó.

 

Ví dụ dưới đây hiển thị liên kết ” Continue Shopping” (tiếp tục mua hàng) và ” Go to Checkout” (tiến hành thanh toán). Hãy chú ý đến việc tìm thấy những liên kết này dễ dàng.

 

 tối ưu giỏ hàng 6  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 61

7. Tránh việc có quá nhiều trường thông tin

Không có gì khó chịu hơn cho người tiêu dùng bình thường khi phải điền vào một số lượng không cần thiết các trường đầu vào trong một biểu mẫu. Bạn nên có quá trình thanh toán càng dễ dàng càng tốt, bởi vì nếu khách hàng không thấy thuận tiện, họ rất có thể sẽ không mua hàng từ trang web của bạn một lần nữa.

 

Giữ số lượng các trường đầu vào ở mức tối thiểu, đặt các trường đầu vào tương tự trong các nhóm và đưa ra tiêu đề cho từng phần. Thiết kế nền form màu trắng sẽ giúp cho biểu mẫu có cảm giác được tổ chức tốt hơn.

 

Biểu mẫu sau đây là tối thiểu và có chứa một số lượng nhỏ các trường đầu vào.

 

tối ưu giỏ hàng 7  10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1) toi uu gio hang 7

Bạn có thể xem tiếp “10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 2)” tại đây

 

(Tổng hợp từ www.webdesignerdepot.com)

 

10 lời khuyên để thiết kế tối ưu giỏ hàng (Phần 1)
Đánh giá bài viết

sao không một lần ghé thăm nhà Sapo

Xem ngay Sapo có gì