如果做得正確,過濾器允許用戶縮小一個網站選擇的成千上萬的產品只有這幾項匹配他們的特定的需求和利益。 然而,盡管它是一個中央方面用戶的電子商務產品的瀏覽,大多數網站提供一個死氣沉沉的過濾經驗。 事實上,我們2015年指標顯示,只有16%的大型電子商務網站提供一個相當好的過濾經驗。
鑒于過濾的重要性,我們——整個團隊Baymard研究所——在過去的九個月研究用戶如何瀏覽、篩選和評估產品在電子商務產品列表。 我們檢查了這兩個搜索,category-based產品列表。 本研究的核心是一個大規模的可用性研究?測試19領先的電子商務網站?與真實的最終用戶,自言自語的協議。
盡管測試數百萬美元的網站,測試遇到了以上?700年可用性問題?相關產品列表,過濾和排序。 所有這些問題進行了分析和壓縮成93簡潔的產品列表可用性指南,35的特定于過濾可用性設計和邏輯。
(?查看大版本?)
我們隨后?標準的50個美國主要電子商務網站?在這些93年指南排名網站和學習主要電子商務網站設計和實現他們的過濾和排序功能。 這導致了一個基準數據庫超過4500基準數據點電子商務產品目錄設計和性能,其中1750是特定于過濾的經驗。 (您可以查看網站的排名,在公開的部分實現?產品列表和過濾?基準數據庫)。
在本文中,我們將仔細查看一些相關的研究成果?用戶的過濾經驗?。 更具體地說,我們將深入研究以下見解：
只有16%的主要電子商務網站為用戶提供了一個良好的過濾的經驗。 這通常是由于缺乏重要的過濾選項,但是從基準數據很明顯,可憐的過濾也因果邏輯和接口問題。
42%的頂級電子商務網站缺乏范疇特定濾波器類型數的核心產品類別。
20%的頂級電子商務網站缺乏主題過濾器,盡管銷售產品具有明顯的專題屬性(季節、風格等)。
那些處理compatibility-dependent產品的網站,32%缺乏兼容性過濾器(例如,智能手機銷售情況下沒有一個過濾器設備類型或大小)。
測試表明,10 +過濾值需要截斷,不過32%的網站要么截斷設計不足,導致用戶忽略截斷值(6%)或使用測試發現更加麻煩,內聯可滾動區域(24%)。
只有16%的網站積極推動重要過濾器上的產品清單(先決條件時更多地依靠過濾器不是類別)。
過濾性能變化很大的行業,電子產品和服裝的網站通常遭受不足過濾器(每個他們獨特的上下文),而硬件網站和大規模商人率先過濾的游戲。
在本文中,我們將介紹這些?七個過濾的見解?,顯示你的可用性測試結果,檢查基準數據和提供最佳實踐案例為創造一個良好的電子商務經驗過濾。
1。 只有16%的網站提供一個良好的過濾的經驗
如果做得正確,過濾器允許用戶只看到他們的個人需求和興趣相匹配的產品,如某一特定類型的產品或風格或某些特性或屬性。 例如,用戶可能希望看到“夾克”所有產品類別為“男性”(性別過濾器),“冬季”賽季(主題過濾)和可用的大小顏色“黑色”和“M”(變異過濾器)。 電子商務的相當于走進物理存儲和要求銷售人員“黑人男性的,冬天夾克大小中等。”
然而,這些美妙的過濾的先決條件是有一個廣泛的過濾器可用于用戶鉆到特定的特性和產品方面,他們和他們的特定的利益很重要。 大多數電子商務網站已經達不到這里。 然而,一個好的過濾需要一定經驗過濾器不僅存在,但將在用戶容易理解的方式和互動,邏輯遵循用戶的期望。
(?查看大版本?)
基準測試美國票房收入最高50電子商務網站在93年產品目錄指南中確定可用性研究顯示一般平庸的性能。 分析1750分數具體過濾可用性、性能和過濾過濾邏輯界面顯示:
34%的網站過濾體驗不佳,嚴重限制其用戶的瀏覽產品——即使他們最基本的產品需求;
50%的網站提供通行的過濾體驗——絕不是好和可以改進的幾個方面;
只有16%的網站提供一個良好的過濾的經驗,有足夠的過濾類型,可提供一個平衡的過濾設計和過濾邏輯,非常符合用戶期望(雖然,即使其中一些好的網站,大多數仍有改進的余地)。
在章節2、3和4在這篇文章中,我們將介紹三個核心過濾類型的測試結果通常導致問題:范疇特定過濾器,過濾器和兼容性主題過濾器,因為60%的主要電子商務網站缺少一個或多個。
在測試過程中,過濾邏輯和過濾用戶界面往往導致貧困的經驗,即使在網站投入了資源在產品標簽(即過濾可用性)。 用戶需要能夠定位和應用相關的過濾值和使他們的理想過濾組合從一個網站為了吸引價值的過濾器。 然而一個顯著的40%的測試受試者在測試無法找到一個網站的過濾選項——盡管積極尋找他們。 這是至關重要的,考慮到注意過濾器-用戶有效一樣不存在的過濾器。 5和6節,然后,我們將介紹兩個過濾設計模式,能有效地解決其中的一些用戶界面的問題。
2。 42%缺乏范疇特定濾波器類型
大多數情況下,用戶感興趣的過濾產品列表在范疇特定屬性,而不僅僅是website-wide屬性(如品牌、價格、用戶評級,等等)。 例如過濾列表的相機camera-specific屬性,如像素,縮放級別和物鏡——屬性并不特別有意義的其他類型的電子產品,如電視機。
例如,睡袋需要溫度額定值過濾器,而家具需要顏色過濾器,和硬盤容量過濾器,等等。 大規模的42%的頂級電子商務網站缺乏這樣的范疇特定過濾類型數他們的核心產品垂直。
一個好的經驗法則是,任何足夠重要的產品規格所示產品列表項也應作為一個過濾器。 此外,由于顯示在用戶面前的信息,該網站是提醒用戶,規范是重要的(或者,在用戶新域,教他們是)。 非常的規范,鼓勵用戶過濾。
注意?自制?顯示能力的食品加工商(以杯),提醒用戶,這是一個重要的指標,但是并沒有提供過濾的食品加工能力。 (?查看大版本?)鍍金?州大多數夾克的材料類型,但沒有過濾材料。 用戶感興趣的羊毛夾克必須經過所有295件上衣。 (?查看大版本?)斯臺普斯?列出了大部分打印機的打印速度但不允許用戶過濾2409打印機的打印速度。 (?查看大版本?)
在測試過程中,當用戶遇到網站缺乏基本范疇特定過濾,他們將放棄,因為他們意識到他們必須手動找到他們想要的東西通過瀏覽一個通用產品列表包含成百上千的物品(例如,找到夾克由羊毛、食物處理器能力大于14杯,等等)。 用戶經常需要相當長一段時間完全掌握,一個網站不提供這樣的過濾器,與大多數簡單的假設“必須有某個地方,”而不是相信網站會忽視這些基本知識,被迫通過數百種產品。
當一個產品是一組搜索結果列表,?面向方面的搜索?應該為用戶提供最優產品特定的過濾器,無需用戶指定一個類別。 我們觸及了我們的測試結果和面向方面的搜索的主題(以及如何只有40%的頂級網站提供)在第六節”?電子商務的搜索當前狀態?”。
關鍵信息
總是確保每個類別都有一組獨特的過濾器針對特定類型的產品。 至少,產品規格包含在列表項需要提供過濾器,但一系列廣泛的過濾器將幾乎總是需要。
3。 20%缺乏主題過濾器
主題瀏覽模式是很常見的在物理零售商店,在那里任何銷售助理能夠幫助游客與常見的請求,如“一件休閑襯衫,”“春季夾克,”“高端袖珍相機”或“LED電視具有良好的錢的價值。 “然而,這是不容易在大多數電子商務網站。
雖然電視、照相機、夾克和襯衫都可以輕易位于大多數電子商務網站,查看產品,匹配一個特定的“主題”可以幾乎不可能。 盡管這樣的專題屬性通常是常見的和中央方面用戶的購買決定,我們的基準測試顯示,20%的頂尖電子商務網站仍然缺乏主題過濾器(雖然支持增長到66%,上升了48%我們最后的研究和基準測試的電子商務搜索?)。
(?查看大版本?)
“這種事情我太不耐煩。 他們將失去了我。 如果有多個頁面,我永遠不會得到它,”一個主題解釋為他尋找一個夾克的春季?鍍金?。 “通常你可以選擇冬季夾克,春季外套或夾克的類型。 ”他最終放棄該網站。
(?查看大版本?)
“我看這些風格是什么樣子。 然后我想,‘Ayhh,這些都是丑陋的。 ”所以,我上去了,看看我是否能排序(過濾器,艾德。),由“風格”之類的,”一個主題解釋說當她尋找一種方式來過濾的風格。 只有一個“枕頭類型”過濾器可以在陶器谷倉,她選擇嘗試,最終應用隨機枕頭類型看,帶她,幾乎沒有一個可靠的方式讓用戶在網站上找到相關條目。
梅西百貨?提供一個主題“風格”過濾器,最終被測試對象的60%。 以上,一個主題被認為應用“外套風格:休閑”過濾器。 (?查看大版本?)
沒有主題過濾選項,查看他們唯一感興趣的產品常常被不合理地為用戶耗費時間。 尤其這樣就真正地選擇購買哪個項目(s),因為相關產品將隨機分散在一個產品列表。 在測試過程中,缺乏主題過濾器經常導致網站被拋棄,因為存儲的對象要么過早得出結論并沒有把他們想要的產品的類型(例如,春季夾克),或者更多的時候,尋找一些相關的東西,可能是隱藏在一個巨大的產品列表將會幾乎是不可能的。 網站上有主題過濾器,過濾器,有很高的使用率,經常在50%以上。
最簡單的方法從技術上實現主題過濾器是通過手動標記產品或產品組。 主題類型風格的典型例子(休閑、浪漫、現代),季節(春、假日),使用條件(戶外、水下)和purchase-selection參數(便宜,物有所值,高結束)。 某些類型非常適合于手動標記(例如,風格和季節通常會快速和準確的人工標記),而其他過濾器需要廣泛的領域知識來手動標記(例如,物有所值)。
關鍵信息
識別并提供關鍵主題過濾器獨特的網站和產品類型上下文。 這些通常會需要范疇特定(見第二節)。常見的遺漏是風格,使用上下文和purchase-selection參數。
4。 32%缺乏兼容性過濾器
一些產品是compatibility-dependent——也就是說,一個產品的相關性決定完全由它與另一種產品的兼容性,用戶已經擁有或計劃購買。 典型compatibility-dependent產品配件(例如,一個筆記本電腦,以適應),產品與其他產品一起使用(一個音頻系統,需要插入一個電視和媒體播放器),備件(筆記本電腦適配器,需要有一個充電器提示和額定功率匹配用戶的筆記本電腦)和耗材(油墨必須符合一個確切的打印機模型)。
為筆記本電腦找到一個備用適配器或購買一個攝像頭和匹配的情況下聽起來像是很簡單的任務,但它是非常困難的對于我們的測試,只有35%的完成率。 這意味著65%的人放棄,或者更糟的是,最終購買產品,他們認為但實際上是不兼容。
(?查看大版本?)
“哦,我的天哪,我不會這樣做,而不是一個網站,這是很難駕馭。 我會去相機商店和我的相機,找到一個適合的情況下。 我不會去考慮所有這些選項,”一個主題解釋說在試圖找到一個攝影包,實現沒有辦法縮小253袋的尺寸列表。 闡述了主題,“我需要去之間來回,相機比較維度。 然后它還好看?！?/p>
無論多么誘人的價格,規范多么偉大,多么完美的顧客評論發音或者有吸引力的產品產品的設計,最終用戶不感興趣,如果產品是不相容的。 這可能是一個看來,無論產品的其他屬性。 這使得兼容性過濾器過濾類型的一個最重要的(當然,僅供compatibility-dependent產品類型)。 給用戶訪問列表的產品兼容已有的項目是至關重要的,。
盡管兼容性過濾器是一個先決條件查找和購買兼容的商品,32%的網站出售compatibility-dependent產品沒有兼容性過濾器。
雖然大多數網站都有一個“品牌”過濾器,測試表明,這完全是唯一類型的兼容性不足過濾器。 首先,品牌往往有多個系列或產品與不同的兼容性方面。 例如,所有聯想聯想筆記本電腦適配器不適合所有人,因此,簡單地應用過濾器“聯想”不會給用戶所有產品的列表與他們特殊的聯想筆記本電腦兼容。 其次,幾個兼容性依賴、第三方產品是一個主要的考慮因素。 例如,一個“制造商”或“品牌”過濾器不會為用戶提供的完整列表匹配的MacBook筆記本袖子。
關鍵信息
任何產品類別包含compatibility-dependent產品(配件、集成系統、備件、耗材等)需要一個兼容性過濾器。 這通常會是一個過濾器,允許用戶指定他們的模型的姓名和電話號碼,但它也可以是一個過濾器更通用的規范,比如大小、能力或力量。
(見章節4和6的“?電子商務研究:更好的導航和分類指南?“compatibility-dependent更多產品,包括完整的討論互連兼容的產品在產品頁面。)
5。 10 +過濾值需要截斷,然而32%做差
我們測試了三種主導模式顯示列表10 +過濾值:
顯示所有過濾值在一長串,
使用內聯可滾動區域,
刪除過濾值。
所有三種方法造成了嚴重的可用性問題。 前兩個表現最差,而截斷是表現最好的三種方法——但只要是用戶界面的實現非常注重細節。 在深入細節之前需要實現一個表現良好的截斷設計,我們先簡要介紹核心問題的兩個方法。
答:顯示所有過濾值
顯示所有觀察到的問題過濾值在一長串是,它使得用戶不可能得到的概述不同的過濾類型可用。
顯示所有過濾值在一長串讓用戶很難得到其他過濾類型的概述。 在這里,?L.L. Bean?被認為在900像素高顯示(減去瀏覽器和操作系統chrome)。 (?查看大版本?)
例如,在測試過程中,用戶會看到一個品牌過濾器與一個品牌三個屏幕過濾值,使它不可能提供的額外的過濾器類型概述如下。 大部分的測試對象完全忽視以下額外的過濾器類型過濾值的長串,通常被長期過濾欄拉伸兩個屏幕或更多。 積極的注意,我們的產品列表和過濾指標顯示,只有一小部分(2%)的主要電子商務網站目前使用這種模式。
B .使用內聯可滾動區域
一些過濾列表值給出自己的可滾動區域(即區域可以滾動頁面的其余部分獨立的),導致部分交互問題對于大多數測試對象,以及概念性的挑戰更小的組的主題。
內聯可滾動區域,如圖所示?斯臺普斯?為測試對象,造成多個交互問題,概念和interaction-wise。 (?查看大版本?)
實現內聯可滾動區域是更常見的- 24%的主要電子商務網站使用此模式。 然而,它并沒有執行任何更好,因為它帶來了一系列問題。 最重要的問題(也難以解決)如下:
滾動?在?滾動(即嵌套滾動窗格)變成了不是一個特別容易為用戶掌握概念。 內聯可滾動區域會被放置在更大的可滾動區域的web頁面,要求用戶理解的差異,以避免問題。
用戶想申請一個過濾器無法獲得所有過濾選項,因為可滾動區域的概述在高度限制。 可用性問題,因此,從沒有得到過濾類型概述轉向得不到過濾值在每個類型的概況。
內聯可滾動區域經常會引發“scroll-hijacking”,即用戶滾動網頁時,他們會想要滾動過濾列表,反之亦然。 用戶必須不斷地意識到自己的只要他們想滾動鼠標光標的位置。 換句話說,一個主導page-browsing模式在網絡上,垂直滾動頁面,將被劫持。 (在觸摸設備上,寬內聯可以捕獲用戶可滾動區域,使它幾乎不可能滾動頁面而不是行內滾動區域。)
(如果你想進一步探索內聯可滾動區域的問題,我們?檢查發現深度?)。
C .刪除過濾值
最后我們測試模式執行比其他兩個。 截斷的好處是給用戶的概述不同的過濾類型。 這很重要,因為一個缺乏常常引起我們的主題讓可憐的過濾選擇僅僅因為他們傾向于與過濾值,第一次很長的列表的過濾器。 截斷的另一個主要好處是,當用戶找到感興趣的一個過濾器類型時,他們也可以得到一個完整的概述過濾值在該類型(通過單擊截斷鏈接)。 因此,截斷,結合其他兩種方法的好處。
截斷過濾值讓用戶可用的過濾類型概述——看到這里?麗?和所有可用的值在一個類型(當單擊截斷鏈接)。 (?查看大版本?)
然而,性能優越的截斷觀察只有當用戶俯瞰截斷聯系的風險是積極的接口。 事實上,在截斷鏈接測試網站上沒有足夠明顯,它執行(至少)兩個其他模式一樣糟糕,因為有些用戶認為截斷列表顯示所有可用的過濾值。 目前,基準測試顯示,只有6%的主要電子商務網站的截斷聯系設計不足。 雖然不是很多,但它仍然是值得提及的一些實現截斷,測試表明是有效的:
根據濾波器的設計,前10過濾值可以顯示額外的值被截斷。 網站上顯示值之前刪除太少——例如,少于6價值觀——用戶經常會被截斷的原因。 10多個值顯示時,受試者的過濾類型的概述開始迅速下降。 (這些數字沒有發現硬限制,但取決于過濾器和過濾的設計類型可用。)
在截斷集之前,過濾值應該中最受歡迎的,不是按字母順序或匹配的數量。 用戶往往會掃描特定的過濾器的名稱值,而不是一個過濾器類型的名稱。 例如,他們將掃描一個頁面的筆記本電腦充電器“聯想”過濾器,而不是一個過濾器類型命名為“兼容。 ”因此,untruncated值是“代表”的過濾類型,因此應選擇用戶最有可能認識到當看頁面。
截斷鏈接應清晰風格,區別是一個交互式元素不同的過濾值正確的上面。 重要線索包括以下:使用網站的默認鏈接樣式(顏色和/或下劃線)、使用空間等指標作為一個加號(+)或箭頭圖標,指示的數量匹配鏈接的名稱(“視圖23更多”),縮進不同的過濾值(即打破垂直對齊),和視覺衰落截斷列表中的最后一個值。
北部的工具?列出了流行品牌過濾器列表時截斷(促進最知名的值)。 擴大時,按字母順序列出的值給可預測性。 (?查看大版本?)
在適當的截斷設計更多的測試結果在本文中進一步探索。
關鍵信息
截斷的過濾值(10 +),而不是顯示所有值或使用內聯可滾動區域。 確保用戶注意到截斷,顯示10值觸發截斷之前,顯示默認值,用戶最有可能識別(即最受歡迎),和風格截斷鏈接設置它有別于過濾值。
6。 只有16%的積極推動重要的過濾器
某些類別有一定的過濾器是非常重要和有益的為用戶考慮。 然而,顯示這些只是傳統過濾器在過濾欄運行的風險,用戶忽略這些選項或不理解的重要性做出選擇。
一般來說,在測試過程中電子商務的網站,我們發現用戶認為分類是網站建議他們選擇,而傳統的過濾欄選項是被大多數用戶是完全可選的。 勸導式設計的原則后,大多數的網站,因此,有許多類別,需要促進某些過濾器或過濾組合。 幸運的是,一種清晰的分類模式出現了在測試網站如何有效促進一套高度重要的過濾器-盡管實現需要大量的過濾設計細節的地方。
當測試對象搜索?亞馬遜?,某些范圍會高度相關的過濾器在產品列表。 這晉升將測試對象向更多的篩選決策,而不是瀏覽過于廣泛的產品列表。 除了提升在產品列表中,過濾的過濾值都保持完整的側邊欄(一個重要細節)。 (?查看大版本?)
例如,如果用戶導航到“電影”的類別,一個非常重要的濾波器類型考慮將與過濾值的格式,如“DVD,”“藍光”和“數字下載”的類型,大多數用戶將重要的選擇一個產品的過程。
另一個例子是“數碼相機”的范疇,“相機類型”將是一個重要的考慮過濾,過濾值,如“瞄準射擊”,“單反”,“mirrorless”和“橋梁”。
促進有限并選擇過濾值的數量意義只有在絕大多數的用戶有興趣或應用可獲得顯著的效益。 因為提升濾波器鼓勵用戶應用它,明智的使用技術和謹慎,避免引誘用戶過于狹窄的過濾列表。 例如,不要簡單地使用這項技術website-wide無論在每個類別是最受歡迎的過濾器。 在實踐中,你會經常需要手動副牧師的類別結構,保證提升過濾器的使用。
沃爾瑪?需要更進一步的技術和促進與筆記本電腦和輸入類型和關鍵采購過濾器,一致參數為用戶想買一臺筆記本電腦。 (?查看大版本?)
提升過濾器不一定所有相同類型的需要。 他們可能僅僅是一個最重要的產品組合過濾器之前,用戶可以申請時間進一步調查實際的產品列表。 事實上,提升一次過濾器甚至可以申請多個過濾器為用戶提供受歡迎的濾波器組合的捷徑。
兩個額外的實現細節要考慮:
保持提升過濾值過濾欄,太(即除了“促銷”位置)。 因為用戶培訓,篩選欄包含所有可用的過濾器,提升過濾器過濾欄中必須,因為有些用戶將尋找過濾值。
沒有促進過濾器使用banner-like圖形。 我們測試的一些網站推廣視覺盒裝的過濾器。 這導致一些科目完全忽視他們,即使盒子包含了他們正在尋找的濾波器類型——所有由于橫幅失明。
關鍵信息
選擇類別初始過濾選擇有關,將有利于絕大多數用戶,考慮促進少數過濾值高于產品列表(例如,使用按鈕、文本鏈接或縮略圖)。
7。 由工業過濾性能有很大的差異
如果我們看看過濾性能的主要電子商務行業,我們看到,性能千差萬別。 下面7個最具優勢的電子商務行業已經堆疊條形圖繪制。 行“可接受的性能”供參考,描繪了一個“可接受”的門檻(但不是好的)過濾性能——至少根據典型測試遇到的問題。 注意性能差異考慮行業;例如,一個服裝網站需要過濾器少于電子網站由于它攜帶的產品類型,因此,需要一個更先進的設計的過濾器來實現更高的分數。
(?查看大版本?)
盡管擁有最低的障礙提供了一個良好的過濾的經驗,服裝網站特別是最差所有行業的過濾性能,由于一個不幸的過濾選項不足和貧困過濾接口。 低于標準的過濾接口可能由于故意優先于一個清晰的美學和翔實的接口(一箱?錯誤的簡單?)。 盡管處理產品類型只需要有限數量的過濾類型(與其他行業相比),許多服裝網站甚至缺乏基本的過濾選項,比如產品材料和用戶評級。
體育和愛好網站過濾的性能不佳。 雖然部分原因是一個簡單的網站優先級美學,類似于服裝行業,另一個原因可能是混合的視覺,spec-driven產品垂直行業。 許多產品在這些網站往往是相當視覺(玩具、戶外用品、體育器材、愛好設備),然而,許多也有兩三個技術屬性,可能完全否定自己,如果他們不匹配用戶的標準,例如性能、體重和年齡。 因此,用戶將有更復雜的過濾需求為體育和愛好產品比他們通常定期服裝網站。
電子及辦公行業歷來是其中的一個電子商務的行業用戶提供多種過濾器,因為發現許多產品會為用戶幾乎不可能。 當近看平淡無奇的過濾性能在電子和辦公室,問題往往是窮人過濾邏輯和接口。 特別常見的缺陷包括以下:只允許選擇一個過濾值,沒有數字濾波器的定義的范圍,以及缺乏對行業術語的解釋。 盡管一般大量的濾波器類型提供一些電子產品和辦公室的網站,產品的技術性質,多個屬性的用戶的購買決定是至關重要的——仍然導致缺乏兼容性過濾器(見本文的第四節)和缺乏范疇特定過濾類型(見第二節)。
家和硬件網站提供良好的過濾性能。 這非常符合該行業的技術性質,和分數都可以解釋為一種歷史關注提供足夠的過濾器(特別是兼容性過濾器),它允許用戶找到特定的洗衣機或無繩鉆,滿足他們特定的標準。 然而,可憐的產品數據和結構化產品的普遍缺乏規范抑制濾波性能。
健康和美容網站有良好的過濾性能。 公平地說,健康和美容產品有更少的關鍵產品屬性(數量是一個例外),這意味著網站可以僥幸過濾器與高度spec-driven產品比要簡單得多。 電子商務網站在其他行業,因此,不應該模型其過濾經驗在健康和美容網站,因為他們的過濾需求很可能不同。
大規模商人龐大和多元化的產品目錄,產品數據結構有嚴格的要求,處理和分類——所有的東西都可以極其困難。 相結合的混合目錄高度spec-driven和視覺產品類型,和大規模商人最復雜的過濾需求。 然而,很明顯,最大規模的商人都知道這些挑戰并取得了非常積極努力解決他們,經常通過先進的過濾邏輯和數據后處理。 這將導致多種過濾器提供(包括范疇特定的),這是質量的一個主要原因商家網站實現最佳的過濾性能,甚至考慮到用戶的更復雜的過濾要求。
提高電子商務過濾
總的來說,我們為基準的網站的過濾性能是可通行的。 過濾時,大部分甚至電子商務網站頂部出現短而物理零售,客戶要求的地方,例如,“光休閑春季夾克尺寸介質”或“這一個崎嶇的數碼相機”并不是不尋常的。
一些網站做的積極專注于過濾和資源花在產品標簽。 對于那些網站,許多揮之不去的filter-related可用性問題與調整用戶的期望和網站實現(具體來說,過濾設計和邏輯)。 過濾從而代表的機會大大提高投資回報率,大多數大型電子商務供應商已經在產品標簽和數據收集。
過濾電子商務網站是一個重要的話題,顯然不能充分地探索在一篇文章中。 然而,本文介紹過濾的見解希望為理解電子商務的現狀奠定基礎為創造一個良好的過濾的過濾和經驗:
而平庸的過濾性能往往是由于缺乏重要的過濾選項,基準測試也表明,過濾邏輯和過濾接口為用戶造成嚴重的問題。 看用戶的整個過濾經驗,只有16%的美國前50名電子商務網站提供一次很好的經歷,50%的人提供一個差強人意的過濾的經驗,和34%的過濾體驗不佳,沒有過濾器對用戶最基本的產品偏好。
確保過濾可用性,總是確保每個類別都有一組獨特的過濾器它包含針對特定類型的產品。 至少,產品規格包含在列表項需要提供過濾器,但一系列廣泛的過濾器將幾乎總是需要。 目前,42%的頂尖電子商務網站缺乏范疇特定濾波器類型數他們的核心產品垂直。
識別并提供關鍵主題過濾器獨特的網站和產品類型上下文。 這些通常會需要范疇特定,常見的遺漏是缺乏風格,使用上下文或購買選擇參數。 目前,20%缺乏主題過濾器。
任何產品類別包含compatibility-dependent產品(配件、集成系統、備件、耗材等)需要一個兼容性過濾器。 這通常是一個過濾器,允許用戶指定一個模型的姓名和電話號碼,但它也可能是一個過濾器更通用的規范,一個過濾器等大小、能力或力量。 目前,32%的網站出售compatibility-dependent產品缺乏兼容性過濾器。
的過濾值(10 +)應該被截斷,而不是顯示全部(2%)或使用內聯可滾動區域(24%)。 來確保用戶注意到截斷,做幾件事:顯示10值截斷集之前,確保默認顯示值是用戶最可能的值識別(即最受歡迎);和風格截斷鏈接本身設置它有別于過濾值。
選擇類別初始過濾選擇有關,將有利于絕大多數用戶,考慮促進少數過濾值高于產品列表(例如,使用按鈕、文本鏈接或縮略圖)。 目前,只有16%的積極推動高度重要的過濾器產品列表的頂部。
過濾性能變化很大的行業,行業中的關鍵球員可能不是一個好的靈感的源泉。 即使不同級別調整后的過濾需求,網站的服裝、電子產品和體育產業遠遠落后于過濾質量商人和硬件網站提供的經驗。
原文：
When done right, filters enable users to narrow down a website’s selection of thousands of products to only those few items that match their particular needs and interests. Yet, despite it being a central aspect of the user’s e-commerce product browsing, most websites offer a lacklustre filtering experience. In fact, our 2015 benchmark reveals that only 16% of major e-commerce websites offer a reasonably good filtering experience.
Given the importance of filtering, we — the entire team at the Baymard Institute — spent the last nine months researching how users browse, filter and evaluate products in e-commerce product lists. We examined both search- and category-based product lists. At the core of this research was a large-scale usability study?testing 19 leading e-commerce websites?with real end users, following the think-aloud protocol.
Despite testing multi-million dollar websites, the test subjects ran into more than?700 usability problems?related to product lists, filtering and sorting. All of these issues have been analyzed and distilled into 93 concise guidelines on product list usability, 35 of which are specific to filtering availability, design and logic.
(View large version)
We subsequently?benchmarked 50 major US e-commerce websites?across these 93 guidelines to rank the websites and learn how major e-commerce websites design and implement their filtering and sorting features. This has led to a benchmark database with more than 4,500 benchmark data points on e-commerce product list design and performance, of which 1,750 are specific to the filtering experience. (You can view the websites’ rankings and implementations in the publicly available part of the?product lists and filtering?benchmark database).
In this article we’ll take a closer look at some of the research findings related to the?users’ filtering experience. More specifically, we’ll delve into the following insights:
Only 16% of major e-commerce websites provide users with a reasonably good filtering experience. This is often due to a lack of important filtering options, but from the benchmark data it’s clear that poor filtering logic and interfaces are also causal issues.
42% of top e-commerce websites lack category-specific filter types for several of their core product categories.
20% of top e-commerce websites lack thematic filters, despite selling products with obvious thematic attributes (season, style, etc).
Of those websites that deal with compatibility-dependent products, 32% lack compatibility filters (for example, selling smartphone cases without a filter for device type or size).
Testing showed that 10+ filtering values require truncation — yet 32% of websites either have insufficient truncation design, causing users to overlook the truncated values (6%) or use what testing found to be even more troublesome, inline scrollable areas (24%).
Only 16% of websites actively promote important filters on top of the product list (a prerequisite when relying more on filters than on categories).
Filtering performance varies greatly by industry, with electronics and apparel websites generally suffering from insufficient filters (for each of their unique contexts), while hardware websites and mass merchants take the lead in the filtering game.
In this article we’ll walk through each of these?seven filtering insights, showing you the usability test findings, examining the benchmark data and presenting best practice examples for creating a good e-commerce filtering experience.
1. Only 16% Of Websites Provide A Good Filtering Experience
When done right, filters enable users to see only the products that match their individual needs and interests, such as products of a particular type or style or with certain features or attributes. For example, a user might want to see all products in the “jackets” category for “men” (gender filter), for the “winter” season (thematic filter) and available in the color “black” and size “M” (variation filter). It’s the e-commerce equivalent of walking into a physical store and asking a salesperson for “a black, men’s, winter jacket in size medium.”
However, a prerequisite to these wonderful powers of filtering is having a vast range of filters available for the user to drill into the particular features and product aspects that are important to them and their particular interests. Most e-commerce websites already fall short here. However, a good filtering experience requires the necessarily filters not only to be present, but to be presented in a way that’s easy for the user to grasp and interact with and whose logic follows user expectations.
(View large version)
Benchmarking the 50 top-grossing US e-commerce websites across the 93 product list guidelines identified in the usability study revealed generally mediocre performance. Analyzing the 1,750 performance scores specific to filtering availability, filtering logic and filtering interfaces reveals that:
34% of websites have a poor filtering experience, severely limiting their users’ ability to browse products — even when they have the most basic of product requirements;
50% of websites offer a passable filtering experience — by no means good and with several areas that could be improved;
only 16% of websites provide a good filtering experience, with sufficient filtering types available, a balanced filtering design and a filtering logic that aligns well with user expectations (although, even among these few good websites, most still have room for refinement).
In sections 2, 3 and 4 in this article, we’ll walk through the test findings for three of the core filtering types that typically cause issues: category-specific filters, compatibility filters and thematic filters — because 60% of major e-commerce websites lack one or more of these.
During testing, the filtering logic and filtering user interface often led to a poor experience, even on websites that have invested resources in product tagging (i.e. filter availability). Users need to be able to locate and apply relevant filtering values and to make their desired filtering combinations in order to draw value from a website’s filters. Yet a notable 40% of test subjects were at some point during testing unable to find a website’s filtering options — despite actively looking for them. This is critical, considering that unnoticed filters are — to the user — effectively the same as nonexistent filters. In section 5 and 6, then, we’ll walk through two filtering design patterns that proved effective at solving some of these user interface issues.
2. 42% Lack Category-Specific Filter Types
Most of the time, users are interested in filtering a product list across category-specific attributes, and not just the website-wide attributes (such as brand, price, user ratings, etc.). An example would be filtering a list of cameras by camera-specific attributes, such as megapixels, zoom level and lens mount — attributes that aren’t particularly meaningful for other types of electronics, such as TVs.
For example, sleeping bags would need a temperature rating filter, while furniture would need a color filter, and hard drives a capacity filter, and so on. A massive 42% of top e-commerce websites lack such category-specific filtering types for several of their core product verticals.
A good rule of thumb is that any product specification that is important enough to be shown in a product list item should also be available as a filter. Moreover, by virtue of displaying the information in front of the user, the website is reminding the user that that specification is important (or, in the case of users new to the domain, teaching them that it is). The very display of the specification, then, encourages users to filter by it.
otice how?Williams-Sonoma?displays the capacity of its food processors (measured in cups) — reminding users that this is an important metric — but then offers no way to filter the food processors by capacity. (View large version)
Gilt?states the material for most jacket types, but without a materials filter. Users who are interested in wool jackets would have to go through all 295 jackets. (View large version)Staples?lists the printing speed of the majority of its printers but does not allow users to filter its 2409 printers by printing speed. (View large version)
During testing, when users encountered websites that lack basic category-specific filtering, they would give up because they realized they would have to manually locate the items they want by browsing a generic product list containing hundreds of items (for example, to find jackets made of wool, food processors with capacities greater than 14 cups, etc.). Users often took quite a while to fully grasp that a website doesn’t offer such filters, with most simply assuming that “It must be there somewhere,” and not believing that the website could neglect such basics — and being forced to look through hundreds of products.
When a product list is a set of search results,?faceted search?should present the user with the best-matching product-specific filters, without the user having to specify a category. We touched on our test findings and the topic of faceted search (and how only 40% of top websites offer this) in section 6 in “The Current State of E-Commerce Search.”
KEY TAKEAWAY
Always ensure that each category has a unique set of filters specific to the type of product. At a minimum, the product specifications included in the list items will need to be available as filters as well, but a wider array of filters will nearly always be needed.
3. 20% Lack Thematic Filters
Thematic browsing patterns are quite common in physical retail stores, where any sales assistant would be able to help visitors with common requests, such as “a casual shirt,” “a spring jacket,” “a high-end pocket camera” or “an LED TV with good value for the money.” However, this is no easy task on most e-commerce websites.
While TVs, cameras, jackets and shirts can all be easily located on most e-commerce websites, viewing products that match a certain “theme” can be nearly impossible. Despite such thematic attributes often being both common and central aspects of the user’s purchasing decision, our benchmarking revealed that 20% of top e-commerce websites still lack thematic filters (although support for it has grown to 66%, up from 48% since?our last study and benchmarking of e-commerce search).
(View large version)
“I’m too impatient for this kind of thing. They would have lost me. If there were multiple pages, I would never have gotten through it,” one subject explained as he looked for a jacket for the spring season on?Gilt. “Normally you can choose between winter jackets, spring jackets or the type of jacket.” He ended up abandoning the website.
(View large version)
“I’d look at these to see what the style is like. And then I’d think, ‘Ayhh, these are all ugly.’ So, I go up again, to see if I can sort a little [filter, ed.], by ‘style’ or something,” one subject explained while she looked for a way to filter by style. With only a “pillow type” filter available on Pottery Barn, she had few options to try and ended up applying a random pillow type to see where that would take her — hardly a reliable way for users to find relevant items on a website.
Macy’s?offers a thematic “style” filter, which ended up being used by 60% of test subjects. Above, one subject is seen applying a “Coat Style: Casual” filter. (View large version)
Without thematic filtering options, viewing only the products of interest to them was often unreasonably time-consuming for users. This was especially the case when it came to actually selecting which item(s) to purchase, because the relevant products would be randomly scattered across a product list. During testing, a lack of thematic filters often led to website abandonment because the subjects prematurely concluded either that the store didn’t carry the type of product they wanted (for example, spring jackets) or, more often, that finding the few relevant items that might be hidden somewhere in a vast product list would be nearly impossible. On websites that do have thematic filters, the filters had very high usage rates, often above 50%.
The easiest way to technically implement thematic filters is by manually tagging products or groups of products. Typical examples of thematic types are style (casual, romantic, modern), season (spring, holiday), usage conditions (outdoors, underwater) and purchase-selection parameters (cheapest, value for money, high end). Some types are well suited to manual tagging (for example, style and season will often be both fast and accurate for a human to tag), whereas other filters require extensive domain knowledge to manually tag (for example, value for money).
KEY TAKEAWAY
Identify and offer key thematic filters unique to the website and product-type context. These will often need to be category-specific (see section 2). Common omissions are style, usage context and purchase-selection parameters.
4. 32% Lack Compatibility Filters
Some products are compatibility-dependent — that is, a product’s relevance is determined entirely by its compatibility with another product that the user already owns or plans on buying. Typical compatibility-dependent products are accessories (for example, a case for a laptop that has to fit), products used in conjunction with other products (an audio system that needs to plug into a TV and media players), spare parts (a laptop adapter that needs to have a charger tip and power rating that matches the user’s laptop) and consumables (ink that has to fit an exact printer model).
Finding a spare adapter for a laptop or buying a camera and matching case might sound like trivial tasks, but it turned out to be extremely difficult for our test subjects, who had a completion rate of only 35%. This means that 65% had to give up or, worse, ended up purchasing a product that they believed was compatible but was in fact not.
(View large version)
“Oh my gosh, I wouldn’t do this — not on a website which is this difficult to navigate. I would go to a camera store with my camera and find a case that fits. I wouldn’t go about looking into all of these options,” one subject explained while trying to find a camera bag and realizing there was no way to narrow the list of 253 bags by size. The subject elaborated, “I’d need to go back and forth between this and the camera to compare the dimensions. And then it also has to look nice.”
No matter how enticing the price, how great the specifications, how perfect the customer reviews pronounce the product to be or how appealing the product’s design, the end user will not be interested if the product is incompatible. This could be a dealbreaker, regardless of the product’s other attributes. This makes compatibility filters one of the most important filtering types (for compatibility-dependent product types only, of course). Giving users access to a list of products that are compatible with the item they already own is vital, then.
Despite compatibility filters being a prerequisite for finding and purchasing compatible items, 32% of websites that sell compatibility-dependent products have no compatibility filters.
While most websites have a “brand” filter, tests showed that this is completely inadequate as the only type of compatibility filter. First, brands often have multiple series or products with different compatibility aspects. For example, all Lenovo adapters will not fit all Lenovo laptops; so, simply applying a filter for “Lenovo” would not give the user a list of all products compatible with their particular Lenovo laptop. Secondly, for several compatibility dependencies, third-party products are a major consideration. For example, a “manufacturer” or “brand” filter would not provide the user with a full list of matching sleeves for their MacBook laptop.
KEY TAKEAWAY
Any product category that contains compatibility-dependent products (accessories, integrated systems, spare parts, consumables, etc.) will need a compatibility filter. This will often be a filter that allows the user to specify their model name and number, but it could also be a filter for a more generic specification, such as for size, capacity or power.
(See sections 4 and 6 of “An E-Commerce Study: Guidelines for Better Navigation and Categories” for more on compatibility-dependent products, including a discussion of complete interlinking to compatible products on product pages.)
5. 10+ Filtering Values Require Truncation, Yet 32% Do It Poorly
We tested three dominant patterns for displaying lists of 10+ filtering values:
displaying all filtering values in one long list,
using inline scrollable areas,
truncating the filtering values.
All three methods caused severe usability issues. The first two performed the worst, while truncation proved to be the best performing of the three methods — but only as long as it was implemented with great attention to details of the user interface. Before diving into the details required to achieve a well-performing truncation design, let’s briefly present the core problems with the first two methods.
A. DISPLAYING ALL FILTERING VALUES
The problem observed with displaying all filtering values in one long list is that it makes it impossible for the user to get an overview of the different filtering types available.
Displaying all filtering values in one long list makes it difficult for users to get an overview of the other filtering types. Here,?L.L. Bean?is being viewed on a 900-pixel-tall display (minus the browser and OS chrome). (View large version)
During testing, users would see, for example, a brand filter with one to three screens of brand filtering values within — making it impossible to get an overview of the additional filter types offered below. The majority of test subjects completely overlooked the additional filter types below the long list of filtering values and were generally overwhelmed by the long filtering sidebar stretching two screens or more. On a positive note, our product list and filtering benchmark shows that only a small fraction (2%) of major e-commerce websites currently use this pattern.
B. USING INLINE SCROLLABLE AREAS
Some lists of filtering values are given their own scrollable area (i.e. the area can be scrolled independent of the rest of the page), causing several interaction problems for the majority of test subjects, as well as conceptual challenges for a smaller group of subjects.
Inline scrollable areas, as seen here on?Staples, caused multiple interaction problems for test subjects, both conceptual and interaction-wise. (View large version)
Implementing inline scrollable areas is far more common — 24% of major e-commerce websites use this pattern. It did not, however, turn out to perform any better, because it comes with a host of problems on its own. The most significant problems (which are also difficult to solve) are the following:
Scrolling?within?scrolling (i.e. nested scrolling panes) turned out to be not a particularly easy concept for users to grasp. The inline scrollable area would be placed within the larger scrollable area of the web page — requiring the user to understand the difference in order to avoid problems.
Users who wanted to apply a filter could not get an overview of all filtering options because the scrollable area was constrained in height. The usability problem, thus, shifted from not getting an overview of filtering types to not getting an overview of filtering values within each type.
Inline scrollable areas often caused “scroll-hijacking,” whereby the user would scroll the web page when they wanted to scroll the filtering list, or vice versa. The user had to be constantly aware of their mouse cursor’s position whenever they wanted to scroll. In other words, a dominant page-browsing pattern on the web, vertical page scrolling, would be hijacked. (On touch devices, wide inline scrollable areas can trap the user, making it almost impossible to scroll the page instead of the inline scroll area.)
(If you want to further explore the problems of inline scrollable areas, we?examine the findings in depth elsewhere.)
C. TRUNCATING FILTERING VALUES
The last pattern we tested turned out to perform better than the other two. Truncation has the benefit of giving users an overview of the different filtering types. This is important because a lack of one often caused our subjects to make poor filtering selections simply because they were inclined to interact with the filtering values that were first in the very long list of filters. The other main benefit of truncation is that, when users find a filter type of interest, they also have the option of getting a full overview of filtering values within that type (by clicking the truncation link). Truncation, therefore, combines the benefits of the other two methods.
Truncated filtering values gives users an overview of both the filtering types available — as seen here on?REI?— and all available values within a type (when the truncation link?is clicked). (View large version)
However, the superior performance of truncation was observed only when the risk of users overlooking the truncation link was actively addressed in the interface. In fact, on the tested websites where the truncation link wasn’t sufficiently distinct, it performed (at least) as poorly as the two other patterns, because some users assumed that the truncated list showed all available filtering values. Currently, benchmarking shows that only 6% of major e-commerce websites have a truncation link that is inadequately designed. While that’s not many, it would still be worthwhile to touch on some of the implementations of truncation that testing showed to be effective:
Depending on the design of the filter, up to 10 filtering values can be displayed before the additional values are truncated. On websites that display too few values before truncating — for example, fewer than 6 values — users would often be confused by the reason for the truncation. When more than 10 values were displayed, the subjects’ overview of the filtering types began to drop rapidly. (These numbers were not found to be hard limits, but depended on the design of the filter and the number of filtering types available.)
Before truncation sets in, the filtering values should be listed in order of popularity, not alphabetically or by number of matches. Users will often scan for the name of a specific filter value, rather than the name of a filter type. For example, they will scan a page of laptop chargers for a “Lenovo” filter, rather than for a filter type named “compatible with.” Consequently, the untruncated values are “representatives” of the filtering type and should therefore be the options that users are most likely to recognize when glancing at the page.
The truncation link should be clearly styled, distinguishing it as an interactive element different from the filtering values right above it. Important clues include the following: using the website’s default link styling (color and/or underlining), using spatial indicators such as a plus sign (+) or arrow icon, indicating the number of matches in the link’s name (“View 23 more”), indenting differently than the filtering values (i.e. breaking the vertical alignment), and visually fading the last value in the truncated list.
(View large version)
Northern Tool?lists brand filters by popularity when the list is truncated (promoting the most recognizable values). When expanded, the values are listed alphabetically to give predictability. (View large version)
More test findings on proper truncation design are explored further in this article.
KEY TAKEAWAY
Truncate long lists of filtering values (10+), rather than displaying all values or using inline scrollable areas. To ensure that users notice the truncation, display up to 10 values before triggering the truncation, display default values that users are most likely to recognize (i.e. the most popular), and style the truncation link to set it apart from the filtering values.
6. Only 16% Actively Promote Important Filters
Some categories have certain filters that are highly important and beneficial for the user to consider. However, displaying these merely as traditional filters in a filtering sidebar runs the risk of users either overlooking these options or not understanding the importance of making a selection.
Generally, during testing of e-commerce websites, we observed that users view categories as something the website suggests they select, whereas the traditional filtering sidebar options are perceived by most users as being purely optional. Following the principles of persuasive design, most websites, therefore, have a number of categories that need to promote certain filters or filter combinations. Luckily, a clear pattern emerged during testing for how websites can effectively promote a single set of highly important filters — although implementation requires a number of filtering design details to be in place.
When test subjects searched?Amazon, certain scopes would have highly relevant filters promoted atop the product list. This promotion nudged the test subjects towards more informed filtering decisions, instead of browsing overly broad product lists. Besides being promoted atop the product list, the filter values are kept intact in the filtering sidebar (an important detail). (View large version)
For example, if a user navigates to a “movies” category, a highly important filter type to consider would be “format,” with filtering values such as “DVD,” “Bluray” and “digital download” as the types that would be important to most users’ process of selecting a product.
Another example would be a “digital cameras” category, where “camera type” would be a highly important filter to consider, with filtering values such as “point and shoot,” “DSLR,” “mirrorless” and “bridge.”
Promoting a limited and select number of filtering values makes sense only if the vast majority of users either have an interest in or would benefit significantly from applying them. Because a promoted filter encourages users to apply it, use the technique intelligently and sparingly, and avoid luring users into overly narrow filtered lists. For example, don’t simply use the technique website-wide for whatever is the most popular filter in each category. In practice, you will often need to manually curate those categories that have a structure that warrant the use of promoted filters.
?
Walmart?takes the technique one step further and promotes a mix of laptop-size and input-type filters that align well with key purchasing parameters for users looking to buy a laptop. (View large version)
Promoted filters don’t necessarily all need to be of the same type. They could simply be a combination of the most important product filters that users can apply before spending further time investigating the actual product list. Indeed, promoted filters could even apply multiple filters at once to provide the user with a shortcut to popular filter combinations.
Two additional implementation details to consider:
Keep the promoted filtering values in the filtering sidebar, too (i.e. in addition to the “promotion” placement). Because users are trained that a filtering sidebar contains all available filters, the promoted filter must be represented in the filtering sidebar as well, since some users will look for the filtering value there.
Never promote filters using banner-like graphics. A few of the websites we tested had promoted filters that were visually boxed. This caused some of subjects to completely overlook them, even when the boxes contained the very filter type they were looking for — all due to banner blindness.
KEY TAKEAWAY
For select categories where an initial filtering selection would be relevant and would benefit the vast majority of users, consider promoting those few filtering values above the product list (for example, using buttons, text links or thumbnails).
7. Filtering Performance Varies Greatly By Industry
If we look at filtering performance within the major e-commerce industries, we see that performance varies greatly. Below, the seven most dominant e-commerce industries have been plotted as stacked bar charts. The row “acceptable performance” is for reference and depicts the threshold for an “acceptable” (but not good) filtering performance — a minimum based on the typical issues that test subjects encountered. Note that the performance difference takes the industry into account; for example, an apparel website needs fewer filters than an electronics website due to the type of products it carries and, therefore, needs a less advanced design for its filters to achieve a higher score.
(View large version)
Despite having the lowest barrier to provide a good filtering experience, apparel websites notably have the worst performance of all industries for filtering, due to an unfortunate combination of inadequate filtering options and poor filtering interfaces. The subpar filtering interfaces are likely due to a deliberate prioritization of aesthetics over a clear and informative interface (a case of?false simplicity). Despite dealing with a product type that requires only a limited number of filtering types (compared to other industries), many apparel websites lack even basic filtering options, such as for product material and user ratings.
Sports and hobby websites suffer from poor filtering performance as well. While part of the reason is a prioritization of simple website aesthetics, similar to the apparel industry, another cause may be the mix of visual- and spec-driven product verticals in the industry. Many products on these websites tend to be fairly visual (toys, outdoor goods, sports equipment, hobby equipment), yet many also have two to three technical attributes that could completely invalidate themselves if they don’t match the user’s criteria, such as performance, weight and age. Consequently, users will have more complex filtering needs for sports and hobby products than they typically do for regular apparel websites.
The electronics and office industry has historically been one of those e-commerce industries that offer users a broad variety of filters, simply because finding many products would otherwise be nearly impossible for users. When looking closer at the lacklustre filtering performance in electronics and office, the problem is often poor filtering logic and interfaces. Particularly common flaws include the following: allowing only one filtering value to be selected at a time, no user-defined ranges for numeric filters, and a lack of explanation of industry jargon. Despite a generally high number of filter types being offered on several electronics and office websites, the products’ technical nature — several attributes of which are vital to the user’s purchasing decision — still result in a lack of compatibility filters (see section 4 of this article) and a lack of category-specific filtering types (see section 2).
Home and hardware websites offer decent filtering performance. This aligns well with the technical nature of the industry, and the score can be explained by a historical focus on offering sufficient filters (in particular, compatibility filters), which enables users to find the particular washing machine or cordless drill that meets their specific criteria. However, poor product data and a widespread lack of structured product specifications hold back filtering performance.
Health and beauty websites have decent filtering performance as well. In fairness, health and beauty products have fewer key product attributes (quantity being an exception), which means the websites can get away with much simpler filters than ones with highly spec-driven products. E-commerce websites in other industries, therefore, should not model their filtering experience on health and beauty websites because their filtering needs are likely different.
Mass merchants have vast and diverse product catalogs that have strict requirements for product data structures, processing and categorization — all things that can be incredibly difficult to get right. Combine that with a mixed catalog of highly spec-driven and visual product types, and mass merchants have the most complex filtering needs. Yet, it is clear that most mass merchants are aware of these challenges and have made very active efforts to resolve them, often through advanced filtering logic and data post-processing. This leads to a broad variety of filters being offered (including category-specific ones), which is one of the main reasons mass merchant websites achieve the best filtering performance — even taking their users’ more complex filtering requirements into account.
Improving E-Commerce Filtering
Overall, the filtering performance of the websites we benchmarked is passable at best. When it comes to filtering, the majority of even the top e-commerce websites come up short compared to physical retail, where a customer request such as “a light casual spring jacket in size medium” or “a rugged case for this digital camera” isn’t out of the ordinary.
Some websites do actively focus on filtering and spend resources on product tagging. For those websites, many of the lingering filter-related usability issues have to do with aligning user expectations and website implementation (specifically, filtering design and logic). Filtering thus represents an opportunity to vastly improve the return on investment that most large e-commerce vendors have already made in product tagging and data collection.
Filtering on e-commerce websites is a major topic that obviously cannot be fully explored in a single article. However, the filtering insights covered in this article hopefully lay the foundation for understanding the current state of e-commerce filtering and for creating a good filtering experience:
While mediocre filtering performance is often due to a lack of important filtering options, benchmarking also reveals that filtering logic and filtering interfaces cause severe problems for users. When looking at the users’ entire filtering experience, only 16% of the top 50 US e-commerce websites offer a good experience, while 50% offer a passable filtering experience, and 34% have a poor filtering experience, without filters for users’ most basic product preferences.
To ensure filtering availability, always ensure that each category has a unique set of filters specific to the type of products it contains. At a minimum, the product specifications included in the list items will need to be available as filters as well, but a wider array of filters will nearly always be needed. Currently, 42% of the top e-commerce websites lack category-specific filter types for several of their core product verticals.
Identify and offer key thematic filters unique to the website and product-type context. These will often need to be category-specific, and common omissions are a lack of style, usage context or purchase selection parameters. Currently, 20% lack thematic filters.
Any product category that contains compatibility-dependent products (accessories, integrated systems, spare parts, consumables, etc.) will need a compatibility filter. This is often a filter that allows the user to specify a model name and number, but it could also be a filter for a more generic specification, such as a filter for size, capacity or power. Currently, 32% of websites that sell compatibility-dependent products lack compatibility filters.
Long lists of filtering values (10+) should be truncated rather than be displayed in full (as 2% do) or use inline scrollable areas (24%). To ensure that users notice the truncation, do a few things: display up to 10 values before the truncation sets in; make sure the default displayed values are the values that users are most likely to recognize (i.e. the most popular); and style the truncation link itself to set it apart from the filtering values.
For select categories where an initial filtering selection would be relevant and would benefit the vast majority of users, consider promoting those few filtering values above the product list (for example, using buttons, text links or thumbnails). Currently, only 16% actively promote highly important filters on top of the product list.
Filtering performance varies greatly by industry, and the key players in your industry might not be a good source of inspiration. Even when adjusted for the different levels of filtering needs, websites in the apparel, electronics and sports industries are significantly behind in the filtering experience offered by mass merchant and hardware websites.
