Guia para melhorar a experiência do usuário (UX) do site WordPress

Publicados: 2017-04-22

Otimizar um site para uma melhor experiência do usuário não é moleza, principalmente porque as ferramentas necessárias e / ou o conhecimento de codificação não custam muito. Mas quando o site é feito em uma plataforma que é praticamente conhecida e amada por sua facilidade de uso, o UXO ( otimização da experiência do usuário ) é significativamente menos incômodo.

Existem milhares de ferramentas disponíveis no WordPress, muitas delas até de graça, que ajudam você a entender melhor o seu público (rastreamento e análise), melhorar o desempenho (cache e plug-ins de otimização de imagem) e testar e melhorar (A / B teste de software como Nelio, OptimizePress, etc.). Este guia não é sobre eles.

Este guia detalha alguns dos aspectos de usabilidade mais facilmente esquecidos em um site WordPress e as melhores maneiras de corrigir esses erros. Vamos começar com:

Carrosséis

Cada departamento em cada empresa deseja carrosséis / controles deslizantes, simplesmente porque é uma bela média dourada. Todos têm seus produtos / campanhas / mensagens colocados em um único espaço de maior visibilidade na página: Acima da dobra.

É por isso que os temas mais desejáveis do WordPress incluem pelo menos um plug-in de controle deslizante (normalmente o Revolution Slider). Vamos ver os prós e os contras dessa abordagem:

Prós:

Mostra as mensagens mais significativas em um único local.
As mensagens podem ser priorizadas (o mais importante fica no primeiro slide)
Supostamente para atrair todos os segmentos de visitantes (“algo para todos”)

Contras:

Os usuários geralmente não esperam que os slides girem e pularão o carrossel depois de dar uma olhada no quadro visível no momento.
O conteúdo do Slides não é rastreado facilmente por robôs de pesquisa, o que é uma má notícia para o SEO.

Existem maneiras de contornar esses contras e melhorar a UX do carrossel:

Mantenha o número de slides / quadros não superior a 5.
Fornece o controle de navegação em carrossel aos usuários
NÃO encaminhe automaticamente.

Às vezes, a solução mais simples é a melhor. Em vez de depender de plug-ins deslizantes premium sofisticados, você pode usar plug-ins leves de JavaScript (jQuery) como o Slick para criar carrosséis amigáveis ao usuário no WordPress.

Navegação Avançada

Um menu principal no cabeçalho combinado com uma navegação secundária em uma barra lateral é uma maneira quase infalível de garantir que sua navegação seja completa e utilizável. Mas quando se trata de sites enormes (especialmente de eCommerce ou blogs grandes e cheios de conteúdo) com milhares de páginas, uma navegação secundária por si só não é suficiente.

É por isso que precisamos dos Mega Menus. Mas essa moeda também tem dois lados.

Prós:

Visibilidade uniforme: conteúdo / páginas em níveis inferiores são incluídos no mega menu
Salva uma etapa extra: os usuários podem acessar o conteúdo mais remoto / obscuro com mais rapidez.

Contras:

São conhecidos por causar problemas de desempenho quando elementos da interface do usuário, como gráficos / ícones, são adicionados.
Mais ou menos ineficaz em um site com hierarquia de conteúdo ruim
Tornar mega menus perfeitamente responsivos pode ser um desafio

Antes de debater os prós e os contras (e se você precisa mesmo de um mega menu em seu site ou não), você precisa ter seu conteúdo completamente categorizado. A taxonomia do WordPress existe por um motivo. Use-o.

Depois de ter sua hierarquia de conteúdo suficientemente controlada e organizada, você pode usar plug-ins WordPress como Max Mega Menu, uberMenu, etc. para adicionar um mega menu suspenso ao site. Extensões WooCommerce como Ajax Layered Navigation adicionam uma interface de filtragem à loja.

atuação

Não importa o que você GOSTARIA de acreditar: Você NÃO é exclusivo.

Os usuários não querem esperar pelo conteúdo, então não os faça esperar pelo conteúdo ou eles irão procurá-lo em outro lugar. Até mesmo suas fileiras sofrem com sites lentos. Essa é a soma total da necessidade de otimização de desempenho na experiência do usuário.

Otimize seu site WordPress para desempenho com:

CDN: Uma opção viável para sites que recebem uma audiência global e têm tráfego médio a alto. O plugin MaxCDN e W3 Total Cache é uma combinação feita no paraíso de carregamento rápido.

Cache: Como mencionado acima, W3 Total Cache é o único plugin de cache de que você precisa (mesmo sem o suporte CDN). Também pergunte a seus desenvolvedores sobre soluções do lado do servidor, como Redis e Memcached

Otimização de front-end: Plug - ins como EWWW Image Optimizer compactam imagens (sem comprometer a qualidade). Além disso, certifique-se de que haja o mínimo possível de CSS e JS embutidos em seus arquivos de tema. Compacte e reduza folhas de estilo e arquivos JavaScript também.

Reduza as dependências externas, use CSS sprites e seja extremamente exigente ao baixar plug-ins (quanto menos, melhor). Você pode até entrar em contato com seu provedor de hospedagem na web e pedir ajuda. Às vezes, seu host da web cria problemas relacionados ao desempenho.

Pop-Ups modais

Não seja desagradável em nome da interatividade e das conversões.

Sim, pop-up modal (marketing de interrupção) é uma ótima ferramenta de conversão. Existem literalmente milhares de plug-ins por aí (a maioria dos plug-ins de mídia social tem esse recurso agora) que permitem que você coloque uma mensagem para os usuários, 'educadamente' lembrando-os de compartilhar / seguir / curtir o conteúdo nas redes sociais, se inscrever ou se inscrever, aproveitar um desconto, et al.

Há tantas coisas erradas com isso ... mas vamos chegar a isso em um momento.

Prós:

Comprovado para melhorar as taxas de conversão

Contras:

Distraindo: o visitante está aqui para obter conteúdo e o pop-up está no caminho.
Os pop-ups são tratados como ruído branco (como tantos anúncios), a menos que se encaixem corretamente na jornada do usuário.
RUIM para acessibilidade

Existem exemplos de pop-ups sendo bem usados no contexto. BrainPickings.org entende seu público e promove seu link de 'doação' somente quando o usuário acessa o site repetidamente e quando termina de ler o conteúdo. O pop-up Reebok Crossfit tem um momento ruim, mas compensa um pouco com um desconto na assinatura na página de produtos.

Fonte: REEBOK

Atrasos de tempo e gatilho são bons, mas também é necessário focar no panorama geral e vincular um pop-up de uma forma que seja relevante para os usuários que o desejam.

Até agora, o aumento da conversão é mais devido à força bruta, mas a qualidade das conversões e leads subsequentes pode ser aumentada quando você faz isso de forma inteligente. Pedir a um visitante pela primeira vez para se inscrever em um site não vai dar a você leads de qualidade 99/100 vezes.

Tente usar os plug-ins do WordPress de forma inteligente para pop-ups. Existem alguns (como Popups da Supsystic) que são bons. Trabalhe com eles em vez de se concentrar apenas na interação em uma única página.

Nota final

Para melhorar a experiência do usuário, espero que você siga este conselho com um grão de sal e teste tudo (use o Google Analytics ou o teste A / B do Nelio, ou qualquer outra ferramenta: você decide).

E prometa a si mesmo continuar melhorando.

Leia mais Plugins WordPress | 5 correções rápidas para o seu site WordPress