Thiết kế website đơn giản phù hợp với người dùng

Theo một nghiên cứu năm 2014 của Google, người dùng luôn đánh giá các trang web trực quan đơn giản đẹp hơn các mẫu phức tạp. Hơn nữa, các trang web nguyên mẫu (hoặc các trang web có bố cục gắn chặt với các trang có cùng category với nó) với thiết kế đơn giản được coi là những trang đẹp nhất trong tất cả. Nói cách khác? Đơn giản là đẹp. Sự chuyển đổi xinh đẹp

Nhưng tại sao? Trong bài viết này, chúng ta sẽ khám phá khái niệm của thiết kế nguyên mẫu, thiết kế đơn giản và xem xét vai trò của nó đối với sự trôi chảy về nhận thức và xử lý hình ảnh, hai yếu tố ảnh hưởng lớn tới sự thu hút người dùng và cuối cùng giúp tạo ra chuyển đổi.

Website nguyên mẫu

Nếu tôi hỏi bạn màu gì đại diện cho "con trai", bạn nghĩ rằng màu xanh. Và một cách tự nhiên, màu hồng tượng trưng cho "con gái". Nhưng bạn có biết rằng vào giữa thế kỷ 19,  màu xanh (một màu điềm đạm, yên bình) được kết hợp cho các cô gái, và màu hồng (màu sáng, đam mê) được kết hợp với các chàng trai? Bạn thậm chí không thể tưởng tượng được điều đó, phải không? Nhưng tại sao lại không? Cái gì vốn thuộc về màu xanh là của con trai, và vốn thuộc màu hồng là về con gái? Câu trả lời ? Không có gì.

Vậy tại sao bạn tự động kết hợp với các chàng trai với màu xanh và cô gái với màu hồng? Bởi vì bộ não của bạn đã nhìn thấy những sự kết hợp như vậy thường xuyên đến nỗi nó tạo ra một shortcut để tham khảo trong tương lai. "Boy = Xanh" là một nguyên mẫu mà bộ não của bạn đã được tạo ra trong một nỗ lực để phân loại thông tin. Công việc của bộ não của bạn là tạo cảm giác càng nhiều thông tin và càng nhanh càng tốt. Bằng cách tạo ra các shortcut này, não của bạn làm cho nó dễ dàng hơn cho bạn trong việc cảm nhận về thế giới.

Khái niệm tương tự có thể được áp dụng cho thiết kế trang web. Hình thức sao chép xảy ra rất nhiều trên Internet. Nếu một yếu tố thiết kế web nào đó hoặc bố cục dùng cho cho một trang web của một đại lý xe hơi, nó chỉ là vấn đề thời gian trước khi các đại lý xe khác bắt đầu làm theo.

Điều này dẫn đến một nguyên mẫu đại lý xe hơi, hay một cái nhìn nhất định mà người dùng sử dụng để liên kết với các đại lý xe hơi. Những tồn tại cho hàng đống website khác nhau, từ "các trang web thời trang dành cho tuổi 20" đến "blog dành cho cho các mẹ". Liệu có một nguyên mẫu cho các category của bạn không? Nếu có, hãy làm một số nghiên cứu để tìm hiểu thiết kế theo nguyên mẫu sẽ như thế nào, và cố gắng kết hợp các yếu tố tương tự nhau.

Sự trôi chảy trong nhận thức

Não bộ tạo ra những nguyên mẫu này vì nó thích những điều dễ dàng khi nghĩ về. Điều này được gọi là sự lưu loát trong nhận thức. Nó bắt nguồn từ hiệu ứng tiếp xúc đơn thuần, trong đó nói rằng bạn càng được tiếp xúc nhiều với một cái gì đó, bạn càng thích nó. Sự trôi chảy trong nhận thức có nghĩa là mọi người sẽ thích các trang web mà họ biết theo bản năng nơi của mọi thứ và hành động gì họ cần cần thực hiện. Ví dụ, có một cấu trúc khá chuẩn mà tất cả các blog đều chia sẻ. Và tất cả các trang sản phẩm thương mại điện tử là một sự kết hợp của các yếu tố nền tảng giống nhau, bao gồm cả hình ảnh sản phẩm, giá cả, mô tả sản phẩm, và một nút để thêm các mục vào giỏ hàng của bạn.

Nếu blog hoặc trang sản phẩm thương mại điện tử của bạn đi chệch khỏi các chuẩn thì nghĩ về nó không còn dễ dàng nữa. Việc thiếu dễ dàng có thể dẫn đến việc người dùng từ chối trang web của bạn. Mục tiêu của bạn sẽ trở thành việc làm cho trang web của bạn càng dễ nhận thức được càng tốt

Xử lý thông tin thị giác

Và cách tốt nhất để làm cho trang web của bạn nhận thức hơn là làm cho nó dễ dàng để xử lý trực quan.  Một nghiên cứu Harvard 2013 phát hiện sự tương quan về mặt toán học mạnh mẽ trong những cái mà nhân khẩu học khác nhau coi là “sự làm hài  lòng về mặt thẩm mỹ”. Những người khác nhau dường như có cảm nhận khác nhau rất lớn về thiết kế web, một khái niệm được tìm thấy mang tính phổ quát là: trang web càng phức tạp về mặt thị giác thì sự thu hút về mặt thị giác của nó càng thấp. Bằng cách đơn giản hóa trang web của bạn, bạn có thể tạo ra sự thu hút nhiều nhất cho một số lượng lớn nhất con người.

Đơn giản là xử lý dễ dàng một cách khoa học

Tại sao tất cả mọi người cảm thấy rằng đơn giản là đẹp hơn? Có thể bởi vì đơn giản là dễ dàng hơn một cách khoa học cho chúng ta xử lý. Các trang web có độ phức tạp thấp không cân mắt và bộ não của chúng ta làm việc mệt mỏi để xử lý và lưu trữ thông tin.

Đây là cách nó hoạt động:

•  Võng mạc của bạn chuyển đổi các thông tin hình ảnh thành các xung điện, mà sau đó nó gửi đến não. Những xung động truyền đi thông tin màu sắc và ánh sáng.

•  Càng nhiều biến thể màu sắc và ánh sáng trên trang (phức tạp về mặt thị giác), càng làm mắt bạn phải làm việc để gửi các xung động lên não của bạn. Sau đó bộ não của bạn phải làm việc nhiều hơn để dịch và lưu trữ thông tin.

Về cơ bản, trang web càng ít phức tạp thì mắt càng dễ dàng tiếp nhận nó và não dễ dàng dịch nó. Đó cũng là khái niệm trôi chảy trong nhận thức.

Tất cả các yếu tố truyền tải thông tin

Bởi bây giờ, có lẽ bạn đang nghĩ rằng đơn giản là một khái niệm tuyệt vời và là tất cả, nhưng làm thế nào để bạn truyền đạt tất cả các thông điệp mà không làm cho trang web của bạn quá lộn xộn? Câu trả lời – truyền đạt càng ít càng tốt.

Mỗi yếu tố (kiểu chữ, logo, màu sắc, bố cục, vv) đều là sự truyền đạt thông tin tinh tế về thương hiệu của bạn. Điều này phản ánh tâm lý cơ bản, tác động đến cách mọi người phản ứng với màu sắc khác nhau và khuôn mặt typographic. Tối ưu hóa trang web của bạn là bạn truyền đạt càng nhiều thông tin thương hiệu trong phạm vi có thể, sử dụng càng ít yếu tố càng tốt.

Hãy lấy MailChimp làm ví dụ. Trong năm 2013, MailChimp đã dành thời gian để thiết kế lại một trong những yếu tố quan trọng nhất của thương hiệu - logo của nó. Thiết kế logo là một phần của việc sửa chữa thương hiệu lớn hơn, MailChimp muốn làm logo trông hiện đại hơn mà không thay đổi nhiều.

Mẫu gốc trông như thế này:

Các nhà thiết kế đã làm thoáng một số khu vực chặt chẽ để dễ đọc hơn, dựng thẳng đường (vẫn duy trì cảm giác như đang viết văn), giảm đường nét và đường gập và tách các từ.

Kết quả:

Có một triệu người dùng mới.

Trong khi tôi không cố gắng để gợi ý rằng một triệu người tham gia MailChimp vì thiết kế lại logo, nhưng kết quả này vẫn rất ấn tượng. Và bằng cách tối ưu các yếu tố cá nhân của bạn, bạn cũng có thể tận hưởng kết quả ấn tượng như thế.

Trí nhớ làm việc

Một lý do khác cho việc đơn giản là tốt hơn là dành cho bộ nhớ ngắn hạn (hay còn gọi là trí nhớ làm việc). Trí nhớ làm việc là một phần của bộ não của bạn để tạm thời lưu trữ và xử lý các mẩu thông tin. Nó cho phép bạn tập trung chú ý, chống nhiễu và đưa ra quyết định. Tuy nhiên, nó chỉ có thể lưu trữ hiệu quả 5-9 mẩu thông tin tại một thời điểm. Đó là lý do tại sao càng ít thông tin trang web của bạn có thì càng tốt. Một thiết kế nguyên mẫu đơn giản làm giảm lượng tiếng ồn vào bộ nhớ làm việc, cho phép các yếu tố quan trọng của bạn (như bảo hành, giới thiệu sản phẩm, giá cả và cung cấp) là 5-9 mẩu thông tin trong lưu trữ.

Độ lệch

Đoán những gì sẽ xảy ra khi bạn đi lệch khỏi thiết kế nguyên mẫu và đơn giản? 5-9 mẩu thông tin mà người dùng lưu trữ sẽ trở thành bất cứ yếu tố nào không hoàn toàn đáp ứng được mong đợi của họ.

Có rất nhiều cách để bạn có thể đi chệch khỏi sự mong đợi, bao gồm:

•  Giá cao

•  Lược đồ màu sắc hoặc bố cục bất thường

•  Tốc độ tải chậm

•  Hình ảnh mờ

•  Điều hướng khó hiểu

Khi bạn đi chệch, những mẩu thông tin này được lưu trữ thay vì các mẩu quan trọng. Đó là lý do tại sao nó thực sự quan trọng để xem xét các tiêu chuẩn web của người truy cập khi thiết kế trang web của bạn. Bạn có thể làm điều này bằng cách nghiên cứu các blog họ đọc, các trang web họ mua sắm, các trình duyệt mà họ sử dụng, lứa tuổi của họ, vị trí của họ, vv Bằng cách hiểu những gì người dùng mong đợi, bạn có thể đáp ứng nhu cầu riêng của họ và giúp họ xử lý thông tin hữu ích trong bộ nhớ làm việc của họ.

Nghiên cứu trường hợp của Skinny Ties

Bạn muốn bằng chứng ư? Dưới đây là một nghiên cứu trường hợp thành công cho thiết kế lại đơn giản của  Skinny Ties. Skinny Ties là một công ty gia đình chuyên thiết kế và bán cà vạt.

Cho đến năm 2012, website Skinny Ties trông giống như thế này:

Trong tháng 10 năm 2012, Skinny Ties đã không nhận được lưu lượng truy cập web và chuyển đổi như nó đã hy vọng, vì vậy công ty đã quyết định thiết kế lại hoàn toàn trang web. Các nhà thiết kế đã quyết định theo chủ đề bố cục thương mại điện tử nguyên mẫu cho những trang sản phẩm và category. Họ cho phép nhiều khoảng trắng mở, và họ đã chọn cho độ phân giải cao, hình ảnh sản phẩm đơn với màu sắc tương phản.

Các trang web của Skinny Ties mới trông như thế này:

Chỉ cần 2,5 tuần sau sự ra mắt của trang web mới, Skinny Ties thấy kết quả như sau:

•  Tăng doanh thu 4% cho tất cả các thiết bị (tăng doanh thu 377,6% chỉ dành cho người dùng iPhone)

•  Tăng tỷ lệ chuyển đổi 6% (Tăng tỷ lệ chuyển đổi 71,9% chỉ dành cho người dùng iPhone)

•  Giảm tỷ lệ trả lại 2%

•  Tăng thời gian viếng thăm 6%

Tự kết quả đã nói lên tất cả.

Kết luận

Nếu người dùng không thể tìm thấy những gì họ đang tìm kiếm, họ sẽ không suy nghĩ rằng sao trang web sáng tạo và ấn tượng thế. Họ chỉ tự hỏi tại sao mọi thứ không ở "nơi mà chúng đáng ra phải ở". Và điều đó không thực sự là khuôn khổ suy nghĩ tốt nhất khi bạn muốn họ chuyển đổi.

Để đơn giản nghe có vẻ dễ, nhưng hãy nhớ rằng bạn phải có chiến lược. Bạn không thể chỉ gỡ xuống những thông tin quan trọng, nhường chỗ cho các khoảng trắng. Hãy xem xét những thông tin người dùng của bạn cần và làm thế nào để thể hiện nó mà tốn ít không gian nhất.

Khi thiết kế / thiết kế lại trang web của bạn, hãy tâm niệm làm theo các bước sau đây:

•  Nghiên cứu độc giả và các trang web mà họ xem nhiều nhất

•  Đặt mọi thứ vào nơi mà khách truy cập mong chờ thấy chúng

•  Dựa vào màu sắc, logo và kiểu chữ của riêng bạn để truyền đạt - không thêm yếu tố, trừ khi truyền đạt một cái gì đó khách truy cập của bạn thực sự quan tâm

•  Giữ nó càng đơn giản càng tốt và tận dụng nhiều khoảng trắng có thể

•  Kiểm tra lại để đảm bảo trang web của bạn phù hợp với mong đợi về giá cả, thẩm mỹ, tốc độ, vv

•  Đừng cố gắng để làm cho mọi khía cạnh của trang web của bạn như nguyên mẫu

Bằng cách giữ thiết kế trang web của bạn đơn giản và nguyên mẫu, bạn có thể cung cấp cho người truy cập của bạn một con đường rõ ràng, thân thiện với người sử dụng để chuyển đổi.