Konwersja i UX

Długi opis w PrestaShop: zakładki, akordeon czy strona ciągła?

Opis produktu liczący 800 słów można przedstawić na trzy sposoby. Wybór wygląda na estetyczny, w rzeczywistości jest kompromisem między czytelnością na telefonie, indeksowaniem a ilością informacji faktycznie przyswojonej.

Ten artykuł porównuje trzy struktury. Techniczne wdrożenie zakładek zostało omówione osobno.

Trzy struktury

Strona ciągła. Cała treść wyświetla się jedna po drugiej, z nagłówkami porządkującymi. Odwiedzający przewija.

Zakładki. Treść jest rozdzielona na sekcje, z których widoczna jest tylko jedna naraz, wybierana poziomymi etykietami.

Akordeon. Sekcje ułożone są pionowo, każda rozwija się w swoim miejscu.

Te trzy formy nie są wymienne: wywołują różne i mierzalne zachowania czytelnicze.

O czytaniu na telefonie

To kryterium najbardziej rozstrzygające i eliminuje jedną opcję.

Poziome zakładki nie mieszczą się na szerokości telefonu powyżej trzech krótkich etykiet. Obejścia, przewijanie poziome albo skracanie etykiet, pogarszają obsługę: ostatnie sekcje stają się niewidoczne i nigdy nie zostają otwarte.

Akordeon to natywny format telefonu. Każda sekcja to blok na pełną szerokość, otwarcie następuje w miejscu, a odwiedzający zachowuje punkt odniesienia.

Strona ciągła sprawdza się na telefonie pod jednym warunkiem: treść nie może być nadmiernie długa. Powyżej 1000 słów odwiedzający nie znajduje już szukanej informacji i nie ma jak przeskoczyć do właściwej sekcji.

Najbardziej rozpowszechniony i najskuteczniejszy kompromis: zakładki na komputerze, akordeon na telefonie, z tą samą treścią i tą samą strukturą HTML.

O indeksowaniu

Wbrew rozpowszechnionemu przekonaniu trzy formaty są równoważne z punktu widzenia indeksowania, pod jednym warunkiem: treść musi znajdować się w podanym kodzie HTML.

Treść ukryta stylami wciąż jest czytana. Treść wczytywana po kliknięciu przez wywołanie asynchroniczne nie istnieje w chwili pierwszej analizy.

Istotny niuans: Google podaje, że traktuje treść ukrytą za interakcją jako mającą mniejszą wagę. Nie dyskwalifikuje jej to, ale daje niewielką przewagę stronie ciągłej i akordeonowi z otwartą pierwszą sekcją.

Praktyczny wniosek: to, co niesie wasze pozycjonowanie, zwykle pierwsza trzecia część opisu, musi pozostać rozwinięte niezależnie od wybranej struktury.

Zakładki Karty Produktu PrestaShop 8 i 9: Menedżer Przeciągnij i UpuśćZakładki karty produktu na miarę, porządkowane przeciąganiem.79,00

O ilości przeczytanej treści

Tu różnice są najwyraźniejsze i idą w kierunku wbrew intuicji.

Na stronie ciągłej współczynnik przewijania spada regularnie. Znaczna część odwiedzających dociera do pierwszej trzeciej, mniejszość schodzi do dołu strony. Ale ci, którzy schodzą, czytają wszystko, co napotkają po drodze.

Przy zakładkach pierwszą widzi niemal każdy odwiedzający, a kolejne znacznie mniejszy ułamek. Różnica między pierwszą a drugą jest brutalna.

Przy akordeonie zachowanie leży pośrodku: etykiety wszystkich sekcji są widoczne, co pozwala odwiedzającemu wypatrzyć to, co go interesuje, i otwierać wybiórczo.

Użyteczny wniosek: zakładki nie sprawiają, że czyta się więcej, sprawiają, że się wybiera. Jeśli waszym celem jest, by zobaczono maksimum informacji, lepsza jest strona ciągła. Jeśli waszym celem jest, by odwiedzający szybko znalazł konkretną szukaną informację, wygrywa akordeon.

Zasada decyzyjna

Trzy kryteria, stosowane w tej kolejności.

Długość treści. Poniżej 400 słów narzuca się strona ciągła: dzielenie tak małej ilości tekstu dokłada kliknięcia bez korzyści. Powyżej 800 słów podział staje się konieczny.

Charakter treści. Jeśli wasze sekcje są sekwencyjne, to znaczy czyta się je po kolei i wzajemnie się dopełniają, zostawcie stronę ciągłą: podzielenie wywodu go łamie. Jeśli są niezależne — skład, konserwacja, dostawa, gwarancja — podział jest naturalny.

Zachowanie waszych odbiorców. W katalogu technicznym, gdzie klient przychodzi po konkretną daną, przeważa bezpośredni dostęp do sekcji. W katalogu, gdzie trzeba przekonać, przeważa lektura liniowa.

Struktura mieszana

To działa najlepiej w praktyce i rzadko bywa wdrażane.

Treść handlowa, ta, która budzi ochotę i niesie pozycjonowanie, zostaje rozwinięta na stronie ciągłej, pod blokiem zakupu. Liczy od 200 do 400 słów.

Treść weryfikacyjna — parametry, skład, zgodności, dostawa — trafia niżej do akordeonu. Odwiedzający sięga po nią, gdy jej potrzebuje.

Ten podział podąża za rzeczywistą ścieżką: najpierw czyta się, by się przekonać, potem sprawdza, by zweryfikować. Unika też głównej wady zakładek, czyli zakopania argumentacji za kliknięciem.

Błędy, których należy unikać

Zwinięcie wszystkiego. Karta, w której nawet opis handlowy jest za kliknięciem, pokazuje pustą stronę pod ceną. Odwiedzający nie ma czego czytać i wychodzi.

Podział na zbyt wiele sekcji. Powyżej pięciu etykiety zamieniają się w menu, a odwiedzający nie otwiera żadnej.

Nieprecyzyjne etykiety. „Informacje dodatkowe” nic nie mówią. „Skład i konserwacja” wskazuje dokładnie, co się tam znajduje, co podnosi współczynnik otwarć.

Treść wczytywana po kliknięciu. Patrz wyżej: psuje indeksowanie bez realnej korzyści wydajnościowej przy tekście.

Pomiar na własnym katalogu

Trzy odczyty pozwalają rozstrzygnąć bez zgadywania.

Głębokość przewijania, z trzema progami: 25 %, 50 %, 75 % strony. Na stronie ciągłej mówi wam, gdzie czytelnik odpada.

Współczynnik otwarć na sekcję, przy formatach zwiniętych. Sekcja nigdy nieotwierana jest albo źle nazwana, albo zbędna.

Porównany współczynnik konwersji między dwiema równoważnymi kategoriami wyposażonymi inaczej, w porównywalnym okresie. To jedyny test, który naprawdę rozstrzyga, i wymaga dostatecznie jednorodnego katalogu.

Moduł Zakładki Karty Produktu dla PrestaShop pozwala wdrożyć te struktury w PrestaShop 8 i 9: konfiguracja na kategorię produktu, automatyczne przełączenie na akordeon na telefonie, treść podana w HTML, by pozostała indeksowalna, oraz wybór sekcji pozostawianych rozwiniętych.

Czytaj dalej

Powiązane artykuły