• <li id="oq4c4"><tbody id="oq4c4"></tbody></li>
  • 
    
    <dl id="oq4c4"></dl>
    <li id="oq4c4"></li>
  • <button id="oq4c4"><tbody id="oq4c4"></tbody></button>
  • 華悅網
    當前位置: 首頁 >建站 >建站資訊 >正文

    電商網站建設的搜索框是怎樣設計的?

    2023-03-01 00:42    

        電商網站建設的搜索框是怎樣設計的?在進行一次大規模的迭代之后,最近在查看公司網站運營數據時,發現數據并不是太好看,通過查看瀏覽頁面的查看時間以及下單的轉化率,發現并沒有太大變化,于是一直在思考如何提升數據,達到公司的最大利潤化。


        通過不斷地使用產品,仔細揣摩,發現站內搜索太爛,于是決定針對搜索進行詳細深入研究,為用戶創造一個好的搜索用戶體驗,相信會提高網站的購買轉化率。


        在這里先說下背景,所說的站內搜索指的是以電商網站的站內搜索為例,然后我分為幾部分進行講解。


        這篇文章針對搜索框的用戶體驗進行詳細講解,如果感興趣,隨時關注之后的文章。


        搜索框的位置



        圖片示例:亞馬遜


        現狀:進入亞馬遜的網站頁面,搜索框放在一個很明顯的位置。


        設計的理由:當用戶進入電商網站,大部分人都是很精準地根據需要才進行網上購物,進行搜索就需要尋找搜索框,搜索框就必然置于顯要的位置


        默認商品提示



        圖片示例:淘寶


        現狀:淘寶頁面的輸入框內有默認的一句話:裙裝節新品大賞!


        設計的理由:


        當網站想推薦某一個品類的商品時,搜索是用戶使用高頻次的功能,那么在搜索框中進行推薦,那么這個品類的銷量也將會帶動起來


        網站推薦的資源位置是有限的,如何充分利用起來,很明顯這是一個不錯的方法。


        下拉框熱搜詞推薦提示



        圖片示例:蘇寧易購


        現狀:在點擊輸入框時,下方彈出推薦類:正在熱搜中,下方有眾多的品類以及商品進行推薦


        設計的理由:當用戶在進行網上購物時,準備精準地搜索想購買的商品時,出現熱搜詞,無意中會出現用戶也想購買的商品,那么很容易激發用戶的購買欲,可以提升熱搜商品的銷量。


        用戶情景模擬:我平生痛恨逛超市,本來想去買點菜,在逛的過程中,不知不覺最后又買了一堆水果以及零食回來,所買商品是我預想中的幾倍。


        如何進行設計:在設計此功能時,作為產品經理,不應當只關注到表面太膚淺的用戶體驗,同樣應該分兩方面進行處理


        根據網站的所有售賣結果進行統計,自動將熱搜詞推上去


        根據網站運營部門的需要,因為運營會有推薦品類商品的需求,技術需要在后臺開發出一套獨立于熱搜詞可以手動設置排名在前的功能。


        既有系統自動抓取更新,同時滿足運營需要,這才是一個完整的熱搜詞推薦。


        搜索框下拉框歷史記錄推薦提示



        圖片示例:京東


        現狀:在京東網站中先后搜索和顯卡以及電腦的選項,再次進入京東主頁時,點擊搜索,會出現你的搜索歷史記錄。


        設計的理由:用戶進行過搜索的商品,是有極大的購買傾向,在進行查看后,但是沒有購買行為,返回去再進行搜索時,自動出現搜索歷史記錄,無需手動繼續進行再次輸入,極大地提高了用戶體驗。相應地可以提升用戶購買的轉化率。


        搜索下拉框出現分類提示



        圖片示例:亞馬遜、淘寶


        現狀:在用戶進行搜索商品時,搜索框下拉框進行提示在某品類中進行搜索


        設計的理由:


        性別男,想買一件短袖,那么直接進行搜索后,系統會出現男性和女性的短袖,你需要再次進行篩選,但是如果在輸入框下方直接選擇品類,那么顯然可以更快地達到精準搜索的目的。


        當然,現在的淘寶根據用戶資料以及行為進行了大量的數據存儲,所以我直接進行搜索,搜索結果頁也是出現男裝,但是新建賬號,沒有數據基礎直接進行搜索短袖,是會出現男女裝并存在頁面的情況。


        分類選擇框



        參考圖片:亞馬遜


        現狀:在搜索框的左方,可以先選擇品類,然后輸入商品進行搜索。


        設計的理由:通過先選擇搜索的品類,再進行填寫輸入的內容,那么會更容易精準地搜索到想要的結果。


        自動容錯功能


        參考圖片:亞馬遜、淘寶


        現狀:


        在亞馬遜中,輸入drass,下拉框中自動糾正為dress的一些選項,而淘寶并無此功能


        在淘寶中,輸入斷袖,在搜索結果中出現你要找的是不是斷袖的提示


        以上兩類,統稱為自動容錯功能。


        在用戶搜索商品,打錯字符進行搜索時,系統自動識別進行糾正,并推薦正確的字符(用戶想進行搜索的結果)。


        設計的理由:當用戶在無意間輸入錯誤的字符進行搜索,得到一個無結果提示或是不想要的結果頁,再進行返回搜索框重新輸入字符,這個過程是崩潰的。


        所以有了自動容錯功能,將極大地提升用戶體驗,并提升用戶的購買率。


        語音輸入搜索


        現狀:市場上主流的電商網站web端是無此功能的,而移動端大部分都添加了此功能。


        設計的理由:人不可能對著電腦去進行語音搜索,還沒這種用戶習慣,而手機的方便便攜性,微信等一系列的社交APP培養了用戶使用語音的習慣,添加此功能,自然為最佳之選。


        以上只是有關搜索框用戶體驗的一部分,更多的體驗需要多去研究探討。


        作為搜索的展示面:搜索框,細細深究發現有如此多的規則以及交互體驗可以讓我們進行提升,每一個細節的改善都可以讓用戶的搜索體驗更加棒,討好了用戶,自然可以讓網站從中受益。


        以上的搜索框用戶體驗不僅針對于電商網站的站內搜索,同樣地適用于其他類型網站。


    品牌、內容合作請點這里: 尋求合作 ??

    今日推薦

    AV无码久久久久不卡蜜桃| 狠狠色噜噜狠狠狠狠狠色综合久久| 久久男人Av资源网站无码软件| 狠狠色丁香婷婷综合久久来来去| 久久国产免费福利永久| 久久人人爽人人爽人人片dvd| 久久久久亚洲AV成人网人人软件| 久久久g0g0午夜无码精品| 97久久精品一区二区三区 | 国产高清美女一级a毛片久久w| 久久精品国产亚洲AV高清热 | 久久久久亚洲AV无码专区首JN| 久久99精品国产一区二区三区| 久久99国产一区二区三区| 国产成人一区二区三区精品久久| 性做久久久久久久久浪潮| 久久天天躁夜夜躁狠狠| 午夜精品久久久久久毛片| 日本精品久久久中文字幕| 久久男人中文字幕资源站| www性久久久com| 国产一级做a爰片久久毛片男| 99久久精品国产第一页| 色婷婷综合中文久久一本| 久久99热这里只有精品66| 久久6这里只有精品| 久久精品国产久精国产思思| 久久影院综合精品| 少妇久久久久久被弄高潮| 久久99国产视频| 欧洲人妻丰满av无码久久不卡 | 伊人久久综合影院| 久久久久亚洲AV无码专区网站| 久久国产福利免费| 久久久这里有精品中文字幕| 久久久国产一区二区三区| 亚洲成av人片不卡无码久久| 久久激情五月丁香伊人| 久久久国产精华液| 囯产精品久久久久久久久蜜桃 | 日本强好片久久久久久AAA|