Nguyên tắc trưng bày nội dung trong Web Thương mại điện tử (part 2)

Nguyên tắc trưng bày nội dung trong Web TMĐT (part 2) Mặt tiền của cửa hàng. Mặt tiền của một cửa hàng là phần nội dung trang Web hiện ra trên trình duyệt ngay khi lần đầu tiên bạn mở trang Web ra. Mặt tiền là vùng có đường bao màu đỏ trong hình minh hoạ dưới. Mặt tiền phải rộng. Chúng tôi thường dùng từ Above the fold để nói về điều này. Cũng giống như một tờ báo giấy, phần chân của khung màu đỏ thể hiện kết thúc nội dung của phần bạn đang nhìn thấy, muốn xem phần sau phải mở rộng phần cuối bằng cách dùng thanh cuộn thẳng đứng. Đường chân đó gọi là đường gấp và phần trên được gọi là Trên đường gấp hay Above the fold. Khi thiết kế mặt tiền bạn cần cân nhắc giữa số lượng hàng hoá trưng bày hay lượng thông tin của mỗi hàng hoá để đảm bảo tính dễ thấy, dễ đọc, dễ chọn. Đa số người sử dụng nhất là trẻ tuổi thường chỉ xem nội dung trưng bày trong phần Above the fold. Hình dưới thể hiện vùng Above the fold. Hình minh hoạ 2 Shop360.vn với tầm nhìn trở thành Trung tâm mua sắm và giải trí trực tuyến hàng đầu Việt Nam. Để đạt được mục tiêu, Site gia tăng số lượng hàng hoá trên gian hàng ảo, phát triển các dịch vụ gia tăng giúp người tiêu dùng mua hàng thuận hiện hơn cũng như thêm dịch vụ in ảnh trực tuyến. Tất cả các nỗ lực đó khiến Site không thể tốt hơn được nữa trong thời điểm TMĐT chưa thực sự thâm nhập vào cuộc sống. Dần dần, Site trở thành nơi tham khảo giá và thông tin của hàng nghìn mặt hàng khác nhau. Trên khía cạnh kinh doanh, Site đang làm rất tốt công việc đào tạo người tiêu dùng nhận thức về Trung tâm mua sắm trực tuyến, tăng độ phủ thị trường. Tuy nhiên sự thiếu quan tâm về mặt tiền của Siêu thị ảo khiến mọi nỗ lực không được đền bù xứng đáng. Người tiêu dùng trực tuyến không thấy sự hấp dẫn của Siêu thị từ vùng Above the fold, nhiều người sẽ nhanh chóng rời bỏ khi không thấy có lợi cho họ trong cái nhìn đầu tiên. Độ rộng vùng có thể nhìn được tuỳ thuộc vào người dùng mục tiêu. Vùng có thể nhìn được phụ thuộc vào các yếu tố sau: • Độ phân giải màn hình • Font chữ mặc định • Kích cỡ màn hình trình duyệt Web • Trình duyệt Web • Các thanh công cụ được cài vào trình duyệt Web Hình minh hoạ 3 Vùng có thể nhìn được bị hạn chế nên các cửa hàng ảo cần phải tiết kiệm các không gian trình bày, giảm thiểu các yếu tố đồ hoạ không cần thiết. Trần Anh là một trong những công ty kinh doanh thiết bị vi tính hàng đầu tại Việt Nam. Mỗi khi có nhu cầu mua thiết bị vi tính, Website trananh.vn là điểm đến đầu tiên của nhiều người. Website không thực hiện chức năng bán hàng trực tuyến, nhưng nó góp phần quan trọng vào việc tạo và gìn giữ cầu nối giữa khách hàng và công ty Trần Anh. Qua Website, Trần Anh cũng đánh giá được xu hướng tiêu dùng của khách hàng thông qua thị phần click chuột vào các hạng mục thiết bị vi tính từ đó công ty hoạch định kế hoạch kinh doanh.Tuy nhiên công ty chưa sử dụng không gian trong vùng Above the fold hiệu quả. Các banner siêu lớn với những hình ảnh ít giá trị choáng phần lớn vùng mặt tiền. Có nhiều cách để định hướng người dùng, tuy nhiên cách này tỏ ra không thu được thiện cảm từ người dùng. Tuy nhiên vị trí trang trọng của thương hiệu Trần Anh trong tim người tiêu dùng, khiến họ vẫn tiếp tục phải tiêu tốn những thao tác thừa để tìm ra thứ họ cần mua. Khả năng mở rộng độ rộng của cửa hàng ảo. Web TMĐT dựa trên nền tảng công nghệ Web, đây là ưu điểm vượt trội của cửa hàng trực tuyến đối với cửa hàng truyền thống. Chiều rộng của Web TMĐT nên co giãn tuỳ theo màn hình người tiêu dùng tuy nhiên nên có một độ rộng mặc định bằng với độ rộng của màn hình nhỏ nhất mà nhóm người tiêu dùng mục tiêu thường sử dụng. Chẳng hạn kích cỡ mặc định là 766 px. Với Amazon, khách hàng mục tiêu sử dụng màn hình 17 inch, nên kích cỡ mặc định là 990 px. Giao diện Web tại Việt Nam phần lớn vẫn dựa trên trải nghiệm của người quản trị dự án hoặc năng khiếu của đồ hoạ viên. Qua nhiều năm, dường như rất ít Web TMĐT may mắn có được một người được đào tạo về tính tự Marketing của Web tham gia vào phát triển giao diện. Do vậy mặc dù được đầu tư rất bài bản nhưng giao diện Web TMĐT Việt Nam vẫn là vùng đất hứa cho các cao bồi hoang dại đặt ra các quy luật giao diện của riêng mình, mặc dầu xét cho cùng khách hàng mới là người đem tiền lại cho họ. Khả năng mở rộng được thay thế bằng khung Web bé xíu - cố định với hai bên treo lủng lẳng các banner trượt hoặc cố nhồi hàng tá siêu banner bên trong không theo tiêu chuẩn IAB. Chẳng hạn shop360.vn, 25h.vn, megabuy.vn, … Bố cục cửa hàng ảo. Tuỳ theo phân khúc thị trường, khách hàng mục tiêu và định vị mà có bố cục trang Web khác nhau. Cửa hàng có thể là một khối, bố cục đối xứng hay bất đối xứng, ba mảng hay một mảng hay phối hợp nhiều loại bố cục. Hình dưới đây so sánh 3 loại bố cục theo thứ tự: một mảng ( Discovery), ba mảng ( Amazon) và phối hợp (Wired). Hình minh hoạ 4 Tuy nhiên trong một cửa hàng bán nhiều nhãn hàng, chủng loại hàng hoá, loại ba mảng được sử dụng nhiều hơn cả. Kích cỡ các mảng trong bố cục thế nào là hợp lý? Chúng phụ thuộc vào nội dung của bạn trong những bài tiếp theo tôi sẽ cung cấp các kích thước chung cho thiết kế giao diện. Màu sơn nền của cửa hàng ảo. Màu nền của trang Web phải hỗ trợ khả năng nhìn, đọc cũng như phối màu của nội dung. Theo nguyên lý phối màu tương phản, chúng ta có thứ tự sau: 1. Chữ đen trên nền vàng. 2. Chữ xanh lá cây trên nền trắng. 3. Chữ xanh dương trên nền trắng. 4. Chữ trắng trên nền xanh dương. 5. Chữ đen trên nền trắng. 6. Chữ vàng trên nền đen. 7. Chữ trắng trên nền đỏ. 8. Chữ trắng trên nền xanh lá cây. 9. Chữ trắng trên nền đen. 10. Chữ đỏ trên nền vàng. 11. Chữ xanh lá cây trên nền đỏ. 12. Chữ đỏ trên nền xanh lá cây. Bạn nên chọn Chữ đen trên nền trắng để giúp người tiêu dùng cũng như Web đạt được mục đích của mình. Độ tương phản bao nhiêu là vừa? Nếu không có công cụ đo độ tương phản, cách đơn giản nhất là bạn đồng bộ hoá toàn bộ màu sắc về màu đơn sắc Grayscale. Và bạn sử dụng công thức sau: Độ tương phản = X – Y <Excel> X: chỉ số Brightness của màu foreground Y: chỉ số Brightness của màu background Nếu kết quả lớn hơn 45% thì độ tương phản là chấp nhận được. Hình minh hoạ 5 Một đối thủ cùng ngành của Trần Anh là Bền. Trong năm 2008, http://ben.com.vn/ được vinh danh là một trong những Web B2C tiêu biểu tại Việt Nam. Sự ghi nhận này thể hiện những nỗ lực của Bền trong lĩnh vực TMĐT đã đền đáp xứng đáng. Tuy nhiên cũng vẫn vết xe đổ của tư duy định hướng đối thủ cạnh tranh nên Website phải đè bẹp Website của một đối thủ nào đó mà bỏ qua nhu cầu và mong muốn của khách hàng. Định hướng sai này khiến Website của Bền như một ma trận với các dòng chữ có độ tương phản thấp với màu nền. Điều này khiến người tiêu dùng nhanh bị mỏi mắt và khó tìm ra thứ mình cần trên danh mục trong vùng Above the fold. . Nguyên tắc trưng bày nội dung trong Web TMĐT (part 2) Mặt tiền của cửa hàng. Mặt tiền của một cửa hàng là phần nội dung trang Web hiện ra trên. trưng bày hay lượng thông tin của mỗi hàng hoá để đảm bảo tính dễ thấy, dễ đọc, dễ chọn. Đa số người sử dụng nhất là trẻ tuổi thường chỉ xem nội dung trưng