實體正文組成的Web頁面的內容結構很難被發現，也不會吸引眼球。為文檔添加顯示類型可以提供幫助用戶瀏覽內容的日志。顯示類型可創建信息架構并且添加引導瀏覽者閱讀材料的各種視覺效果。有效的顯示類型的關鍵是對版式強調的精確、髙效的應用。深圳網站制作為您講解網頁內容的設計中通過哪些方式來強調信息。

好幾種歷史悠久的版式技巧都可以用來對文本塊進行強調，伹是必須要分開應用。如果你對所有的內容加粗，那么將沒有任何內容能脫穎而出，而且看起來像是對讀者很不恭敬。一個不錯的應用類型的經驗就是每次只使用一種參數來強調。如果你想將注意力集中到文檔的標題，請不要同時對它設置大字號、加粗及全大寫形式。如果你想讓標題變大，采用一種方式增加字號即可。如果你想加粗，讓標題的字號與正文一致然后加粗即可。你很快就會發現，視覺對比只需一個小小的改變。

1. 斜體

斜體之所以吸引眼球是因為它與正文的字形對比。或者將斜體用在正文中強調字與詞，抑或強調外文。做網站提醒大家不要將大段的文字設為斜體，因為斜體字的可讀性要遠遠低于同等大小的羅馬文字。

2. 加粗

粗體之所以能用來強調是因為它與正文有粗細的區別。將小節子標題設置為粗體的效果特別好。盡管大段地采用粗體，其對比性不好、效果也不佳，但是粗體是可通過屏幕閱讀的。

3.下劃線

下劃線是打字機時代用來代替諸如斜體和粗體這些無法表示的功能的替代表示方式。除了下劃線在美學上的不足外，它在Web文檔中還有一個特殊的功能含義，大多數瀏覽者都會將自己的瀏覽器首選項設置成下劃線鏈接。默認瀏覽器設置可確保單色顯示器或者色盲能判斷文本塊中的哪些文字是鏈接。做網站提醒大家如果你在網頁中使用下劃線文字，肯定會跟超鏈接發生混淆。

4.色彩

盡管色彩也是一種用來區分文字的選擇，但是彩色文字與下劃線一樣，在Web文檔中還有一種特殊的功能含義。需要盡量避免對文本塊中的文字添加色彩，這是因為讀者會誤以為著色的文字是超鏈接，并且會單擊它。不過，帶色彩的文本對小節標題的區分效用有限。做網站提醒您選擇與頁面背景對比強烈的深色，并且不要使用與Web鏈接默認的藍色和紫色相近的色彩。

白

突出網站重點不一定要做加法，有時候一些減法設計，也就是留白，也可以起到同樣的作用。適當的留白可以減少頁面多余的元素，突出主角，同時頁面干凈整潔、有空間感，提高頁面檔次。

頁面顏色和字體搭配

頁面的顏色和字體搭配無法分離，色彩可以代替文本傳達一種情感，而字體的大小可以影響用戶訪問信息，合理搭配給訪問者更舒適的閱讀體驗。

對比

只是稍微對字號大小進行調整，或對色彩進行更改，就會馬上改變整個界面

的視覺效果。

版式設計獨特

將用來表達企業主題文化品質的圖片或文字放置在特定的位置，利用好位置，同時注意文字與圖片的關聯性，頁面之間也要注意符合邏輯的串聯，從而讓整個網站更有渲染力，引起用戶的共鳴。

采用“倒金字塔結構”

倒金字塔結構，要求是以事實的重要程度或受眾關心程度依次遞減的次序，把重要信息寫在最前面。

站導航的細節設計左右著使用者體驗好壞，不管你的網站頁面設計得再漂亮，使用者體驗不在，自然也留不住瀏覽者的注意力。從你的網站視覺吸引力、布局，再到文本的運用都是使用者體驗的一環，要達到美觀與功能之間的平衡，才稱得上是一個好網站。

而在這些眾多的考量因素，決定網站使用者體驗成敗的就是—— 網站導航設計，網站導航欄扮演著引領瀏覽者的角色，不管是解答問題、行動呼吁、認知強化、再行銷，這些都是導航欄設計實際能為用戶達成的。接下來，讓我們更深入了解網站導航設計的重要性，以及其設計的關鍵技巧。

什么是網站導航？為什么它很重要？

當你在電商網站消費，好不容易決定好要購買哪一些產品，卻發現找不到結賬按鈕，你會有什么樣的感受？網站導航就像實體店面的消費路線一般，從門口到柜臺，需要怎么說服消費者購買？產品要怎么擺放？有什么誘因可以再提升購買金額？結賬柜臺應該要在哪里，才能讓消費者找得到？

這當中的細節規劃就是網站導航設計應該要做到的，像是用戶進到網站應該走過哪些流程？如果從不同的節點進入網站，有沒有辦法順利瀏覽整個網站？有哪些重要的頁面是大多數用戶需要的？使用者點擊習慣會讓他們愿意點擊哪個形式的按鈕或文字？

良好的網站導航設計可以帶你避開這些細節可能衍生的困擾，讓網站導航設計成為你降低跳出率的秘密武器。網站流量與轉換也會因為網站導航設計的順暢運作，而有持續提升的趨勢存在。下面是「易極贊」導航條的設計。簡介且突出主要的頁面內容。

網站導航欄類型有哪些？

網站導航設計大多是以連結指向內部所有頁面，組織成一個連結平均的樹狀圖，但在規劃階段會因為訊息量揭露的多寡，以及資訊深度與廣度的安排，產生不一樣的導航欄設計，以下是網站導航欄常見的設計類型：

水平導航欄

水平導航欄顧名思義會出現在網站的最上端，使用起來十分直觀，能協助用戶迅速地找到相關頁面。從你曾瀏覽過的網站，應該會發現水平導航欄已經是網站布局的標準配備，無論是一頁式或多頁式網站，都習慣性運用水平導航欄為網站布建瀏覽體驗。

• 下拉式導航欄

假設網站擁有龐大的資料量待揭露，導航欄設計就會考慮到資訊量的深度與廣度，在一定的階層布局中，運用下拉式導航欄將主要頁面與其子頁面平均分配，滿足大資料量需求的同時，顧及使用者體驗與網路爬蟲的索引流程。

• 側邊欄

帶有側邊導航欄的網站，在畫面呈現就像書本目錄一般，適合少且固定頁面量的網站運用，例如：藝術品介紹、品牌形象展示…等，藉由放置在左側或右側的導航欄設計，迅速引導用戶到指定頁面。

• 頁腳導航欄

過往網站養成的使用者習慣，使得用戶會直覺地到頁腳尋找相關的連絡資訊，以及社群媒體連結。網站在規劃導航欄時，正會借此將曝光度不高，卻必須揭露于網站的資訊，制作成頁腳導航欄作為頂端導航欄的補充項。

網站導航設計的10個重要關鍵

網站導航欄設計的選擇會因信息量與視覺需求，而有不一樣的搭配，就算是競業的網站，導航欄設計也可能不同。而真正會影響使用者體驗的關鍵，就是這些導航欄的細節設計，細節會體現導航欄的核心價值，并很大程度控制使用者體驗的好壞。

不過導航欄的細節關鍵其實并不難達成或發掘，只要持續猜測用戶的下一步是什么、需要什么，反饋于自身操作流程去縮減、增加，就能創造最完整的使用者體驗。下面就來看這些已被列為重要關鍵的網站導航細節設計吧！

如果你是新手小白，沒有設計經驗，也選擇使用「易極贊」建站工具來完成導航設計，編輯器內置豐富的頁頭和頁尾導航，只需要簡單操作瞬間完成導航條設計。

使用站點地圖規劃導航欄

無論是自架網站或找網頁設計公司處理，在架設網站之前都需要經歷多場名為「網站結構」的頭腦風暴，將網站實際需要的頁面列出，例如：關于我們、產品介紹、服務項目、聯絡我們、隱私權條款、免責聲明、Cookie政策之類的頁面。

就頁面需求還會應用站點地圖，更進一步的劃分主要頁面與次要頁面，以舉例的頁面來說，站點地圖就會如圖所示。這種做法可以協助你理清，那些頁面之于用戶的重要層級，同時也能確保站點地圖的深度與廣度，能讓網路爬蟲順利讀取。

導航欄位應該反映網站目標

你的目標將取決于即將架設的網站類型。在決定站點地圖的層次結構前，應該就你列出的頁面優先找出「能引導用戶完成你所制定行為」的項目，像電商網站最終希望消費者完成的是消費行為，所以導航欄會有購物車、促銷訊息出現；形象網站需要獲取顧客資料便于陌生開發，欄位就會有連接到問卷或社群的選項。

頁面的層次結構要以導引為目的去設置，才能讓所有的資訊發揮最大的效用。不然想像一下，最上端的導航欄如果列的順序是：隱私權條款、免責聲明、Cookie政策、新聞與媒體，用戶一進到網站不能立即獲得應有的資訊，網站瀏覽意愿隨即會發生什么問題，大家應該都能猜得到。

尊重使用者習慣

網站視覺設計不管是破而后立的大膽獨特，亦或是中規中矩的復古經典都能有其大放異彩的一面，但之于導航設計可就不是這么一回事，使用者體驗以訊息可以順利傳遞為前提，追求的是清晰直覺、好操作，特立獨行的導航欄設計反而會讓用戶迷失在網站瀏覽之中。

并不會有從眾現象，使用者體驗亦是。使用者習慣養成不容易，想做第一個吃螃蟹的人，除非你有破釜沉舟的決心，愿意去花時間分析、測試，否則歸根究底這些都僅是體驗的其中一環，為了其去提倡連結文字應該要是綠色，或導航欄只該出現在頁腳，實際意義并不大甚至還會造成使用者體驗無法連貫。

讓導航欄固定在視線內

讓用戶一路滾動到正上方，只為了找到導航欄跳轉到下一個頁面，絕對會是使用者體驗大忌，不管下方是否有頁腳導航或回到頂部的設計，可以理解希望用戶完整瀏覽的用心，但并非每一瀏覽者都是初次進入網站，或有耐心瀏覽完整個網站，讓導航欄固定于視線內，不但跳轉頁面變得方便，同時也可以縮短那些迫切形成轉換的用戶旅程。

限制導航欄的連結數量

人們對于單詞記憶的廣度大約是7個單位，過多的選擇會一定程度干擾用戶瀏覽、購買的意愿。爾后也有數據顯示年輕人的記憶廣度已縮短成4個單位。

不過實際與你提供幾個選擇給用戶無關，更重要的是你如何在減少決策步驟下，去組織網站頁面的訊息結構。訊息爆炸的時代瀏覽網站期待的，絕不會是如字典般的厚重，而是像懶人包的簡潔有力，用最少選擇、獲取最完整的資訊，才更符合現代使用者體驗的期望值。

增加網站搜索欄

有了網站搜索欄，就算用戶不熟悉網站操作流程，也能直覺地從搜索欄輸入關鍵字找到需要的內容。如果你有仔細觀察其他網站，應該也會發現網站搜索欄位置有一定講究，例如：要在導航欄的附近、應該要突顯放大鏡圖示、每一頁面都需具備…等等，做到在使用者體驗中不搶眼，但用戶需要使用時又能第一時間輕松找出的存在。

導航文案直覺清晰

導航是用來指引從一點出發到達另一點的技術的總稱，因此與導航有關的所有文字都應該契合大多數人的直覺反應，以能立即產生認知判斷為主，而不是使用需要思考文字意涵的各種行業術語、簡稱，或只有部分人理解的微文案。并且直覺清晰的導航文案，也能讓頁面在語言轉換更為順利。

運用Logo連結回首頁

當Logo連結回首頁的使用者習慣培養起，導航欄內的首頁設置就顯得可有可無，因此現在的網站越來越少「回首頁」或「主頁」的欄位設計，就連頁腳導航欄也時常會應用一個小型Logo作為回首頁的鏈接。

讓用戶清楚知道目前所在頁面

用戶在連接子頁面獲得相關資訊時，網站導航若能適時提供頁面路徑圖，也就是面包屑設計，讓用戶能清楚地知曉目前所在頁面，用戶就能根據路徑決定下一個瀏覽目的地，而不需要重返首頁或返回上一頁再做一次路徑點擊。

面包屑設計相較返回鍵的好處在于：

1. 讓網路爬蟲更清楚了解頁面與頁面的關系，提升網站SEO分數。
2. 在搜尋結果頁能有更清晰的表現方式，便于用戶了解其分層邏輯。
3. 可以降低用戶的跳出率，提高網站的易用性。

在「易極贊」提供的網站模板中不僅設置好了面包屑導航，還支持豐富的設計組件的使用，可視化編輯，你可以DIY任何你想要的頁面

確保導航欄在所有頁面的相同位置

讓使用者可以從任何頁面導航到他們想要的頁面，這是網站架設、設計的基本準則之一。因為不是所有的用戶都會從首頁進入網站，可能會從銷售的著陸頁、聯絡頁面，或部落格中的某一篇文章進到網站內進行瀏覽，讓這些頁面在相同的位置擁有同樣的導航欄設計，便能有效延伸用戶的瀏覽意愿。

同時在著陸頁、聯絡頁面以及部落格文章中，也能應用錨點文字串接相關資訊頁面，在導航欄連接之外，提供用戶更多與入站頁面相關的更多內容。

成熟的網站導航設計，為你的使用者體驗加分

總體來說，網站架設都需要面對兩道關卡，首先是搜尋引擎的索引，當搜尋引擎認為你有排名的價值，你的網站才會出現在搜尋結果中，接著便是來自用戶的檢驗，一個使用者體驗不好，也沒有足夠誘因的網站，往往在幾個回合的互動之下，就會透漏不好的信號給搜索引擎，因此在擁有一定的排名優勢下，網站的使用者體驗可謂重中之重。

從上述的結論，我們也可以得出網站導航設計便是左右這一切的重要關鍵，不管最終的網頁視覺設計呈現如何，網站導航欄與上述的十個細節設計，都應該出現在你的網站設計之中，這樣才能讓你的使用者體驗趨近成熟完整，無論是什么類型的用戶，都能操作自如地在你的網站擷取所需資訊。

文章出自易極贊 https://www.yjzan.com/yjznews/095dd3ad.html

網站導航應該這樣設計才正確 ，你應該知道的十個關鍵點！ – 易極贊自助建站

轉載需注明出處