一個(gè)網(wǎng)站的導(dǎo)航有效演示

2016-08-23    分類: 網(wǎng)站建設(shè)

一個(gè)網(wǎng)站的導(dǎo)航有效演示
用戶有兩種方式獲取網(wǎng)絡(luò)上的信息:搜索或?yàn)g覽。瀏覽–移動(dòng)通過多方位的內(nèi)容結(jié)構(gòu)–是一個(gè)直觀的導(dǎo)航層次結(jié)構(gòu)時(shí),信息架構(gòu)師目前用戶更容易。本文討論了兩個(gè)技術(shù)。

有一個(gè)很大的郵政服務(wù)的歌曲,這個(gè)地方是監(jiān)獄,說,“這不是一個(gè)黨如果每天晚上都這樣。”雖然歌手具體指的是一個(gè)生活的聚會(huì)太多,這是一個(gè)很好的提醒,任何事情發(fā)生的太經(jīng)常失去意義。
這個(gè)概念在我們的導(dǎo)航是正確的。作為人類,我們的大腦的通知對(duì)比,事情脫穎而出的規(guī)范。這是為什么復(fù)印機(jī)使用大,綠色啟動(dòng)按鈕。這也是之所以在我的智能手機(jī)提供了一個(gè)收集的而不是文字鏈接彩色圖標(biāo)界面。
當(dāng)尋找Yelp上我的iPhone,我沒有掃描“Yelp;“我掃描了紅場。這是一個(gè)更快的心算比詳盡地閱讀每個(gè)應(yīng)用程序的名稱。很明顯,在這兩種情況下,設(shè)計(jì)師把優(yōu)先級(jí)和視覺語言的工作。


我們的術(shù)語定義
優(yōu)先級(jí)就是給一個(gè)元素突出相對(duì)于其重要性在(導(dǎo)航)層次。至于導(dǎo)航層次結(jié)構(gòu),這是通過首先考慮每個(gè)元素的關(guān)系做了用戶的目標(biāo)。
排序的原因是諸如“設(shè)置”或“配置”通常比在網(wǎng)站或應(yīng)用程序的主要作用不明顯。它可以通過多種方式,但本質(zhì)上的優(yōu)先次序意味著項(xiàng)目更重要的應(yīng)該更多的關(guān)注自己。

視覺語言,另一方面,需要用視覺元素來傳達(dá)意義。這通常是通過插圖或圖解,雖然任何視覺線索,強(qiáng)化了功能的元素有助于應(yīng)用程序的視覺語言。
相反,考慮文本導(dǎo)航結(jié)構(gòu)–尤其是那些使用相同的字體大小。不引入/將豐富的視覺語言,這些結(jié)構(gòu)沒有達(dá)到他們大的交際潛能。簡單的視覺線索去了漫長的道路,因?yàn)樗鼈冇兄趲椭脩舴治鲂畔⒆R(shí)別召回。
一些知名的網(wǎng)站和應(yīng)用程序使用的日歷圖標(biāo)。

妖怪
不幸的是,設(shè)計(jì)師往往在設(shè)計(jì)做完全相反的事。為了一致性,他們常常強(qiáng)迫用戶仔細(xì)掃描每個(gè)項(xiàng)目直到他們找到他們要找的東西。愛默生曾經(jīng)稱這種愚蠢的“沒腦子的妖怪。”
讓我們看一看一些不好的例子:
Craigslist
Craigslist提供小優(yōu)先級(jí)和一個(gè)不存在的視覺語言。用戶需要在找到他們正在尋找的鏈接閱讀幾乎每個(gè)條目在首頁。

吉米約翰的網(wǎng)站
每一次我在一個(gè)三明治吉米約翰的網(wǎng)站,我發(fā)現(xiàn)自己重新仔細(xì)閱讀每個(gè)導(dǎo)航項(xiàng)目。為統(tǒng)一起見,每個(gè)導(dǎo)航項(xiàng)目看起來是一樣的:紅色,黑色,白色。在吉米約翰的三明治的導(dǎo)航,那么大。

微軟Metro UI
我最喜歡的一個(gè)最近的違規(guī)者是微軟Metro UI。這已經(jīng)為Windows Phone界面的一些時(shí)間,很快就要到了對(duì)Windows 8的桌面。通過主屏幕瓷磚一樣的顏色與白色字體和白色的圖標(biāo),用戶必須閱讀每瓦而不是應(yīng)對(duì)獨(dú)特的圖標(biāo)和顏色。(John C.德沃夏克最近寫的這一偉大的作品在PC雜志。)
Rdio的iPhone應(yīng)用程序
這個(gè)Rdio的iPhone應(yīng)用程序界面使同樣的錯(cuò)誤作為微軟Metro UI。當(dāng)他們把圖案,顏色和圖標(biāo)的大小一致,迫使用戶密切掃描每個(gè)項(xiàng)目。在一個(gè)美麗的、成功的應(yīng)用,我發(fā)現(xiàn)自己多次掃描屏幕選項(xiàng),找到我所需的行動(dòng)。

蘋果的iTunes
在蘋果的iTunes 10(以及它的搜索),側(cè)邊欄項(xiàng)目從彩色到灰度轉(zhuǎn)換。將一致性,蘋果刪除對(duì)比每個(gè)條目之間,因此需要用戶掃描更仔細(xì)閱讀標(biāo)簽,找到所需的內(nèi)容。以前,如果你正在尋找播客,你掃描的紫色圖標(biāo)。現(xiàn)在你要掃描“播客”因?yàn)閳D標(biāo)一起跑。
iTunes 9出現(xiàn)在左邊和右邊出現(xiàn)的iTunes 10。
路徑滑動(dòng)菜單
路徑的iPhone應(yīng)用程序使用了一個(gè)類似的滑動(dòng)導(dǎo)航發(fā)現(xiàn)在Facebook的應(yīng)用程序。有一個(gè)重要的區(qū)別,然而,在路徑不使用圖標(biāo)和標(biāo)簽,而Facebook。每當(dāng)我打開路徑導(dǎo)航,我要讀每個(gè)條目直到我找到一個(gè)我想要的。在Facebook上,我的視覺模式和選擇反應(yīng)和更少的認(rèn)知負(fù)荷更快。

通過實(shí)例學(xué)習(xí)
現(xiàn)在我們已經(jīng)看到了他們,我們才能避免這些妖怪的一致和創(chuàng)造更有效的導(dǎo)航結(jié)構(gòu)?讓我們來看看一些好的例子:
薄荷
薄荷一直被視為一個(gè)典型的用戶體驗(yàn)和他們的地區(qū),使用高度視覺導(dǎo)航一些不錯(cuò)。“保存”標(biāo)簽,特別是依賴于一個(gè)經(jīng)過反復(fù)推敲的圖標(biāo)導(dǎo)航方式。
ESPN
ESPN的網(wǎng)站有多種不同的導(dǎo)航風(fēng)格貫穿始終,但我發(fā)現(xiàn)懸停狀態(tài)為主要的導(dǎo)航項(xiàng)目是特別有效的照片,視頻和文字相結(jié)合,不同的權(quán)重。
美國大眾汽車
當(dāng)瀏覽車輛模型的選擇美國的大眾網(wǎng)站下拉導(dǎo)航菜單的結(jié)合,優(yōu)先級(jí)–敞篷轎車前–與視覺語言–標(biāo)志性的版本,每輛車在不同的色彩。
推特Web應(yīng)用程序
Web應(yīng)用程序的推特有一個(gè)只有少數(shù)鏈接的接口非常簡單,但都伴隨著一個(gè)獨(dú)特的和有意義的圖標(biāo),它除了和最重要的作用,構(gòu)成一個(gè)新的鳴叫,是除了在明亮的藍(lán)色。

Instagram的iPhone應(yīng)用程序
對(duì)Instagram的應(yīng)用程序按鈕有效結(jié)合優(yōu)先級(jí)和視覺語言。每個(gè)按鈕都是由其相關(guān)的圖標(biāo),最重要的一個(gè)確定的(鏡頭)的中心,代表了一個(gè)藍(lán)色的背景。
環(huán)保纖維光學(xué)
EPB光纖網(wǎng)站充分利用不同級(jí)別的優(yōu)先級(jí)在高水平的導(dǎo)航。主要的導(dǎo)航項(xiàng)目都是黑的最重要的選項(xiàng)(“點(diǎn)菜”)掀起的藍(lán)色。
指引成功
我們看到的例子,包括好的和壞的,現(xiàn)在讓我們?cè)囍爬ㄒ稽c(diǎn)。以下方法可以幫助我們創(chuàng)造更多的優(yōu)先,視覺導(dǎo)航方案:

1.重視用戶的目標(biāo)和/或轉(zhuǎn)換
當(dāng)試圖確定如何安排和帶來的意義,你的導(dǎo)航,想從你的用戶的首要目標(biāo)和/或網(wǎng)站的轉(zhuǎn)化率。讓那些元素突出,易于理解。


2.是不一致的
從復(fù)印機(jī)中得到靈感:而不是努力給所有導(dǎo)航項(xiàng)目相同的尺寸和外觀,杠桿不一致在你的設(shè)計(jì),最重要的項(xiàng)目得到大的能見度。

3.用視覺的語言,不是文字
在有意義的地方,使用圖標(biāo)和其他的視覺線索,你不是只使用文字導(dǎo)航帶來額外的意義。這將允許用戶的大腦過程更迅速依靠模式識(shí)別而不是閱讀。

4.尺寸(顏色)事項(xiàng)
使用大小和顏色的差別來區(qū)分更重要的鏈接或按鈕。

最后的思考
有這么多方面考慮設(shè)計(jì)時(shí)的導(dǎo)航,它可以很容易依靠公約和創(chuàng)造更多的工作給你的用戶作為一個(gè)后果。盡管總是會(huì)出現(xiàn)的情況下,使用這些技術(shù)沒有意義,記住,分化是一個(gè)強(qiáng)大的工具。

不是所有的導(dǎo)航是平等的。通過在你的導(dǎo)航元素采用優(yōu)先級(jí)和視覺語言,你會(huì)幫助用戶導(dǎo)航完全忘記。

四川廣漢網(wǎng)站建設(shè)網(wǎng)絡(luò)公司
岳西定制型網(wǎng)站制作

網(wǎng)頁題目:一個(gè)網(wǎng)站的導(dǎo)航有效演示
網(wǎng)頁網(wǎng)址:http://www.muchs.cn/news37/21087.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站、小程序開發(fā)、定制開發(fā)用戶體驗(yàn)、網(wǎng)站營銷、面包屑導(dǎo)航

廣告

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

成都app開發(fā)公司