我為銀杏泰克站內(nèi)搜索服務(wù)商做產(chǎn)品顧問期間，經(jīng)手了十幾個(gè)站點(diǎn)的站內(nèi)搜索應(yīng)用的方案設(shè)計(jì)，略作一些分析和總結(jié)。

一、站內(nèi)搜索應(yīng)用

站內(nèi)搜索的應(yīng)用受到越來越多的重視，以前出于技術(shù)成本和內(nèi)容規(guī)模的原因，大家使用公共應(yīng)用來湊合這個(gè)事，或者干脆沒有。但是現(xiàn)在有錢了，信息量和信息類型的差異化和幾年前也完全不是一個(gè)級(jí)別了，有越來越多網(wǎng)站對(duì)站內(nèi)搜索有了極大的依賴。

對(duì)于分類信息、電子商務(wù)、點(diǎn)評(píng)類、視頻和資源站，站內(nèi)搜索應(yīng)用簡(jiǎn)直就是生死線。

對(duì)于專業(yè)領(lǐng)域門戶、綜合社區(qū)網(wǎng)站、以及新型交互應(yīng)用網(wǎng)站，站內(nèi)搜索也在扮演著重要角色，拉升活躍度和流量，提升網(wǎng)站整體的信息質(zhì)量。

站內(nèi)搜索應(yīng)用分為2個(gè)部分。搜索入口和搜索結(jié)果頁(yè)面。

1. 全局搜索入口的設(shè)計(jì)原則

使用顯眼的設(shè)計(jì)，全站統(tǒng)一樣式和位置。位置通常是位于第一屏的居中或居右。

搜索框中應(yīng)有提示文字。（比如：請(qǐng)輸入關(guān)鍵字…或者 關(guān)鍵字、分類、url…），以在視覺上標(biāo)識(shí)該input框的功能或提示可行的操作。

焦點(diǎn)功能。頁(yè)面初始化時(shí)和input輸入框失去焦點(diǎn)時(shí) 顯示提示文字, 鼠標(biāo)聚焦搜索框時(shí) 消除提示文字。（不要使用text框的默認(rèn)值，我們?cè)诳蛻舻慕y(tǒng)計(jì)數(shù)據(jù)里發(fā)現(xiàn)每天有上千條關(guān)鍵詞為“請(qǐng)輸入關(guān)鍵字”的搜索請(qǐng)求，浪費(fèi)資源。更不要使用背景圖片-_-!!!）

輸入詞智能（模糊）匹配提示（search suggest），這個(gè)最近也逐漸成為標(biāo)配。最初此功能用于在拉丁語系網(wǎng)站中協(xié)助拼寫，現(xiàn)在發(fā)展為通過和本站內(nèi)的搜索請(qǐng)求的趨勢(shì)關(guān)聯(lián)，智能提示的搜索詞可以在一定意義上引導(dǎo)用戶進(jìn)行集中而熱門的搜索，獲得更有效的結(jié)果，以及拓展的關(guān)聯(lián)搜索。

 
2. 分類搜索和搜索結(jié)果分類

許多網(wǎng)站會(huì)在全局搜索入口中放置分類搜索下拉菜單(select)。

好處：對(duì)于通用搜索和擁有復(fù)雜信息類型的網(wǎng)站而言，可以幫助熟練用戶精確搜索目標(biāo)，減少點(diǎn)擊次數(shù)。
壞處1：根據(jù)我們掌握的多個(gè)各個(gè)類型的站內(nèi)搜索log結(jié)果分析，這個(gè)分類下拉的使用率非常低，不足2%。
壞處2：互聯(lián)網(wǎng)用戶的搜索習(xí)慣是被通用搜索引擎培養(yǎng)的——直接輸入關(guān)鍵字。用戶總是先直接輸入關(guān)鍵字，除非發(fā)現(xiàn)找不到結(jié)果，才會(huì)返回來尋找并使用分類搜索下拉，這樣設(shè)計(jì)反而變成是反用戶的了。

許多設(shè)計(jì)師混用了 “分類搜索”和“搜索結(jié)果分類”這2個(gè)概念。

分類搜索：針對(duì)不同信息數(shù)據(jù)類別，搜索需求間有互斥性，分類搜索的搜索結(jié)果間不存在交集。

搜索結(jié)果分類：針對(duì)不同內(nèi)容類型，將某一搜索需求 按不同維度的屬性進(jìn)行的二級(jí)分類或篩選，搜索需求是一致或可容的，結(jié)果之間可能存在交集。

我們拿豆瓣的分類下拉菜單舉例：

書籍/電影/音樂都是屬于內(nèi)容類型，（且輸入框的提示把它們同質(zhì)化了）。它們之間是搜索結(jié)果分類的區(qū)別。

內(nèi)容和小組、成員、活動(dòng)是同級(jí)別的類型。它們之間是分類搜索的區(qū)別。

用戶搜索“暮光之城”，用戶不會(huì)排斥在結(jié)果中同時(shí)得到“暮光之城”的電影類、書籍類、原聲音樂類信息，都是對(duì)內(nèi)容的搜索需求。但是可能會(huì)排斥小組/活動(dòng)/成員類型搜索結(jié)果。想搜索小組和想搜索活動(dòng)是完全不同的需求，一個(gè)想搜僅僅想搜索書籍信息的用戶并不想看到小組中的討論。

_________________________________________________

再來看淘寶的全局搜索入口：

寶貝、店鋪、打聽是不同的搜索需求，它們是分類搜索的區(qū)別。

商城、拍賣、全球購(gòu) 和寶貝都屬于同一內(nèi)容類型，搜索需求一致，信息結(jié)構(gòu)是父子級(jí)的關(guān)系。它們也屬于搜索結(jié)果分類。
這3個(gè)分類是否有單獨(dú)作為分類搜索存在的必要，你使用過這3種分類嗎？

下列設(shè)計(jì)搜索入口的一些方法和原則：

避免過度設(shè)計(jì)。對(duì)于搜索目的或內(nèi)容類型單一的網(wǎng)站，放置分類搜索下拉是不必要的。比如專業(yè)視頻網(wǎng)站，餐飲點(diǎn)評(píng)網(wǎng)站等等

這是一個(gè)專業(yè)視頻網(wǎng)站，從圖1和圖2中可以看到，雖然分類搜索里選擇的視頻和專輯這2個(gè)分類，但是當(dāng)選擇視頻分類去搜索時(shí)，還是會(huì)在第一行輸出了專輯類的搜索結(jié)果。

把搜索結(jié)果分類放到它該去的位置——搜索結(jié)果頁(yè)面通過統(tǒng)一的搜索入口進(jìn)入搜索結(jié)果頁(yè)面后，用戶可根據(jù)此列表了解 搜索結(jié)果的分布，篩選所需分類。
這種設(shè)計(jì)可以清晰地展現(xiàn)信息結(jié)構(gòu)，信息規(guī)模，幫助用戶明確搜索目的，精確篩選。

1 簡(jiǎn)單化處理：在全局頁(yè)面放置通用搜索入口，不帶分類下拉。同時(shí)在頻道頁(yè)設(shè)置單類的搜索入口。
在書籍頻道頁(yè)設(shè)置單類的搜索入口

2 復(fù)雜化處理：在首頁(yè)放置高級(jí)搜索工具箱 （不可代替通用搜索框?。?/P>

盡量避免存在多個(gè)分類搜索之間互斥的設(shè)計(jì)
你是否遭遇過直接在淘寶的input框中輸入店鋪名稱而得不到任何有效結(jié)果？

使用Tab manu （選項(xiàng)卡）代替 下拉菜單。
你更習(xí)慣的是下面哪一種的方式？

有些分類選擇可以用高級(jí)搜索選項(xiàng)來代替

在這里 使用高級(jí)搜索中的篩選來表現(xiàn)可能會(huì)更好。

 
 
在需要使用多重維度的搜索條件來定位時(shí)的處理

比較兩者的設(shè)計(jì)，高下立現(xiàn)。

3．全局搜索結(jié)果和分類搜索結(jié)果

當(dāng)一個(gè)網(wǎng)站同時(shí)擁有全局搜索入口和單類搜索入口。會(huì)產(chǎn)生一個(gè)問題：?jiǎn)晤愃阉骺傻贸鰡我痪_的搜索結(jié)果，而全局搜索得出的結(jié)果頁(yè)面是多種單類搜索混合而成的。如何處理好這種混合，并有效引導(dǎo)用戶得到自己想要的信息？

1 最簡(jiǎn)單的方法: 混排+分類標(biāo)簽。

2 華麗的方法：分區(qū)塊顯示。(對(duì)服務(wù)器壓力較大，分區(qū)塊搜索會(huì)形成多次請(qǐng)求)

分區(qū)塊顯示要根據(jù)網(wǎng)站自身的產(chǎn)品特性和內(nèi)容重心來安排，

不能不分詳略，事無巨細(xì)把所有類型都均等地列出來。多信息等于無信息。

二、搜索結(jié)果頁(yè)面布局

1. 常用功能模塊

上圖只是是為了演示所有通用功能模塊的設(shè)計(jì)demo。并不建議像這樣設(shè)計(jì)產(chǎn)品，用戶根本不會(huì)用到那么多功能，過度設(shè)計(jì)會(huì)導(dǎo)致開發(fā)成本和用戶的學(xué)習(xí)成本大大增加，也使頁(yè)面零亂。

應(yīng)該根據(jù)各自網(wǎng)站的資源、優(yōu)勢(shì)、類型、目的來選用恰當(dāng)?shù)哪K進(jìn)行設(shè)計(jì)。關(guān)于這一點(diǎn)請(qǐng)見后文

2. 布局問題

先來看2個(gè)案例

上圖為4欄的機(jī)票搜索結(jié)果頁(yè)面，中間2欄為往返雙程的搜索結(jié)果。信息密度太高，頁(yè)面擁擠，用戶在尋找自己所需的結(jié)果時(shí)，視線會(huì)不斷被干擾。在左欄縱向放置的篩選功能區(qū)塊，位置和高度導(dǎo)致用戶的正常使用流向被打亂，最右邊的推薦和廣告區(qū)也很難吸引用戶閱讀和點(diǎn)擊，

上圖是2欄的機(jī)票搜索頁(yè)面。頁(yè)面布局寬松，信息密度分布正常。日期的Tab Manu、篩選功能區(qū)和搜索結(jié)果區(qū)的分布和排序符合用戶使用流程。 右側(cè)的推薦信息區(qū)也容易吸引用戶視線。

搜索結(jié)果頁(yè)面的布局原則是簡(jiǎn)潔、突出重點(diǎn)、目的明確。不能分散用戶獲取搜索結(jié)果的注意力。

下面是一些設(shè)計(jì)建議

使用兩欄布局。內(nèi)容型搜索建議比例為三七開，不要讓搜索結(jié)果內(nèi)容區(qū)過寬，影響閱讀體驗(yàn)。
剔除無關(guān)元素，對(duì)于網(wǎng)站統(tǒng)一布局中的公告、推薦、廣告、排行之類的元素，應(yīng)該割舍。布局越清晰明了，干擾元素越少，用戶越容易順利達(dá)到使用目的。
主搜索框 位置全局（或主內(nèi)容區(qū)）上方居中。在搜索結(jié)果頁(yè)面，搜索框不必和全局設(shè)計(jì)統(tǒng)一，縮于一角。
處理好多個(gè)搜索框之間的層次關(guān)系（在同時(shí)存在 主搜索框和單類搜索框/高級(jí)搜索工具箱的時(shí)候）。
信息密度不要過高。不要試圖在搜索結(jié)果中列出所有信息元素。
篩選、排序等功能區(qū)要注意產(chǎn)品邏輯和分布層次。很多設(shè)計(jì)師在處理信息的多個(gè)維度缺乏邏輯和結(jié)構(gòu)意思，弄得頁(yè)面看起來有4~5層橫導(dǎo)航。

這一堆選項(xiàng)卡，你眼花嗎？
根據(jù)內(nèi)容屬性的不同，對(duì)搜索結(jié)果使用合適的顯示模式。（圖片、縮略圖+內(nèi)容、內(nèi)容列表、表格、內(nèi)容+表格 等）
正常搜索結(jié)果和 推廣類搜索結(jié)果（競(jìng)價(jià)或廣告）的設(shè)計(jì)應(yīng)該有清晰的區(qū)分，讓用戶能很容易區(qū)分這兩者。
搜索結(jié)果中的 匹配關(guān)鍵字 應(yīng)高亮顯示。

原文：http://blog.xiqiao.info/2009/06/02/343