Thứ tư - 31/05/2017 07:54
Các nguyên tắc bố cục giao diện đồ họa web khá đa dạng, từ dạng lưới, bố cục theo chiều dọc hay bố cục theo hình chữ F hoặc theo hình Zig Zag, cho đến các quy tắc một phần ba hoặc các tỷ lệ vàng,…
Mục lục bài viết
Tất cả đều được áp dụng nhằm mục đích “hút” người dùng vào trong website của mình.
Giao diện đồ họa được thiết kế và phát triển phục vụ nhu cầu của con người được gọi là Giao diện đồ họa người dùng (GUI - Graphical User Interface). GUI được khai sinh bởi những nhà nghiên cứu tại Standford Research Institute - được dẫn đầu bởi Douglas Engelbart. Khi đó, họ phát triển việc sử dụng những siêu liên kết (hyperlinks) dựa trên chữ cho hệ thống trực tuyến (On-Line System), trong đó các liên kết được thao tác với một con chuột. Khái niệm siêu liên kết sau đó đã được các nhà nghiên cứu tại Xerox PARC mở rộng sang phạm vi đồ họa.
Dựa trên nguồn cảm hứng từ lịch sử cùng tiềm năng phát triển cho tương lai, các hệ thống phát triển GUI lần lượt được ra đời và được ứng dụng. Năm 1981, mô hình điều hành máy tính dựa trên GUI đầu tiên được ra đời là Xerox 8010 Star Information System. Tiếp theo đó là Apple Lisa năm 1983, Macintosh 128K của Apple năm 1984, Atari ST và Commodore Amiga năm 1985. Việc điều khiển đồ họa bằng lệnh (command) được khai sinh khi IBM cho ra đời Common User Access (1987), trong đó các chuỗi lệnh khác nhau sẽ được áp dụng cho các chương trình khác nhau như: phím F3 sẽ kích hoạt chế độ hỗ trợ trong WordPerfect, nhưng nó sẽ đóng chương trình trong các ứng dụng khác của IBM.
Các hệ thống GUI phổ biến ngày nay là Microsoft Windows, Mac OS X, X Window System trên các PC (Personal Computer), laptop. Ngoài ra còn có sự góp mặt của các thiết bị di động như Symbian, BlackBerry OS, Android, iOS. Các hệ thống này đều được phát triển dựa trên những ý tưởng ban đầu của Xerox, cho nên chúng gần như có các khái niệm tương tự nhau (như button, radio button, menu...).
Trong thời buổi hiện tại, khi bạn tiếp xúc với các thiết bị công nghệ di động hoặc máy tính, láp top,...bạn sẽ nhìn thấy các hình ảnh hiển thị trên màn hình và qua đó bạn có thể tương tác với các thiết bị, phục vụ nhu cầu giải trí, học tập hay làm việc. Trên các thiết bị đó, bạn có giao diện đồ họa của hệ điều hành, hay giao diện đồ họa của một phần mềm, một ứng dụng nào đó đã được cài đặt cho bạn sử dụng. Khi chơi game bạn có giao diện đồ họa của game hay khi nghe nhạc bạn có giao diện đồ họa của phần mềm nghe nhạc,…
Tất cả những thứ bạn thấy được thể hiện bằng các biểu tượng, hình ảnh, kết hợp với màu sắc kết hợp hay các hiệu ứng chuyển động,…thông qua các tương tác cảm ứng hoặc thông qua các thiết bị kết nối như chuột máy tính, bàn phím,…bạn có thể sử dụng và điều khiển các thiết bị này.
Song song với sự phát triển về Giao diện đồ họa người dùng, Giao diện đồ họa web cũng ngày càng phát triển như là một tập hợp con của một tổ hợp rộng lớn về đồ họa đang phát triển vượt bậc. Hàng ngày, thị hiếu về các trang mạng đẹp, gọn gàng, tạo được sự thân thiện với người dùng đang như là một nhu cầu tất yếu trong đời sống tinh thần của người dùng khi hoạt động tương tác với các trang web trên internet.
Giao diện đồ họa web cũng mang ý nghĩa tương tự khi bạn sử dụng một máy tính được cài đặt hệ điều hành mới hơn, tiên tiến hơn và dĩ nhiên Giao diện cũng đẹp hơn sẽ làm cho bạn cảm thấy thực sự thoải mái và thích thú. Giao diện đồ họa web cũng luôn được người dùng chú trọng trong việc trải nghiệm các hình ảnh, hiệu ứng, bố cục hay màu sắc. Nhìn vào một trang web, điều cuốn hút đầu tiên đối với người dùng là bố cục, màu sắc, hình ảnh,…và tiếp theo sẽ là sự trải nghiệm thông qua các tương tác. Chính vì lẽ đó, các nhà thiết kế ngày càng chú tâm hơn vào các điều này và dần làm mọi thứ trở nên tốt hơn, ưu việt hơn.
Trong lĩnh vực thiết kế đồ họa cho website, các nguyên tắc về bố cục được chú trọng hàng đầu. Việc người dùng quyết định rời bỏ hoặc ở lại với trang web của bạn chỉ được thực hiện trong vòng 3-5 giây sau khi lướt qua website của bạn. Điều mà họ có thể cảm thấy băn khoăn là họ được thông tin gì khi họ ở lại trang của bạn lâu hơn hoặc ít ra trong vòng 3-5 giây đó bạn cũng sẽ cho họ được thông tin gì.
Như bạn đã biết, người dùng sử dụng internet hầu hết đa số đều tìm kiếm thông tin, cho nên khi tương tác với một website bất kỳ, những khoảnh khắc ngắn ngủi nhưng website của bạn tạo cho người dùng cảm giác thân thiện và mang được thông điệp rằng bạn có thể cho họ được thông tin mà họ cần thì cơ hội họ ở lại với bạn sẽ lâu hơn, và việc bố cục khoa học, logic sẽ là một lợi thế cho bạn.
Các trường phái thiết kế luôn có những quan điểm khác nhau về cách trình bày các thông tin với các nguyên tắc bố cục khác nhau. Nhưng ta sẽ xem xét các nguyên tắc bố cục được cho là phổ biến hiện tại.
Hiện tại, các nguyên tắc bố cục trang web khá đa dạng, từ dạng lưới, bố cục theo chiều dọc hay bố cục theo hình chữ F hoặc theo hình Zig Zag, cho đến các quy tắc một phần ba hoặc các tỷ lệ vàng,…Tất cả đều được áp dụng nhằm mục đích “hút” người dùng vào trong website của mình.
Một nghiên cứu về sự tương tác người dùng trên giao diện đồ họa web của Jakob Nielsen và Viện Poynter nhằm thỏa mãn các câu hỏi:
Nghiên cứu trên đã bật mí 3 thông tin về cách mà mắt người dùng tương tác với giao diện đồ họa web.
Các điều này cho thấy bạn không nên quá bận tâm vào các font chữ nhỏ với các nội dung không phải là tiêu đề, bởi người dùng của bạn sẽ không đủ kiên trì để đọc hết các thông tin trong các dòng chữ nhỏ đó, giai đoạn này họ chưa biết tầm quan trọng trong các thông tin chi tiết. Hãy tập trung chuyển tải thông điệp của bạn qua các tiêu đề, và làm cho nó thật nổi bậc, đó mà điều nên làm.
Ngoài các điểm chú ý trên trong việc thiết kế giao diện đồ họa cho web, các hình thức về màu sắc, font chữ, hình ảnh sẽ được phân tích chi tiết trong các bài viết sau. Hy vọng rằng các bạn sẽ có nhiều thông tin hữu ích.