網頁頂部導航欄設計概要

發布時間:2020-05-27 08:38:00

如果您想訂閱此博客并每天自動將其發送到您的電子郵件,請單擊此處

如果您想訂閱此博客并每天自動將其發送到您的電子郵件,請單擊此處

網頁中的標題通常稱為頂部導航欄。為方便寫作,以下簡稱頂欄。頂欄對網站的用戶體驗至關重要,因為根據用戶的瀏覽習慣(從左到右,從上到下),當他們進入一個新網站時,頂欄通常是他們看到的第一個地方。我們都知道用戶對你的產品的第一印象是非常重要的,因為它總是遵循使用過程,第一印象是不能改變的。

但是在我們的設計中,頂桿是一個盲點,我們很少注意它。因為我們認為頂欄不過是一個logo,幾個文字鏈接堆成菜單,實在沒什么值得注意的。但事實上,頂級酒吧設計的知識遠遠不止于此。

在設計頂欄之前,我們首先需要確定應該顯示什么。總的來說,頂欄有以下內容:

以上都是頂部列中的公共元素。設計時要根據產品本身的實際情況進行選擇。畢竟,把所有這些信息都放在上面是不現實的。信息過載會增加用戶的使用負擔,分散他們的注意力。

取舍當然意味著既有“保留”又有“放棄”,但UI設計中的“放棄”是指“隱藏”——隱藏一些次要功能。

在隱藏的同時,我們也希望當用戶需要時,這些隱藏的功能可以隨時隨地呈現出來。漢堡包按鈕可以幫助我們實現這一點。普通的漢堡包按鈕是由三條水平線組成的,很像一個有兩層面包和一層肉的漢堡包,所以我們稱之為漢堡包按鈕。

漢堡按鈕可以通過隱藏一些次要信息來釋放頁面空間,使頂部的欄更加清晰簡潔,用戶的注意力可以更好地集中在那些重要信息上。

漢堡按鈕是網頁導航設計中常用的一種按鈕,用戶對它比較熟悉,因此不會增加用戶的學習成本。漢堡按鈕設計中最重要的是容易被用戶忽略,所以我們需要使用顏色、大小和空白來恰當地突出它。總之,漢堡包按鈕應該顯示清楚,但不要占用太多的空間。

在最近的頂級菜單設計中,雙層菜單的風格越來越受到設計師的青睞。因為現在隨著產品功能的不斷增加和完善,逐漸出現了一些單層菜單無法解決的情況,即頂欄需要顯示的內容太多,有些具體功能不屬于同一級別。為了更好地應對這種情況,設計師創造性地使用雙層菜單。

以上述網站為例。上面的菜單有到社交網絡(Facebook、instagram和twitter)、公司徽標、搜索框、購物車和漢堡按鈕的鏈接。底部的菜單包括產品類別、門店地址、新聞、關于我們的信息和聯系我們。在這種情況下,如果信息顯示在傳統的單行菜單中,它將無法放下,導致頂欄擁擠。

另外,雙層菜單的設計非常時尚,可以給用戶一種清新的感覺。


17742004931 聯系我們,談您的需求

立即咨詢 立即建站
北京时时彩5分开奖结果 甘肃十一选五中奖规则 北京快乐8所有开奖结果 股票配资工作 欢乐彩票是骗局吗 徽十一选五赢钱 广东36选7福利彩票 融资融券股票折算率 贵州快三全部开奖今天 中国女篮进入决赛直播 最精准的时时彩软件 山西11选5走势图基本 一分快三在哪里下载 北京11选5手机板走势图 泳坛夺金组选中奖规则 北京11选5走势图top10 炒股哪个平台好