Giao diện website

Trong bài viết trước chúng ta đã tìm hiểu sơ qua các tính năng tiêu biểu của gói thiết kế website chuẩn.

Bài viết hôm nay sẽ bàn chi tiết về các dạng bố cục, giao diện của các website đó.

1) Điều hướng website

Khi nhắc đến tính điều hướng trong website, ta nghĩ ngay đến cách bài trí menu sao cho người sử dụng có thể dễ dàng di chuyển qua lại giữa các trang web của mình. Chính vì thế, nhà thiết kế phải hiểu tâm lý cũng như thói quen của người dùng để có thể điều hướng website cho hợp lý.

Thói quen đọc web

Thói quen khi ta đọc một webpage hay một bài báo, một trang sách thì ta luôn đọc theo thứ tự từ trái qua phải và từ trên xuống dưới. Do đó, các menu nằm ở phía trên, bên trái đều được nhìn thấy trước hết và nhà thiết kế cần lưu ý đưa những menu quan trọng hoặc thường dùng vào góc trên bên trái để visitors có thể tìm thấy một cách dễ dàng.

1 click

Một điểm khác khá quan trọng khi điều hướng là số click chuột đến nội dung cần quan tâm. Ví dụ, một khách hàng muốn xem thông tin giới thiệu và các gói thiết kế website của www.khatech.net chỉ cần click 1 lần vào menu Giới thiệu hay các gói thiết kế mà không cần phải “chạy lòng vòng” để tìm thông tin.

Việc này đem lại nhiều thuận lợi cho người dùng và làm website của doanh nghiệp thêm thân thiện (user-friendly) khi mà người dùng có thể thấy ngay thông tin cần tìm chỉ qua 1 click chuột. Do đó, nhà thiết kế cần lưu ý link những thông tin quan trọng sao cho người dùng có thể truy cập chỉ qua 1 click chuột.

2) Bố cục của website

Bố cục của website có thể nói là muôn hình vạn trạng, tuy nhiên ta có thể phân chia website thành 5 phần chính

• Top Extra
• Top Menu
• Header Banner
• Main Content
• Footer

Top Extra

Thường là những menu mang tính chất bổ sung thêm cho website và do đó không nên xem nó như một vị trí trọng yếu của website. Vị trị top ở đây có thể được canh lề TRÁI, PHẢI hoặc GIỮA tùy theo từng thiết kế nhưng nó có 1 điểm chung là thành phần đầu tiên của website.

Top Menu

Top Extra cũng có thể được thay thế bằng Top Menu khi website không cần bất kỳ menu bổ sung nào. Khi này thì Top Menu và Top Extra là một. Ngoài ra thì Top Menu được xem như là một menu chính của website, chứa các menu quan trọng nhất và cơ bản nhất mà doanh nghiệp muốn gửi gắm đến người xem, nó góp phần định nghĩa khung sườn của 1 website, cho phép người dùng có một cái nhìn tổng quát về website đó.

Header Banner

Đây là banner chính của website, một thành phần rất quan trọng thể hiện nét đặc trưng riêng của doanh nghiệp. Hình ảnh trong banner có thể đập ngay vào mắt giúp visitors nhận ra ngành nghề của doanh nghiệp là gì và nhờ đó giúp chuyển tải hình ảnh đến với người dùng một cách rõ nét hơn. Tuy nhiên, không phải lúc nào header banner cũng là phương pháp duy nhất, hữu hiệu nhất cho việc này vì ngoài banner, nhà thiết kế website hoàn toàn có thể sử dụng các phương tiện khác như hình ảnh bài viết, màu sắc website, hoa văn trên web cũng như cách dàn trang website để gột tả nét cá tính của trang web.

Main Content

Đối với 1 website động, main content là nội dung chính của website và là thành phần được thay đổi nhiều nhất khi visitors lướt web. Top Extra, Top menu, Header Banner có thể không thay đổi nhưng Main Content hầu như luôn thay đổi sau mỗi lần click chuột.

Chính vì thế, đặc tính quan trọng nhất của nó là làm sao để vừa đảm bảo chất lượng mỹ thuật của website, vừa có thể đáp ứng tính đa dạng, phong phú của nội dung.

Ví dụ: trong 1 website, nếu font chữ quá to thì tuy rất dễ đọc nhưng sẽ thô và phá vỡ cân bằng thẩm mỹ của website. Tuy nhiên, nếu font hơi nhỏ quá thì cho dù có gọn gàng, đẹp đẽ nhưng khi visitors phải đọc những bài viết dài sẽ tạo cảm giác khó khăn, nhức mắt.

Bố cục Main Content có thể chỉ là 1 khung lớn chứa tất cả nội dung trong đó hoặc nó cũng có thể được chi thành nhiều khung, được sắp sếp vào 2 hoặc 3 cột.

• Cột bên trái thường chứa Left Menu chủ yếu mang tính điều hướng như danh sách sản phẩm, liên kết website, hỗ trợ trực tuyến, bản đồ, địa chỉ liên hệ, …
• Cột giữa chứa nội dung cần hiển thị.
• Cột phải chứa nội dung hỗ trợ 

Footer

Còn được gọi là phần chân (footer) của website. Thông thường được sử dụng để hiển thị các nội dung như

• Địa chỉ, điện thoại liên hệ
• Copyright website
• Các loại giấy phép vận hành website