En produktlistningssida presenterar en uppsättning artiklar från en kategori, sökning eller filtrerat urval, vilket gör det möjligt för en besökare att jämföra alternativ och välja ett att granska i detalj. Den ligger mellan navigering och produktdetaljsidan, och dess funktion är att hjälpa någon att begränsa en uppsättning effektivt snarare än att beskriva en enskild artikel fullständigt.
Designfrågan är vilken information varje kort måste innehålla för att en besökare ska kunna avgöra om en vara förtjänar närmare uppmärksamhet. För lite tvingar alla att öppna flera detaljsidor och återvända, vilket är långsamt och orsakar övergivande. För mycket gör sidan kompakt och långsam att skanna, vilket omintetgör jämförelsens syfte. Rätt uppsättning är kategorispecifik: kläder behöver storlekstillgänglighet och färgalternativ, elektronik behöver viktiga specifikationer, tjänster behöver prisbas och varaktighet.
Standardsortering är ett av de mest betydelsefulla besluten på sidan och fattas ofta utan eftertanke. De flesta besökare ändrar aldrig sorteringsordningen, så det som visas först avgör vad de flesta ser och köper. Sortering efter relevans kräver en definition av relevans, sortering efter popularitet befäster befintliga bästsäljare, och sortering efter pris stigande tränar besökare att förvänta sig det billigaste alternativet. Varje standard formar beteendet, och valet bör vara medvetet och testat.
Filterintegration avgör om stora mängder förblir navigerbara, och det är i interaktionen mellan filtrering och listning som användbarhetsproblemen koncentreras. Filter som laddar om sidan och förlorar rullningsposition, som inte anger hur många objekt varje alternativ skulle returnera, eller som inte kan tas bort individuellt, gör alla avgränsningen frustrerande. På mobila enheter, där filter måste döljas bakom en kontroll, är avvägningarna tydligare och motiverar explicit testning.
Pagineringsmetoden påverkar både användbarhet och sökresultat. Traditionell paginering ger en känsla av skala och möjliggör återgång till en specifik position, oändlig scrollning passar för surfning men gör det omöjligt att nå något under listan och kan förstöra bakåtknappen, och "läs mer"-knappar sitter mellan de två. För webbplatser som är beroende av söktrafik är det viktigt att säkerställa att produkter djupt inne i en uppsättning förblir tillgängliga via sökbara länkar oavsett vilken interaktion som väljs.
Varuhantering är det kommersiella lagret över presentationen. Företag behöver marknadsföra säsongsbetonade sortiment, prioritera varor med högre marginaler, lyfta fram nya varor och undertrycka varor som är slut i lager eller utgår. Detta kräver verktyg som låter varuförsäljare justera beställningen utan ingenjörsinblandning, och återhållsamhet i användningen, eftersom en lista som helt ordnas efter kommersiella preferenser snarare än relevans inte längre hjälper kunden att välja.
Prestanda är oproportionerligt viktigt här eftersom dessa sidor innehåller många bilder och många interaktiva element. En listningssida som laddar dussintals produktbilder utan responsiv leverans och uppskjutning är bland de tyngsta sidorna på de flesta webbplatser, och de besökare som drabbas mest är de som har mobila anslutningar och surfar på en kategori, vilket är precis det beteende som sidan finns för att stödja.
Eftersom sidan kombinerar informationsdesign, sökrelevans, merchandising och prestanda, gynnas den av att behandlas som ett system snarare än en mall. I praktiken utformas kortinnehållet och interaktionen genom produktdesign informerad av användarundersökning, sorterings- och filtreringsbeteendet valideras av en CRO-tjänst program, och i textil- och klädkategorier är tillgänglighets- och variantinformationen på varje kort ofta skillnaden mellan en användbar lista och en frustrerande.