Por que não uso carrossel em home page?

Esses dias estava refazendo o layout da home do site de uma empresa e precisei tomar uma decisão a respeito do conteúdo da área above the fold. O que seria melhor: utilizar carrossel ou um hero banner?

Se por um lado com o carrossel o design teria mais conteúdo em uma fatia tão nobre do site, por outro ter muito conteúdo em um espaço não é garantia que as pessoas vão parar e ver todas as informações.

A primeira seção do site tem o propósito de apresentar ao usuário o que a página oferece. Se um dos slides do carrossel transmitir uma mensagem muito específica, isso pode causar confusão, levando o usuário a acreditar que a página se limita ao conteúdo mostrado em apenas uma parte do carrossel. Isso pode ser prejudicial, especialmente quando um dos objetivos da empresa com o site é se tornar mais conhecida.

“Quase todos os testes que gerenciei mostraram que o conteúdo entregue por meio de carrosséis é ignorado pelos usuários. Poucos interagem com eles.” Adam Fellowes

Um exemplo disso é a página inicial do Instituto Unibanco, que utiliza um carrossel na área principal para exibir os projetos nos quais está envolvido. Essa abordagem parece direcionada a um público que já conhece o Instituto e visita o site em busca de novidades. No entanto, tenho dúvidas sobre sua eficácia, pois parece mais vantajoso divulgar esses conteúdos em newsletters ou em outras seções do site. Essa estratégia pode excluir usuários que não sabem que o Instituto atua para melhorar a educação pública no Brasil. É como recortar um pedaço aleatório de uma fala e postar na internet, criando espaço para o usuário interpretar como quiser.

Home do Instituto Unibanco

No caso específico que eu estava trabalhando o objetivo principal da empresa com a mudança da home era fazer com que os usuários entendessem de cara como ela poderia ajuda-los. Preguei então a palavra do menos é mais: preferi reduzir a carga mental do usuário e ter certeza que o seu foco estivesse na coisa certa, então optei por um hero banner.

O carrossel não funciona em qualquer contexto?

Entendo também que a depender do conteúdo dos slides do carrossel e do tipo de site pode ser que essa estratégia funcione. Por exemplo, se a página for um e-commerce e os slides forem uma coletânea de promoções, o usuário que já entrou no site com a intenção de compra pode se sentir atraído a deslizar pelo carrossel na mesma lógica de quem garimpa por promoções em uma loja física.

A animação dos slides ou o excesso de informação em uma seção do site são características que aproximam a estrutura do carrossel a anúncios, o que pode explicar por que esse tipo de conteúdo é mais comum de ser encontrado em e-commerces. No entanto, essa associação pode levar os usuários a entenderem que o conteúdo do carrossel é dispensável, levando-os a rolar a página em busca das informações realmente relevantes. Uma estratégia para garantir que o usuário veja as informações do carrossel é colocá-las em outras áreas do site (o mesmo vale para banners hero).

Cuidados importantes caso você opte por usar carrossel

1 Não exagere na quantidade de slides Segundo o NNgroup o número de carrosséis não deve ultrapassar 5. Limitar o número ajuda o usuário a reconhecer quando um conteúdo já foi visto, deixa menos cansativo passar por tantos conteúdos e caso ele queira voltar para algum conteúdo isso é mais fácil.

2 Pontos não são uma boa escolha Os pontos são uma escolha desfavorável em carrosséis para dispositivos móveis, pois são frequentemente despercebidos, especialmente porque são menos padronizados no Android do que no iOS. É difícil de clicar em pontos e setas em uma tela pequena, dê preferência para swipe ou cliques em botões maiores. Ou então, ao invés de apenas pontos, números ou setas para a navegação no carrossel, é interessante utilizar algum título para cada slide que o usuário possa se lembrar e voltar para ele. Um site que faz isso muito bem é o do Instituto Ayrton Senna que utiliza textos que fazem alusão ao conteúdo do slide, na versão mobile dão a opção de deslizar ou de clique nas setas (botões grandes) para ver o próximo conteúdo.

Home do Instituto Ayrton Senna na versão Desktop e Mobile

3

Cada slide importa A lógica para criar o conteúdo do carrossel deve ter o mesmo preciosismo se o espaço fosse usado um hero banner. A mensagem deve ser curta, forte e clara em todos os banners do carrossel.

4

Diferencie os slides

É legal que as imagens do carrossel sejam bastante diferentes entre si. A probabilidade de um usuário lembrar uma informação por uma foto ou cor diferente é maior do que pelo número do slide. Essa dica serve em especial para agências de publicidade que administram o conteúdo dos sites dos seus clientes. Existe uma rotatividade muito grande nos slides dos carrosseis de acordo com as campanhas de marketing e geralmente o seu layout é pensado individualmente e não como parte do conjunto do carrossel.

5

Rolagem horizontal automática

É bom evitar. Ajustar o tempo de leitura para cada usuário é difícil, o que pode causar frustração quando os usuários estão lendo o conteúdo e são encaminhados para o próximo slide antes de terminar, sendo obrigados a voltar para concluir a leitura. O NNgroup recomenda uma média de 3 palavras por segundo como diretriz de tempo para carrosséis. Além disso, é importante ter cuidado, pois a rolagem horizontal automática pode se assemelhar a um anúncio devido à animação, o que pode levar o usuário a ignorá-la. Em dispositivos móveis, a rolagem automática pode tornar o site mais lento. Quer ter um exemplo de experiência frustrada com carrosséis de rolagem automática? Acesse o site https://shouldiuseacarousel.com/

Reflita se vale a pena

O carrossel pode gerar mais custo para a sua construção uma vez que mais conteúdo e animação entre os conteúdos precisam ser projetados e em constante manutenção, esse esforço pode ser concentrado em criar e manter apenas um conteúdo que realmente transmita a essência do site.

No fim das contas a maior vantagem do herobanner para mim é não desfocar a atenção do usuário com muitas informações apresentadas para ele ao mesmo tempo. Escolher bem qual a principal mensagem e expô-la de uma maneira destacada parece ser mais eficiente.