Những website có menu điều hướng đáng xem

Các nhà thiết kế luôn tìm một cách nào đó thú vị và hiệu quả để cho phép người dùng dễ dàng sử dụng, tìm kiếm thông tin thông qua thanh menu điều hướng (Navigation Menu ). Nhưng tất nhiên có một danh giới giữa sự bất ngờ và không sử dụng được.

Nếu trang web quá dài, nhiều thông tin. Người dùng liệu sẽ tìm thấy nội dung của mình thông qua trang web bằng cách chọn vị trí của trên thanh menu nhanh chóng?

Hãy xem một vài ví dụ.

Made by Water

Một ứng dụng mạnh mẽ của JavaScript

Các tiêu đề lớn, đậm với bảng màu hiện đại trên Made by Water. Bố trí lưới đẹp và rõ ràng, trong khi nền khá tinh tế và thú vị. Các biểu tượng ở trên cùng trực quan, hấp dẫn khi người dùng nhấp chuột.

Made in Haus

Slideshow ngang như là menu điều hướng chính.

Thiết kế trang lớn khiến Made in Haus có sự khác biệt, các chuyển động trơn tru và có sự khác biệt với những tranh trượt mà chúng ta từng nhìn thấy.

Hạn chế là hình tam giác phía bên phải có vẻ đơn điệu, và có thể khiến người dùng một chút bối rối.

Foundation Six

Fondation six với các hình ảnh được chụp màn hình lớn, rõ ở chính giữa trang, cho chúng ta cảm giác có thể tương tác bằng cách nào đó. Việc đầu tiên chúng ta có gắng click vào nó, nhưng không có gì xảy ra, một chút thất vọng.

Word Refuge

Word Refuge có thiết kế giống một tờ giấy cũ, do nó làm về dịch vụ Copywriting, điều này là thích hợp. Các hình thức liên lạc nổi bật, dễ thấy, dễ sử dụng, logo cũng độc đáo với các bảng màu phong phú, quý phái.

Relogik

Relogik là một ví dụ của minimalism tốt. Logo dễ hiểu, tinh tế. Hầu hết các yếu tố được nửa trong suốt và xuất hiện khi di chuột. Các hình ản được tô đậm và làm cho nội dung trở thành trọng tâm của trang. Hệ thống lưới vững vàng, cấu trúc tốt, sạch sẽ.

Drexler

Danh mục chính nằm ngang. Người dùng sẽ thấy nếu… nhìn theo hướng dẫn.

Thanh điều hướng nằm ngang trên Drexler với các mũi tên và click chuột. Nếu lần đầu tiên ghé thăm, bạn sẽ không thấy cách để điều hướng trang web. Bạn cần đọc các gợi ý ở khu vực phía trên của trang web, hoặc thử nghiệm click một vài nơi để tìm kiếm. Thiết kế trực quan, hấp dẫn, nhưng thanh điều hướng lại không đơn giản.

Komrade

Trang Web chọn cách điều hướng theo chiều dọc. Mặc dù có thiết kế tươi mới nhưng cách điều hướng lại khó hiểu. Các màu sắc tươi vui của trang lại không giúp cho người đọc biết được dòng chữ nào chứa liên kết có thể click được.

All for Design

All for Design có sự thoáng đãng, sáng sủa, các nhóm hình tượng chìm sắc nét và hiệu ứng tinh tế. Trang Project đặc biệt rất đẹp, tập trung chính xác vào những gì cần quan tâm trong một dự án.

Lịch làm việc ở phần liên hệ là một ý tưởng tuyệt vời. Nó giúp khách hàng biết được thời gian nào có thể liên hệ.

Digital Labs

Điều hướng dọc hay ngang?

Với hình ảnh chụp màn hình của website này, trang web nên sử dụng điều hướng theo chiều ngang. Trang web nhìn tuyệt vời, Digital Labs sử dụng layout rộng, với màu nền đẹp. Các màu tối khiến không gian rộng rãi.Dải băng màu cam phía trên web hình như có thể tương tác được, nhưng không có gì.

Calobee Doodles

Mail Chimp

Trang Mail Chimp là trang web hấp dẫn với rất nhiều vintage đồ họa thú vị. Màu sắc hiện đại, kết cấu thú vị. Tuy nhiên trang web có sự định hướng kém. Muốn "Đăng nhập" phải kéo xuống dưới cùng. Cần thêm cả những liên kết nhỏ ở đầu trang để người dùng có thể sử dụng dễ dàng, giúp trang web hoàn thiện hơn.

Pline Studios

Pline Studios là công ty kiến trúc nên nó có những bố trí dọc thoáng với những nét gợi lên bản vẽ Auto Cad. Tiêu đề lớn, rõ ràng, giúp người dùng dễ dàng tập trung. Việc điều hướng của trang cũng được làm dễ hiểu khi các menu điều hướng luôn xuất hiện ở mỗi trang.

Mọi thứ đều hấp dẫn và tuyệt vời, duy chỉ có những mô tả cho dự án của họ thì có vẻ hơi ít, không đủ cung cấp thông tin cho khách hàng, hay người sử dụng.

Transformology

Transformology cho thấy một cách khách để xử lý điều hướng theo chiều dọc. Khi người dùng cuộn trang, menu điều hướng ở trên cùng của trang sẽ di chuyển theo phù hợp. TIêu đề xây dựng trong các khối văn bản hấp dẫn. Tuy nhiên thiết kế lưới của trang khiến nội dung chính có vẻ bị chìm đi.

Burton

New Adventures in Web Design

Các hình khối ở trang đầu tiên của New Adventures in Web Design nhìn có vẻ như là menu chuyển hướng. Nó sẽ thay đổi khi ban qua trang web, nó có ý nghĩa là công ty sắp xếp lại mọi thứ một cách có trật tự.

Thiết kế sạch sẽ, cấu trúc chặt. Màu sắc trầm và chuyên nghiệp, tuy nhiên cảm giác có vẻ quá .. hài hòa, không có được một cái gì đó nổi bật.

Có một chút bối rối khi theo thói quen chúng tôi click vào chữ New Adventures để quay lại trang home nhưng không có gì xảy ra.

Christopher Kaufman

Chapolito

Chapolito thực sự là trang web độc đáo với ác hình ảnh bắt mắt.

Flywheel Design

Flywheel Design có thiết kế tổng quan tốt. Các tương tác để chuyển hướng xuất hiện khi người dung di chuột thực sự thú vị.

Có một chút khó nhìn khi vào các trang trong, các dòng chữ nên làm lớn hơn chút để người đọc dễ nhìn hơn.

Wishbone Design

Wishbone Design thiết kế cho trẻ em và ông bố, bà mẹ, vì vậy nó có sự vui vẻ, các hình ảnh động hấp dẫn, vui nhộn. Một trang web với các chuyển động đáng xem.

Tuy nhiên cũng có người không thích lắm cách menu chuyển hướng xuất hiện hơi chậm bởi các animation, dù chúng thật sự dễ thương.

Basmatitree

Minus Five

Retinart

Retinart làm một ví dụ hấp dẫn về trang một trang web tập trung kiểu chữ (typeface).

Collision Labs

Theo SmashingMagazine

Cùng tác giả

#Tag

thiết kế website

iDesign Must-try

An Bùi khám phá với Thiết kế sáng tạo đa ngành - Multidisciplinary Design
An Bùi khám phá với Thiết kế sáng tạo đa ngành - Multidisciplinary Design
Multidisciplinary Design là một thuật ngữ “vừa mới, vừa lạ” tại Việt Nam. Mình đã có dịp đọc một bài viết sáng tạo liên quan và tìm hiểu về nó:…
6 xu hướng thiết kế web đáng xem trong năm 2023
6 xu hướng thiết kế web đáng xem trong năm 2023
Sự hòa nhập của người dùng sẽ trở thành chìa khóa cho trải nghiệm web vào năm 2023, nhưng điều này sẽ diễn ra như thế nào? Kể từ khi…
11 Bí mật về công việc thiết kế web sẽ không ai nói với bạn
11 Bí mật về công việc thiết kế web sẽ không ai nói với bạn
Là một nhà thiết kế web, chắc hẳn, bạn sẽ có nhiều điều để suy nghĩ trong thị trường đầy cạnh tranh này. Bạn có các kỹ năng, sự tinh tế,…
5 công cụ tiện ích giúp kiểm tra tỷ lệ tương phản thiết kế của bạn
5 công cụ tiện ích giúp kiểm tra tỷ lệ tương phản thiết kế của bạn
Nếu bạn là một nhà thiết kế sản phẩm hoặc thiết kế UX/UI thì khả năng truy cập của người dùng là một trong những điều bạn quan tâm hàng…
Thuật ngữ UX/UI kỳ 4: Website (Phần 1)
Thuật ngữ UX/UI kỳ 4: Website (Phần 1)
Trong các bài viết trước, chúng ta đã nghiên cứu đến tính khả dụng trong thiết kế, cũng như đã nêu lên được sự khác biệt thường bị nhầm lẫn…
Từ poster đến web: Mối tương quan giữa thiết kế in ấn và kỹ thuật số (Phần 2)
Từ poster đến web: Mối tương quan giữa thiết kế in ấn và kỹ thuật số (Phần 2)
Ở phần 1, chúng ta đã khám phá một số mối tương quan giữa thiết kế poster và thiết kế web. Trong phần hai này chúng ta sẽ tiếp tục…