Uczyń decyzję zakupową widoczną nad foldem
Zacznij od konkretnej nazwy, wybranego wariantu, bieżącej ceny i waluty, dostępności, krótkiego wyjaśnienia wartości oraz wyraźnego przycisku zakupu. Nie każ kupującemu domyślać się, czy zdjęcie przedstawia domyślny produkt czy wybrany kolor albo rozmiar. Jeśli cena, dostępność lub czas realizacji zmieniają się w zależności od wariantu, zaktualizuj je natychmiast i nazwij wybór w tekście.
W pierwszym widoku odpowiedz na główną przeszkodę decyzyjną: dopasowanie i materiał w przypadku odzieży; kompatybilność, wymiary, zasilanie lub zawartość w przypadku sprzętu. Umieść specyfikacje, instrukcję pielęgnacji, gwarancję i zwroty w przewidywalnych, dostępnych z klawiatury sekcjach.
Pokaż wybrany rozmiar, kolor, konfigurację lub okres obok ceny i przycisku zakupu. Wyjaśniaj niedostępne kombinacje zamiast pozwalać, by kontrolka bezgłośnie zawiodła.
Wskaż precyzyjnie cenę promocyjną, cenę dla członków, cenę jednostkową i okresowe opłaty. Podaj warunki materialne, takie jak wymóg członkostwa czy progi ilościowe.
Używaj mediów i tekstu, by rozwiać właściwe wątpliwości
Nadaj każdemu obrazowi lub wideo konkretną rolę: pokaż skalę, materiał, dopasowanie, porty, dołączone części, użycie w kontekście lub zbliżenie istotne dla decyzji. Sparuj je z tekstem, który nazywa przedmiot, dla kogo jest przeznaczony i ograniczenia materiałowe. Lista cech nie zastępuje szczegółów dotyczących kompatybilności czy pielęgnacji.
Napisz alternatywy tekstowe dla informacji lub funkcji, które reprezentuje obraz. W3C rozróżnia obrazy dekoracyjne, które mogą mieć pusty atrybut alt, od obrazów funkcyjnych będących przyciskami, których alt powinien opisać akcję. W galeriach przekaż szczegóły potrzebne do rozróżnienia obrazów.
Gdy opcja zmienia wygląd lub sprzęt, zmień główne media i oznacz je. Nie sugeruj, że akcesorium jest w zestawie, gdy nim nie jest.
Opisz produkt i wyróżniającą cechę, gdy obraz wspiera wybór, na przykład „zielony płaszcz z wełny, widok z przodu.”
Uczyń warianty, zapasy, wysyłkę i zwroty jednym prawdziwym systemem
Wariant to możliwa do kupienia wersja, jak rozmiar, kolor, materiał czy konfiguracja. Jego SKU, cena, dostępność, obraz i oczekiwania realizacyjne mogą się różnić. Uczyń dostępne wybory i zmiany klarownymi. Nie ogłaszaj „dostępne” dla całej rodziny produktów, gdy wybrana kombinacja jest niedostępna.
Podaj obietnicę wysyłki, którą twoja operacja faktycznie może wesprzeć: okno obsługi, przewoźnik lub szacowany termin przybycia, ograniczenia destynacji i wykluczenia wpływające na koszty. Podlinkuj pełną politykę zwrotów i wyróżnij warunki materialne. FTC mówi, że sprzedawcy online w USA muszą mieć rozsądne podstawy dla wyraźnych lub dorozumianych deklaracji dotyczących wysyłki; prawo różni się w zależności od rynku, więc miej kwalifikowanych recenzentów oceniających zlokalizowane twierdzenia.
Zmapuj odpowiedzialność za atrybuty katalogowe, sprzedawalne zapasy, cenę i kwalifikowalność dostawy. Dokumentuj aktualizacje dla korekt stanu, końca promocji, opóźnień i ograniczeń przewoźnika.
Jeśli obliczenie stanu magazynowego lub dostawy jest niedostępne, zapobiegaj wprowadzającej w błąd obietnicy. Użyj jasnego fallbacku, poproś o potwierdzenie albo tymczasowo usuń dotkniętą ofertę.
Pokaż recenzje jako dowód, nie dekorację
Wyeksponuj ocenę, liczbę recenzji i ścieżkę do pełnego zestawu opinii tam, gdzie pomagają w ocenie. Pozwalaj kupującym filtrować tylko wtedy, gdy filtr jest dokładny. Nie przedstawiaj wybranej przez sprzedawcę, edytowanej lub opłaconej recenzji jako niezależnego dowodu bez wymaganych ujawnień.
Reguła FTC dotycząca opinii i rekomendacji konsumenckich odnosi się do wprowadzających w błąd i nieuczciwych praktyk związanych z recenzjami. Wytyczne personelu FTC mówią, że kontekst ma znaczenie i nie stanowi bezpiecznej przystani. Zachowuj źródła i zasady wyświetlania, ujawniaj istotne relacje tam, gdzie wymagane, i eskaluj programy zachęt, moderacji, tłumienia lub testimoniali do przeglądu prawnego. To jest wskazówka edukacyjna, nie porada prawna.
Trzymaj recenzje produktu z produktem i odróżniaj recenzje sklepu. Jeśli wariant zmienia wydajność lub dopasowanie, udostępnij ten kontekst w sposób odkrywalny.
Nie kupuj, nie pisz ani nie uzależniaj zachęty od pozytywnych opinii. Zachowuj zapisy do badania podejrzanych recenzji i dokumentuj moderację.
Dodawaj dane strukturalne dopiero, gdy widoczne fakty są wiarygodne
Dane strukturalne (structured data) to maszynowo odczytywalne informacje ze strony. Google dokumentuje znaczniki Product i Offer dla list produktów, w tym cenę, dostępność, wysyłkę i zwroty. Mogą one uczynić stronę kwalifikowalną do bogatszych doświadczeń zakupowych, ale sposób ich prezentacji zależy od Google; znacznik nie gwarantuje wyniku w wynikach wyszukiwania ani innego traktowania.
Dla wariantów Google dokumentuje ProductGroup i powiązane znaczniki Product. Dopasuj każdą oznakowaną ofertę do kupowanego wariantu i adresu URL oraz wyrównaj widoczną stronę, znacznik i feed sprzedawcy. Waliduj za pomocą Google Rich Results Test przed wydaniem i po zmianach szablonu.
Pomiń właściwość, gdy jej informacje są nieznane lub nieutrzymywane. Błędne dane o cenie, stanie magazynowym lub polityce nadszarpną zaufanie.
Uwzględnij testy danych strukturalnych w procesie wdrożenia szablonu produktu. Przetestuj proste oferty, oferty promocyjne, brak stanu magazynowego i oferty z ograniczeniami destynacji.
Chroń ścieżkę zakupu strony zanim ruch ją wystawi
Na wielu stronach produktowych największym widocznym elementem są media hero. Largest Contentful Paint (LCP) mierzy, kiedy największy obraz lub blok tekstu w widoku zostaje wyrenderowany. web.dev zaleca dążyć do LCP 2,5 sekundy lub mniej dla 75. percentyla wizyt i mówi, że dane z rzeczywistych użytkowników są właściwą miarą. Użyj tego celu do badania, a nie jako deklaracji ukończenia strony.
Mierz odpowiedź produktu, główne media, interakcję z wariantami, dodanie do koszyka oraz ich zależności. Optymalizuj największe opóźnienie zamiast tylko kompresować obrazy; LCP może być ograniczone przez odpowiedź serwera, opóźnienie ładowania zasobu, czas trwania zasobu lub opóźnienie renderowania. Zarezerwuj przestrzeń dla mediów i bloków dynamicznych, by kontrolki nie przesuwały się.
Ustal limity dla głównych mediów, skryptów stron trzecich i kluczowych interakcji. Testuj stronę z produkcyjnymi ustawieniami pamięci podręcznej zimnej oraz typowymi warunkami mobilnymi przed promocją.
Przeprowadź preflight wysokowartościowych stron i zależności, wyznacz właściciela i możliwość rollbacku, a następnie napraw powtarzające się przyczyny, takie jak za duże media, blokujący skrypt lub przestarzałe dane magazynowe.