Existe uma tabela estreita listando cerca de 250 clientes em ordem alfabética. Cada linha contém o nome do cliente, código da conta, cidade e estado.
Preciso indicar em cada linha se a conta do cliente foi editada e se 2 dados foram preenchidos (por exemplo, os 2 dados são vendas anuais e o setor em que o cliente atende).
O espaço é escasso e eu não quero adicionar muito barulho à página. Um vendedor precisa poder verificar rapidamente a lista e determinar quais contas precisam ser atualizadas.
Atualmente, as palavras 'atualizado', 'vendas' e 'setor' aparecem em cada linha em vermelho ou verde, dependendo da situação. Eu sinto que isso é ruim para o ruído da página, espaço e daltonismo.
Antes de tudo, você nunca deve usar vermelho e verde para diferenciar as coisas, pois esse é o tipo mais comum de daltonismo.
Para indicar se uma linha foi editada, o texto pode ser exibido em uma cor diferente das linhas que foram editadas, com as linhas não editadas enfatizadas (por exemplo, cinza médio para edição e preto para não editado). Isso já reduzirá a largura do texto da linha.
Para indicar se as duas propriedades foram editadas, você pode ter um pequeno ícone representando cada uma delas, em vez do texto completo "vendas" e "setor".
Qual é o objetivo da página? Listando clientes em ordem alfabética ou digitalizando clientes para atualização/vendas/setor? Neste último caso, jogue fora a ordem alfabética. Ou adicione opções de classificação à página. Em seguida, crie uma variação agrupada da tabela que agrupa por cada um dos atributos necessários. Pode ser algo como isto:
- Customers ------------------------------------------
------------------------------------------------------
Code | Name | City | State |
++++++++++++++++++++++++++++++++++++++++++++++++++++++
Updated
++++++++++++++++++++++++++++++++++++++++++++++++++++++
011 | Vidbot | Dallas | TX |
212 | Rahul | San Jose | CA |
++++++++++++++++++++++++++++++++++++++++++++++++++++++
Sales
++++++++++++++++++++++++++++++++++++++++++++++++++++++
187 | lori.lee | Boston | MA |
etc...
A tabela será mais digitalizável para a finalidade que você está descrevendo e você não precisará usar ícones, cores ou peso da tipografia para realizá-la. Tudo que você precisa é um controle de opção de classificação em algum lugar. Como o estado da página seria bastante binário nesse caso (agrupado ou classificado em ordem alfabética), você poderia tentar vários controles, como uma caixa de seleção ou um hiperlink. No entanto, eu recomendaria um menu suspenso - para apenas uma opção, é um pouco supérfluo.
Atualmente, as palavras 'atualizado', 'vendas' e 'setor' aparecem em cada linha em vermelho ou verde, dependendo da situação. Eu sinto que isso é ruim para o ruído da página, espaço e daltonismo.
Ou, coloque as palavras/ícones em uma linha de cabeçalho, definindo assim três colunas e use as marcas de seleção onde você realmente tem as palavras.
Isso leva a padrões de marcas de seleção que os usuários aprendem rapidamente a reconhecer, como "verificar, confirmar, vazio" para "vendas atualizadas, nenhum setor".
Gostaria de explorar a possibilidade de definir um cabeçalho que fique no topo da lista em vez de rolar para fora da vista.
Além disso, para economizar espaço horizontal, eu projetaria os títulos das colunas para torná-los o mais estreitos possível, como por exemplo, usando uma fonte pequena, abreviações, texto girado ou tudo.
Se fosse útil, eu adicionaria um recurso de lapidação no lado do cliente, como "mostrar apenas aqueles com este padrão de marcas de seleção".
É uma prática comum usar um ícone de lápis para marcar as coisas que foram editadas. Você pode adicionar um pequeno ícone no início da linha das linhas que foram editadas.