Divisor (divider)

Linha ou separador sutil que organiza a tela, agrupando conteúdo sem pedir atenção.

Hard

O que é

Divisor é aquele elemento simples que separa blocos de conteúdo, como uma linha fina ou um separador de largura cheia. A força dele está justamente na discrição, porque ele guia o olho sem chamar atenção pra si, marcando onde uma seção termina e outra começa.

Na interface, o divisor reduz o esforço de leitura ao agrupar o que é parecido. Numa tela de configurações, por exemplo, ele separa conta de notificações, e numa tabela ele distingue as colunas. Variar espessura, espaço e cor é o que cria hierarquia: um divisor mais forte separa blocos grandes, enquanto um mais leve separa itens dentro de um mesmo bloco.

Em uma frase

Aqui um divisor leve já separa as seções, não precisa de uma linha forte em cada item.

A pergunta que ele responde

Como separo blocos de conteúdo na tela sem deixar tudo bagunçado?

Quando usar

Ajuda a organizar listas, tabelas, feeds e painéis quando o espaço em branco sozinho não dá a separação necessária.

Como não usar

O cuidado é encher a tela de linha. Excesso de divisor polui e acaba engaiolando o conteúdo, em vez de clarear o que você queria destacar.

Na prática

Pense numa lista de mensagens em que divisores marcam a virada de data. A pessoa entende na hora quando cada conversa rolou, sem precisar procurar a informação.

Não confunda com

Vale separar divisor de espaço em branco. A linha marca uma separação explícita, enquanto o espaço em branco separa por respiro, sem desenhar nada. Muitas vezes o próprio espaço resolve melhor, então o divisor não é a primeira saída, é uma das saídas.

Design

Em inglês

Dividers

Pronúncia

di-vái-der

Também chamado de

divider, separador, linha divisória

Origem

n/a

Fonte

Saiba mais

Material Design, documentação sobre dividers