在軟件設計中嘗試過很多菜單的表現形式，其中含義各不相同，隨著表現形式的多樣化，整理使用的方式也顯得比較重要，

菜單的表現方式——體驗并列和包含的關系交互設計

。

    一、預覽樣式

   

    可以看到操作系統或者操作軟件都采用了這種表現方式，這種表現方式的優點在于可以很好的明確包含關系，上下級的顯示較為清晰，在專屬的行業軟件中比較注重操作的上下級關系，使用頻率是比較多的，例如軟件的一級菜單下包含了多個二級菜單。當然這樣的排列方式就多了一個煩惱，不能清晰的定義下級菜單的多少，會給排版帶來不好的影響。

   

    如上圖：當二級菜單在不之情的范圍下，使用這樣的預覽模式，可能對二級菜單的樣式控制造成不好的影響。甚至不得已的情況下撐破頁面。特別是在商業的領域中，二級的種類更是不可控制的，所以它的使用就比較受限。

    二、“樹”就是我們常用的列表試圖

   

    樹的應用一般是在數據量大時，嵌套關系比較復雜，在二層關系以上的情況使用較多，它具有很好的擴展性，能夠明確的從主干看到樹的基本內容或者分類屬性。但是一般來說，它會伴隨滾動軸的出現，所以網頁中很少出現，目前我在看圖軟件和產品分類較多的情況下看到過。

    三、并列篩選

   

    就是說簡單的連動，后面的選擇是依據前面的選擇結果而控制的。最多的情況應該就是出現在上圖的方式中，

電腦資料

《菜單的表現方式——體驗并列和包含的關系交互設計》(http://salifelink.com)。但是也有一些網站是按照這樣的方式進行篩選；這種方式限制用戶的眼光是從左到右，逐個縮小篩選的范圍，就像很多導航一樣，先通過分類，再詳細選擇；它的優點是空間比較省哦，但是當層次比較多時，就難以應付了；從用戶使用角度，距離用戶最近的就是用戶上一步選擇的結果，這樣就比較容易記憶，鼠標的移動范圍也相對的較小，比較快捷。

   

    上圖是并列篩選和下拉結合運用比較好的例子，但是使我比較模糊的是，它采用了并列的排版方式，省去了大量的空間，但是選擇采用的卻不是逐級縮小的關系。當用戶點擊“marke”時，是針對此類的篩選，似乎和后面的“farbe”等是并列的關系，是無級別關系的。

    四、目前使用較好的菜單表現關系（1）

   

    a點擊前如上圖排列

   

    b點擊后如上圖排列

    這種方式的好處是，一目了然，a讓用戶知道所有的分類，首頁的效果就達到了，告訴用戶這個網站給你提供了什么；由于每一項的二級層次種類較多，故使用了b的表現方式，中間用豎線間隔，進行合理的分類。

    五、目前使用較好的菜單表現關系（2）

   

    這個是目前拍拍和淘寶等多家c2c網站使用的方式，最多不能代表最好，個人認為從視覺上容易造成視覺上的疲勞；從數量上，滾動軸表現的范圍有限制，對用戶記憶造成了不便；從定位上，撤銷上一步操作好像鼠標動作上有點不便。是不是可以引入國外的方法，進行結合處理呢？希望和大家一起探討！

    來自：http://www.xibeidesign.cn/xibei/article.asp?id=54