定義
搜索欄（Search Bars）：通過在其中輸入字段，來實現(xiàn)對大量數(shù)據(jù)合集的查詢。
基礎設計指南
將搜索框放在用戶預期的位置
搜索框最佳的位置，網(wǎng)站上是每個頁面的正上方或右上方，移動端是每個頁面的導航欄下方，也可以固定在導航欄中或默認隱藏待下滑時再顯示。-
占位文字提示可搜索的內(nèi)容和上下文
搜索欄可以包含占位符文本，如“搜索服裝，鞋子和配件”或簡單地顯示“搜索” ——作為搜索上下文的提醒。
search_Placeholder 提供一個帶有放大鏡圖標的搜索按鈕
放大鏡圖標具備高效識別的特點，搜索按鈕則提示用戶進行下一步，即使大多數(shù)用戶會按Enter鍵執(zhí)行此操作。-
提供清除按鈕
輔助用戶快速清除已經(jīng)輸入的文字內(nèi)容。
search_Clear -
適時提供一個取消按鈕
立即終止搜索的取消按鈕，為用戶提供了取消當前搜索行為的操作方式。
search_Cancel 保持搜索欄簡潔，默認情況下不顯示高級搜索選項，但可以考慮在搜索欄下方提供有用的快捷方式和其他內(nèi)容。
幫助用戶更快地獲取內(nèi)容，例如，Safari在點擊搜索欄后會立即顯示出已收藏的書簽，不輸入任何字段就可以點擊跳轉(zhuǎn)至對應書簽頁。當搜索正在執(zhí)行時，提供明確的狀態(tài)反饋。
通過視覺提示向用戶反饋系統(tǒng)當前的工作狀態(tài)，可以在搜索結果中對用戶已輸入的字符內(nèi)容進行突出顯示。
體驗優(yōu)化Tips
遵循顯性搜索（Explicit Search）的原則
例如，在輸入域周圍提供明顯的操作按鈕，提供撤銷搜索選項，通過反饋告知用戶搜索動作已完成自動補全（Auto-Complete）輸入內(nèi)容
根據(jù)已輸入內(nèi)容，推測或提示關聯(lián)搜索詞，用戶點擊后自動補全輸入內(nèi)容。
匹配的查詢條件不要超過10個（且不要顯示滾動條），以保證信息不會過載。
可以在搜索結果中加粗已輸入的字符，突出顯示。動態(tài)搜索（Dynamic Search）
針對已輸入的內(nèi)容，即時呈現(xiàn)搜索結果。
對有限的數(shù)據(jù)，如地址薄或個人媒體庫，比較有效；不適合搜索海量數(shù)據(jù)。-
范圍搜索（Scoped Search）
在搜索之前或之后對搜索對象的類型和范圍進行限定，從而得到更匹配的搜索結果。
根據(jù)數(shù)據(jù)集提供合理的搜索范圍選項或設定默認分類，3-6個足夠，必要的時候可以通過表單來實現(xiàn)高級搜索功能。
例如，將范圍分欄（Scope Bars）添加到搜索欄下方，適用于有明確分類定義的場景，縮小搜索范圍。
ScopeBar 保存搜索記錄（Saved&Recent）
顯示最近搜索的內(nèi)容，便于用戶選擇搜索過的關鍵詞，節(jié)省重新輸入的時間。搜索結果（Search Results）
標明搜索結果的總項數(shù)，提供合理的默認排序規(guī)則和信息呈現(xiàn)形式。移動端通常采用延遲加載（Lazy Loading）的方式
首先加載一部分搜索結果，另一部分繼續(xù)載入。兩種方式觸發(fā)更多內(nèi)容的加載，一是瀏覽內(nèi)容下滑到未加載位置時自動加載，二是用戶點擊某個按鈕或鏈接來加載。網(wǎng)頁端可根據(jù)實際場景確定搜索結果是否采用分頁顯示的方式
分頁可以幫助用戶從一個很長的列表中定位某個特定的項目；對于瀏覽性的表格來說，點擊顯得比較多余。如果內(nèi)容僅限于單一字段，輸入框可以確定一個合適長度
根據(jù)輸入內(nèi)容的長度規(guī)劃字符數(shù)，體驗更佳。
以電商為例
其搜索位置明顯，定位是按需要精準購買的用戶；
通常在搜索框內(nèi)及周圍推薦商品品類；
鼠標定位在輸入框時，會顯示熱搜推薦和歷史記錄提示，以及更加細分的某類別（或提供分類搜索框指定搜索范圍）；
有字段容錯功能，支持語音輸入。
參考來源：
Search Patterns: Design for Discovery
Designing Search: UX Strategies for eCommerce Success
移動應用UI設計模式
Apple developer Human Interface Guidelines
