Vous êtes sur la page 1sur 52

Ignore essas 23 boas práticas e veja seus

visitantes abandonando seu site para


sempre
Audio Player
00:00
00:00
Use Up/Down Arrow keys to increase or decrease volume.

Você já passou por essa situação?

Entrou em um site e simplesmente não conseguiu ficar nem 3 segundos dentro dele?

Ou pior...

Gastou seu precioso tempo dentro dele para chegar a frustração por não entender como
ele funciona?

Você não está sozinho.

Infelizmente, a internet está infestada de sites com péssima usabilidade, tornando a


experiência para seus usuários nada agradável.

Não é sua função apontar o que eles precisam mudar, mas é sua função receber um
visitante no seu blog/site da melhor maneira possível, assim como recebemos pessoas
queridas em nossa casa.

E é bem provável que você não está seguindo os 23 conceitos de usabilidade que
iremos abordar nessa aula.

Portanto, preste bastante atenção em todos os itens para você garantir a melhor
experiência possível para seu usuário.

E com isso diminuir sua taxa de rejeição, aumentar o tempo de permanência do leitor no
seu blog, aumentar o número de leitores recorrentes e todos demais benefícios
relacionados.

Assim como mostramos na aula anterior, a usabilidade do seu site é extremamente


importante para sua credibilidade e para a experiência do usuário.

Conceito e requisitos de usabilidade


Usabilidade é um termo usado para definir a facilidade com que as pessoas podem
manusear uma ferramenta ou objeto com a finalidade de realizar uma tarefa específica e
importante.

Portanto, usabilidade significa a facilidade com que seus visitantes conseguem chegar
ao seu objetivo ao entrar em um site.

Esse objetivo varia de pessoa para pessoa e, dentre vários, pode ser:

 Entrar em contato com você;


 Encontrar o artigo que estava procurando;
 Cadastrar seu email para receber mais informações do seu blog;
 Deixar um comentário num artigo;
 Compartilhar o artigo nas redes sociais.

Uma boa usabilidade costuma andar de mãos dadas com um bom design.

Nas próprias palavras de Steve Jobs, um dos maiores gênios em termos de design e
usabilidade:

Design não é apenas o que parece e o que se sente. Design é como funciona.

Logo, um bom design vai muito além de traços bonitos. Design também está
relacionado a como as coisas funcionam.

Existem algumas “leis universais” sobre uma boa usabilidade em um blog.

Para facilitar seu trabalho para otimizar seu blog/site, não apenas mostrarei os 23
problemas de usabilidade como também irei apontar as soluções para você resolvê-los.

Vamos juntos?

Problema #1. Site não-responsivo


Hoje não se trata mais de uma discussão.

É uma realidade. E os sistemas de buscas estão cada vez mais ligados nisso.

Sites responsivos têm mais chances de rankear melhor.

O motivo é claro: Uma melhor experiência para o usuário, independente de qual


aparelho ele está usando.

Como resolver esse problema?

Use um tema responsivo.

Na aula 1.5 recomendamos alguns grátis e alguns pagos para você escolher.

Problema #2. Site extremamente lento para carregar


O principal problema de acessibilidade de um blog é ele não estar acessível.

Meio óbvio, não é?

Porém, mesmo estando acessível, ele precisa ser muito rápido.

Afinal, os usuários na internet estão cada vez menos pacientes.

Como vimos na aula passada, você tem apenas 8 segundos para conquistar o seu leitor.

Faça isso ou você perderá muitas visitas.

Nesta aula, trago números ainda mais alarmantes:

 40% dos usuários abandonam um blog se ele não carregar em menos de 3


segundos;
 Um segundo a mais para carregar um site pode resultar em um queda de 16%
na satisfação do usuário;
 A cada um segundo para carregar, um site pode perder 7% em conversões.

Além disso, o tempo de carregamento de um site também conta para SEO, afetando seu
ranking no google.

Então você deve estar se perguntando: “Como resolver este problema?”.

Como resolver esse problema:

Aqui vão duas dicas essenciais para você melhorar o tempo de carregamento do seu site.

Dica #1: Monitore a velocidade do seu site através desta ferramenta no site Pingdoom.

Faça um teste e veja em quanto tempo seu site carrega. Identifique qual tipo de
conteúdo demora mais para carregar.

Normalmente, imagens de grande tamanho são os principais vilões que afetam o


carregamento do seu site.

Se a sua intenção é mostrar uma imagem de 100 x 100 pixels, não coloque uma imagem
de 1000 x 1000 pixels e deixe o WordPress redimensionar para você.

O tamanho da imagem continuara sendo a de 1.000 x 1.000 pixels, embora o site mostre
como 100 x 100 pixels.

Portanto, lembre-se sempre de redimensionar a sua imagem antes de fazer o upload para
seu site.

Dica #2: Contrate um servidor confiável (e rápido)

Essa é uma grande dúvida de qualquer pessoa que possui um blog: “Qual empresa
escolher para a hospedagem do meu blog?”
Aqui no Brasil vejo muitos decidindo pelo UolHost ou Locaweb e posso dizer que esses
serviços são muito ruins quando comparados com empresas de nome estrangeiras.

Não é raro encontrar gente reclamando em fóruns sobre a má qualidade dessas empresas
nacionais.

Se você cuida do seu site como se fosse seu empreendimento e dedica-se bastante para
melhorá-lo, um bom servidor é mais do que necessário para ajudar você a melhorar o
tempo de carregamento do site e até mesmo melhorar seu ranking no google.

Falamos bastante sobre este tópico no módulo #1, aula #4.

Problema #3. Links quebrados


Links quebrados são links dentro do seu site que apontam para uma página de erro.

Eles são ruins porque geram uma frustração para o usuário, quando ele percebe que
clicou em um link que não existe mais.

Se ele for um link interno, basta você trocá-lo para o link correto.

Se for externo, avalie se é possível mudar o link para o lugar correto ou se você
precisará excluir esse link.

Como resolver esse problema:

Use um plugin como o Broken Link Checker para verificar automaticamente os links
quebrados dentro do seu site/blog.

Ele permite você trocar o link dentro do próprio plugin ao invés de caçar o link nos
artigos.

Além disso, se você usar esse mesmo link várias vezes dentro de seu site, ele troca o
link em todos os lugares.

Problema #4. PopUps exagerados


Uma das principais causas de um usuário deixar o seu site logo na primeira visita é o
uso de pop-ups.

Assim como em um primeiro encontro, você não pode pedir a pessoa em casamento. É
preciso ganhar sua confiança e conhecê-la melhor.

Por esse motivo, pop-ups devem ser utilizados com moderação e, de preferência, nunca
para uma primeira visita.

Como resolver esse problema?

Se utilizar pop-ups, lembre-se de procurar um software que permita uma boa


segmentação, ou seja, para quem exatamente o pop-up será mostrado.

A opção que utilizamos em nossos blogs é o OptinMonster.


Boas práticas recomendam você mostrar o pop-up apenas para novos visitantes e que
tenham ao menos visitado mais de uma página ou que estejam tentando sair do seu blog.

Problema #5. Pouco contraste entre o fundo do site e o


texto
Como Steve Jobs disse, design vai além de como as coisas parecem.

Portanto, de nada vale investir em um design que seja “bonito” se você dificultar a
experiência do usuário.

Um exemplo disso é o fundo cinza com texto também em cinza.

Pode até parecer bonito, mas o importante é o leitor conseguir ler seus textos, correto?

Como resolver esse problema?

Nada como à moda antiga. Utilize um fundo branco com uma fonte preta. Ou variações
muito próximas dela.

Problema #6. Tamanho da fonte minúsculo


Outro grande problema de acessibilidade e usabilidade é o tamanho pequeno da fonte
em diversos sites.

Antigamente, o padrão era utilizar a fonte Arial tamanho 12.

Porém, essa combinação é pequena para os padrões atuais.

Os monitores ganharam mais pixels, se alargaram e manter uma fonte de tamanho 12 é


ruim para a leitura de artigos.

Mais e mais usuários estão lendo artigos em dispositivos móveis (smartphones, tablets),
necessitando de fontes maiores para facilitar a leitura.

Como resolver esse problema?

Calcule a largura da área destinada ao conteúdo do seu site. A maioria tem, pelo menos,
600 pixels de largura.

Depois, visite o site Pearsonified e coloque o tamanho da largura do seu site em


“content width” e clique no botão.

Ele dará a você exatamente o tamanho de fonte ótimo para seu site.

Na maioria das vezes, ele recomendará um fonte de tamanho 15 para um conteúdo de


600 pixels.

Tudo baseado em estudos matemáticos.

Problema #7. Página 404 (não encontrada) não


personalizada
Experimente colocar “asdf” no término da URL do seu site.

Exemplo: seublog.com/asdf

Você será redirecionado para uma página 404 (não encontrada).

Porém, a maioria dos blogs param por aí e não mostram ao leitor possibilidades para ele
voltar para a homepage do site ou para a área de artigos.

Como resolver esse problema?

Sempre oriente seus leitores para uma página com conteúdo.

No Viver de Blog, o Henrique manteve o menu de navegação, o rodapé e um link


centralizado para voltar a homepage do site.

No Quero Ficar Rico, os mesmos passos acima foram seguidos e ainda há uma lista dos
artigos mais recentes para oferecer uma alternativa ao visitante.

Problema #8. Logo do site escondido ou inexistente


Não precisa ser necessariamente o logo da empresa, mas o nome do blog deve ser
visível e fácil de achar.

Muitos clicam nele para voltar a página inicial.

Pelo padrão, ele deve estar posicionado no canto superior à esquerda do site (e deve ser
clicável).

Como resolver esse problema?

Coloque uma imagem ou texto que represente o seu blog no canto superior à esquerda e
faça com que ele seja clicável, redirecionando para a página inicial.

Problema #9. Falta de clareza na página inicial


Você possui em torno de 8 segundos antes que um visitante deixe seu blog.

Portanto, se ele não descobrir rapidamente do que se trata seu blog, ele irá deixá-lo.

Quanto mais confuso ele estiver na página inicial, maior é a chance dele nunca mais
voltar no seu site/blog.

Como resolver esse problema?

O design da usa página inicial deve transmitir rapidamente os valores do site.

Escolha muito bem os elementos que ficarão na região acima da dobra.

Logo, tagline, menu de navegação, página sobre são uma ótima maneira para começar.

Uma imagem de rápida associação com seu site também é essencial nessa parte.

Problema #10. Falta de uma tagline que defina algum


valor do site/blog
Tagline é uma frase curta que busca transmitir rapidamente os valores de uma marca ou
produto.

A ideia por trás do conceito é criar uma frase marcante que será uma referência para a
marca ou produto, ou ainda que reforçará a memória do público-alvo.

Porém, muitos sites não possuem uma tagline.

E eles estão perdendo uma ótima oportunidade para comunicar rapidamente um


conceito através de breves palavras.

Como resolver esse problema?

O seu logotipo/nome do site deve transmitir rapidamente os valores do site.

Além disso, utilize uma chamada para ajudar a expressar esses valores.

No Quero Ficar Rico: Conquiste sua independência financeira. (objetiva, clara)

No Viver de Blog: Mais que um blog, um estilo de vida. (inspiracional)

Problema #11. A página “sobre” não existe ou está


escondida
Hoje em dia, os leitores fazem questão de saber quem está por trás do blog.

O anonimato na internet está com os dias contados e você precisa deixar claro quem
produz o blog e como ele pode ajudar o leitor.

Como resolver esse problema?

Coloque um link para a página “sobre” no seu menu de navegação.

Se transparência é um dos valores mais importantes para o seu blog, como é no Quero
Ficar Rico e no Viver de Blog, coloque também uma foto sua com um pequeno texto na
barra lateral para os leitores saberem melhor sobre sua história.

Problema #12. Não existe uma área para contato


no blog
A internet nos permite entrar em contato com pessoas do mundo inteiro, interessadas no
que temos para compartilhar.

Entretanto, se você não colocar uma área de contato no seu blog, ninguém entrará em
contato com você e muitas oportunidades de negócios, parcerias, ideias serão perdidas.

Como resolver esse problema?

O plugin Contact Form 7 (grátis) é muito popular e extremamente fácil de configurar.

Se você ainda não possui uma área de contato para o seu site, a hora é agora.

Problema #13. Menu de navegação confuso


O menu de navegação está presente em sites há um longo tempo. É um padrão de
usabilidade antigo e está presente até hoje porque funciona.

O problema nesse item pode ocorrer de duas formas:

1. O site não possui um menu de navegação;


2. O site possui vários menus de navegação (confundindo leitores).

Como resolver esse problema?

Um bom menu de navegação precisa ser simples e direto.

Se você coloca suas 15 categorias do blog no menu de navegação, você está fazendo
isso de modo errado.

Lembre-se de que mais escolhas podem resultar em menos conversões (cliques, no


caso).

Portanto, limite o uso do seu menu de navegação para itens importantes como:

 Pesquisa
 Arquivo
 Sobre
 Contato
 Páginas mais importantes (com moderação)

Problema #14. Logo não redireciona a pessoa para o


início do site
Tem um logo, mas quando ele é clicado nada acontece?

Por ser um elemento visual importante do seu site/blog, muitas pessoas clicam nele.

Porém, se ele não for clicável, seu visitante não terá uma boa experiência.

Como resolver esse problema?

Bem simples. Basta colocar um link na imagem do logo apontando para a página inicial.

Problema #15. Links não parecem links (ou são difíceis


de identificar)
No ramo de marketing digital, não é tão raro ver sites usando vermelho para o cabeçalho
e vermelho para links.

Ao colocar os dois itens com a mesma cor, o leitor fica confuso, não sabendo
exatamente onde ele pode e não pode clicar.

Além disso, outro erro comum é colocar links com cores diferentes. Se um link é azul e
outro link é verde você também está criando confusão para o leitor.

Como resolver esse problema?

Todos os links do blog, assim como botões de ação, devem ser de uma única cor.

Por padrão, usuários estão acostumados com a cor azul para links, mas você pode variá-
la com moderação.

Entretanto, nunca coloque um link da mesma cor do conteúdo. Alguns sites cismam em
usar uma fonte de cor preta e também links na cor preta, péssimo para a usabilidade do
site.

Praticamente ninguém consegue encontrá-lo.

Problema #16. Campo de busca inexistente ou difícil de


encontrar
Novamente, por padrão, o campo de pesquisa costuma ficar no topo de um site, no
menu de navegação principal.

Entretanto, outros bons lugares para se ter um são:

 Barra lateral (sidebar)


 Rodapé (footer)

Porém, alguns sites não possuem campo de pesquisa ou os colocam em um lugar de


difícil acesso.

Como resolver esse problema?

Disponibilize uma área exclusiva para o campo de pesquisa no menu de navegação do


seu blog.

Integrando as buscas com seu Google Analytics, você ainda poderá ver os termos mais
pesquisados dentro do seu blog, o que pode dar várias dicas para novos artigos.

Problema #17. Resumo dos artigos na página


inicial não clicáveis
A maioria dos blogs hoje disponibiliza um resumo dos artigos mais recentes em sua
página inicial.

Esses resumos consistem em 3 principais elementos:

 Título do Artigo;
 Imagem;
 Link para continuar a leitura do artigo.

O problema de muitos blogs: nem sempre esses 3 elementos são clicáveis.

O erro mais comum é o próprio título do artigo não ser clicável.

Ao impedir o leitor de clicar no título do artigo, esperando que ele clicará no “continue
lendo” (o qualquer que seja sua chamada para ação), você pode perder importantes
visitas para seu artigo.

Como resolver esse problema?

Faça com que todos esses 3 elementos do resumo dos artigos na página principal sejam
clicáveis.

Pode parecer um passo pequeno, mas é fácil e vai aumentar a satisfação do leitor ao
navegar pelo seu blog.

Problema #18. A "salada mista” de cores


Não apenas links, como mencionei anteriormente, mas todas as cores do seu
blog precisam ser pensadas como um todo e não em particular.

Criar uma “salada mista” de cores é ter a certeza de confundir seus leitores.

Isso ocorre porque, ao tornar todas as cores do seu site predominantes, você está
fazendo com que nenhuma delas se destaque.

Como resolver esse problema?

Utilize cores mais fortes apenas onde você quer chamar mais atenção.

Um bom exemplo é na captura de emails e nas páginas que você deseja que sejam mais
visitadas.

Problema #19. Imagens sem descrições apropriadas


Poucos sabem o que é uma ALT tag.

Ela nada mais é do que uma descrição que diz do que se trata uma imagem.

Importante não apenas por questões de usabilidade, a ALT tag também ajuda no SEO
do seu blog.

Como resolver esse problema?

Lembre-se de colocar ALT tag em suas imagens.

Uma solução simples e eficaz para você não perder tempo toda vez que fizer o upload
de uma imagem é utilizar o plugin SEO Friendly Images (grátis).

Problema #20. Uso excessivo de negrito, itálico e caixa


alta
Um exemplo muito parecido com o problema anterior: A cognição humana tenta
chamar a atenção para tudo e acaba, por consequência, não chamando atenção para
nada.

Perceba nesta frase como ao tentar CHAMAR ATENÇÃO para tudo eu não consegui
chamar atenção para NADA.

Como resolver esse problema?

Simples. Utilize apenas um estilo para enfatizar um determinado ponto na frase.

Boas práticas indicam que você deve utilizar o itálico em palavras estrangeiras.

Colocar o texto em negrito é uma ótimo forma de destacar um ponto, mas precisa ser
usado raramente.

Textos em LETRAS MAIÚSCULAS podem indicar que você está “gritando” na


internet. Portanto, só utilize em casos muito raros dar ênfase máxima a um ponto.

Problema #21. Falta de uma separação clara do seu


texto
Sabe aqueles artigos acadêmicos gigantes que são bem chatos de ler?

Infelizmente, eles foram programados para serem chatos...

A estrutura rígida deles faz com que os parágrafos sejam enormes e não haja separação
suficiente entre o texto para uma boa e agradável leitura.

Como resolver esse problema?

Use parágrafos menores.

Considere frases curtas para que o leitor continue lendo seu texto.

Divida seu conteúdo em vários subtítulos, como fizemos aqui nessa aula com os 23
problemas de usabilidade.

Separe seu texto com imagens também. Elas ajudam na quebra de um tópico e na
conexão do próximo.

Problema #22. Anúncios por toda parte


A maioria dos blogs necessita de anúncios para pagar suas contas ou para rentabilizar o
tempo que o editor leva para entregar um conteúdo de graça.

Entretanto, assim como cores e ênfases no texto, os anúncios também devem ser
utilizados com cautela, já que o excesso de anúncios poderá fazer seu leitor sair
correndo para outro site.

Como resolver esse problema?

Não há problema algum em utilizar anúncios em um site.

Porém, você precisa definir um limite para não quebrar a fina linha entre conteúdo e
anunciantes e também deve deixar claro que se trata de um anúncio.

Você pode chamar essas áreas de anúncios de “publicidade”, “parcerias” ou outro termo
adequado, desde que deixe claro para o leitor que se trata de um anúncio.

Tem mais: se você seguir nossa estratégia de gerar renda através de vendas invisíveis
(módulo 7), é provável que você nem precise colocar banners em seu blog.

Problema #23. URLs inimigas (nada amigáveis)


Por padrão, o wordpress coloca as URLs de um blog como:

http://www.site/?p=631

Porém, o que a parte “?p=631” diz sobre essa página?

Nada!

Alguns leitores mais acostumados com a internet olham a URL de um link antes de
clicá-lo.

Não adotando boas práticas, você pode perder novos visitantes, assim como deixar de
ganhar rankings no Google pela má estrutura de URLs.

Como resolver esse problema?

No painel do seu WordPress, siga o caminho: Configurações -> Links Permanentes.

Agora, marque a configuração “nome do post”.

Desse modo, ao invés de aparecer http://www.site/?p=631 seu artigo irá aparecer


como http://www.site/nome-do-artigo.

Supondo que a URL seja “mais-trafego”, ela irá aparecer como http://www.site/mais-
trafego.

Importante: Se você já possui outra configuração de link permanente, talvez seja


melhor repensar antes de adotar esse modelo.

Digo isso porque você provavelmente irá perder os números sociais de sua página e
até seu ranqueamento no google.

Porém, se você está começando um blog do zero ou o tem há pouco tempo, a mudança
irá melhorar a acessibilidade e usabilidade do seu site.

Conclusão – Recapitulando…
O seu objetivo como blogueiro é disponibilizar informação de qualidade para seus
leitores e fazer com que essas informações sejam de fácil acesso.

Garantir uma boa usabilidade do site é essencial para fazer com que novos visitantes se
tornem visitantes repentinos.

Abaixo, relembro os 23 problemas de usabilidade:

1. Site não-responsivo
2. Site extremamente lento para carregar
3. Links quebrados
4. PopUps exagerados
5. Pouco contraste entre o fundo do site e o texto
6. Tamanho da fonte minúsculo
7. Página 404 (não encontrada) não personalizada
8. Logo do site escondido ou inexistente
9. Falta de clareza na página inicial
10. Falta de uma tagline que defina algum valor do site/blog
11. A página “sobre” não existe ou está escondida
12. Não existe uma área para contato no blog
13. Menu de navegação confuso
14. Logo não redireciona a pessoa para o início do site
15. Links não parecem links (ou são difíceis de identificar)
16. Campo de busca inexistente ou difícil de encontrar
17. Resumo dos artigos na página inicial não clicáveis
18. A "salada mista” de cores
19. Imagens sem descrições apropriadas
20. Uso excessivo de negrito, itálico e caixa alta
21. Falta de uma separação clara do seu texto
22. Anúncios por toda parte
23. URLs inimigas (nada amigáveis)

Analise cada um desses itens e faça as alterações necessárias para tornar seu blog cada

vez mais memorável!

É possível que através de apenas algumas simples mudanças você conseguirá números
bem melhores para a retenção do leitor no seu blog/site.

Até a próxima aula!

Vous aimerez peut-être aussi