Diagramação 01.3

DiagramaçãoAbreu® 2013

Anatomia da Página

Unidade 01


Conceito

Diagramação ou Paginaçãoé o ato de diagramar (paginar) e diz respeito a distribuir os elementos gráficos (texto, imagem, etc.) no espaço limitado da página impressa ou outros meios. Entre as diretrizes principais da diagramação podemos destacar a hierarquia tipográfica e a legibilidade. A diagramação é aplicada em diversas mídias como jornais, livros, revistas cartazes, sinalização, websites entre outros.


Anatomiada página

Formato:é o ponto de partida. Trata-se das dimensões da página. Deverá ser adequado ao tipo de projeto de maneira ergonômica, ou seja, nem grande ou excessivamente pequeno. Geralmente suas dimensões são dadas em milímetros.


Centro Geométrico:é exatamente o centro da folha nos sentidos horizontal e vertical. Pode-se obtê-lo, trançando duas diagonais de cima para baixo da esquerda para direita e depois o inverso.


Anatomiada página

Centro Ótico:é um local no qual geralmente fixamos o olhar. O centro óptico é obtido pela divisão ao meio da metade superior da folha.


Anatomiada página

Margens:espaços localizados ao redor da folha no lado interno. Servem para dar um descanso visual e não permitem que as informações presentes nas páginas encostem nas bordas das folha, salvo quando existirem sangrias. É nas margens que são aplicados o cabeçalho e rodapé.


Anatomiada página

Mancha:área interna às margens. Nela, será distribuído o alinhamento dos objetos e calculada a quantidade de texto.


Anatomiada página

Colunas:são divisões simétricas que dividem a página, afim de adequá-la melhor ao conteúdo e às necessidades do projeto.


Anatomiada página

Intervalo entre Colunas:deve ser coerente com o tamanho das colunas e da página. Não é preciso aproximar ou afastar em demasia.Um módulo (ou valor do entrelinhamento do texto) é suficiente em termos gerais.


X = um módulo Hent pra et volesti ipsan-tem quuntis qui sincienih-ita plia quibus eum quoE-bis nos sed quiaccum que essunt quisti ore voloreptas verovid eli-quatempor modi ut fuga. Nequid qu e doluptibus reraec te o lupta voles abor aliciis ad magni qui optae. Nem dit quis dolest mossus debit verionecto

X

X


Anatomiada página

VariaçõesColunas


Por que utilizarum grid?

O grid fornece uma estrutura para todos os elementos de design de uma página, o que facilita e simplifica os processos de criação e de tomada de decisão por parte do designer. Utili-zar um grid aumenta a precisão e a consistência da localiza-ção dos elementos da página, fornecendo uma estrutura para diagramação.


Modelo de JanTschichold

Como construir um grid? (A) altura do bloco de texto é igual à largura da página (B). As margens superior e interna equivalem a 1/9 da página. A largura da margem interna equivale a 1/2 da margem externa.


Como utilizarum grid?

Um grid equilibrado pode se tornar limitado e repetitivo quando usado em páginas sucessivas. Porém, esse grid um tanto formal e funcional pode ser adaptado e melhorado por meio do acréscimo de outros elementos da página - fólios, títulos, rodapés.


Elementosdo Grid

O grid é formado por:• colunas;• margens;• módulos;• zonas espaciais;• guias;• marcadores;


Tipos deGrids

Uma coluna:Estrutura muito adequada para trabalhos editoriais cujo fluxo de texto é corrido e contínuo.

Ex.: relatórios, livros, etc.


Tipos deGrids

Duas colunas:É um grid bastante utilizado em revistas e informativos, por serem publicações onde é grande o volume de texto, akém de possuírem diferentes tipos de informação.


Tipos deGrids

Múltiplas colunas:Esse grid combina várias colunas de largura diferentes, porém proporcionais.

Muito comum em páginas da internet e revistas.


Tipos deGrids

Grid modular:Organizam informações compostas por muitas partes, em espaços menores (módulo). São exemplos gráficos, tabelas e calendários.


Tipos deGrids

Grid hierárquico:É aquele que organiza as informações da página em áreas horizontais, estabelecidas como “colunas” e não como linhas.

Ex.: Sites de busca.


Como utilizarum grid?


Dicas:Um bom grid deve considerar fatores como:• o conteúdo da peça gráfica;• características específicas da produção;• definição do formato;• escolha da tipografia;• entre outros aspectos;

Construçãode grids

Diagramação 01.3

Documents

Transcript of Diagramação 01.3