Muitas vezes, consideramos como “melhores” exemplos de design de sites aqueles que se concentram em visuais impressionantes ou layouts originais. Para as empresas, no entanto, existem elementos funcionais de web design que são muito mais importantes para levar em consideração.
Mesmo que você esteja criando um site de marketing ou um aplicativo web interno, as empresas têm necessidades organizacionais complexas que a maioria das práticas de web design não reconhece. Uma interface do usuário (UI) é algo significativo e que vale o esforço, mas não deve superar uma revisão difícil de como a experiência geral do usuário afeta os resultados finais de sua empresa, incluindo desempenho, navegação, branding e análise.
Aqui estão algumas estatísticas reveladoras que mostram o impacto que o design do site tem em seus resultados:
- Cada dólar gasto na melhoria da experiência do usuário traz entre US $ 2 e US $ 100 em troca.
- 70% dos projetos de sites falham porque os usuários não gostaram dos resultados finais.
- Até 15% dos projetos de TI são abandonados e pelo menos 50% do tempo de um programador durante o projeto é gasto para refazer o trabalho. Se medições, metas e processos de teste adequados fossem implementados de antemão, a maior parte desse tempo perdido poderia ser evitada.
- Gastar 10% do seu orçamento de desenvolvimento para melhorar a usabilidade deve melhorar sua taxa de conversão em 83%.
Um novo visual no seu site não corrigirá os problemas que essas estatísticas destacam. Muitas delas estão sob a esfera da experiência do usuário, auxiliadas por uma tecnologia simplificada que forma a base de um website realmente bem projetado.
A lista abaixo não serve para substituir todas as outras excelentes informações online que podem ajudar a refinar o site da sua organização. No entanto, para empresas que precisam de investimentos em seu site para mostrar um retorno significativo, começar com esses sete elementos de alto nível irá focar nas melhorias em seu site que fornecem um valor comercial real.
1. Design Voltado para Conversão
Otimizar seu site para conversões é determinar o que você deseja que seu cliente faça em seguida e, logo após, filtrar qualquer coisa que o distraia. Há muitas maneiras diferentes de orientar seu usuário para a ação preferida:
- Dicas direcionais: use ícones, animações ou cores brilhantes que chamam atenção para determinados elementos da página.
- Layouts de Padrão Z e Padrão F: As pessoas digitalizam mais do que lêem e geralmente fazem isso em formato Z ou F. Existem guias detalhados disponíveis online para ajudá-lo a determinar quando usar cada um.
- Diminuir opções: há um estudo bem conhecido que mostra como muitas opções tornam as pessoas menos propensas a tomar uma decisão. Isso não precisa significar a remoção completa de outras opções. Você pode destacar uma ou duas ações e depois colocar o restante em outra página para usuários que continuam procurando mais informações.
- Avalie tudo: as opiniões não devem levar a alterações de design, a menos que possam ser copiadas para backup por números ou dados qualitativos (como feedback do usuário).
Destes sete elementos, o design voltado para a conversão provavelmente terá o maior impacto nos seus resultados. Desde que suas metas de negócios estejam vinculadas a manter as pessoas engajadas em seu site, uma mentalidade voltada para conversões é essencial para os sites corporativos.
A Whole Foods utiliza o amarelo para chamar a atenção dos usuários ao quadro de cupom de descontos.
2.Ponderando Metas de Negócios e Experiência do Usuário (UX)
Otimizar seu site com foco nas conversões leva a uma discussão sobre o que você deve fazer quando as metas de negócios entrarem em conflito com uma boa experiência do usuário. Você pode querer que seu usuário clique em um link de compra, mas se ele estiver procurando por algo diferente e não encontrar, é provável que ele saia do seu site por completo. Nesse caso, o design UX deve substituir sua meta de negócios.
As prioridades de UX e de negócios geralmente parecem conflitantes, mas um bom design é um bom negócio. As partes interessadas que representam os dois lados devem ter voz no design do seu site. Websites são ferramentas de negócios que precisam gerar valor, mas optar por um UX ruim que force os usuários a se comportarem de uma determinada maneira pode prejudicar suas metas de negócios a longo prazo.
Por exemplo, alguns sites de varejo exigem que os usuários criem uma conta antes de fazer uma compra. Isso pode afastar os visitantes que pretendem comprar apenas uma vez e não querem passar por uma etapa extra. Isso pode ser transformado em um UX melhor, movendo o processo de criação da conta para o final - depois que o visitante terminar sua compra, pergunte se ela gostaria de adicionar mais algumas informações para criar uma conta para que ela possa acompanhar seu pedido e checkout mais rápido da próxima vez. Isso facilita o processo sem sacrificar a meta de negócios de manter os clientes envolvidos.
3. Arquitetura de Informação
A arquitetura de informação refere-se a como você estrutura o conteúdo em seu site. O Liferay.com, por exemplo, usa uma estrutura basicamente hierárquica, com categorias amplas no topo que abrem opções mais restritas conforme você clica. A atenção para a arquitetura e navegação da informação garante que seus visitantes encontrem exatamente o que precisam em seu site, com o menor número de cliques possível.
Existem pelo menos sete maneiras diferentes de estruturar seu conteúdo:
- Hierárquico: Possivelmente a estrutura mais comum e que os usuários estão acostumados a ver em sites de empresas públicas. Isso começa com amplas categorias de informações e até um conteúdo mais detalhado.
- Sequencial: Essa estrutura exige que os usuários sigam passo a passo por meio de um caminho determinado. Isso é frequentemente usado para produtos online que precisam coletar muitas informações dos usuários. O TurboTax online é um bom exemplo. Os usuários respondem a uma pergunta de cada vez, e o site cuida do afunilamento para a próxima etapa correta.
- Matriz: As estruturas matriciais permitem que os usuários escolham como navegar pelo conteúdo. Isso pode ser obtido com opções de filtragem (para que os usuários possam classificar por data ou tópico, por exemplo) ou por páginas claramente interligadas, para que os usuários possam clicar conforme necessário.
- Alfabética: Usada frequentemente como um componente de navegação secundário para facilitar a classificação através do conteúdo.
- Público-alvo: Conteúdo segmentado por grupos de usuários. Os sites de varejo de roupas são o exemplo clássico, com itens classificados para homens, mulheres, crianças etc.
- Cronológica: organizada por data e normalmente usada para blogs ou outros sites com grande volume de conteúdo.
- Tópico: Organizado por assunto, como em wikis ou revistas online.
Essas estruturas não são mutuamente exclusivas e muitas empresas as usam juntas para organizar seus sites com sucesso. Por fim, a pergunta que você deve fazer é: quantos cliques existem entre meu usuário e o que ele quer? Sua arquitetura de informações deve simplificar isso tanto quanto possível. As taxas de conversão diminuem a cada nova página que os usuários precisam clicar. Reduzir isso com uma maneira clara e agradável de navegar em seu site facilitará o engajamento dos visitantes desde o início.
4. Ferramentas de Teste e Engajamento
Se você pensar em design de website apenas em termos da experiência frontend, você pode ignorar a importância das ferramentas de teste. Ter uma maneira precisa e consistente de avaliar o engajamento com seu site garante que você tenha os dados necessários para encontrar insights úteis e usá-los para aumentar essas conversões.
Há várias ferramentas de engajamento que podem medir tudo, desde o engajamento de mídias sociais até quais as notificações por push estão direcionando seus usuários para o cancelamento da inscrição. Uma maneira de filtrá-las é buscar por ferramentas que ajudem você a ouvir seus clientes e otimizar o equilíbrio entre uma grande experiência e metas vinculadas aos seus KPIs. Não se contente com ferramentas que medem cliques ou visualizações de tráfego simples; medidas como mapas de calor ou testes A/B são mais adequadas para ajudar você a descobrir, não apenas o que seus usuários estão fazendo, mas por que eles estão fazendo isso.
5. Móvel
Como o Google continua a ajustar seu algoritmo de busca para sites móveis, as empresas precisam pensar mais do que apenas tornar o site responsivo. Agora, o Google penaliza coisas como anúncios de tela cheia (que podem ser irritantes em computadores, mas são insuportáveis em dispositivos móveis), vídeos que não podem ser reproduzidos ou sites com desempenho ruim.Lembre-se de que qualquer arquitetura de informação ou outro componente de design que você esteja usando para o seu site para computador deve corresponder à experiência móvel. Um site bem projetado deve oferecer suporte a experiências consistentes em todos os tamanhos de tela, com a mesma capacidade de otimizar as conversões, medir o engajamento e estruturar o conteúdo como a experiência da área de trabalho. Pesquisas mostram que, se um site de negócios não funciona bem em dispositivos móveis, 48% dos usuários consideram que o negócio não se importa. Isso definitivamente não está ajudando nos seus resultados.
A Sumo utiliza um anúncio full-screen para oferecer uma aula gratuita de marketing, no entanto o ele é desabilitado na versão mobile. Torna-se possível visualizar o conteúdo apenas através do texto “Bonus Material”, criando uma experiência mais agradável na versão smartphone.
6. Práticas de design moderno
Sim, no início deste artigo, dissemos que o bom design do site é mais do que a experiência visual. No entanto, isso não significa que você não precisa acompanhar as tendências atuais de design web. Isso é particularmente importante quando se trata da interface do usuário (UI).
À medida que novas tendências de design se espalham online, as pessoas se acostumam com os novos padrões visuais de certa forma. Pesquisas mostram que a credibilidade do site é 75% baseada em estética. Em outras palavras, um design de website moderno convence os usuários de que você sabe o que está fazendo. Até mesmo a intranet de uma empresa pode beneficiar-se de uma boa tipografia, imagens modernas e layouts contemporâneos para ajudar a impulsionar a adoção pelos usuários e garantir que seu site não seja um investimento desperdiçado.
A Lufthansa utiliza uma imagem clara e navegação simples em sua homepage.
7. Simplicidade
Já discutimos a importância de diminuir as opções de otimização de conversão, mas às vezes é importante voltar atrás e considerar a complexidade do seu site como um todo. Você precisa de um blog? Você precisa da página da empresa para incluir um histórico completo de seus fundadores? Existe conteúdo que não foi visto em meses que você pode remover? Isso torna o site mais fácil de gerenciar e oferece mais opções para agilizar a navegação de conteúdo em seu site.
A Homepage da Vroom possui um call-to-action claro e objetivo, o que leva a o usuário a encontrar exatamente o que ele está buscando.
Esses elementos são apenas um começo
Há muito mais para cada um desses elementos do que podemos abordar neste artigo, mas fazer uma avaliação rápida do design do site com base neles fornecerá um lugar para começar. Esses sete elementos centrais são destinados a construir uma base para sites corporativos que precisam trabalhar e entregar valor comercial real à sua empresa.