當(dāng)前位置:首頁 >  站長 >  搜索優(yōu)化 >  正文

什么是面包屑導(dǎo)航

 2015-07-28 17:00  來源: 互聯(lián)網(wǎng)   我來投稿 撤稿糾錯

  域名預(yù)訂/競價,好“米”不錯過

導(dǎo)航是互聯(lián)網(wǎng)網(wǎng)站最重要的組成部分之一,它涉及到產(chǎn)品的信息架構(gòu)、頁面布局和用戶交互行為等諸多方面。一個網(wǎng)站用戶體驗的優(yōu)劣往往和導(dǎo)航的優(yōu)劣有密切的聯(lián)系。

隨著移動互聯(lián)網(wǎng)的發(fā)展,越來越多的網(wǎng)站以移動網(wǎng)站的形式移植到手機(jī)上。在網(wǎng)站移植過程中,導(dǎo)航的重新設(shè)計有什么變化和設(shè)計要點(diǎn)呢,本文嘗試做出一些研究。

導(dǎo)航的目的

在研究導(dǎo)航之前,我們不妨從導(dǎo)航的使用目的談起。如果把網(wǎng)站比成一座大廈,那導(dǎo)航可認(rèn)作是大廈內(nèi)的指引系統(tǒng)。導(dǎo)航的使用目的歸納起來主要有以下幾個方面:

1. 引導(dǎo)用戶在網(wǎng)站頁面間移動和瀏覽,提供獲取信息的路徑。全局導(dǎo)航、局部導(dǎo)航等都是為了用戶瀏覽相關(guān)的頁面提供引導(dǎo),方便用戶找到所求。

2. 理清網(wǎng)站各部分內(nèi)容之間的關(guān)系,使用戶了解網(wǎng)站全景。最常見于全局導(dǎo)航和站點(diǎn)信息導(dǎo)航,它們展現(xiàn)了整個網(wǎng)站的目錄信息,用戶可快速理解網(wǎng)站結(jié)構(gòu),對網(wǎng)站有整體的把握。

3. 定位用戶在網(wǎng)站中所處的位置。這個功能常見于面包屑和相關(guān)導(dǎo)航中,它幫助用戶識別當(dāng)前瀏覽的頁面與網(wǎng)站整體內(nèi)容間關(guān)系,使用戶了解當(dāng)前頁面和網(wǎng)站其它內(nèi)容的聯(lián)系和區(qū)別。

導(dǎo)航變化的原因

從PC端到移動端導(dǎo)航變化的原因歸根結(jié)底是由物(設(shè)備的軟、硬件差異)、景(使用情景和操作方式)、事(用戶需求和使用目的)差異。這些因素相互交織,對移動終端的導(dǎo)航設(shè)計有顯著的影響。

本文嘗試從類型、內(nèi)容、樣式等方面結(jié)合實例來說明PC端到移動端網(wǎng)站導(dǎo)航設(shè)計的變化:

一、常用導(dǎo)航類型變化

網(wǎng)頁導(dǎo)航的劃分有不同的維度。網(wǎng)頁導(dǎo)航按照作用范圍的不同可以分為三大類:結(jié)構(gòu)性導(dǎo)航、關(guān)聯(lián)性導(dǎo)航和公用程序?qū)Ш健8鶕?jù)《web 導(dǎo)航設(shè)計》,三者的關(guān)系可描述如下:

根據(jù)外在形式的不同,網(wǎng)頁導(dǎo)航通常又可以分為頂部橫向?qū)Ш?、?cè)邊欄導(dǎo)航、Tab標(biāo)簽導(dǎo)航、面包屑導(dǎo)航、頁內(nèi)錨點(diǎn)導(dǎo)航等多種形式。

由于移動終端特性,移動網(wǎng)站可以采用的導(dǎo)航種類較PC端要少很多,主要有縱向?qū)Ш?、分類鏈接?dǎo)航、Tab標(biāo)簽導(dǎo)航、相關(guān)導(dǎo)航等。

下面就常用的移動網(wǎng)頁的導(dǎo)航形式進(jìn)行一些介紹:

縱向?qū)Ш?/p>

由于移動設(shè)備更適合縱向的瀏覽方式,PC站點(diǎn)的頂部橫向?qū)Ш胶蛡?cè)邊欄導(dǎo)航在移動端通常轉(zhuǎn)變?yōu)榭v向?qū)Ш健@缦聢Ddell 和hp的移動版網(wǎng)站設(shè)計中,均采用這種轉(zhuǎn)換方式,較好地完成了導(dǎo)航的遷移。

分類鏈接導(dǎo)航

常見的是在首頁設(shè)置分類鏈接導(dǎo)航,將網(wǎng)站的主要模塊入口放置在主頁頂部。如果分類太多可以加入“更多”入口,在更多頁面將所有分類全部展現(xiàn)。 圖標(biāo)導(dǎo)航是文字鏈接導(dǎo)航的衍生,它更適合在觸屏手機(jī)上,方便用戶用手指進(jìn)行操作。

Tab標(biāo)簽導(dǎo)航

支持HTML5特性的高端機(jī)型通??梢詫崿F(xiàn)頁面的局部刷新。通過Tab的應(yīng)用,導(dǎo)航可以在有限的頁面空間顯示更多的內(nèi)容。例如 Myspace頂部的導(dǎo)航設(shè)計:三個主導(dǎo)航下面各有3-4個二級導(dǎo)航,展現(xiàn)了網(wǎng)站的主要功能。

SEO專題推薦:

關(guān)鍵詞優(yōu)化專題:網(wǎng)站關(guān)鍵詞優(yōu)化沒效果?來這里學(xué)習(xí)最實用的關(guān)鍵詞優(yōu)化技巧!

內(nèi)鏈優(yōu)化專題:最能提升網(wǎng)站權(quán)重的內(nèi)鏈部署優(yōu)化技巧與方法

外鏈建設(shè)專題:高質(zhì)量自然外鏈怎么做?讀完這些你將質(zhì)的飛躍

網(wǎng)站降權(quán)專題:2015年最有用的網(wǎng)站降權(quán)、被K、被黑、被攻擊的解決方法

用戶體驗專題:學(xué)習(xí)完這些,作為站長的你可以秒懂如何做網(wǎng)站用戶體驗

行業(yè)網(wǎng)站專題:優(yōu)化行業(yè)網(wǎng)站的“葵花寶典”看完后無優(yōu)化壓力

申請創(chuàng)業(yè)報道,分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處,共同探討創(chuàng)業(yè)新機(jī)遇!

相關(guān)標(biāo)簽
什么是面包屑導(dǎo)航

相關(guān)文章

  • 什么是面包屑導(dǎo)航,它對SEO的影響有哪些?

    什么是面包屑導(dǎo)航,它對SEO的影響有哪些?總結(jié):面包屑導(dǎo)航是SEO優(yōu)化的重要組成部分,但有的時候也可以打破常規(guī),另辟蹊徑,比如:利用面包屑導(dǎo)航做自定義內(nèi)容的相關(guān)推薦。

  • 什么是面包屑導(dǎo)航?

    在網(wǎng)站建設(shè)和SEO中,面包屑導(dǎo)航的作用就是告訴訪問者他們目前在網(wǎng)站中的位置以及如何返回。關(guān)于面包屑導(dǎo)航的由來是源于一則童話故事的一個詞語:漢澤爾和格蕾特爾兩個人在穿過森林是,為了避免找不到回家的路,他們在沿途走過的地方都會撒下面包屑以便于根據(jù)這些面包屑找到回家的路。典型的面包屑導(dǎo)航如同:網(wǎng)站首頁—頻

  • 電子商務(wù)網(wǎng)站設(shè)計分析之四:面包屑導(dǎo)航

    網(wǎng)站中的面包屑導(dǎo)航(BreadcrumbNavigation)導(dǎo)航是一種作為輔助和補(bǔ)充的導(dǎo)航方式,它能幫助用戶明確當(dāng)下所在的網(wǎng)站內(nèi)位置,并快捷返回之前的路徑。面包屑的由來出自一個童話,兩個孩子為了不在森林里迷路,于是沿途灑下了面包屑作為標(biāo)記,幫助自己能夠原路返回。通過這個故事我們可以看出,之所以被稱

  • 網(wǎng)站中的面包屑導(dǎo)航有什么作用?

    1)讓用戶了解目前所處位置,以及當(dāng)前頁面在整個網(wǎng)站中的位置。2)體現(xiàn)了網(wǎng)站的架構(gòu)層級,能夠幫助用戶快速學(xué)習(xí)和了解網(wǎng)站內(nèi)容和組織方式,從而形成很好的位置感。3)提供返回各個層級的快速入口,方便用戶操作。4)Google已經(jīng)將面包屑導(dǎo)航整合到搜索結(jié)果里面,因此優(yōu)化面包屑導(dǎo)航每個層級的名稱,多使用關(guān)鍵字,

  • 什么是面包屑導(dǎo)航對網(wǎng)站有什么好處

    什么是面包屑導(dǎo)航對網(wǎng)站有什么好處!黃岡SEO認(rèn)為在網(wǎng)站的內(nèi)部優(yōu)化的過程中,面包屑導(dǎo)航是個非常重要的因素,不僅能對搜索引擎有很好的作用,合理的樹狀結(jié)構(gòu)。而且用戶體驗也會很好的。很清晰的知道自己在什么位置。面包屑導(dǎo)航在表現(xiàn)形式上,就像通往目標(biāo)的最直觀的線索,通過線索可以順藤摸瓜,進(jìn)退自如。它能讓訪問者直

熱門排行

信息推薦