Làm sao để sử dụng “call to action”

Để tối đa hóa sự thành công của các trang web của bạn, chúng ta cần một định nghĩa “call to action”. “Call to action”  là  nghệ thuật hấp dẫn khách thăm web của bạn nhấn vào một nút, điền vào một mẫu đơn hoặc bất kì sự tương tác nào khác. Chúng ta sẽ cùng xem xét 10 ví dụ bên dưới để đánh giá hiệu quả của “call to action” mang lại cho trang web của bạn.

Các “call to action” là một trong những điều mà một nhà thiết kế web nên biết và hiểu. Đó là  việc trình bày cho người dùng các đường dẫn truy cập rõ ràng, thường thể hiện bằng một nút nhấn hoặc điền vào một biểu mẫu. Dù bạn đang thiết kế web cho chính bạn hoặc khách hàng, một trong những nhiệm vụ đầu tiên là xác định mục tiêu của trang web và những thứ mà bạn muốn ưu tiên cho khách truy cập vào.

Hiệu quả của “call to action” phụ thuộc vào hiệu quả của việc thiết kế. Màu sắc, font chữ, từ ngữ và bố cục đóng một vai trò quan trọng trong việc hướng người dùng truy cập vào các mục theo mục đích của bạn. Nói chung, điều đầu tiên bạn muốn trang web của bạn giao tiếp với khách hàng là cái gì, và thứ hai cung cấp các lời mời gọi hành động. Nếu không có sự hiểu biết rõ ràng về mục đích của trang web, một lời kêu gọi hành động (một mẫu đơn đặt hàng, một mẫu đăng ký, một nút tiếp tục…) sẽ trở thành vô nghĩa. Một khi bạn xác định rõ mục đích, bạn cần xác địch rõ các hành động mà bạn muốn họ thực hiện.

Ví dụ 1: BaseCamp

BaseCamp là một dịch vụ rất phổ biến và thiết kế của họ được tham chiếu thường xuyên do sự đơn giản của nó và hiệu quả. Các kêu gọi hành động ở đây là nút màu xanh lá cây được gán nhãn “See Plans and Pricing”. Họ sử dụng một số nét và màu gradient xanh lá. Họ cũng sử dụng một mũi tên chỉ vào nút đó để tăng tối đa cơ hội mà khách thăm web truy cập vào đó.

Ví dụ 2: Tapmates

Mục đích của thiết kế này là để cho người dùng nhập vào địa chị email của họ và nhấn vào nút “SIGN UP!”, cũng đồng thời là lời gọi hành động. Hiệu ứng nút lệnh signup nhô ra được tạo bởi màu xanh ngọc với cách đổ bóng tinh tế.

Ví dụ 3: FatCow

Lời kêu gọi ở đây là một nút lệnh “Get Started!” màu cam vàng sáng. Nó có hiệu ứng nổi bật bởi vì 2 yếu tố. (1) là đó là đối tượng duy nhất có màu cam vàng sáng, và (2) là có một mũi tên màu xanh lá – như cấu trúc bên trên, chỉ vào nó. Họ đã sử dụng hiệu ứng đổ bóng vào nút và đặt bóng của nó trên nút “Get Started!” để làm cho nó nổi bật.

Ví dụ 4: Red is White

Trong ví dụ này, chúng ta có thể thấy 2 lời gọi hành động khác nhau. Cuộc gọi nổi bật nhất là nút “PRE-ORDER”, mút nổi bật nhất bởi nó nằm ở bên trái màn hình và tương phản với hầu hết các đối tượng xung quanh với nền đen và nút nhấn màu hồng sáng.

Ví dụ 5: Slack

Lời kêu gọi hành động ở đây là một nút “Continue” lớn, và nó được nhấn mạnh bởi một đường biên màu xanh lá đậm dày 1 pixel bao xung quanh. Nút này sử dụng một màu xanh lá, hiệu ứng đổ bóng trên văn bản cũng như hiệu ứng màu sáng dần chuyển từ trắng sang xanh lá trên dòng chữ.

Các yếu tố của một “call to action” tốt

Sự tương phản: bất cứ điều gì bạn muốn mọi người thấy và nhấp chuột vào, cần phải làm cho dễ dàng nhìn thấy. Càng nhiều sự tương phản của nút lệnh hoặc biểu mẫu so với màu nền, thì càng nhiều người dùng dễ dàng nhìn thấy nó.

Đường viền: Thêm một đường viền bao ngoài cũng có thể tạo thêm hiệu ứng tương phản. Nó cũng không cần thiết lắm, nhưng nếu bạn cho thêm một đường viền mà không xung đột với thiết kế, hãy làm thế!

Gradients: Gradient có thể là cách đổ màu tốt để làm cho các thứ trông nổi bật hơn. Trong hầu hết các ví dụ trên, màu gradient được sử dụng trong một vài form. Hãy cẩn thận với việc lạm dụng màu gradient, nó rất dễ dàng có thể trở lòe loẹt thay vì mang lại lợi ích thiết kế.

Đổ bóng: Như với gradient, việc đổ bóng có thể làm cho các phần tử có hiệu ứng nổi lên. Nhưng hơn cả gradient, việc đổ bóng gần như luôn luôn bị lạm dụng bởi các nhà thiết kế nghiệp dư. Một hiệu ứng bóng đổ có thể là một tài sản tuyệt vời trong thiết kế của bạn, hoặc là cái chết của thiết kế của bạn. Nếu bạn để ý trong các ví dụ ở trên, bạn sẽ thấy hiệu ứng đổ bóng được sử dụng theo nguyên tắc.

Thử nghiệm phân chia các lời gọi hành động

Nếu mục đích của bạn là tối đa hóa các đơn đặt hàng, các thuê bao, khách thăm hoặc bất kỳ loại dữ liệu nào từ kết quả các hành động của khách thăm, việc thử nghiệm phân chia là cần thiết. Thử nghiệm phân chia đơn giản A/B có thể tiết lộ lỗi trong thiết kế và chỉ ra các thay đổi cần phải thực hiện. Một lỗ nghiêm trọng của nhà thiết kế có thể là cái tôi, việc nghĩ rằng nỗ lực đầu tiên của họ là cố gắng tốt nhất của họ, hầu như không bao giờ đúng. Thông thường một thay đổi đơn giản sẽ dẫn đến hàng loạt các thay đổi khác phải thực hiện theo.

Có rất nhiều công cụ kiểm tra có sẵn, nhưng một trong những cái tuyệt vời là bắt đầu với Website Optimizer của Google. Nó miễn phí 100% và cung cấp những bước dễ dàng để bạn thực hiện thử nghiệm của mình.