譯文|真正易用的搜索功能長(zhǎng)什么樣?

7 評(píng)論 13020 瀏覽 81 收藏 6 分鐘

你知不知道有超過(guò)半數(shù)的用戶在網(wǎng)站中的行為由搜索支配?

我對(duì)搜索功能及它的價(jià)值持肯定態(tài)度,尤其是在電商網(wǎng)站上。它能讓我很快就能找到想要的,而不需要通過(guò)在一層層的分類列表里翻尋。

那么我們應(yīng)該做什么才能讓搜索功能做得更好呢?

想象上一次去某個(gè)網(wǎng)站尋找某個(gè)視頻的時(shí)候,你是通過(guò)它的分類列表去一級(jí)級(jí)尋找?還是去瀏覽你的訂閱列表?沒(méi)有,你是通過(guò)搜索功能。

是否需要搜索?

在nielsen的規(guī)范里,提及搜索功能的大綱頁(yè)數(shù)超過(guò)200頁(yè)。但他們同時(shí)指出有一半的用戶會(huì)直接通過(guò)搜索功能去尋找他們想要的。嗯,這可不是一個(gè)小數(shù)目。

離開搜索,那些用戶不得不使用你的導(dǎo)航菜單。這意味著你必須確保所有的內(nèi)容被組織妥當(dāng),同時(shí)導(dǎo)航菜單也必須在排布上顯示出較高的權(quán)重。

無(wú)論你再怎么做,有時(shí)候某些用戶仍然會(huì)感到挫敗感。這時(shí)你的搜索框應(yīng)該出來(lái)救場(chǎng)了。如果用戶不能前往他們想去的地方,他們會(huì)依靠搜索來(lái)幫助他們達(dá)到那。反之他們會(huì)選擇離開。

位置很重要

既然用戶會(huì)使用搜索功能,那么一旦他們發(fā)現(xiàn)找到某樣?xùn)|西不那么容易的時(shí)候。你需要確保他們能夠容易地發(fā)現(xiàn)搜索。

搜索框應(yīng)該在每一個(gè)頁(yè)面上都出現(xiàn),并且在一個(gè)容易被發(fā)現(xiàn)的地方。不要把你的搜索功能藏在頁(yè)腳,也不要只使用一個(gè)藏在頁(yè)面右上角的小圖標(biāo)。

大多數(shù)網(wǎng)站把他們的搜索框放在頁(yè)頭的位置,這也確實(shí)是一個(gè)安置它的最好地方。用戶會(huì)對(duì)網(wǎng)站之間這種排布的一致性感到自然和習(xí)慣。記住,如果你把你的搜索框放在一個(gè)最通常的地方,會(huì)方便你的用戶去找到。

搜索框應(yīng)該長(zhǎng)什么樣?

搜索框只應(yīng)該是一個(gè)框,我之前提到過(guò)用戶會(huì)傾向一致性,這包括關(guān)鍵ui元素的位置和視覺(jué)上的設(shè)計(jì),更何況我們不應(yīng)該去修正一個(gè)本來(lái)就沒(méi)有問(wèn)題的東西。

我在過(guò)去的幾年里看到人們?cè)噲D去“重設(shè)計(jì)”搜索功能,比如只用一個(gè)搜索的圖標(biāo)在頁(yè)頭上,然后就…沒(méi)有然后了!當(dāng)點(diǎn)擊它后會(huì)打開一個(gè)全屏的圖層。說(shuō)實(shí)話,這很糟糕,我總是會(huì)忽視那些小圖標(biāo),另外對(duì)于一個(gè)簡(jiǎn)單的搜索功能來(lái)說(shuō),它需要被點(diǎn)擊太多次了。。

讓搜索框能夠具有足夠的長(zhǎng)度是很重要的,這樣才能確保在其中能輸入所有東西。一般推薦的寬度是27個(gè)字符,有的網(wǎng)站需要更長(zhǎng),但別比這個(gè)標(biāo)準(zhǔn)短。

一個(gè)簡(jiǎn)單的“在這搜索”的占位符就足夠了,每個(gè)人都知道它能做什么。

不要包含一些高級(jí)的搜索功能在這里,這只會(huì)讓人生厭。一個(gè)簡(jiǎn)單的搜索框已經(jīng)足夠滿足大多數(shù)人的需求,至于高級(jí)搜索功能可以放置在更深的入口,下文會(huì)提到。

你的搜索應(yīng)該搜索什么?

你的搜索功能應(yīng)該具備全局性,這意味著它應(yīng)該能搜素你網(wǎng)站里的所有的內(nèi)容。不要只給出那些用戶當(dāng)前所在板塊相關(guān)的結(jié)果。

原因?因?yàn)槟菚?huì)讓用戶去猜測(cè)待搜索的信息是在哪個(gè)版塊下的。他們是用戶!你不能把什么都扔給他們!

舉個(gè)例子:如果你的用戶正在你的網(wǎng)站中試圖找到一些odour eating鞋墊,他們可能會(huì)下意識(shí)地前往鞋子板塊進(jìn)行搜索。那么結(jié)果就是他們會(huì)無(wú)功而返,因?yàn)橛脩艉芸赡懿⒉恢肋@odour eating鞋墊應(yīng)該歸屬于醫(yī)藥板塊下。

記?。?strong>你的搜索結(jié)果應(yīng)總是返還整個(gè)網(wǎng)站的結(jié)果。

搜索結(jié)果

你的搜索結(jié)果頁(yè)面是一個(gè)非常關(guān)鍵的部分。

結(jié)果可以通過(guò)很多種方法顯示,這取決于你的內(nèi)容格式。但是有一些重要的元素,每一個(gè)搜索引擎結(jié)果頁(yè)面都應(yīng)該具備。

你的搜索結(jié)果頁(yè)面應(yīng)該包含:

  1. 置頂搜索框,并有對(duì)應(yīng)的文案告知用戶他們剛才進(jìn)行過(guò)搜索行為
  2. 搜索結(jié)果的數(shù)目
  3. 一個(gè)過(guò)濾或者排序的菜單項(xiàng),幫助用戶應(yīng)用不同的優(yōu)先級(jí)來(lái)瀏覽內(nèi)容
  4. 一個(gè)能幫助用戶進(jìn)入更高級(jí)的搜索功能的入口(如果你有的話)
  5. 大而醒目、可供點(diǎn)擊的內(nèi)容標(biāo)題
  6. 點(diǎn)擊過(guò)的鏈接應(yīng)該顯示不同的顏色
  7. 導(dǎo)航(面包屑、無(wú)限滾動(dòng)等等)
  8. 搜索框在搜索結(jié)果的底部(如果分頁(yè)顯示結(jié)果的話)

 

版權(quán)所有:UXRen翻譯組

原作者:Marco Lopes

譯者:勵(lì)定洲

原文鏈接:https://medium.com

本文由 @勵(lì)定洲 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. | 我在過(guò)去的幾年里看到人們?cè)噲D去“重設(shè)計(jì)”搜索功能,比如只用一個(gè)搜索的圖標(biāo)在頁(yè)頭上,然后就…沒(méi)有然后了!當(dāng)點(diǎn)擊它后會(huì)打開一個(gè)全屏的圖層。
    這不就是woshipm的設(shè)計(jì)么。。。

    來(lái)自河北 回復(fù)
  2. 可以參考下 : https://support.apple.com/zh-cn

    筆者真用心~~

    來(lái)自福建 回復(fù)
  3. 搜索框這個(gè)要看應(yīng)用平臺(tái)的場(chǎng)景,web端一定是妥妥的框更好,在APP端是可以調(diào)整的,視覺(jué)寬度與功能布局都有影響,圖標(biāo)并不比框更難用;且對(duì)于錄入字符數(shù)的標(biāo)準(zhǔn),很明顯也是適用于web端的

    來(lái)自四川 回復(fù)
  4. 我剛想說(shuō)人人都是產(chǎn)品經(jīng)理的新版面的搜索竟然取消了直接的搜索框… 要點(diǎn)圖標(biāo)才能進(jìn)去…不如之前好吶

    來(lái)自廣東 回復(fù)
  5. 很棒的的文章

    來(lái)自廣東 回復(fù)
  6. 當(dāng)看到:記?。耗愕乃阉鹘Y(jié)果應(yīng)總是返還整個(gè)網(wǎng)站的結(jié)果。果斷收藏了!走了彎路呀慢慢明白的

    回復(fù)
    1. 沒(méi)有經(jīng)歷過(guò)確實(shí)不太好理解啊

      來(lái)自廣東 回復(fù)