無論您是一個好奇的新設計師或是經驗豐富的專業人士，垂直導航的主題是一個精緻的談話點。這種垂直的頁面元素的想法打破了 WooCommerce 獨立站網頁設計領域的一個重要規則。這當然是一個艱鉅的任務，類似的設計過程中一個小錯誤可以搞砸整個佈局。看看下面這些例子，您就知道如何將垂直網站導航選單應用到您自己的 Web 專案中。 WooCommerce 獨立站網頁設計中垂直導航選單的設計技巧。
1 、頁佈局
每一個餐飲網站都應該建立一個導航餐飲的選單。單頁的佈局往往是最靈活的。網站不需要大量的下拉選單或滑動連線板。 Jorge Rigabert 的網站是一個很好的例子。該網站被分割成彩色的部分，其中包括不同的資訊。在滾動頁面的時候，左邊的導航欄和您一起滾動。可悲的是，我無法讀西班牙語，但連結文字本身脫穎而出，大膽和豐富多彩。懸停和選定的連結效果也引人注目。垂直導航並不總是需要浮華的，但它肯定不會傷害到您的設計。
2 、選單
並不是每一個網站都可以作為一個單一的頁面佈局。幸運的是，有很多其他的方法來構造一個垂直導航。有時設計者仍然會選擇修改選單在多使用者旁邊滾動。這是一個很受歡迎的選擇，您會發現這種效果也經常使用水平導航中。但在許多情況下是簡單的垂直導航放在頁面頂部。例如麥當勞的網頁，它使用一個紅色的垂直導航匹配公司的標誌。
您會發現另一個很好的例子，權力的海報，這是一個海報零售網站。此佈局集中在瀏覽器視窗中，並有一個更為簡明的頁面頭。所有的選單連結似乎融入背景和工作很好地與標誌設計。
麥當勞和權力的海報利用對比度導航懸停效果。文字可讀性很強，在類似連結的分類中脫穎而出。在設計您自己的垂直導航風格的同時記住這一想法。雖然您可以完美的釘的定位和組成，一個小的更新的顏色方案可以明顯影響整個佈局。
3 、小的、簡單的
您真的需要將頁面資訊凝聚成一個較小的部分，這往往關係到調整字型和潛在的刪除某些元素。記住要保持所有簡單和容易識別的，把這變成您的垂直設計的原則。
這些例子中的每一個都應該證明，設計得當時垂直導航可以很好的工作。並不是每一個網站都可以受益於這樣一個垂直的佈局。然而，我發現了大量的垂直設計，真正吸引了我的注意力。敢於在未來的專案中應用這些技術，不要害怕在您自己的設計作品中使用垂直導航。若有 WooCommerce 建站需求請諮詢專業 WooCommerce 建站網站跨飛獨立站。