Audyt karty produktu: najlepsze praktyki UX, które realnie zwiększają konwersję

Podstawą jest oczywiście wydajność. Każdy ułamek sekundy ma znaczenie, co potwierdza m.in. słynne już w branży badanie Milliseconds Make Millions, przeprowadzone kilka lat temu przez Deloitte, które pokazało, że skrócenie czasu ładowania strony o zaledwie 0,1 s potrafi zwiększyć konwersję średnio o 8,4%.

Audyt wydajności najlepiej będzie oprzeć na metrykach Core Web Vitals; bardzo dobrze opisują one podstawowe aspekty działania strony.

Druga kwestia – jakie konkretnie informacje znajdą się na karcie produktu.

Najważniejsze są tu dwie integracje: z systemem PIM oraz ERP. Ten pierwszy powinien pełnić funkcję „hubu” do zarządzania opisami produktów, specyfikacją techniczną oraz zdjęciami. Warto zwłaszcza przyjrzeć się, jak są zorganizowane dane w PIM: czy są kompletne, czy wszystkie nazwy są ze sobą spójne oraz czy atrybuty przypisane do produktów mają sens w obrębie swojej kategorii. Klienci tego po prostu oczekują i trzeba im to zapewnić.

Użytkownicy wymagają także tego, by na karcie produktu widoczna była jego dostępność. To jedna z wielu ról systemu ERP, który powinien być ściśle zintegrowany ze stroną sklepu, tak aby na bieżąco przesyłać informacje o stanach magazynowych. Trudno wyobrazić sobie bardziej frustrującą sytuację dla kupującego, niż gdy złoży zamówienie, a po kilku godzinach otrzyma maila z informacją, że produktów jednak nie ma na stanie.

Jasne jest, że inaczej powinna wyglądać karta produktu, jeśli skupiasz się na kliencie detalicznym, a inaczej, jeśli prowadzisz sprzedaż B2B. Klienci biznesowi raczej rzadko zamawiają pojedyncze sztuki – zazwyczaj zamówienie składa się z kilku pozycji, w różnych konfiguracjach i większych ilościach… ale to nie znaczy, że nie oczekują, aby cały proces zakupowy przebiegał na tyle sprawnie, na ile to możliwe.

Na co warto zwrócić uwagę?

• Dobrym pomysłem jest umieszczenie na karcie tabeli wariantów – powinna zawierać rozpisane kombinacje atrybutów danego produktu, odpowiadające im numery SKU, ceny oraz dostępność, tak, aby były widoczne bez konieczności przeklikiwania się między kartami dla różnych wersji.
• Dane o dostępności powinny być bardziej szczegółowe niż przy sprzedaży detalicznej – dla kupującego ważna jest nie tylko informacja, ile towaru, co do sztuki, może w danym momencie zamówić, ale też np. z jakiego magazynu go dostanie. A jeśli produktu nie ma na stanie – kiedy będzie znów dostępny.
• Jeśli na stronie ma pojawić się konfigurator produktów, trzeba zadbać o jego responsywność – klient nie może czekać kilku sekund na odpowiedź serwera przy każdej zmianie parametrów.

Dobry projekt często można poznać po tym, jak strona reaguje na interakcje, na przykład co się dzieje, gdy użytkownik kliknie "Dodaj do koszyka". Podczas audytu UX karty produktu trzeba się takim szczegółom przyjrzeć – są to małe elementy, ale gdy ich brakuje, zadowolenie klientów maleje.

Jakie rozwiązania sprawdzą się w niemal każdym sklepie?

• Przycisk „Dodaj do koszyka" powinien się „blokować” na chwilę po kliknięciu, tak aby system mógł potwierdzić akcję użytkownika, a klient nie dodał przypadkiem tego samego produktu do koszyka dwa czy trzy razy.
• Gdy produkt trafi już do koszyka, trzeba to jasno potwierdzić. Można to zrobić albo w formie powiadomienia, albo wyświetlając pop-up z aktualną zawartością koszyka i przyciskiem „Przejdź do płatności” w rogu ekranu.
• Jeśli produkt ma kilka wariantów – powiedzmy, różne rozmiary – ale któreś z nich są niedostępne, nie należy ich ukrywać, tylko wygasić lub przekreślić. Klient powinien wiedzieć, że takie opcje są w katalogu sklepu.
• Pola, w których użytkownik może wpisać liczbę sztuk produktu, powinny mieć wbudowaną walidację i od razu informować, jeśli wprowadzona wartość przekracza stany magazynowe lub limit narzucony przez sklep.

Między „dobrym UX” a „dobrym SEO” jest sporo wspólnych punktów. Boty Google, podobnie jak użytkownicy, potrzebują czytelnie zorganizowanych informacji na karcie produktu. Muszą dostać jasną informację, gdzie jest aktualna cena produktu, a gdzie ta sprzed 30 dni, do jakiej kategorii należy produkt albo czy jest w danym momencie dostępny.

Do tego służą dane strukturalne schema.org. Najlepiej jest umieścić je – a konkretnie znacznik Product, dla którego da się opisać kilkadziesiąt różnych parametrów – w kodzie HTML każdej karty produktu, jaka znajduje się w sklepie. Z jednej strony pomoże to botom wyszukiwarek jednoznacznie zinterpretować treść pod danym adresem. Z drugiej – pozwoli Google wygenerować w wynikach wyszukiwania bardziej rozbudowany opis produktu z informacją o jego cenie, recenzjach i tak dalej… co może przyciągnąć do sklepu bardziej zainteresowanych zakupem użytkowników.