21 lines
2.0 KiB
Markdown
21 lines
2.0 KiB
Markdown
|
---
|
||
|
|
title: Layout
|
||
|
|
localeTitle: Layout
|
||
|
|
---
|
||
|
|
## Layout
|
||
|
|
|
||
|
|
Layout refere-se ao arranjo ou colocação de elementos em uma determinada página. Os elementos podem incluir itens funcionais, como parágrafos, títulos, listas e seções. Os elementos também podem incluir itens de design, como ícones, formas e imagens. O uso de espaço em branco, preenchimento e margem também é muito usado no layout. Você pode considerar as primeiras como características de design, e não elementos em si mesmas.
|
||
|
|
|
||
|
|
O layout de uma página é a disposição desses vários itens em uma apresentação que transmite significado à pessoa que visualiza a página. Assim, uma consideração primária para o layout deve ser como o layout será entendido e o significado que ele irá transmitir. Sem considerar cuidadosamente o significado de um layout, você pode causar confusão e desconfiança entre seu público-alvo.
|
||
|
|
|
||
|
|
Um erro comum que você pode cometer é determinar o layout com base no que acha melhor. Isso pode violar a ideia de convenções padrão e deve ser evitado até que você tenha mais experiência em design de layout.
|
||
|
|
|
||
|
|
Convenções Padrão é um termo usado para descrever um processo ou aplicação de uma técnica que tem aprovação geral do setor e aceitação cultural geral entre os usuários. Exemplos dessas convenções relacionadas ao layout estão listados abaixo:
|
||
|
|
|
||
|
|
* Colocação do texto do cabeçalho acima do parágrafo que está sendo descrito.
|
||
|
|
* Posicionamento de uma barra de navegação no topo da página.
|
||
|
|
* Uso de espaços em branco para separar diferentes seções e tipos de conteúdo.
|
||
|
|
* Falta de espaço em branco para reunir seções e tipos de conteúdo.
|
||
|
|
* Garantir que os elementos estejam limpos e organizados (ou seja, dois botões alinhados para serem visualmente aceitáveis)
|
||
|
|
* Simplicidade do layout de tal forma que é fácil de seguir e flui bem
|
||
|
|
* Uso de hierarquia visual para ajudar a manter o layout fluindo visualmente (tamanho, cor, posicionamento, etc)
|