9

Durante o desenvolvimento vi a seguinte situação:

inserir a descrição da imagem aqui

Onde o card é clicável e leva para o estoque do usuário, porém dentro do card tem um botão inativo, ou seja, o usuário geralmente vai clicar no botão para ir ao estoque mas isso funcionaria para qualquer parte do card.

Na minha visão o botão deveria ser clicável e o card inativo para que o usuário pudesse copiar alguma informação do card ou algo parecido.

Qual abordagem seria a mais correta?

2
  • Quando você cria um objeto com link, ele é atribuído a todos os objetos dentro dele em primeira instância. Se você conseguir editar esse cardo coloque os texto para serem clicaveis, ou faço o botão por fora do card e coloque ele por cima do card com css. 3/03/2020 às 20:12
  • Mas o clique do card vai para um local diferente do botão detalhes ?
    – Isac
    3/03/2020 às 23:11

1 Resposta 1

7

Heurística Número 5 de Nielsen: Previna Erros

Heurística Número 6 de Nielsen: Reconhecimento em vez de memorização

Lei 5: Basicamente vc está enganando o usuário e induzindo ele ao erro... Se vc quer que o card todo seja clicado não coloque um outline no botão, pois delimitando a área do botão parece que exclusivamente ele é um elemento clicável. Então caso o usuário clique no card "sem querer" e seja encaminhado para outro lugar ele vai se frustrar e ficar confuso (principalmente se não tiver uma forma fácil de voltar).

Lei 6: Elementos que parece algo deve agir como o algo, então, se algo parece um botão o usuário espera que ele funcione como botão, se um texto é sublinhado o usuário espera que ele seja um link. Muito provavelmente o usuário não vai esperar que o card seja um link, principalmente tendo um botão dentro dele.

Vc está pecando em dois erros fundamentais das Heurísticas de Nielsen, e não vou me aprofundar nos conceitos, mas sugiro que leia o link da fonte

Fonte: https://www.nngroup.com/articles/ten-usability-heuristics/

Uma alternativa é retirar o outline do botão, assim pelo menos vc não engana o usuário "delimitando uma área ativa" que não é real.

inserir a descrição da imagem aqui

OBS: Apesar disso, se vc tem um botão não tem pq deixar o card todo como uma área ativa... Vc mesmo citou um problema, imagine que o usuário queira dar um ctrl+c de alguma coisa dentro do card, ele pode acidentalmente clicar indo para outra página... Previna erros!

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .