it-swarm-pt.com

Alterar a cor do texto ao passar o mouse sobre o hiperlink

A cor do texto deve mudar ao passar o mouse sobre um hiperlink? Normalmente, mudo meus hiperlinks para um tom mais claro de azul ao passar o mouse.

a:link {
 color: #0088cc;
}

a:hover {
 color: #0099dd;
}

Acredito que isso tornaria mais fácil segmentar e clicar em um hiperlink porque há feedback visual extra. Tenho estados de foco para quase qualquer coisa clicável no meu site por esse motivo - imagens, botões, etc.

Vejo que os resultados de pesquisa do Google não têm hiperlinks para alteração de cor. Eles fizeram um estudo sobre isso e concluíram que reduz a usabilidade? Eu sei que eles fazem muitos testes malucos, como testar a taxa de conversão em 41 tons de azul , então eles devem ter feito testes com estados de foco de hiperlink, certo?

8
JoJo

Alguns de meus colegas e eu acabamos de realizar um conjunto de testes de usabilidade de um aplicativo da web. Embora não tenhamos estudado especificamente se adicionar ou não outras pistas visuais (além do cursor da mão) em um link ao passar o mouse, descobrimos que elementos que podem ser clicados (links, botões) com mais feedback visual têm maior chance de serem notados e/ou clicou. Quando mencionei "mais", isso não significa que precisa ser muito chamativo; uma mudança sutil na cor ou um sublinhado de um link ajuda.

Podemos discutir incessantemente sobre quanto mais escuro/mais claro definir a cor do estado de foco do link. Mas, especificamente para links, descobrimos que i) adicionando/removendo um sublinhado e ii) mostrando uma dica de ferramenta ao passar o mouse sobre o link, significativamente, tornando os usuários mais conscientes da existência e capacidade de clicar no link.

Eu espero que isso ajude.

1
moey

Acho que, como você apontou, isso pode ajudar na usabilidade em termos de 'descoberta espacial' - ou seja, tornar um pouco mais óbvio quando um link pode ser clicado, especialmente se os links tiverem uma pegada grande que não seja indicada de outra forma.

No entanto, a alteração do cursor já indica isso, então acho que o benefício é mínimo; na minha experiência, é mais usado para o "efeito bonito" do que para qualquer usabilidade positiva.

Um caso em que acho que provavelmente pode ser muito eficaz é quando pequenos links são colocados juntos - por exemplo, em uma barra 'A-Z'. Isso facilitará a seleção de um link específico, pois é mais fácil determinar qual link está sendo selecionado, algo que o cursor não oferece. No entanto, essa provavelmente não é a melhor solução para o problema original: o espaço é ligeiramente menor e aumenta a pegada!

Por fim, se os links de texto estiverem adjacentes, um estilo de focalização poderá ajudar a indicar a separação e, novamente, qual link está sendo selecionado.

7
Bobby Jack

Não tenho certeza de que seja usado principalmente para o "efeito bonito" - acho que isso diz respeito à capacidade visual. Isso mostra mais claramente que o site está respondendo a você e que a área em que você está atualmente é interativa. Se alguma coisa, eu trabalhei com alguns designers visuais que tentaram pressionar contra ter estados de foco; Eu nunca ouvi alguém dizer que isso torna as coisas mais bonitas.

Além disso, o cursor nem sempre muda - por padrão, mas os designers podem substituí-lo e, se houver elementos interativos acionados por javascript ou dentro de um módulo Flash, eles nem sempre são indicados com uma alteração no cursor.

Devo admitir que fiquei perplexo por que o Google não faz isso. Eles oferecem alguns estados de destaque caso contrário a cada resultado de pesquisa (alguns ícones ao lado do link ficam mais escuros), mas também têm outras decisões de design estranhas - como o próprio URL em um resultado de pesquisa não é clicável, o que para mim parece contra-intuitivo (embora eu deva supor que seja porque, nos anúncios patrocinados, o URL mostrado pode ser apenas o domínio de nível superior, não o URL real para o qual você acessará quando o link for clicado).

Meu melhor palpite sobre por que o Google faz isso? Porque é o comportamento padrão do navegador. O que significa que, mesmo se você tivesse tudo desabilitado (CSS, javascript etc.) e tivesse apenas HTML puro, a cor/funcionalidade dos links ainda pareceria a mesma para todos.

1
Michael Histen