私域流量社交電商軟件及相關(guān)增值服務(wù)提供商--HiShop海商

返回
HiShop / 電子商務(wù)解決方案 / 云建站 / 云建站行業(yè)動(dòng)態(tài) /

給你的電子商務(wù)網(wǎng)站設(shè)計(jì)一個(gè)搜索框

2017-03-13|HiShop|閱讀量:
導(dǎo)讀:對(duì)于電子商務(wù)網(wǎng)站建設(shè)來(lái)說(shuō),搜索框的重要性相信專(zhuān)業(yè)人士都知道,搜索框是我們最常用到的UI控件之一,它幾乎存在于所有的網(wǎng)站和APP當(dāng)中。...

給你的電子商務(wù)網(wǎng)站設(shè)計(jì)一個(gè)搜索框

  對(duì)于電子商務(wù)網(wǎng)站建設(shè)來(lái)說(shuō),搜索框的重要性相信專(zhuān)業(yè)人士都知道,搜索框是我們最常用到的UI控件之一,它幾乎存在于所有的網(wǎng)站和APP當(dāng)中。在以內(nèi)容為導(dǎo)向的網(wǎng)站中,搜索框的重要性會(huì)相對(duì)更明顯,用戶需要快速又無(wú)痛地找到他們想要的內(nèi)容。

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

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

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

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

  2、顯眼的搜索輸入框

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

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

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

  3、提供搜索按鈕

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

  小貼士:

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

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

  4、每頁(yè)都保留搜索輸入框

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

  5、讓搜索框盡量簡(jiǎn)單

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

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

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

  下面這個(gè)圖表來(lái)自 A. Dawn Shaikh 和 Keisi Lenz 的一項(xiàng)研究,它展示出了 142 名被調(diào)查者對(duì)于網(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í)在視覺(jué)上要略顯突出,便于用戶發(fā)覺(jué)它的存在。

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

  電子商務(wù)網(wǎng)站搜索框的重要性,相信很多人都有所了解了,一個(gè)好的搜索框,能夠?yàn)榫W(wǎng)站帶來(lái)更多的PV以及增加用戶對(duì)產(chǎn)品的購(gòu)買(mǎi)率。

相關(guān)推薦

產(chǎn)品推薦
  • 移動(dòng)云商城
    一款會(huì)賺錢(qián)的網(wǎng)上商城系統(tǒng)——移動(dòng)云商城,讓零售企業(yè)轉(zhuǎn)型電商更簡(jiǎn)單!獨(dú)創(chuàng)6合一全網(wǎng)營(yíng)銷(xiāo)模式、裂變式推廣分傭快速吸粉引流,不論微信、APP、手機(jī)觸屏還是PC端網(wǎng)上購(gòu)物商城,只要1個(gè)后臺(tái)即可掌控全網(wǎng)最火爆的6大商城!詳情
關(guān)注HiShop

電話咨詢 預(yù)約演示 0元開(kāi)店