Strona z listą produktów prezentuje zestaw produktów z kategorii, wyszukiwania lub filtrowanego wyboru, umożliwiając odwiedzającemu porównanie opcji i wybranie jednej do szczegółowego przeanalizowania. Znajduje się ona pomiędzy nawigacją a stroną ze szczegółami produktu, a jej funkcją jest pomoc użytkownikowi w efektywnym zawężeniu zestawu, a nie w pełnym opisie pojedynczego produktu.
Pytanie projektowe brzmi: jakie informacje musi zawierać każda karta, aby odwiedzający mógł zdecydować, czy dany produkt zasługuje na bliższą uwagę? Zbyt mało informacji zmusza wszystkich do otwierania kilku stron ze szczegółami i wracania do nich, co jest powolne i prowadzi do porzucenia strony. Zbyt dużo informacji sprawia, że strona jest zatłoczona i wolniej się ją przegląda, co niweczy cel porównania. Prawidłowy zestaw informacji jest specyficzny dla danej kategorii: odzież wymaga dostępności rozmiarów i kolorów, elektronika wymaga kluczowych specyfikacji, a usługi – ceny i czasu trwania.
Domyślne sortowanie jest jedną z najważniejszych decyzji na stronie i często jest podejmowane bez zastanowienia. Większość odwiedzających nigdy nie zmienia kolejności sortowania, więc to, co pojawi się jako pierwsze, decyduje o tym, co większość osób zobaczy i kupi. Sortowanie według trafności wymaga zdefiniowania trafności, sortowanie według popularności utrwala istniejące bestsellery, a sortowanie według ceny rosnącej uczy odwiedzających, że oczekują najtańszej opcji. Każde domyślne ustawienie kształtuje zachowanie, a wybór powinien być przemyślany i sprawdzony.
Integracja filtrowania decyduje o tym, czy duże zestawy pozostają nawigowalne, a interakcja między filtrowaniem a listowaniem to obszar, w którym koncentrują się problemy z użytecznością. Filtry, które przeładowują stronę i tracą pozycję przewijania, które nie wskazują, ile elementów zwróci każda opcja, lub których nie można usunąć pojedynczo, sprawiają, że zawężanie jest frustrujące. Na urządzeniach mobilnych, gdzie filtry muszą być ukryte za kontrolką, kompromisy są bardziej istotne i wymagają szczegółowych testów.
Podejście do paginacji wpływa zarówno na użyteczność, jak i widoczność w wyszukiwarce. Tradycyjna paginacja daje poczucie skali i umożliwia powrót do określonej pozycji, przewijanie w nieskończoność ułatwia przeglądanie, ale uniemożliwia dotarcie do czegokolwiek poniżej listy i może zepsuć przycisk Wstecz, a przyciski „Załaduj więcej” znajdują się pomiędzy nimi. W przypadku witryn zależnych od ruchu z wyszukiwarek, zapewnienie, że produkty znajdujące się głęboko w zestawie pozostają dostępne za pośrednictwem linków indeksujących, ma znaczenie, niezależnie od wybranej interakcji.
Kontrola merchandisingu to warstwa komercyjna nad prezentacją. Firmy muszą promować asortyment sezonowy, priorytetowo traktować produkty o wyższej marży, eksponować nowości i ograniczać sprzedaż produktów niedostępnych w magazynie lub wycofanych z produkcji. Wymaga to narzędzi, które pozwolą sprzedawcom dostosowywać zamówienia bez ingerencji inżynierów, a także powściągliwości w ich stosowaniu, ponieważ oferta uporządkowana wyłącznie według preferencji handlowych, a nie według trafności, przestaje pomagać klientom w wyborze.
Wydajność jest tutaj niezwykle ważna, ponieważ strony te zawierają wiele obrazów i elementów interaktywnych. Strona z ofertą, która ładuje dziesiątki obrazów produktów bez responsywnego dostarczania i opóźniania, jest jedną z najbardziej obciążonych stron na większości witryn, a najbardziej dotknięci są użytkownicy korzystający z urządzeń mobilnych i przeglądający kategorie – właśnie takie zachowanie ma wspierać ta strona.
Ponieważ strona łączy w sobie projektowanie informacji, trafność wyszukiwania, merchandising i wydajność, korzysta z traktowania jej jako systemu, a nie szablonu. W praktyce treść i interakcja karty są projektowane poprzez projekt produktu poinformowany przez badania użytkownikówzachowanie sortowania i filtrowania jest weryfikowane przez Usługa CRO program i w włókienniczy i kategorii odzieży informacje o dostępności i wariantach na każdej karcie często decydują o tym, czy oferta będzie przydatna, czy frustrująca.