6個(gè)網(wǎng)站垂直航菜單
牧羊人Web導(dǎo)航菜單流橫向頁面的大多數(shù)。這是來自一個(gè)傳統(tǒng)的顯示器是寬而不是更高的歷史。但有這么多的屏幕空間，它現(xiàn)在是可能的網(wǎng)站使用垂直導(dǎo)航菜單代替。他們中的許多人看起來棒極了。

這6個(gè)例子的垂直菜單完美研究獨(dú)特的設(shè)計(jì)風(fēng)格和獨(dú)特的可用性。

 
1。Petersham苗圃垂直航菜單

上Petersham苗圃網(wǎng)站你會發(fā)現(xiàn)一個(gè)嵌套的垂直導(dǎo)航。這種技術(shù)是不是你會發(fā)現(xiàn)很經(jīng)常但在本網(wǎng)站的作品。

每個(gè)主導(dǎo)航鏈接使用的背景圖標(biāo)鏈接的視覺傳達(dá)。和前兩個(gè)鏈接打開子菜單對齊的一級菜單。這些以下拉菜單你通常看到的水平菜單的地方。

這個(gè)網(wǎng)站是敏感的，在較小的尺寸這些鏈接消失在漢堡菜單。這將創(chuàng)建一個(gè)合理的劃分之間的垂直聯(lián)系與桌面用戶和移動用戶足夠的空間，誰做的更好的水平導(dǎo)航欄。

2。喬木的餐廳垂直航菜單

另一個(gè)非常獨(dú)特的例子喬木的餐廳具有足夠的空間之間的鏈接干凈的垂直導(dǎo)航。的內(nèi)容出現(xiàn)在一個(gè)滑動容器也將垂直旁邊的導(dǎo)航。

本文內(nèi)容風(fēng)格很獨(dú)特。大多數(shù)的垂直導(dǎo)航網(wǎng)站保持其內(nèi)容與主頁對齊的，但在這種情況下，你可以顯示/隱藏輕松的內(nèi)容。它增加了一定的天賦為垂直導(dǎo)航可以使網(wǎng)頁的動量流下來的內(nèi)容。

3.斯莫基骨頭垂直航菜單

斯莫基骨頭有兩種東西：可怕的食物和一個(gè)殺手的網(wǎng)站。

每一頁使用固定在左側(cè)的垂直導(dǎo)航。這是一個(gè)大多數(shù)網(wǎng)站主要是因?yàn)槲鞣降拇蠖鄶?shù)讀者消費(fèi)的內(nèi)容，從左到右，左上角是一個(gè)網(wǎng)站的標(biāo)志的傳統(tǒng)地位。

我喜歡的是一個(gè)附加功能菜單彈出列表所有餐廳的菜。如果你點(diǎn)擊“菜單”鏈接，你會看到這個(gè)作品也像子菜單添加垂直。絕對是一個(gè)很酷的想法，很適合小餐館網(wǎng)站。

4。龐大的媒體垂直航菜單

當(dāng)你有較少的內(nèi)容你可以帶走更多的另類導(dǎo)航選擇。龐大的媒體是一個(gè)很好的例子，只有在他們的網(wǎng)站上加上一個(gè)博客主頁五。

這一方面是隱藏特定的導(dǎo)航下拉功能。如果你點(diǎn)擊“工作”的鏈接，你會得到2種鏈接，你可以通過點(diǎn)擊。他們出現(xiàn)在主要環(huán)節(jié)，所以他們以一個(gè)較小的下拉作用。

即使在移動導(dǎo)航遵循類似的風(fēng)格。它的證明，當(dāng)你沒有太多的聯(lián)系，你可以真正推動創(chuàng)新。

5。昆侖垂直航菜單

Corum 網(wǎng)站 有另一個(gè)干凈的垂直導(dǎo)航，很簡單的功能。全部大寫的鏈接，黑暗的文字，清晰的風(fēng)格和對懸停主頁強(qiáng)烈對比。
Ads by

這是一個(gè)最大的方面在設(shè)計(jì)垂直導(dǎo)航。你通常要?jiǎng)?chuàng)建垂直導(dǎo)航欄和頁面內(nèi)容之間的強(qiáng)烈分歧。在這種情況下，它是通過使用一個(gè)較亮的背景顏色接近頂部的昆侖標(biāo)志。

和移動響應(yīng)用戶而不是得到一個(gè)下拉菜單，以及屏幕，長于寬的替代。

6。medienstadt.koeln垂直航菜單

德國網(wǎng)站medienstadt.koeln有另一種不同的垂直導(dǎo)航。他們的資產(chǎn)凈值仍然隱藏在時(shí)刻漢堡菜單，但它仍然跨越整個(gè)屏幕的高度。

它還包括更多的聯(lián)系不僅僅是典型的頂部的水平導(dǎo)航。這是有道理的但可以給一些游客迷惑。

我喜歡垂直風(fēng)格最多的是如何保持藏甚至桌面直到需要。

當(dāng)然會有爭論發(fā)現(xiàn)問題漢堡菜單。但我覺得這個(gè)圖標(biāo)很快成為公認(rèn)的，這樣的設(shè)計(jì)是一個(gè)隱藏的垂直導(dǎo)航作用的一個(gè)很好的例子。

總結(jié)

網(wǎng)站垂直導(dǎo)航最好在依靠額外的屏幕空間的網(wǎng)站。這些通常包括網(wǎng)站、餐館、小企業(yè)和電子商務(wù)商店。但不管是網(wǎng)站你可以嘗試添加一個(gè)垂直導(dǎo)航到你的設(shè)計(jì)。我希望這些例子可以讓你開始與一些偉大的思想的線框圖和模型設(shè)計(jì)。