MENU 服務 案例
網(wǎng)站建設-網(wǎng)站設計-北京網(wǎng)站建設-高端網(wǎng)站制作公司-尚品中國
我們通過擁抱變化創(chuàng)造
360°的品牌價值__
簡體
簡體中文 English

尚品與山東真諾智能設備有限公司簽署網(wǎng)站改版合作協(xié)議

類型：尚品動態(tài) 了解更多

完美的網(wǎng)站搜索框需要符合哪些要求？

來源：尚品中國| 類型：網(wǎng)站百科| 時間：2018-06-01
     其實搜索框在網(wǎng)站制作中扮演的角色不容小覷，一個可用性較高的搜索框往往可以有效節(jié)省用戶獲取信息和內(nèi)容的時間，大大提升用戶的瀏覽體驗。作為網(wǎng)頁中最常見的UI控件之一，搜索框的組成非常簡單：輸入框+觸動按鈕，不少站長也因此沒有對它給予足夠的重視。尤其是在內(nèi)容為主的網(wǎng)站中，當用戶面對復雜的內(nèi)容時，他們第一時間就會尋找搜索框，輸入關鍵詞以獲取想要的內(nèi)容，強大的搜索框能夠促進用戶交互行為的發(fā)生。所以在設計網(wǎng)站時我們應多花些時間思考搜索框如何設計。如果您沒有什么頭緒，不用擔心，和廣州網(wǎng)站建設公司佰維網(wǎng)絡一起來看看搜索框設計的幾個要點吧!
　　1. 使用放大鏡圖標
　　現(xiàn)在，一看見放大鏡圖標，用戶自然而然就會想起搜索功能，這種聯(lián)系是在長期使用過程中逐漸形成的，是為大家所廣泛認可接受的。因此在網(wǎng)站中設計搜索框時，我們可以多使用放大鏡圖標，畢竟它是最常使用、最易于辨認的(即使沒有文本標簽，用戶也能輕松識別)。當然也要注意，放大鏡圖標應該簡潔直觀，盡量減少一些不必要的細節(jié)，提高圖標的可辨識度。
　　2. 讓搜索框足夠顯眼
　　搜索框設計有一條重要的準則就是：讓搜索框足夠顯眼，清晰可見的搜索框能讓用戶快速發(fā)現(xiàn)并使用。下圖就很好地證明這一點，左右兩側是兩種不同的搜索框設計，左邊的搜索框隱藏在圖標之后，這種隱性的搜索框太不顯眼了，用戶很難發(fā)現(xiàn)并使用。相比而言，右側的搜索框就能及時給用戶提供幫助。
　　3. 提供搜索按鈕
　　在搜索框中設置按鈕是為了讓用戶能夠明白搜索的觸動方式，帶有按鈕的搜索框更易吸引用戶點擊進行搜索。不過，在設計搜索按鈕時，我們要注意控制它的尺寸大小，選取合適的區(qū)域，讓用戶可以移動光標或手動輕松點擊。另外，設置回車鍵提交搜索的功能也是有必要的，因為現(xiàn)在很多用戶仍然保留著點擊回車鍵觸動按鈕的習慣。
　　4. 每頁都保留搜索輸入框
　　網(wǎng)站的每個頁面最好都有搜索框。這樣一來，當用戶在特定的頁面找不到想要的內(nèi)容時，可以立即通過搜索框獲取內(nèi)容，這種設置是快速便捷的，是能夠顯著提高用戶對網(wǎng)站好感的。
　　5. 讓搜索框盡量簡單
　　搜索框設計還有一條原則，那就是簡單易用。研究表明，一個沒有顯示高級選項的搜索框看上去更加友好，可用性也更強。所以，一般情況下，在給用戶提供搜索框時最好不要提供復雜的搜索選項?！?/div>
　　6. 使用自動搜索推薦機制
　　什么是自動搜索推薦機制?以Google為例，當我們在搜索框中輸入"Apple Watch 2"，它會自動出現(xiàn)相關詞條推薦搜索，這就是自動搜索推薦機制的表現(xiàn)形式。谷歌在這方面擁有絕對的發(fā)言權，從2008年開始，它就開始統(tǒng)計用戶的搜索歷史，整理詞條推薦，以幫助用戶節(jié)省時間，創(chuàng)造更佳的用戶體驗。自動搜索推薦機制能夠動態(tài)地預測用戶的搜索方向，幫助用戶更快完成搜索。不過，在使用這種機制時我們也要注意以下幾點：
　　確保自動搜索的推薦內(nèi)容是有價值的。如果輸入框中出現(xiàn)不恰當或無用的搜索推薦，這非但不能為用戶的搜索提供便利，反而容易混淆和分散用戶的注意力。自動搜索的推薦內(nèi)容一定要基于用戶的搜索歷史數(shù)據(jù)來決定;
　　當用戶在輸入框輸入關鍵詞時，盡快給予用戶推薦信息，比如在第三個字符之后，為用戶開始提供即時、有價值的建議，降低用戶的輸入難度和工作量;
　　盡量為用戶提供少于10個搜索結果，避免信息過載。
　　突出顯示輸入信息和推薦內(nèi)容之間的差異;
　　7. 讓用戶明白哪些可以搜索到
　　讓用戶知道在網(wǎng)站中可以搜索到哪些內(nèi)容，也是一種能夠提高用戶對網(wǎng)站好感度的方法，這可以通過在輸入框中添加占位符文字做到。下圖是IMDB的網(wǎng)站，它在搜索框中添加了一些占位字符，提示用戶搜索框中可搜索的內(nèi)容，吸引用戶進行搜索。隨著HTML5建站技術的不斷發(fā)展，這種形式的占位符添加在設計時也不沒有什么難度。不過這里建議占位符的內(nèi)容不要太多，避免給用戶帶來認知負擔。
　　8. 合理的輸入框尺寸
　　輸入框尺寸太小是最常見的搜索框設計錯誤。不少網(wǎng)站的輸入框都太小，雖然可以容納較長的內(nèi)容，但部分內(nèi)容卻是不可見的，這種設計的可用性很差。由于視覺范圍的限制，用戶在輸入內(nèi)容可能會下意識覺得只能采用短的、不精確的查詢方式，或是輸入了較長的關鍵詞，卻在修改時遇到麻煩。因此，小飛建議使用能夠根據(jù)輸入關鍵詞長度而變長的輸入框，這不僅可以節(jié)省屏幕空間，還能給予用戶充分的視覺提示。
　　9. 讓搜索框處于用戶預期的位置
　　當用戶想要使用搜索框，卻需要花費不少精力去找時，用戶的體驗就已經(jīng)大大降低了。網(wǎng)站上的搜索框最好易于察覺，放在用戶預期的位置，哪里才是用戶預期的位置呢?下面這個圖表是來自 A. Dawn Shaikh 和 Keisi Lenz 的一項研究結果，他們抽樣調(diào)查了142名用戶，了解用戶對于網(wǎng)站搜索框位置的偏好。從圖表中，我們可以看出大多數(shù)用戶會在網(wǎng)站的左上角和右上角尋找搜索框，這主要是因為用戶在瀏覽網(wǎng)站時使用F型掃視法，而網(wǎng)站右上角是大多數(shù)用戶的首選區(qū)域，因此在設計搜索框時我們最好把它放在頂部靠右或頂部居中的位置。
　　小貼士：
　　在理想情況下，搜索框的設計應和整個網(wǎng)站的設計風格保持一致。不過在視覺上要略微突出，便于用戶發(fā)覺它的存在;
　　網(wǎng)站的內(nèi)容越多，搜索框就應該越明顯，確保輸入框和按鈕能夠與背景區(qū)域相互區(qū)別。
　　總體而言，雖然搜索框看似簡單，其背后卻蘊藏著大量的設計知識。由于一點點變化也會對整個網(wǎng)站的用戶體驗造成很大的影響，我們在改動搜索框時一定要足夠謹慎。如果你網(wǎng)站目前的轉化率還不錯，搜索框就不要做什么大的改動了;但如果你網(wǎng)站的轉化率很低，其他區(qū)塊設計也沒有發(fā)現(xiàn)什么問題，記得看看搜索框的設計是否存在缺陷。
來源聲明：本文章系尚品中國編輯原創(chuàng)或采編整理，如需轉載請注明來自尚品中國。以上內(nèi)容部分(包含圖片、文字)來源于網(wǎng)絡，如有侵權，請及時與本站聯(lián)系（010-60259772）。
TAG標簽：

如果您的網(wǎng)站可以增加轉化次數(shù)并提高客戶滿意度，該怎么辦？

預約專業(yè)咨詢顧問溝通！

*尚品專業(yè)顧問將盡快與您聯(lián)系

免責聲明

非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前，請您仔細閱讀本聲明的所有條款。

1、本站部分內(nèi)容來源自網(wǎng)絡，涉及到的部分文章和圖片版權屬于原作者，本站轉載僅供大家學習和交流，切勿用于任何商業(yè)活動。

2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。

3、本聲明未涉及的問題參見國家有關法律法規(guī)，當本聲明與國家法律法規(guī)沖突時，以國家法律法規(guī)為準。

4、如果侵害了您的合法權益，請您及時與我們,我們會在第一時間刪除相關內(nèi)容!

聯(lián)系方式：010-60259772
電子郵件：394588593@qq.com

現(xiàn)在就與專業(yè)咨詢顧問溝通！

  • 全國服務熱線

    400-700-4979

  • 北京服務熱線

    010-60259772

信息保護中請放心填寫
在線咨詢

免責聲明

非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前，請您仔細閱讀本聲明的所有條款。

1、本站部分內(nèi)容來源自網(wǎng)絡，涉及到的部分文章和圖片版權屬于原作者，本站轉載僅供大家學習和交流，切勿用于任何商業(yè)活動。

2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。

3、本聲明未涉及的問題參見國家有關法律法規(guī)，當本聲明與國家法律法規(guī)沖突時，以國家法律法規(guī)為準。

4、如果侵害了您的合法權益，請您及時與我們,我們會在第一時間刪除相關內(nèi)容!

聯(lián)系方式：010-60259772
電子郵件：394588593@qq.com