<dl id="czmil"><label id="czmil"></label></dl>

    • <ul id="czmil"></ul>

      <menuitem id="czmil"><label id="czmil"></label></menuitem>
      網(wǎng)站建設(shè)找易捷,真誠服務(wù)更便捷!易捷網(wǎng)絡(luò)您的建站專家!
      秦巴云出入掃碼登記管理系統(tǒng)上線 易捷網(wǎng)絡(luò)助力金康園“萬金征名”線上投票評選活動(dòng)取得圓滿成功! 易捷網(wǎng)絡(luò)總經(jīng)理李愛在《傳承優(yōu)秀企業(yè)家精神 幫扶新生代健康成長》活動(dòng)中交流發(fā)言稿 祝賀易捷網(wǎng)絡(luò)公司與得眾小額貸款股份有限公司簽訂結(jié)對幫扶協(xié)議! 易捷網(wǎng)絡(luò)公司與育英中等職業(yè)技術(shù)學(xué)校達(dá)成校企戰(zhàn)略合作,共建雙創(chuàng)育人平臺(tái)!
      安康網(wǎng)絡(luò)公司
      立足安康服務(wù)全國
      做國內(nèi)專業(yè)的網(wǎng)站建設(shè)及品牌推廣服務(wù)提供商
      業(yè)務(wù)咨詢:400-0915-909
      客戶服務(wù):155-9156-9559
      代理合作:187-0050-0630
      您現(xiàn)在的位置: 首頁 » 知識(shí)寶庫 » 網(wǎng)站建設(shè)知識(shí) » 正文 網(wǎng)站建設(shè)知識(shí)
      設(shè)計(jì)一個(gè)完美的搜索框,你需要注意這9個(gè)要素
      發(fā)布時(shí)間:2017-03-03     來源:未知     瀏覽次數(shù):917

      今天的文章我們來聊聊搜索框的設(shè)計(jì),如何讓用戶盡量節(jié)省時(shí)間,搜到他們想要的內(nèi)容。

      1、使用放大鏡圖標(biāo)

      時(shí)至今日,搜索的概念和放大鏡圖標(biāo)之間的關(guān)系已經(jīng)深入人心,根深蒂固了。在日常最常用、最易于識(shí)別的幾個(gè)圖標(biāo)當(dāng)中,放大鏡所帶代表的搜索圖標(biāo)就是其中之一。

      即使在沒有文本標(biāo)簽標(biāo)識(shí)的情況下,用戶也能輕松地識(shí)別圖標(biāo)的含義。

      小貼士:使用最簡略直觀的放大鏡圖標(biāo),細(xì)節(jié)越少,越容易識(shí)別。

      2、顯眼的搜索輸入框

      如果搜索是你的網(wǎng)站或者APP的重要功能的話,你應(yīng)當(dāng)讓搜索框足夠顯眼,這樣的能設(shè)計(jì)讓用戶最快發(fā)現(xiàn)它的存在。

      左邊:搜索功能隱藏在圖標(biāo)之后

      顯示完整的文本輸入框是很重要的,隱藏在按鈕背后的輸入框會(huì)讓用戶覺得不是那么明顯,不容易被快速發(fā)現(xiàn)。需要點(diǎn)擊之后用戶才能看到。

      3、提供搜索按鈕

      按鈕的存在讓用戶能夠明白搜索的觸發(fā)方式——也就是說通過觸發(fā)按鈕來完成這一操作。

      小貼士:

      ·控制搜索按鈕的尺寸大小,讓用戶使用光標(biāo)可以輕松找到并點(diǎn)擊,讓觸發(fā)區(qū)域大小合適。

      ·讓用戶可以通過回車鍵提交搜索,許多用戶仍然有通過點(diǎn)擊鍵盤按鍵來觸發(fā)搜索的習(xí)慣。

      4、每頁都保留搜索輸入框

      你應(yīng)該為用戶擁有在每個(gè)頁面都能立刻進(jìn)行搜索的權(quán)限,如果你的用戶在特定的頁面找不到他們想要的內(nèi)容,可以立刻通過搜索獲取內(nèi)容,無論他在網(wǎng)站的哪個(gè)地方。

      5、讓搜索框盡量簡單

      在你設(shè)計(jì)搜索框的時(shí)候,請盡量讓它看起來就是一個(gè)搜索框,并且簡單易用??捎眯匝芯勘砻鳎J(rèn)沒有顯示高級(jí)選項(xiàng)的搜索框看起來更加友好,所以,通常情況下給用戶提供的搜索框最好不要提供進(jìn)階的搜索選項(xiàng)。

      6、讓搜索框處于用戶預(yù)期的位置

      當(dāng)用戶想要搜索內(nèi)容的時(shí)候還需要花費(fèi)精力來尋找搜索框,這就非常尷尬了。這意味著搜索框本身就不容易被察覺。

      下面這個(gè)圖表來自 A. Dawn Shaikh 和 Keisi Lenz 的一項(xiàng)研究,它展示出了 142 名被調(diào)查者對于網(wǎng)站的搜索框的預(yù)期的位置。這項(xiàng)研究表明,網(wǎng)站的左上角和右上角是用戶所期待的搜索框的位置,用戶在使用F型掃視法查看內(nèi)容的時(shí)候,可以輕松找到搜索框。

      這份研究還表明,右上角的區(qū)域是用戶搜尋輸入框的首選區(qū)域。

      因此,將輸入框置于頂部靠右或者頂部居中的位置,用戶會(huì)主動(dòng)在這個(gè)地方尋找搜索框。

      小貼士:

      ·在理想情況下,搜索框的設(shè)計(jì)應(yīng)當(dāng)和整個(gè)網(wǎng)站的設(shè)計(jì)風(fēng)格保持一致,同時(shí)在視覺上要略顯突出,便于用戶發(fā)覺它的存在。

      ·如果網(wǎng)站的內(nèi)容足夠多,搜索框在設(shè)計(jì)上顯著程度應(yīng)該越高,如果搜索功能對于你的網(wǎng)站至關(guān)重要,那么你應(yīng)該采用較大的對比度,確保輸入框和按鈕從背景中脫穎而出。

      7、合理的輸入框尺寸

      輸入框太小是最常見的搜索框設(shè)計(jì)錯(cuò)素,雖然用戶可以輸入比輸入框更長的內(nèi)容,但是可見的部分往往無法完全可見,這種設(shè)計(jì)的可用性并不強(qiáng)。這樣的輸入框可能因?yàn)榭梢暦秶南拗?,促使用戶使用短的、不精確的查詢方式,因?yàn)楦L的內(nèi)容并不適合閱讀。如果輸入框能夠符合用戶的常見輸入內(nèi)容的尺寸來進(jìn)行匹配,那么它的可用性會(huì)更強(qiáng)。

      根據(jù)經(jīng)驗(yàn),輸入框能夠承載的最佳字符數(shù)量為 27 個(gè),百分之 90 的搜索內(nèi)容都在這個(gè)長度以內(nèi)。

      小貼士:建議考慮使用能根據(jù)輸入長度增長而能變長的輸入框,這不僅節(jié)省了屏幕空間,而且能夠給予用戶足夠的視覺提示,并快速進(jìn)入搜索環(huán)節(jié)。

      8、使用自動(dòng)搜索建議機(jī)制

      自動(dòng)建議機(jī)制能夠幫助用戶在輸入的過程中,動(dòng)態(tài)地預(yù)測正確的查詢方向。自動(dòng)建議并不會(huì)加快搜索的過程,但是能夠幫助用戶構(gòu)建正確的搜索關(guān)鍵詞/內(nèi)容。普通用戶在第一次搜索結(jié)果不理想的情況下,很少會(huì)繼續(xù)進(jìn)行嘗試,而自動(dòng)建議運(yùn)作順利的情況下,將會(huì)幫助用戶更好的搜索。

      谷歌搜索在這方面有著豐富的經(jīng)驗(yàn),自 2008 年開始,谷歌開始記錄用戶的搜索記錄,并且通過這種方式節(jié)省時(shí)間,優(yōu)化結(jié)果,創(chuàng)造更為優(yōu)秀的體驗(yàn)。

      小貼士

      ·確保你的自動(dòng)搜索建議是有用的。不當(dāng)?shù)乃阉鹘ㄗh內(nèi)容可能會(huì)混淆和分散用戶的注意力。盡量幫助用戶更正拼寫,識(shí)別詞根,預(yù)測文本,并改進(jìn)你的工具。

      ·當(dāng)用戶開始輸入之后,盡快開始給予用戶建議,例如在第三個(gè)字符之后,為用戶開始提供即時(shí)的、有價(jià)值的建議,降低用戶的輸入難度和工作量。

      ·盡量為用戶提供少于 10 個(gè)搜索結(jié)果,避免信息過載。

      ·允許使用鍵盤進(jìn)行交互,當(dāng)用戶使用方向鍵向下滾動(dòng)到最后的條目之后,繼續(xù)滾動(dòng)會(huì)跳轉(zhuǎn)到頂部的項(xiàng)目。允許用戶使用Esc按鍵推出列表。

      ·突出顯示輸入的信息和建議的信息之間的差異。

      9、讓用戶明白哪些可以搜索到

      最好是在輸入框中包含示例,這樣可以向用戶給予建議。如果用戶可以輸入多個(gè)關(guān)鍵詞搜索,那么可以像下面的IMDB的網(wǎng)站一樣給予建議。HTML5 可以輕松的實(shí)現(xiàn)在輸入框內(nèi)加入文本占位符。


      安康網(wǎng)絡(luò)公司

       

      易捷網(wǎng)絡(luò)公眾平臺(tái)

      公司地址: 陜西省安康市漢濱區(qū)南環(huán)快速干道8號(hào)誠鵬機(jī)電城漢濱區(qū)互聯(lián)網(wǎng)產(chǎn)業(yè)園4樓404 業(yè)務(wù)咨詢電話: 400-0915-909 3169449 代理合作:18700500630 客服服務(wù):0915-3169449

      Copyright ? 2015 易捷網(wǎng)絡(luò)(www.mexicanrestaurantsandiegoca.com) 版權(quán)所有 陜ICP備12009079號(hào)

      安康易捷網(wǎng)絡(luò)科技有限公司

      国产网曝门亚洲综合在线,中文字幕与邻居少妇性刺激,无码的免费不卡毛片视频,亚洲视频中文在线 精品无码一区二区三区色噜噜 高清对白精彩国产国语 国产91白浆在线
      <dl id="czmil"><label id="czmil"></label></dl>

      • <ul id="czmil"></ul>

        <menuitem id="czmil"><label id="czmil"></label></menuitem>