Conversão e UX

Descrição longa no PrestaShop: separadores, acordeões ou página contínua, o que escolher?

Uma descrição de produto de 800 palavras pode ser apresentada de três formas. A escolha parece estética, mas é na realidade um arbítrio entre a legibilidade em mobile, a indexação e a quantidade de informação realmente consumida.

Este artigo compara as três estruturas. A implementação técnica dos separadores foi tratada à parte.

As três estruturas

A página contínua. Todo o conteúdo aparece seguido, com títulos a estruturar. O visitante desloca-se.

Os separadores. O conteúdo é repartido por secções, uma única visível de cada vez, selecionada por títulos horizontais.

O acordeão. As secções estão empilhadas na vertical, abrindo-se cada uma no lugar.

Estas três formas não são intercambiáveis: produzem comportamentos de leitura diferentes e mensuráveis.

Na leitura em mobile

É o critério mais discriminante, e elimina uma opção.

Os separadores horizontais não cabem na largura de um telemóvel acima de três títulos curtos. As soluções de contorno, deslocamento horizontal ou títulos truncados, degradam o uso: as últimas secções ficam invisíveis e nunca são abertas.

O acordeão é o formato nativo do mobile. Cada secção é um bloco de largura total, a abertura faz-se no lugar, e o visitante mantém a sua referência.

A página contínua funciona bem em mobile com uma condição: que o conteúdo não seja excessivamente longo. Acima de 1000 palavras, o visitante deixa de encontrar a informação que procura e não tem forma de saltar para a secção certa.

O compromisso mais difundido, e o mais eficaz: separadores em computador, acordeão em mobile, com o mesmo conteúdo e a mesma estrutura HTML.

Na indexação

Ao contrário de uma ideia difundida, os três formatos são equivalentes do ponto de vista da indexação, com uma única condição: que o conteúdo esteja presente no código HTML servido.

Um conteúdo ocultado por estilo continua a ser lido. Um conteúdo carregado ao clique por uma chamada assíncrona não existe no momento da análise inicial.

A nuance que conta: o Google indica tratar o conteúdo ocultado atrás de uma interação como tendo menor peso. Isso não o desqualifica, mas dá uma vantagem marginal à página contínua e ao acordeão com a primeira secção aberta.

Consequência prática: aquilo que carrega o seu posicionamento, geralmente o primeiro terço da descrição, tem de ficar aberto seja qual for a estrutura escolhida.

Separadores da Ficha de Produto PrestaShop: Gestor por Arrastar e LargarSeparadores de ficha de produto à medida, reorganizados por arrastar e largar.79,00

Na quantidade lida

É aqui que os desvios são mais nítidos, e vão num sentido contraintuitivo.

Em página contínua, a taxa de deslocamento decresce de forma regular. Uma parte importante dos visitantes chega ao primeiro terço, uma minoria desce até ao fim da página. Mas quem desce lê tudo o que encontra pelo caminho.

Em separadores, o primeiro separador é visto pela quase totalidade dos visitantes, e os seguintes por uma fração bem mais baixa. A diferença entre o primeiro e o segundo é brutal.

Em acordeão, o comportamento fica entre os dois: os títulos de todas as secções estão visíveis, o que permite ao visitante identificar o que lhe interessa e abrir seletivamente.

A conclusão útil: os separadores não fazem ler mais, fazem escolher. Se o seu objetivo é que o máximo de informação seja vista, a página contínua é melhor. Se o objetivo é que o visitante encontre depressa a informação precisa que procura, ganha o acordeão.

A regra de decisão

Três critérios, a aplicar por esta ordem.

O comprimento do conteúdo. Abaixo de 400 palavras, a página contínua impõe-se: dividir tão pouco texto acrescenta cliques sem benefício. Acima de 800 palavras, a divisão torna-se necessária.

A natureza do conteúdo. Se as suas secções são sequenciais, ou seja leem-se por ordem e respondem umas às outras, mantenha a página contínua: dividir um raciocínio parte-o. Se são independentes, composição, conservação, entrega, garantia, a divisão é natural.

O comportamento da sua audiência. Num catálogo técnico em que o cliente vem buscar um dado preciso, o acesso direto por secção é prioritário. Num catálogo em que é preciso convencer, a leitura linear é prioritária.

A estrutura mista

É o que funciona melhor na prática, e raramente é implementado.

O conteúdo comercial, o que dá vontade e que carrega o posicionamento, fica aberto em página contínua, sob o bloco de compra. Tem 200 a 400 palavras.

O conteúdo de verificação, características, composição, compatibilidades, entrega, passa para acordeão por baixo. O visitante vai lá se precisar.

Esta repartição segue o percurso real: primeiro lê-se para se convencer, depois consulta-se para verificar. Evita também o principal defeito dos separadores, que é enterrar o argumentário atrás de um clique.

Os erros a evitar

Fechar tudo. Uma ficha em que até a descrição comercial está atrás de um clique apresenta uma página vazia sob o preço. O visitante não tem nada para ler e vai-se embora.

Dividir em demasiadas secções. Acima de cinco, o título torna-se um menu e o visitante não abre nenhuma.

Os títulos vagos. «Informações complementares» não diz nada. «Composição e conservação» indica com precisão o que lá se encontra, o que aumenta a taxa de abertura.

O conteúdo carregado ao clique. Ver acima: compromete a indexação sem benefício real de desempenho em texto.

Três registos permitem decidir sem adivinhar.

A profundidade de deslocamento, marcando três limiares: 25 %, 50 %, 75 % da página. Numa página contínua, diz-lhe onde o leitor desiste.

A taxa de abertura por secção, nos formatos fechados. Uma secção nunca aberta está ou mal intitulada ou a mais.

A taxa de conversão comparada entre duas categorias equivalentes equipadas de forma diferente, num período comparável. É o único teste que decide mesmo, e exige um catálogo suficientemente homogéneo.

O módulo Separadores da Ficha de Produto para PrestaShop permite implementar estas estruturas no PrestaShop 8 e 9: configuração por categoria de produto, passagem automática a acordeão em mobile, conteúdo servido no HTML para continuar indexável, e escolha das secções deixadas abertas.

Continuar a ler

Artigos relacionados