如何設(shè)計(jì)網(wǎng)站功能菜單

有人來到你的網(wǎng)站，這是一個(gè)成功的第一步。現(xiàn)在你需要將它們放在想要的位置，否則它們可能會(huì)反彈。擁有一個(gè)好的菜單將有助于防止人們?cè)谒麄兿胍咝У牡胤将@得反彈。

雖然菜單起初可能看起來很復(fù)雜，但有效設(shè)計(jì)有三個(gè)關(guān)鍵要素：位置、清晰度和可用性。

菜單位置

與實(shí)體房地產(chǎn)一樣，虛擬房地產(chǎn)中最重要的設(shè)計(jì)元素是位置，位置，位置。找到您的菜單是設(shè)置可用網(wǎng)站的第一步。

菜單的設(shè)計(jì)慣例是它們位于頁面頂部，標(biāo)題下方或左側(cè)邊欄中。找到頁面右側(cè)的菜單可以看作有點(diǎn)不同尋常和大膽?；蛘咚梢员灰暈闊o能。主要的區(qū)別在于這個(gè)人是否有洞察力地破壞了這些約定。

菜單通常位于頁面頂部或左側(cè)邊欄中，因?yàn)檫@些區(qū)域是讀者給予更多“重量”的區(qū)域。只有當(dāng)您希望為頁面內(nèi)容而不是導(dǎo)航提供更多“權(quán)重”時(shí)，才可以在右側(cè)邊欄中放置菜單。

菜單元素的放置至關(guān)重要。在頂部菜單上，第一個(gè)和最后一個(gè)元素應(yīng)該是最重要的，因?yàn)榇蠖鄶?shù)讀者都會(huì)關(guān)注它們。雖然中間特征也會(huì)受到一些關(guān)注，但大多數(shù)讀者都會(huì)傾向于外在元素。

邊欄組件應(yīng)從最重要到最不重要的順序排序。通過垂直排列，讀者優(yōu)先考慮最后一個(gè)元素。這是菜單應(yīng)位于左側(cè)邊欄的另一個(gè)原因，因?yàn)檫@是大多數(shù)讀者尋找主要內(nèi)容的第一個(gè)地方。

菜單清晰度

網(wǎng)站設(shè)計(jì)應(yīng)盡可能提供最佳用戶體驗(yàn)。這從導(dǎo)航開始。對(duì)于用戶來說，每個(gè)站點(diǎn)元素應(yīng)該是顯而易見的，如何與它們進(jìn)行交互以及它們的作用。

簡潔是網(wǎng)站清晰度的重要元素。讀者傾向于掃描太長的標(biāo)簽。確保某些重要內(nèi)容不僅標(biāo)記清晰，而且盡可能簡要說明，以保持清晰。

請(qǐng)記住，簡潔并不總是等同于清晰度。如果不能從上下文線索中收集標(biāo)簽的含義，那么你將失去讀者。語境化很重要。拼寫出一切都會(huì)浪費(fèi)空間，并給讀者一種印象，即你認(rèn)為他們看起來太愚蠢了。盡可能簡短，但要盡可能清楚。

如果必須犧牲另一個(gè)元素，那么簡潔就是下一步。永遠(yuǎn)不應(yīng)該犧牲清晰度。雖然缺乏簡潔可能會(huì)刺激讀者，但它不會(huì)像不明確的標(biāo)簽?zāi)菢邮柽h(yuǎn)他們。

菜單可用性

雖然可用性是最后實(shí)現(xiàn)的元素，但它絕不是不重要的。如果一個(gè)菜單無法使用，那就更糟糕了。

小型網(wǎng)站的菜單有最清晰的設(shè)計(jì)原則。建議隱藏向下滾動(dòng)元素后面的鏈接。用戶將單擊元素以下載完整的選項(xiàng)菜單，輕松單擊鏈接。這使得網(wǎng)站易于導(dǎo)航。

對(duì)于較大的網(wǎng)站，有幾種選擇，其中沒有一種本質(zhì)上比其他任何選擇都差。如果您有大類信息的登錄頁面，則可以使用為小型網(wǎng)站設(shè)計(jì)菜單的原則。每個(gè)鏈接都會(huì)將讀者帶到一個(gè)單獨(dú)的登錄頁面，然后引導(dǎo)他們獲取更具體的信息。此技術(shù)可能需要更廣泛的頂級(jí)菜單以及著陸頁上更具體的左側(cè)邊欄菜單。

下拉菜單應(yīng)該只有一個(gè)級(jí)別。不要強(qiáng)制用戶滾動(dòng)菜單或嘗試查看主菜單類別中的所有子類別。著陸頁對(duì)此非常有用，因?yàn)樗鼈兪鼓軌驅(qū)⒂脩舭l(fā)送到仍具有自己菜單的較小類別頁面。

在設(shè)計(jì)與類別元素的用戶交互時(shí)，可以輕松地與它們進(jìn)行交互。不要讓懸停菜單的元素太小以至于光標(biāo)很容易從菜單中滑落，迫使用戶再次嘗試導(dǎo)航。雖然它使編程更復(fù)雜，但懸停導(dǎo)航問題的解決方案還包括可點(diǎn)擊元素，以便用戶可以選擇如何與菜單進(jìn)行交互。延遲懸停菜單的關(guān)閉也可以解決交互問題，“懸停效果”也是如此，這給人留下了懸停元素被壓低的印象。

使下拉菜單不透明，或大部分都是如此，因此菜單元素不會(huì)與背景元素混淆。圖片上的半透明菜單可以很好地工作。不要使用完全半透明的菜單或在文本上使用半透明菜單; 你的菜單將成為一個(gè)難以理解的混亂。還要確保工具提示不包含菜單元素。一個(gè)模糊的選擇比沒有選擇更糟糕。

設(shè)計(jì)好菜單后，請(qǐng)?jiān)谡麄€(gè)網(wǎng)站中保持一致。確保您在所有頁面上保留主菜單，并且當(dāng)您在登錄頁面上有輔助菜單時(shí)，請(qǐng)保持設(shè)計(jì)元素不變，這樣您的讀者就不必調(diào)整到全新的菜單。