Diagramação – Elementos e Tipos de Grids

3 de setembro de 2010 Artigos, Design Editorial 11 comentários

Hoje veremos um assunto muito importante para diagramadores, e também para designers, de como deixar páginas mais elaboradas e bem feitas, pois um dos segredos para um aspecto bom ou ruim de um texto em um layout é a diagramação, e hoje veremos sobre grid, seus elementos e tipos de grid, para você poder usá-los da melhor forma possível.

Grid

Diagramação é o ato de estruturar os elementos que irão compor o layout, de uma forma clara, de fácil entendimento e que também chame a atenção. Deve ser feito com uma aparência estética valiosa, pois a estética não é o mais importante em uma arte, mas ela é que a que causa o primeiro impacto, e assim deve ser feito o estudo de diagramação e grid para que a peça esteja totalmente usual.

Grid é a junção de todos os elementos visuais que estarão nessa peça gráfica para transmitir uma informação, conhecimento, sendo composto por conjuntos de “regras” como colunas e linhas, que funcionam como guias para a distribuição dos elementos visuais. Com a utilização do grid, existem muitas vantagens, como clareza e eficiência na transmissão de informação.

Elementos do Grid

Margens: são os espaços que sobram entre o limite do formato (tamanho da folha) e as áreas que serão usadas para a diagramação, como colunas e guias. Essa área é usada muito para colocar informações secundárias ou mesmo para área de descanso para os olhos.

Guia Horizontal: são faixas horizontais, que ajudam no alinhamento e estrutura o texto, a orientar os olhos na hora de escrever o texto e também é usada para criar pontos de partita ou pausas no texto, para ficar um aspecto mais criativo e diferente.

Colunas: são os alinhamentos verticais, que se cruzam com as guias horizontais, que criam divisões horizontais entre as margens. A quantidade e a largura delas depende muito de designer para designer, dependendo do tipo de trabalho ou quantidade de texto.

Modulos: são unidades individuais, como se fossem quadrados formados pela junção da coluna com a guia horizontal, e são separadas em espaços de tamanhos iguais, que repetidas por toda a página, criam colunas e faixas horizontais.

Zonas Espaciais: são um grupo de módulos, que formam um campo distinto. Cada zona espacial pode receber um tipo específico de informação, por exemplo uma foto, ou mesmo uma coluna com um texto mais importante.

Marcadores: Encontrados na parte externa, na margem, são os indicadores para textos secundários ou informações constantes, como cabeçalho, rodapé ou um elemento que ocupe sempre o mesmo lugar na página, como por exemplo, o nome do livro ou a página do mesmo.

Tipos de Grid

Retangular: É o grid mais simples. Tem a característica de  acomodar um longo texto corrido, como um livro ou um texto científico. Esse tipo de grid causa um grande cansaço, por ser muito simples, e com isso deve-se criar algo diferente para criar um estímulo a leitura, como tamanho do tipo, do espaçamento ou da margem.

De Colunas: O grid de colunas é flexível e pode ser utilizado para separar diversos tipos de texto ou mesmo informação. Ele pode ser composto por grids diferentes, cada um destinado a um tipo de conteúdo, por exemplo, em um site cada grid pode ter um tipo diferente de menu e imagem.

Modular: É o grid de coluna com muitas guias horizontais, criando módulos. Esse tipo de grid é originário da Bauhaus e do Estilo Internacional suíço. Muito usado para informações tabulares, gráficos, formulários e diagramas. Ele possui muitas vantagens com relação aos outros : Simplicidade nos grids; Unificação de diversos tipos de conteúdo, como textos e fotos no mesmos módulos; Combinação de 1, 2 e 3 larguras modulares.

Hierárquico: No grid hierárquico, a largura das colunas e entrecolunas varia. A página da Internet é um exemplo de grid hierárquico. O conteúdo dinâmico da maioria dos sites e o redimensionamento das janelas exigem flexibilidade na largura e no comprimento, característica desse tipo de grid.

Related Posts Plugin for WordPress, Blogger...

Cris Schiavenin

Meu nome é Cristiane Schiavenin, tenho 21 anos e sou do Interior do Rio Grande do Sul. Sou apaixonada pro Música , Filmes, Seriados, e apaixonada pelo Japão, pois sou super fã de Anime, Cultura antiga e Cultura pop Japonesa. Sou formada em Publicidade e Propaganda (curso tecnico), e no momento estou cursando Faculdade de Design. Trabalhei 3 anos em uma Gráfica Digital, mas há 6 meses, possuo minha própria empresa de adesivos decorativos e impressos: Meus Adesivos – Adesivos Personalizados. Nas horas vagas também faço layout de sites, e criação de logotipos e identidades visuais que é o meu xodó. No Choco La Design sou responsável pelas matérias sobre Produção Gráfica.

Veja todos os 67 posts publicados por Cristiane »

COMENTÁRIOS

  • Pingback: Diagramação – Elementos e Tipos de Grids « Designsal

  • http://Website Alex Fabiano

    Muito legal!!!

  • http://ronalddematos.blogspot.com/ Ronald

    Excelente blog… Continue com esse trabalho fantástico!!!

  • http://www.peleias.com.br Eric Peleias

    Cris,

    Parabéns. Fiquei curioso com a imagem que abre o texto. Parece um catálogo de vinhos inspirados em grandes designers com a estética do construtivismo russo. Poderia falar mais sobre ele? Você sabe quem criou?

  • http://www.diogodesign.com/ dinhojsb

    Conteúdo de primeira qualidade…parabéns !!

  • Tatiana Brandini

    Parabéns pelo conteúdo, Cris Schiavenin! Você tem ótimas fontes, pesquisa excelente e informa muito bem. Sucesso!!!!!!!

  • http://www.jacksonalves.com Jackson Alves

    Olá Cris, bacana o post. Só não concordo com a observação sobre o grid retangular — grid de uma coluna — causar um grande cansaso.

    O grid de uma coluna é o mais usado em livros justamente por proporcionar uma leitura mais confortável para grandes volumes de texto e proporcionar que o leitor possa “mergulhar” no texto — desde que sejam respeitadas certas regras do comprimento de linhas (veja Robert Bringhurst, Elementos do estilo tipográfico, pg. 37).

    O grid de múltiplas colunas é mais usados em textos de rápida leitura como revistas e informativos.

    Referente ao grid modular, esta imagem me parece mais se tratar de linhas de base do que módulos, o grid modular possui divisões horizontais maiores, como a largura das colunas (veja Ellen Lupton, Pensar com tipos, pg. 151).

    No mais, parabéns pelo blog.

  • Mohandas Hirata

    Ótimo post!

  • http://designices.com Rogerio Fratin

    Fonte…?

  • Rodrigo

    Ainda útil! valeu, gostei também das dicas dos livros.

  • Pingback: [Diagramação] Como Configurar o Grid no InDesign CS5 | Mito Freela | Soluções Gráficas e Digitais