05 thành phần cơ bản của một bản thiết kế landing page
(Ảnh: 5 thành phần cơ bản của Landing page, nguồn: tự vẽ tay)
Có nhiều website, blog online nói về các thành phần cơ bản của landing page, cũng như tối ưu hóa bản thiết kế của một landing page. Site thì đưa ra 7 core elements, site thì 5, site thì 10… tôi tóm gọn lại trong 05 yếu tố cơ bản, bởi trong 05 yếu tố này có thể mở rộng với các yếu tố nhỏ hơn, chi tiết hơn. Bài blog này tôi tổng hợp lại từ khóa học trực tuyến “Landing Page Conversion Course” của Oil Gardner.
1. The Unique Selling Proposition (USP)
Yếu tố đầu tiên là USP (Unique Selling Proposition), tạm dịch là lợi thế cạnh tranh tuyệt đối, hay là lợi thế cạnh tranh độc nhất. Khái niệm này không xa lạ với dân sale/marketing hay branding bởi nó xuất phát từ marketing. USB ám chỉ ưu thế bền vững của một thương hiệu hay sản phẩm được xác định với mục đích tạo sự khác biệt rõ rệt, khiến khách hàng quyết định chọn thương hiệu/sản phẩm này thay vì thương hiệu/sản phẩm khác. Ví dụ như với Head & Shoulder (dầu gội): USP là Trị sạch gàu, Domino’s Pizza: USP là Giao hàng bánh nóng hổi trong vòng 30 phút, chậm hơn không tính tiền và với M&M là “chỉ tan trong miệng, không tan trên tay”.
Vậy USP đối với landing page design gồm những gì? Về cơ bản, nó bao gồm 04 thành phần:
- The main headline: Đây là dòng tiêu đề đầu tiên (thường được typography chữ to, in đậm) của trang landing page. Mục đích của nó nhằm khẳng định lợi ích mà người dùng có được cũng như khẳng định rằng người dùng đã vào đúng trang web cần thiết. (Đúng nơi, đúng chỗ, đúng mục đích).
- The supporting subhead: Giống như “main headline”, supporting headline nhằm mở rộng ý nghĩa của main headline bởi đối với main headline thì text không thể quá dài. Ngoài ra, supporting subhead còn có tác dụng nhấn mạnh lợi ích mà user có thể có được từ landing page của bạn.
- The reinforcement statement: Hơi tricky một chút, nhưng thực ra đây là một dạng “second headline” được viết với câu cú khác nhưng cùng ý nghĩa với main headline. Sở dĩ cần re-inforce người dùng bởi họ thường “scan” nội dung của trang web chứ không đọc kỹ. reinforcement statement thường được đặt ở giữa hoặc cuối trang landing page.
- The closing argument: Giống như trong bán hàng thông thường, đây là câu để kết thúc quá trình mua bán (closing the sale). Một lần nữa, closing argument thường có dạng thúc giục, nhắc lại những gì mà re-inforce statement đã nhắc tới. Đoạn text này thường đặt cạnh nút bấm call-to-action (CTA).
Một điểm nên lưu ý rằng chúng ta không nhất thiết phải áp dụng USP text một cách máy móc. Các USP text có thể kết hợp với call-to-action để xuất hiện nhiều lần trên một landing page (đặc biệt với landing page có chiều dài hơn một trang màn hình).
(Ảnh: 2 loại landing page phổ biến và cách bố trí các thành phần cơ bản)
2. The hero shot
Hero shot, hiểu nôm na là một bức ảnh (hoặc hình họa) hoặc một đoạn video nhúng (có kích thước 2/3 hoặc 1/2 độ rộng màn hình) vào trang landing page và thường đặt ngày dưới main headline của landing page đó. Mục đích của các hero shot là làm nổi bật nội dung, ý nghĩa của landing page cũng như sản phẩm/ dịch vụ mà người dùng sẽ đạt được. Vì vậy, có thể dễ dàng nhận thấy rằng 03 thành phần main headline, supporting headline và hero shot luôn có sự liên quan chặt chẽ với nhau về thông điệp (text message), bố cục cũng như cách thức trình bày (theo thứ tự, và gần nhau).
Vậy khi nào dùng ảnh? khi nào dùng video?
Khi bán một sản phẩm mà mọi người đều biết đến và đã dùng qua, bạn nên dùng ảnh. Ví dụ khuyến mại mua 3 áo thun tặng 1 áo mưa thì nên design bức ảnh dạng combo cho dễ hiểu. Hoặc landing page giới thiệu thông tin giảm giá vé xem film, vé nhạc kịch cũng thể dùng ảnh chup, posters của show diễn. Ngược lại, những dịch vụ trực tuyến (online service), phần mềm cho thuê (SaaS), các sản phẩm công nghệ mới (unpack technology product) thì nên sử dụng advertising video để tăng phần hấp dẫn và lôi cuốn các khách hàng tiềm năng.
52% of consumers say watching product videos make them more confident in purchase decisions. Shoppers who view product videos are 174% more likely to purchase than visitors that did not. – Unbounce.com
3. The benefits of your offering
Đây là phần liệt kê và mô tả chi tiết những lợi ích từ sản phẩm, dịch vụ của bạn. Ví dụ như: tham gia sự kiện để nhận sách miễn phí, gặp gỡ 5 diễn giả hàng đầu châu Á, trở thành 100 người đầu tiên sử dụng công nghệ context advertising online… Tóm lại, khi bán một sản phẩm / hay dịch vụ nào, thông qua marketing campaign và landing page, bạn phải liệt kê những lợi ích đi kèm bên cạnh giá trị USP của bạn (của công ty bạn).
Benefits ở landing page có thể được trình bày dưới dạng các gạch đầu dòng ngắn gọn (bullets benefit), nhằm giúp người dùng “scan” nhanh chóng, và có thể được thiết kế dạng “chi tiết ngắn gọn” (detail benefit) ở phía dưới landing page giúp người dùng có thể xem kỹ hơn nếu cuộn chuột xuống phần còn lại. Vấn đề ở chỗ, viết như thế nào? và nên viết kiểu gì để đạt hiệu quả tối đa? Theo tôi thì có mấy lưu ý ngắn gọn như sau:
- Bullets benefit và detail benefit nên đồng nhất với nhau về nội dung, và detail benefit chỉ nhằm mục đích mở rộng “offering” của bullets benefit.
- Tập trung vào việc nhấn mạnh các “benefits” này nhằm “giải quyết vấn đề gì” của khách hàng. Đó mới là điều quan trọng khiến người ta ra quyết định bấm vào nút call-to-action hay không. Ví dụ như: lưu giữ backup email cho bạn, tự động sao lưu contact list, hỗ trợ import vào MS Outlook… có thể là 03 bullets dành cho một dịch vụ online backup email.
Đối với “detail benefit”, có thể sử dụng một số screen shot (nếu sản phẩm bạn kinh doanh là phần mềm dạng SaaS), hoặc ảnh chụp chi tiết từng góc nhỏ của sản phẩm (với những sản phẩm công nghệ khác) đi kèm với mô tả để giúp người dùng dễ dàng ra quyết định hơn.
4. Social proof / Trust indicators
Leverage social proof to make purchasing decisions easier – Oil Gardner
Đây là phần dành cho việc show-off những khách hàng tiêu biểu, những bình luận (tích cực) từ các khách hàng đã và đang sử dụng sản phẩm, dịch vụ của bạn. Việc này bắt nguồn từ lý thuyết bán hàng. Bạn sẽ bán hàng dễ hơn một chút nếu chứng minh được đã có nhiều người tin dùng sản phẩm của bạn. Đối với landing page, phần “proof” thường sử dụng 02 yếu tố chính là:
- Big, bold typography text: Những dòng chữ to, in đậm chỉ ra những thống kê về số lượng khách hàng sử dụng sản phẩm/ dịch vụ của bạn. Ví dụ như 2000 khách hàng đã sử dụng sản phẩm trong năm 2013, hoặc hơn 100 khách hàng đã đăng ký mua sách tuần qua.v.v..
- Social images, avatar of client/company: Hình ảnh của những khách hàng kèm lời trích dẫn (bình luận) về sản phẩm của bạn. Kèm theo đó là thông tin doanh nghiệp/công ty đã và đang là đối tác của bạn. Ví dụ là chị A, giám đốc công ty B đã sử dụng sản phẩm và phát biểu rằng..blah blah…
(Ảnh: chụp màn hình trang chủ của basecamp.com, 1 ví dụ về social proof)
Có thể dễ dàng nhận thấy trong hình trên, 37signals (công ty chủ quản của basecamp.com) đã sử dụng typography cho phần social proof khá rõ ràng khi nêu ra số lượng đối tác sử dụng sản phẩm, bên cạnh đó là hình ảnh của khách hàng + công ty tiêu biểu đặt cạnh form đăng ký cũng như nút bấm call-to-action.
5. The conversion goal – call-to-action (CTA)
Call-to-action (hay còn gọi là CTA) là mục tiêu cuối cùng của landing page mà bạn muốn người dùng hướng tới, click vào đó sau khi điền thông tin hoặc sau khi quyết định mua hàng/ tham gia sự kiện, download tài liệu PDF, đăng ký mua sản phẩm.v.v… Nói một cách khác, CTA chính là cách bạn muốn người dùng tương tác với landing page của bạn. Chính vì vậy, CTA cần được xây dựng sao cho đạt được mục đích mà landing page đề ra.
Một nút bấm CTA có 02 phần:
- CTA Design. Đây là phần thiết kế đồ họa của nút bấm (button), và nó phải được thiết kế cũng như đặt ở vị trí thuận lợi để người dùng có thể dễ dàng nhận ra. CTA design có nhiệm vụ trả lời câu hỏi “where should I click?” của người dùng.
- CTA Copy. Đây chính là chữ viết trên nút bấm call-to-action, hay còn gọi là CTA button text. Giống như nội dung của một biển chỉ dẫn, CTA copy chính là dòng chữ với nội dung kêu gọi người dùng hành động. Việc người dùng có bị thôi thúc hành động (click) hay không phụ thuộc vào việc CTA copy có giải đáp được nghi vấn “why should I click this button?” trong tư duy của họ hay không.
Ngày nay, thay vì việc đặt các CTA button với nội dung “SUBMIT” hoặc “SAVE”, “SEND” thì người thiết kế landing page thường sử dụng các cụm từ khuyến khích tâm lý người dùng hơn dưới dạng “Get my free e-book now”, “Take the 5 minute tour”, “Start my 30-day FREE trial” hoặc “Join FREE training course NOW”..v.v… Rõ ràng, những từ ngữ mang tính kêu gọi và mời chào sẽ có hiệu quả cao hơn là những từ mang tính hành vi thông thường của phần mềm máy tính. Đó cũng chính là đặt người dùng vào trọng tâm của thiết kế.
Trong một số trường hợp, bên cạnh CTA, bạn có thể đặt thêm các social sharing buttons như share Facebook, Twitter, gửi email… để người dùng có thêm lựa chọn nho nhỏ (ngay cả khi họ không muốn click vào CTA button).
5+ Forms
Sau cùng, các landing page thường được thiết kế đi kèm với các forms. Form thì rất đa dạng. Form ở đây có thể là đăng ký nhận ebook, đăng ký thành viên, đặt hàng trước một sản phẩm nào đó..v.v… và form đi kèm với CTA buttons. Một lưu ý quan trọng ở đây là form nên tối giản, càng đơn giản càng thuận lợi cho người dùng. Bạn có còn nhớ có 1 blog tôi từng viết rằng: người dùng thì lười biếng ? Đừng hỏi những thứ thừa thãi như qui mô công ty, số điện thoại, v.v… Hãy tập trung vào những thông tin thật cần thiết, ví dụ như email chẳng hạn.
Always try to balance the “size of the prize” (what you are giving away) with the level of information you are asking a prospect to provide. There is a fine line between being too greedy and not asking for enough to satisfy your marketing needs. – Oil Gardner
Số lượng dữ liệu phải nhập trên form nên cân bằng với dịch vụ / sản phẩm mà bạn cung cấp. Bản thân mỗi người dùng sẽ tự hiểu độ ngắn / dài của form thế nào là phù hợp. Chẳng hạn form mua hàng trực tuyến thì cần có address để giao hàng, nhưng form đăng ký download e-book dạng PDF thì chỉ cần tên người dùng, và email là đủ. Nếu cẩn thận hơn chút nữa, sau khi người dùng nhập thông tin vào form, bấm vào nút call-to-action, ngoài việc gửi email confirm cho họ, bạn có thể hiện thị thêm một màn hình dạng confirmation page để họ (người dùng) chắc chắn rằng yêu cầu của họ đã được gửi đi, và ghi nhận.
Thiết kế một landing page tốt không quá phức tạp, nhưng cần tỉ mỉ một chút, theo dõi hành vi khách hàng kỹ lưỡng một chút, campaign sẽ thành công.
Tham khảo:
Abstraction Hub 