11 Nguyên tắc thiết kế web sẽ tăng tỷ lệ chuyển đổi của bạn – P1

02 Th10, 2017

Như đề cập trong bài chia sẻ trước của mình, chúng tôi đã từng khẳng định tầm quan trọng của tỷ lệ chuyển đổi trang Web trong việc đánh giá hiệu quả của một Website. Có rất nhiều cách giúp tăng chuyển đổi trên trang web của mình. Tuy nhiên, thiết kế Website chính là nền tảng quan trọng nhất để tạo ra sự khác biệt cho Website của bạn. Trong bài viết này, chúng tôi xin chia sẻ 11 nguyên tắc thiết kế Web sẽ tăng tỷ lệ chuyển đổi của bạn.

Hầu hết các Marketer đều hiểu về tầm quan trọng của SEO, Social Media, tạo ra những nam châm chuyển đổi nhưng lại thường bỏ qua một yếu tố vô cùng quan trọng là thiết kế web. Thiết kế web không chỉ là một khuôn mặt đẹp mà nó còn có vai trò vô cùng quan trọng, có thể tạo ra hoặc phá hủy tỷ lệ chuyển đổi trang Web của bạn.

Theo nghiên cứu của đại học Stanford, 46,1% người được phỏng vấn cho rằng thiết kế của một trang web là tiêu chí hàng đầu để quyết định xem một công ty có đáng tin cậy hay không. Vì vậy, điều cực kỳ quan trọng là thiết kế của bạn phải trông thật hấp dẫn và chuyên nghiệp.

Cho dù trang Web của bạn có mang tính thẩm mỹ hay không thì nó cũng đóng một vai trò lớn trong việc tối ưu hóa tỷ lệ chuyển đổi. Với 15 phút để tiếp nhận nội dung, hai phần ba người đọc thích đọc những thứ gì đó có thiết kế đẹp mắt hơn một thứ gì đó đơn giản (Theo nghiên cứu của Adobe). Vì vậy, nếu bạn muốn mọi người đọc đọc các bài đăng blog của bạn, bạn cần phải trông thật hấp dẫn.

38% người dùng sẽ rời khỏi trang web của bạn khi thiết kế của nó kém hấp dẫn. Đó là một mất mát đáng tiếc!

Vì vậy, bất kể thiết kế có phải là sở trường của bạn hay không thì cũng không thể bỏ qua việc đầu tư cho việc thiết kế web như thuê một Agency chuyên thiết kế web chẳng hạn.

Để bắt đầu,  chúng tôi xin điểm qua một vài nguyên tắc thiết kế quan trọng giúp tăng tỷ lệ chuyển đổi bền vững cho website của bạn:

  1. Tuân theo luật Hick

Luật Hick là một lý thuyết phổ biến được trích dẫn bởi nhiều cá nhân cho các mục đích khác nhau, nhưng thường được tham chiếu về thiết kế website. Được đặt tên theo nhà tâm lý học người Anh William Edmund Hick, luật quy định rằng thời gian cần thiết để một cá nhân đưa ra quyết định là trực tiếp tương ứng với những lựa chọn có thể có của họ. Nói cách khác, bằng cách tăng số lượng lựa chọn, thời gian quyết định cũng tăng lên.

Bạn có thể đã nghe nói về nghiên cứu nổi tiếng của các nhà tâm lý học Sheena Lyengar và Mark Lepper, nơi họ thấy rằng một bảng trưng bày 24 loại mứt thu hút ít sự quan tâm hơn một  bảng chỉ hiển thị 6 loại. Trên thực tế, những người nhìn thấy màn hình lớn hơn chỉ có một phần mười khả năng mua như những người xem màn hình nhỏ.

Đó là một ví dụ về luật Hick đang hoạt động: hành động bị mất tương ứng với số lượng các lựa chọn được trình bày.

Về thiết kế Web, bạn có thể tăng chuyển đổi bằng cách giới hạn số lượng lựa chọn mà người dùng có. Điều đầu tiên xuất hiện trong đầu khi suy nghĩ về nơi để cắt giảm số lượng lựa chọn trên trang web của bạn là thanh điều hướng. Rõ ràng, bạn không muốn có quá nhiều liên kết để lựa chọn, nếu không người dùng cũng sẽ đánh mất dần sự quan tâm của họ.

Tuy nhiên, Luật Hick không dừng lại ở đó . Hãy suy nghĩ về tất cả các quyết định quan trọng khác nhau mà người dùng phải thực hiện trên trang web của bạn, ngoài việc chỉ liên kết điều hướng nào cần nhấn.

Đây chỉ là một vài:

  • Quyết định có sử dụng thanh điều hướng hay cuộn xuống trang nhiều hơn
  • Bỏ qua các tiêu đề để xem bài đăng trên blog cần đọc
  • Quyết định có tải xuống nam châm dẫn của bạn hay không, chia sẻ bài đăng của bạn trên phương tiện truyền thông xã hội hoặc để lại nhận xét
  • Lựa chọn giữa việc mua hàng, đọc đánh giá sản phẩm hoặc duyệt qua các sản phẩm khác

Những điều này chỉ làm xước bề mặt của rất nhiều quyết định mà người dùng của bạn phải thực hiện. Việc cảm thấy choáng ngợp khi cố gắng tìm ra nơi để bắt đầu cắt giảm các quyết định này là bình thường, tuy nhiên, có một cách đơn giản để sử dụng Luật Hick trong một nhúm…

Tất cả những gì bạn phải làm là cài đặt một cổng chào mừng toàn màn hình trên trang chủ của bạn. Cổng chào mừng bao gồm toàn bộ màn hình với một lời kêu gọi hành động, do đó, người dùng chỉ thấy một lựa chọn có sẵn lúc đầu. Nếu họ muốn thấy nhiều lựa chọn hơn, họ sẽ phải cuộn xuống.

Điều này cho phép bạn giảm thiểu xao lãng trên trang chủ của mình, trong khi vẫn giữ nguyên chức năng của trang chủ của bạn.

Nhìn chung, khi áp dụng Luật Hick vào trang web của bạn, điều quan trọng là bạn phải biết hành động nào là quan trọng nhất đối với lợi nhuận của bạn. Bạn càng giới hạn chính xác lựa chọn của người dùng, trang web của bạn càng dễ sử dụng và tỷ lệ chuyển đổi nhờ đó cũng tăng lên.

Bạn càng có thể giới hạn lựa chọn của người dùng, trang web của bạn sẽ dễ sử dụng hơn và chuyển đổi của bạn sẽ tăng vọt.

  1. Vận dụng quy tắc hai phần ba:

Quy tắc của phần ba là một nguyên tắc nhiếp ảnh phổ biến mà cũng có thể được áp dụng cho thiết kế web. Với Rule of Thirds, bạn phải phân chia trực quan một hình ảnh (hoặc trang web) thành một phần ba (cả theo chiều dọc và chiều ngang).

Điều này cho bạn chín ô vuông bằng nhau. Theo quy tắc, bốn nút giao giữa là những nơi quan tâm chiến lược. Khi các đối tượng được đặt tại các điểm này, nó tạo ra hình ảnh hoặc thiết kế có ảnh hưởng nhất.

Về mặt thiết kế web, bạn có thể đặt các yếu tố quan trọng nhất của trang tại các nút giao này để mọi người tập trung vào chúng, thúc đẩy chuyển đổi của bạn.

Lưu ý cách không nên đặt thanh điều hướng của họ ở bất kỳ nơi nào gần nút giao. Điều này giúp giữ khách truy cập tập trung vào lời kêu gọi hành động chính trên trang, thay vì hướng mắt họ đến một nơi khác.

Bạn không cần phải thiết kế toàn bộ trang web của mình một cách nghiêm ngặt theo quy tắc của phần ba, thay vào đó bạn có thể sử dụng nó như một công cụ để giúp bạn đặt các yếu tố quan trọng nhất của mình.

Hãy thử chụp ảnh màn hình trang web của bạn (chỉ trong màn hình đầu tiên hoặc chỉ phần tiêu đề của bạn, không phải toàn bộ chiều dài của trang vì không ai nhìn vào trang web theo cách đó) và chia thành 9 ô vuông bằng nhau. Sau đó, bạn có thể quyết định xem bạn có muốn thực hiện bất kỳ chỉnh sửa nào không.

  1. Tôn trọng sự kiên nhẫn của người dùng:

Theo một nghiên cứu của Aberdeen Group , sự chậm trễ một giây trong thời gian tải trang dẫn đến giảm 7% chuyển đổi!

Vì vậy, khi nói đến tốc độ tải trang, mỗi giây đều được tính. Để kiểm tra tốc độ trang của bạn và khắc phục sự cố bất kỳ vấn đề nào, hãy chạy trang web của bạn thông qua một hoặc nhiều công cụ miễn phí sau:

  1. Sử dụng không gian âm

Trong thiết kế web, khoảng trắng thường được gọi là không gian âm. Không gian tích cực là không gian chứa tất cả các phần tử trên trang web của bạn, trong khi không gian âm là tất cả không gian trống ở giữa.

Mặc dù tên, không gian âm thực sự là một điều tích cực trong thiết kế web, bởi vì không có nó trang web của bạn sẽ không đọc được và không sử dụng được.

Không gian âm không chỉ đề cập đến khoảng trống giữa các phần tử lớn hơn trên trang của bạn, chẳng hạn như khoảng cách giữa tiêu đề và nội dung của bạn hoặc không gian giữa thanh bên và nội dung của bạn. Nó cũng đề cập đến không gian giữa tất cả các phần tử nhỏ hơn trên trang của bạn, như khoảng cách giữa các đoạn văn, khoảng cách giữa các dòng văn bản và thậm chí là khoảng cách giữa các chữ cái.

Chú ý đến tất cả các dạng không gian âm trên trang web của bạn sẽ giúp mọi thứ dễ đọc, dễ đọc (rất quan trọng, bởi vì đó là cách mọi người đọc trang web) và dễ nhìn vào mắt. Và tất nhiên, tất cả điều này dẫn đến tăng chuyển đổi.

Flat.io sử dụng một tấn không gian âm trên trang chủ của họ để tập trung vào lời kêu gọi hành động chính của họ, đó là đăng ký với Google hoặc Facebook.

Dưới đây là một số mẹo để đảm bảo bạn đang sử dụng đủ không gian âm:

  • Phông chữ của bạn càng nhỏ, bạn càng cần nhiều không gian hơn giữa các chữ cái.
  • Chiều cao dòng của bạn (xác định không gian phía trên và bên dưới dòng văn bản) phải xấp xỉ 150% kích thước phông chữ cho bản sao nội dung (trong CSS, điều này sẽ đọc line-height: 1.5;:).
  • Tuy nhiên, các phông chữ nhỏ hơn cần chiều cao dòng rộng hơn.
  • Chia nhỏ các khối văn bản lớn thành các đoạn văn nhỏ hơn để tăng không gian âm ở giữa chúng và làm cho các bài đăng trên blog của bạn dễ đọc hơn.
  • Thêm khoảng trắng giữa các phần tử lớn hơn trên trang web của bạn (thanh bên, tiêu đề, phần thân, chân trang, v.v.) bằng cách sử dụng lề rộng và phần đệm.
  1. Xem xét F-Layout

Các nhà nghiên cứu đã phát hiện ra rằng hành vi tự nhiên của người dùng khi duyệt web là đọc màn hình theo mẫu “F”.

Dưới đây là bản đồ nhiệt cho biết mắt người dùng thường nằm ở đâu trên trang web:

Như bạn có thể thấy, mọi người nhìn từ trái sang phải ở đầu màn hình. Sau đó, họ quét trang xuống dưới, làm cho những kẻ đột nhập nhỏ vào nội dung. Diện tích của trang có số lượng hiển thị ít nhất là dưới cùng bên phải.

Vậy điều này có ý nghĩa gì đối với việc thúc đẩy chuyển đổi của bạn? Vâng, bạn có thể tận dụng lợi thế của hành vi này bằng cách đặt các đối tượng quan trọng nhất và các cuộc gọi hành động dọc theo các đường hình chữ F, và đặt các đối tượng ít quan trọng trong các khu vực tầm nhìn thấp hơn.

Ví dụ: bạn có thể đặt lời gọi hành động chính ở đầu trang về phía bên trái vì đó là nơi người dùng sẽ nhìn đầu tiên.

Sau đó, nếu bạn muốn người dùng của mình gắn bó với nhau để đọc các bài đăng trên blog mới nhất của mình, bạn có thể đặt các dòng tiêu đề đó xuống phía bên tay trái của trang. Thông tin ít quan trọng hơn (chẳng hạn như quảng cáo được tài trợ) có thể nằm trong thanh bên ở bên phải trang của bạn và bạn có thể đặt thông tin mà bạn muốn có mức hiển thị thấp nhất (chẳng hạn như chính sách cookie) ở phía dưới bên phải- góc tay của trang.

                                                                                                                                                                                            Theo Mary Fernandez

Follow Us
on Facebook.

Đăng ký
nhận tin tức.