Matt Cronin版權(quán)所有
作者：Smashing magazine, Matt Cronin
譯者：UCD翻譯小組 , JJYY
原文：http://www.smashingmagazine.com/2009/02/04/50-beautiful-and-user-friendly-navigation-menus/
對任何網(wǎng)站來說，可用性都是一個重要的設(shè)計目標(biāo)，而友好的導(dǎo)航是其中的要素之一，它決定著用戶在網(wǎng)站中如何被引導(dǎo)，如何與網(wǎng)站進行互動。如果沒有友好的導(dǎo)航，網(wǎng)頁的內(nèi)容就很難發(fā)光和被用戶發(fā)掘。菜單必須要足夠簡單到用戶容易理解，還要包含必要的元素來引導(dǎo)用戶瀏覽整個網(wǎng)站——同時要有很棒和有創(chuàng)意的設(shè)計在上面。
下面我們將展示50多個出色的導(dǎo)航菜單—— 我們挑選了一些用CSS實現(xiàn)的菜單，一些CSS+Javascript的菜單，還有flash的菜單設(shè)計。不管他們具體是用什么實現(xiàn)的，共同點是：對用戶友好、富有創(chuàng)意，并且完美符合所屬網(wǎng)站的風(fēng)格。
感興趣的話，您還可以閱讀我們之前的幾篇文章：
- 基于CSS的導(dǎo)航菜單：時髦的解決方案 - 列舉了一些很時髦的CSS菜單
- 導(dǎo)航菜單：趨勢和例子 - 收集了一些很能激發(fā)靈感的導(dǎo)航菜單。
1. 基于CSS的導(dǎo)航菜單
Loodo
一個色彩斑斕、給網(wǎng)站增加了觸摸感的菜單。
Acko.net
設(shè)計者Steven Wittens采用了一種獨特的透視角度來呈現(xiàn)導(dǎo)航菜單。
Web Design Ledger
該網(wǎng)站有一個很棒的菜單，大尺寸的按鈕非常舒適且沒有和網(wǎng)站內(nèi)容攪在一塊。
UX Booth
在導(dǎo)航欄下面使用了一個漂亮的輔助文本區(qū)域來說明當(dāng)前的菜單項。
Nopokographics
垂直文字的導(dǎo)航菜單非常罕見，因為他們用起來不是那么舒服。但一些設(shè)計師總會迎著風(fēng)頭去做些突破。Nopoko Grphics就使用了箭頭指示和鼠標(biāo)懸浮(Hover)效果在他們的垂直導(dǎo)航菜單上。
Icon Designer
這個網(wǎng)站在首頁上使用了超大的圖片菜單，用戶的注意力馬上就被這個賊大的菜單拽了過去，看起來對用戶非常方便。
Cosmicsoda
這個大大的菜單十分醒目，并且使用了輕微的Hover效果來為菜單增色。
Designsensory
十分符合用戶認(rèn)知的二級菜單導(dǎo)航，使用2種顏色區(qū)分，有效的告訴用戶當(dāng)前激活的菜單項目和未激活的項目。
Smallstone
Smallstone, 美國的唱片公司，采用了一種獨特的導(dǎo)航菜單，厄。。。這東東叫做“空間回音Rloand SE-201型號”.
TNVacation
這年頭很難找到一個看起來很棒的下拉菜單，不過這里就有一個例外。
粵公網(wǎng)安備 44010402000282號