中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

網(wǎng)站導(dǎo)航設(shè)計(jì)如何做到讓用戶不迷路?

2022-08-15    分類: 網(wǎng)站導(dǎo)航

由于搜索引擎的普及,許多網(wǎng)站的新用戶,他們的著陸頁是在內(nèi)頁而不是首頁。著陸在內(nèi)頁的用戶,由于是搜索引擎將他們帶進(jìn)的網(wǎng)站,他們并不知道頁面的層級(jí)關(guān)系,以及上一級(jí)的頁面是在什么位置,因此他們更容易在網(wǎng)站中迷路。

關(guān)于如何避免用戶在網(wǎng)站中迷路,之前也發(fā)布過一些文章,比如如何通過設(shè)計(jì)有效的將他們帶回首頁。而本篇文章,將結(jié)合實(shí)例告訴你,如何有效的告知用戶所在位置,制作網(wǎng)站的“導(dǎo)航牌?!?/p>

1.jpg

網(wǎng)站一般使用以下元素來告知用戶所處位置:

1.品牌Logo:在頁面上展示logo可以標(biāo)識(shí)內(nèi)容所有權(quán),讓在內(nèi)頁著陸的用戶明白自己是在哪個(gè)網(wǎng)站上。通常,我們將logo放置于左上角,已保證當(dāng)用戶希望找到它時(shí),可以迅速的發(fā)現(xiàn)它。

2.導(dǎo)航上的視覺差異:借用導(dǎo)航文字的下劃線,或者文字顏色的變化等等,告知用戶自己是在哪個(gè)欄目里。研究發(fā)現(xiàn)這種方式在用戶識(shí)別位置上非常有效。

3.頭部信息:在正文標(biāo)題左上方放置的頭部信息也可以起到幫助用戶明確位置的作用。同時(shí)由于空間相比導(dǎo)航更廣,因此可以羅列更多的層級(jí)信息,在位置信息上的呈現(xiàn)可以更加豐富。

4.頁面標(biāo)題:頁面標(biāo)題是寫在html里的,對(duì)頁面內(nèi)容作出的高度詮釋。在瀏覽器的標(biāo)簽、搜索引擎的搜索結(jié)果、歷史訪問記錄、收藏夾里呈現(xiàn)的都是頁面的標(biāo)題。描述性的、獨(dú)特的標(biāo)題有助于表明所有權(quán)、信息組織和頁面的特定內(nèi)容。

5.url:一個(gè)靜態(tài)化的可讀的url同樣也是告知用戶位置的一個(gè)重要標(biāo)識(shí)。其中與導(dǎo)航相關(guān)聯(lián)的層級(jí)信息非常實(shí)用,比如文章頁面的url帶有英文的article或者拼音的wenzhang等等都可以。

6.面包屑導(dǎo)航:與url相同,面包屑導(dǎo)航同樣彰顯了頁面的層級(jí)關(guān)系,相比url,面包屑導(dǎo)航用錨文本的形式可以更加清楚地描述各級(jí)頁面的主題。

7.文章線索:文章的發(fā)布日期,標(biāo)簽,頁面圖標(biāo),配圖等等都可以表現(xiàn)出站點(diǎn)的信息結(jié)構(gòu)或者時(shí)間的信息。

8.頁面視覺變化:不同色彩的文字,logo的變化以及其他清晰可見的視覺化差異,都可以讓用戶明確自己所處的網(wǎng)站位置已經(jīng)發(fā)生了改變。

結(jié)合實(shí)例,我們來看一下這些元素是怎么被使用的:

2.jpg

BBC使用了這四個(gè)元素來告知用戶所處位置:1.品牌與logo2.導(dǎo)航欄視覺差異3.頭部信息4.文章線索

3.jpg

這個(gè)網(wǎng)頁采用了1.品牌名2.導(dǎo)航欄視覺差異3.面包屑導(dǎo)航4.頭部信息這四個(gè)元素來告知用戶所處位置。在截圖上未體現(xiàn)出來的其頁面標(biāo)題與url也很具有層次感。

4.jpg

紐約公共圖書館的網(wǎng)頁同樣使用了導(dǎo)航欄的視覺差異(黑色→紅色)來告知用戶所處位置。帶有顏色的按鈕不光可以有效抓住用戶視覺,同時(shí)其描述文本極為清晰的闡明了該頁面的主要作用—支持搜索的圖書館明細(xì)列表。

5.jpg

在一些目錄層次很深的網(wǎng)站上,借用導(dǎo)航欄的視覺差異來說明所處位置與網(wǎng)站的信息結(jié)構(gòu)非常困難。比如相冊(cè)類網(wǎng)站,按照年月日進(jìn)行歸類的照片內(nèi)頁,其所在的層級(jí)結(jié)構(gòu)非常深。這時(shí)候,面包屑導(dǎo)航起到的作用會(huì)被放大,這種情況下通??梢詫⒚姘紝?dǎo)航設(shè)計(jì)的更明顯一些。該網(wǎng)頁中最明顯的位置標(biāo)識(shí)就是面包屑導(dǎo)航。

如何測(cè)試網(wǎng)站所處位置標(biāo)識(shí)的設(shè)計(jì)是否有效?

將樣本頁直接拿給身邊的人,或者打印出來去找行人進(jìn)行隨機(jī)測(cè)試。將不同的樣本頁展示給初次接觸該頁面的測(cè)試群體,詢問他們是否可以清楚的明確自己在網(wǎng)站中的位置。如果可以,詢問他們是借助頁面上的什么元素知道自己的位置的。如果不可以,詢問他們“一般借助什么元素來明確自己在網(wǎng)站中的位置/希望網(wǎng)站中添加什么導(dǎo)航元素”

總結(jié)

用戶通常會(huì)借助多種元素來明確自己在網(wǎng)站中的位置,以防迷路。通常來講,url與頁面標(biāo)題等等不會(huì)展現(xiàn)在頁面視覺上的屬性,面對(duì)的受眾要比其他元素更小,如果能用設(shè)計(jì)來讓用戶清楚自己的位置再好不過。然而,url與頁面標(biāo)題的設(shè)置同樣不能大意,這兩樣是搜索引擎理解頁面與層級(jí)關(guān)系的重要指標(biāo),不可忽視。

本文名稱:網(wǎng)站導(dǎo)航設(shè)計(jì)如何做到讓用戶不迷路?
路徑分享:http://m.rwnh.cn/news47/190297.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷seo公司;服務(wù)項(xiàng)目有網(wǎng)站導(dǎo)航

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)
东源县| 察雅县| 栾城县| 禹州市| 淮阳县| 江门市| 芦山县| 丰原市| 奈曼旗| 济宁市| 霍林郭勒市| 河南省| 安国市| 鱼台县| 宜宾市| 阿拉善左旗| 鄢陵县| 三亚市| 西城区| 贵阳市| 常熟市| 许昌市| 新田县| 康平县| 秦安县| 甘谷县| 苍南县| 沭阳县| 丹江口市| 前郭尔| 本溪市| 沙田区| 福清市| 黄石市| 武隆县| 象州县| 美姑县| 剑阁县| 高雄县| 锦屏县| 淮滨县|