You are currently viewing Cách White Space có thể thúc đẩy chuyển đổi trang đích của bạn

Cách White Space có thể thúc đẩy chuyển đổi trang đích của bạn

Họa sĩ theo trường phái tối giản Jo Baer’s Nhóm ánh sáng chính: Đỏ, Xanh lục, Xanh lam có ba hình vuông màu trắng được đóng khung bằng các dải màu đen và màu. Nhờ vào tâm lý con người, các hình vuông trông như đang trôi nổi.

Nhóm ánh sáng chính: Đỏ, Xanh lục, Xanh lam cho thấy bạn không cần phải che toàn bộ canvas của mình để tạo ấn tượng. Quy tắc tương tự áp dụng cho các trang đích. Trên thực tế, có thể bạn không muốn mỗi inch trên trang đích của mình đều có nội dung.

Thỉnh thoảng, càng đơn giản càng đẹp. Cung cấp khoảng trắng tấn lợi ích đối với luồng, cấu trúc và tác động của trang đích.

Bạn muốn tìm hiểu cách tạo một trang đích hấp dẫn sử dụng sức mạnh của khoảng trắng? Blog này sẽ hướng dẫn về những gì khoảng trắng là gì, nó làm gì để cải thiện trang đích và cách bạn có thể khai thác tiềm năng của nó.

Đối phó với Khoảng trắng là gì?

Trong thiết kế trang đích, khoảng trắng—Đôi khi được gọi là không gian âm—là không gian giữa các yếu tố thiết kế.

Mặc dù có tên, khoảng trắng không nhất thiết phải là màu trắng hoặc trống. Nó có thể có màu sắc hoặc thậm chí là hình nền. Hãy nghĩ về nó như những khu vực giữa các tiêu điểm của bạn.

Một trang đích có vi mô vĩ mô khoảng trắng, như Creatopy giải thích:

  • Khoảng trắng siêu nhỏ là khoảng cách giữa các phần tử nhỏ — khoảng cách giữa các biểu tượng hoặc khoảng cách giữa các dòng văn bản.
  • Khoảng trắng macro là không gian giữa các phần tử lớn như đồ họa và các cột văn bản.

Hãy sử dụng một trong những ví dụ của chúng tôi về các trang tạo khách hàng tiềm năng chuyển đổi cao để hiển thị khoảng trắng vĩ mô và vi mô đang hoạt động.

Phía bên phải, bạn sẽ thấy rất nhiều khoảng trắng vĩ mô, giúp hướng mắt về phía bản sao và CTA ở phía bên trái của trang, sau đó xuống ứng dụng đang được hiển thị trên máy tính bảng.

CKBK White Space 2

Ở bên trái của tiêu đề, bạn sẽ tìm thấy ba vùng của không gian trắng vi mô chia nhỏ tiêu đề, tiêu đề phụ, trường biểu mẫu và nút gửi.

CKBK White Space 3

Vì vậy, như bạn có thể thấy, bạn có thể sử dụng khoảng trắng vi mô và vĩ mô trong thiết kế trang đích của mình để tách biệt và làm nổi bật các yếu tố khác nhau.

Khoảng trắng tăng khả năng đọc

Mặc dù bạn có thể không nhận thấy khoảng trắng giúp dễ đọc như thế nào khi nó hoạt động, bạn có thể chắc chắn cho biết khi nó bị thiếu.

Bạn đã bao giờ phải đọc qua một tài liệu với các từ được in chưa aaaa đường đi vào lề của một trang? Điều gì về một văn bản từ người bạn đó gửi một bức tường văn bản khổng lồ thay vì các dòng riêng biệt? Không phải là một thời gian vui vẻ.

Khả năng đọc thậm chí còn trở nên quan trọng hơn khi trực tuyến, nơi người đọc muốn có câu trả lời cho câu hỏi của họ Nhanh. Một nghiên cứu trên hàng nghìn người dùng internet cho thấy rằng khách hàng chỉ đọc trung bình 18% nội dung của một trang web. Bạn sẽ muốn giúp họ nhanh chóng tìm thấy 18% đó trước khi họ trả lại.

Khoảng trắng phân loại các trang của bạn

Khoảng trắng cũng là một dấu ấn của thiết kế web hiện đại. Các trang có nhiều khoảng trắng hơn có xu hướng trông ít lộn xộn hơn, sạch hơn và chất lượng cao hơn. Mặc dù có thể cảm thấy như bạn đang “lãng phí” không gian âm, nhưng nó cũng quan trọng như các yếu tố thiết kế khác.

Chúng ta hãy nhìn vào ví dụ về cách sử dụng không gian trắng tối thiểu và chiến lược.

Nếu bạn đã sống hoặc đến thăm Thành phố New York trong một hoặc hai thập kỷ qua, bạn có thể đã thấy quảng cáo cho Tiến sĩ Jonathan Zizmor trước khi ông nghỉ hưu vào năm 2016. Những quảng cáo đó được biết đến với chất lượng “đẹp”, một phần vì chúng phù hợp với rất nhiều các yếu tố thiết kế trên một trang. Họ không có nhiều vi mô hoặc khoảng trắng vĩ mô — hầu hết mọi điểm đều chứa văn bản hoặc hình dạng.

Các quảng cáo đã có lợi cho Zizmor vì họ là trụ cột chính của tàu điện ngầm trong 25 năm. Nhưng cách tiếp cận này có thể không hiệu quả đối với một doanh nghiệp đang cố gắng trở nên hiện đại.

Đối chiếu điều này với một ví dụ gần đây hơn, như trang đích của sách điện tử này từ Optimonk. Nó có thiết kế đầy màu sắc giống như quảng cáo tàu điện ngầm ở trên, nhưng nó sử dụng nhiều khoảng trắng hơn:

Khoảng không gian mở rộng lớn — cả vĩ mô và vi mô — tuân theo các phương pháp hay nhất hiện nay cho không gian trắng và thiết kế trang đích này cảm thấy hiện đại hơn nhiều.

Làm thế nào để cung cấp cho trang đích của bạn mạnh mẽ với khoảng trắng

Khoảng trắng phục vụ nhiều mục đích trên các trang đích. Một khi bạn hiểu tất cả các cách khác nhau mà bạn có thể áp dụng, bạn có thể sử dụng tốt hơn khoảng trắng để làm lợi thế của mình.

Luồng người dùng trực tiếp

Mỗi trang đích đều có hệ thống phân cấp trực quan hướng dẫn người xem thông qua các yếu tố thiết kế của nó. Bạn có thể kiểm soát dòng chảy đó bằng cách bố trí khoảng trắng chiến lược. Khi bạn cung cấp cho một phần tử nhiều khoảng trắng hơn xung quanh nó, người xem có nhiều khả năng nhìn vào yếu tố đó trước.

Thực tiễn này quay trở lại một trong những nguyên tắc cơ bản của traveljob về thiết kế trang đích tập trung vào chuyển đổi: cấu trúc xây dựng. Bạn có thể tạo một hệ thống phân cấp thông tin bằng cách cho những chi tiết quan trọng nhất nhiều không gian hơn những chi tiết ít quan trọng hơn.

Kiểm tra cách Đơn giản kinh doanh tạo một đường dẫn trực quan bằng cách sử dụng khoảng trắng vĩ mô và vi mô.

Dòng tiêu đề, tiêu đề phụ và nút gọi hành động đầu tiên có nhiều khoảng trắng macro xung quanh chúng để thu hút mắt bạn trước tiên. Sau đó, khi bạn xuống trang, bạn sẽ thấy quy trình ba bước được chia nhỏ với nhiều khoảng trắng vi mô hơn. Măt của bạn tự động chuyển đến các phần tử quan trọng nhất của trang vì căn phòng họ có xung quanh họ.

Chia nhỏ nội dung của bạn

Khoảng trắng cũng có thể tách văn bản và các phần của trang đích để nhóm các ý tưởng tương tự lại với nhau và cải thiện khả năng đọc. Khoảng cách giữa các dòng văn bản, dòng tiêu đề và đoạn văn giúp bạn tìm hiểu thông tin theo thứ tự đã định. Khi trang đích của bạn chuyển đổi chủ đề, không gian trắng vĩ mô làm mịn quá trình chuyển đổi.

Theo nguyên tắc thứ năm của thiết kế trang đích tập trung vào chuyển đổi—hút sự chú ý—Hình ảnh của bạn nên tập trung vào những phần quan trọng nhất trên trang của bạn. Khi bạn chia nhỏ nội dung của mình bằng khoảng trắng, bạn giúp khách truy cập dành cho mỗi phần sự chú ý xứng đáng.

Hãy xem qua trang đích dễ hiểu của Sundae để xem thủ thuật này đang hoạt động:

Sundae bao quanh mỗi điểm chính trong một phần có khoảng trắng để thu hút sự tập trung của bạn vào đó. Chúng cũng kết hợp sự tương phản màu trắng / xám tinh tế với nhiều không gian âm để tách hai phần được hiển thị ở trên.

Tạo ra nhiều tác động hơn

Chạm vào nguyên tắc thiết kế trang đích tập trung vào chuyển đổi của hút sự chú ý, khoảng trắng cho phép không gian không phải màu trắng tạo ra nhiều tác động hơn. Một yếu tố chính được bao quanh bởi không gian trắng tạo ra nhiều điểm nhấn hơn mà không có bất kỳ yếu tố nào gần đó có thể phân tán khỏi nó.

Trang đích của Amazon này kết hợp việc sử dụng khoảng trắng để thu hút sự chú ý đến CTA của nó:

Trang đích của Amazon
Hình ảnh được cung cấp bởi Amazon qua VA CHẠM.

Đầu tiên, trang này làm nổi bật các tính năng và lời chứng thực với lượng khoảng trắng vừa phải. Sau đó, nó trình bày CTA (“Bắt đầu”) được bao quanh bởi khoảng trắng. Cuối cùng, nó bao gồm các chi tiết bổ sung trong phần Câu hỏi thường gặp với khoảng trắng tối thiểu.

Sau khi bạn lấy một dễ dãi hành trình thông qua các lợi ích của sản phẩm, Amazon mời bạn bắt đầu mà không bị phân tâm. Sau đó, bạn có thể tìm hiểu phần Câu hỏi thường gặp nếu bạn có bất kỳ câu hỏi nào.

Tăng sự thân thiện với người dùng

Khi bạn sử dụng khoảng trắng trên trang đích của mình, bạn muốn người dùng của mình nhìn thấy nó trên mọi nền tảng. Giữ cho không gian trắng của bạn nhất quán trên tất cả các định dạng xem, bao gồm cả bố cục web và thiết bị di động. Ngoài ra, hãy đảm bảo rằng vị trí khoảng trắng của bạn trên máy tính để bàn không đẩy mọi thứ ra khỏi vị trí — hoặc tạo ra sự chồng chéo — trên các thiết bị nhỏ hơn.

Đó là tất cả về nguyên tắc thứ bảy của thiết kế trang đích tập trung vào chuyển đổi: giảm ma sát. Theo Statcounter, 41,97% lưu lượng truy cập web toàn cầu đến từ người dùng máy tính để bàn vào tháng 5 năm 2021, với 55,31% đến từ thiết bị di động. Với hơn một nửa khách hàng của bạn sử dụng thiết bị di động, bạn cũng sẽ muốn họ có trải nghiệm trang đích tuyệt vời.

Trang đích di động này từ ClaimCompass cân bằng khoảng trắng dễ sử dụng.

Trong phần đầu tiên, trang đích dành cho thiết bị di động này thu hút sự chú ý đến nền giữa tiêu đề và tiêu đề phụ của nó. Sau đó, nó đánh dấu các lợi ích của nó bằng các dấu kiểm và khoảng trắng vi mô để giữ cho chúng có thể đọc được. Tất cả các yếu tố đều cảm thấy như chúng đang ở đúng nơi, ngay cả với khoảng trắng được bao gồm trong định dạng điện thoại di động.

Ôm lấy không gian

Đừng đánh giá thấp sức mạnh của khoảng trắng. Khi bạn cung cấp cho các yếu tố thiết kế của mình không gian để thở, chúng sẽ phục vụ mục đích dự kiến ​​của chúng hiệu quả hơn nhiều. (Điều này cũng giúp bạn có cơ hội tốt hơn trong việc kiếm chuyển đổi.) Hãy xem 7 Nguyên tắc thiết kế lấy chuyển đổi làm trung tâm để biết một khóa học về xây dựng trang đích chuyển đổi.

Leave a Reply