Usabilidade x Conversão

Olá leitores da Agência Mestre!

Há algumas semanas, escrevi sobre algumas dicas para melhorar as taxas de bounce rate do seu site ou blog através dos calls to action. Hoje vou continuar a falar um pouco de design, mas desta vez, do site inteiro… Será que ele influencia nas taxas de conversão?

Usabilidade x Conversão

A palavra-chave para a escolha de um template para blog ou design de um site é usabilidade, pois você deve ter sempre em mente a importância de facilitar a vida do usuário em seu site – não o canse em templates complexos e sofisticados demais para o seu propósito. Assim, os elementos devem estar dispostos de maneira organizada em todas as páginas, e essa organização deve ser feita de maneira intuitiva para o usuário.

É importante ressaltar elementos visuais que ajudem o usuário a navegar no site intuitivamente – por exemplo, utilize um menu que se parece um menu e se comporta como um menu. Geralmente, o menu fica no topo do site e com uma lista de links em uma linha. No máximo um drop down para opções sobre os itens de menu.

Ao organizar os elementos de maneira intuitiva, você evita que seus usuários saiam de seu site por não encontrar aquilo que procuram – muitas vezes, pode não ser o caso de o seu site não ter a informação, mas somente o usuário não foi capaz de encontrá-la por navegar demais e encontrar seus objetivos de menos.

Naturalmente, isso é diretamente impactante na conversão, pois se o usuário não entende o site, não entende como navegar, não encontra uma forma clara de navegar, ele pode ir embora por se cansar de tentar. O ideal é que ele acerte de primeira, por isso a importância de não fugir aos padrões dos sites de maior sucesso dentro de determinado nicho.

Para um site de ecommerce, procurar sites de ecommerce. Para um blog, procurar temas mais comuns de blogs. Para portais de notícia, acompanhar sempre como os grandes estão fazendo – é a maneira como as pessoas estão acostumadas a encontrar determinado tipo de conteúdo.

Outro detalhe que segue o conceito de intuição das pessoas é o esquema de cores utilizado e seus significados implícitos. Grande parte das cores utilizadas nos designs de sites tem em si algum valor emotivo ou “reativo” agregado, por exemplo:

  • O azul traz a sensação de frio, de água e sono.
  • A cor amarela é sinal de alerta: “Tome cuidado!”, “preste atenção”
  • Vermelho quer dizer “pare!”, “perigo”, “fogo” – implica em necessidade de muito cuidado e atenção e traz a sensação de calor / quente
  • A cor verde significa “pode ir”, “está tudo bem”.

O detalhe aqui é pensar mais uma vez no CTA, se o objetivo é que o usuário tome determinada ação, pode ser interessante evitar cores vermelhas, pois despertam a sensação de perigo, enquanto o verde vai tranquilizá-lo a seguir em frente.

Escolher ou montar um template fácil de utilizar e com cores agradáveis, que não cansam, auxilia e muito nos seus trabalhos de SEOfazer o usuário chegar ao site é somente parte do trabalho, mantê-lo no site é igualmente importante. De nada adianta utilizar as mais avançadas técnicas de otimização de sites se o usuário não consegue navegar e se encontrar nas suas páginas.

Receba Novidades

Insira seu email para receber novidades e dicas exclusivas da Agência Mestre!
Divulgue este artigo

4 Comentários para “Usabilidade x Conversão”

  1. guilhermecruz

    Muito legal Fabiane, acho que o design definitivamente é um dos pontos mais importantes, tanto que a interface é comandada pelo olhos do usuário, acredito tambem que a arquitetura da informação seja muito útil neste caso tambem, ja que aborda algo mais amplo do que usabilidade.

    Responder
  2. sergioronei

    Muito bom o post, parabéns!!!

    Este esquema das cores tem tudo a ver… eu nunca ví um botão comprar com o fundo vermelho, nem um botão excluir verde. hehe!…

    Responder

Deixar um comentário

  • (não será publicado)

XHTML: Você pode usar estas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>