在內(nèi)容繁雜的網(wǎng)站中，搜索框通常是最常用的設(shè)計(jì)元素。當(dāng)用戶(hù)遇到相對(duì)復(fù)雜的網(wǎng)站時(shí)，他們會(huì)立即尋找搜索框，已達(dá)到最終目的。搜索框的設(shè)計(jì)及其可用性就顯得尤為重要。
許多人可能認(rèn)為搜索框不需要設(shè)計(jì)，畢竟這只是兩個(gè)簡(jiǎn)單的元素。然而，在內(nèi)容繁雜的網(wǎng)站中，搜索框通常是最常用的設(shè)計(jì)元素。當(dāng)用戶(hù)遇到相對(duì)復(fù)雜的網(wǎng)站時(shí)，他們會(huì)立即尋找搜索框，已達(dá)到最終目的。搜索框的設(shè)計(jì)及其可用性就顯得尤為重要。
兩種類(lèi)型
1. 即時(shí)搜索：
結(jié)果立即顯示在用戶(hù)界面上，不需要按鈕，放大鏡僅顯示為一個(gè)圖標(biāo)，輸入時(shí)立即搜索。
2. 常規(guī)搜索：
通過(guò)用戶(hù)點(diǎn)擊搜索按鈕后才開(kāi)始執(zhí)行搜索。
何時(shí)使用
1. 目標(biāo)對(duì)象很難找到時(shí)
對(duì)象很多時(shí)；
可能的目標(biāo)對(duì)象不在同一個(gè)位置時(shí)；如在磁盤(pán)中查找某類(lèi)型文件時(shí)。
數(shù)據(jù)很難找到時(shí)；如在一篇長(zhǎng)文本中搜索某個(gè)字符串時(shí)。
2. 需要查找特定的內(nèi)容時(shí)；比如我們?cè)谔詫氈兴阉髌ヅ淠撤N特征的商品時(shí)。
3. 需要的結(jié)果不能在5秒找到時(shí)。
設(shè)計(jì)理念
1. 它是界面的一部分，所以要放在一個(gè)顯眼的位置，要容易找到；
2. 在同一應(yīng)用中，它們應(yīng)該有統(tǒng)一的外觀；
3. 它的功能應(yīng)該是有效的，它的結(jié)果應(yīng)該是準(zhǔn)確的，它的速度應(yīng)該是盡可能快速的。
外觀特征
1. 不需要使用標(biāo)簽，使用一個(gè)可選的提示；
2. 提示可以是一個(gè)指令（如搜索類(lèi)型），或者一個(gè)范圍；
3. 提示語(yǔ)要簡(jiǎn)短；
4. 即時(shí)搜索時(shí)，提示首字母大寫(xiě)；常規(guī)搜索時(shí)，首字母小寫(xiě)。
搜索框設(shè)計(jì)的7個(gè)技巧
1. 使用放大鏡圖標(biāo)
根據(jù)定義，圖標(biāo)是對(duì)象，動(dòng)作或想法的可視化表示，并且有幾個(gè)圖標(biāo)是用戶(hù)記憶最深刻的，也是通用的。放大鏡圖標(biāo)就是其中之一。即使沒(méi)有文字標(biāo)簽，用戶(hù)也可以識(shí)別放大鏡圖標(biāo)的作用。
2. 將搜索框放在用戶(hù)希望找到的地方
如果搜索對(duì)于你的應(yīng)用或網(wǎng)站來(lái)說(shuō)是重要的功能，那么搜索框必須放在顯眼的位置，讓用戶(hù)一眼就能找到。
研究發(fā)現(xiàn)，搜索框放置的最佳位置是你網(wǎng)站上每個(gè)頁(yè)面的左上角或右上角，用戶(hù)可以使用常見(jiàn)的F形掃描模式輕松找到它。理想情況下，搜索框應(yīng)該完美匹配網(wǎng)站的整體設(shè)計(jì)，并在用戶(hù)需要時(shí)輕松展現(xiàn)。
3. 為搜索框提供搜索按鈕
搜索按鈕可以幫助人們了解還有額外的觸發(fā)操作 – 即使他們通常使用Enter鍵。
4. 將搜索框放在每一頁(yè)上
始終提供對(duì)每個(gè)頁(yè)面的搜索框的訪問(wèn)權(quán)限，因?yàn)槿绻愕挠脩?hù)找不到他們正在查找的內(nèi)容，他們將會(huì)使用搜索功能，無(wú)論他們處于你網(wǎng)站的哪個(gè)位置。
5. 使搜索框簡(jiǎn)單
如果你設(shè)計(jì)一個(gè)搜索框，請(qǐng)確保它看起來(lái)像一個(gè)搜索框，并盡可能簡(jiǎn)單的使用。根據(jù)可用性研究，默認(rèn)情況下沒(méi)有顯示高級(jí)搜索選項(xiàng)，這樣更加顯示用戶(hù)友好。高級(jí)搜索選項(xiàng)可能會(huì)混淆將嘗試使用它的用戶(hù)。
6. 自適應(yīng)字段大小
輸入字段太短是設(shè)計(jì)人員常見(jiàn)的錯(cuò)誤。當(dāng)然用戶(hù)可以鍵入長(zhǎng)查詢(xún)，但只有一部分文本可見(jiàn)，部分文字被隱藏，這意味著可用性差。因?yàn)橛脩?hù)無(wú)法輕松查看和編輯其查詢(xún)。實(shí)際上，當(dāng)搜索框能夠輸入的文本有限時(shí)，用戶(hù)被迫使用短的文本進(jìn)行查詢(xún)，這樣就不能精確的查詢(xún)。如果輸入字段根據(jù)其預(yù)期輸入進(jìn)行大小調(diào)整，那么它們更容易閱讀并給用戶(hù)提供良好的用戶(hù)體驗(yàn)。
經(jīng)驗(yàn)法則是具有27個(gè)字符的文本輸入（它可以容納90％的查詢(xún)）。
7. 使用自動(dòng)建議機(jī)制
自動(dòng)建議機(jī)制可以幫助用戶(hù)通過(guò)輸入的字符進(jìn)行預(yù)測(cè)來(lái)找到正確的查詢(xún)。自動(dòng)建議機(jī)制不是加快搜索過(guò)程，而是關(guān)于指導(dǎo)用戶(hù)并幫助他們構(gòu)建搜索查詢(xún)。用戶(hù)在查詢(xún)配置方面非常差：如果在第一次嘗試時(shí)沒(méi)有獲得良好的結(jié)果，他們可能就放棄了。自動(dòng)建議機(jī)制可以幫助用戶(hù)更好地表達(dá)他們需要的搜索查詢(xún)。
Google早在2008就掌握此項(xiàng)技術(shù)。由于用戶(hù)傾向于多次搜索相同的內(nèi)容，通過(guò)記住搜索記錄，Google可以節(jié)省時(shí)間并創(chuàng)建更加便捷的體驗(yàn)。
