SlideShare uma empresa Scribd logo
1 de 3
O design equilibrado. Os alinhamentos 
Necessários para conseguir uma composição ordenada e lógica, assim 
como para relacionar elementos. 
Uma vez definido o reticulado que vamos usar em nossa composição, deveremos 
situar na mesma os elementos gráficos e textuais. 
Neste ponto aparece o conceito de alinhamento, como a colocação de elementos 
gráficos e textuais segundo uma linha dada, que geralmente será horizontal ou 
vertical. Geralmente haverá várias linhas guias de alinhamento em uma 
composição. 
Alinhar os elementos é uma operação imprescindível para conseguir uma 
composição ordenada e lógica, pois com isso se criam unidades visuais definidas e 
relações entre elementos. 
Se o alinhamento é importante na hora de situar elementos gráficos, será ainda 
mais se se trata de conteúdos textuais. Efetivamente, os textos perfeitamente 
alinhados são mais fáceis de ler, não cansam a vista e produzem um efeito de 
equilíbrio que convida à leitura. Ao contrário, um texto sem alinhamento resulta 
confuso, difícil de ler, desmotivando ao espectador. 
Tudo o que está sendo falado se acentua ainda mais se o suporte é uma página 
web, já que a forma do monitor e da janela do navegador impulsiona o uso de 
contornos retangulares, que unicamente se conseguem com alinhamentos perfeitos. 
Ademais, muitas vezes devemos desenhar as páginas com um importante número 
de elementos, por isso se a disposição dos mesmos não for perfeitamente regular 
será muito difícil criar uma composição aceitável. 
Os alinhamentos horizontais são imprescindíveis para conseguir um desenho em 
níveis estáveis, já que as linhas horizontais sugerem equilíbrio. Como podemos ter 
blocos lógicos de diferente altura, estes alinhamentos se definirão desde as bordas 
superiores dos blocos. 
Alinhamentos horizontais em EresMas 
Quanto às verticais, o alinhamento mais comum é a esquerda, já que é a normal 
nos livros e demais suportes textuais, estando nossa vista educada para tratar com 
ela.
Alinhamentos de textos à esquerda 
Os alinhamentos centralizados são pouco comuns, salvo no caso de tabelas de 
dados com colunas que admitam bem este tipo de alinhamento, sobretudo se todos 
os valores da coluna tiverem a mesma largura. Se não for assim, é preferível optar 
pelo alinhamento à esquerda. 
Elementos centralizados em uma tabela 
Quanto aos alinhamentos à direita, são pouco freqüentes, já que criam tensões 
visuais na maioria dos casos. Podem-se usar naqueles blocos cujo conteúdo deva 
se adaptar a um reticulado que defina uma linha vertical à direita do mesmo, como 
ocorre em muitos menus de navegação situados à esquerda da página. 
Também são úteis nas colunas das tabelas que contiverem dados que devam seguir 
uma ordenação lógica a direitas, como é o caso de dados de moeda. 
Adequando o alinhamento ao tipo de dados de cada campo 
Existe outro tipo de alinhamento para textos, o justificado, no qual todas as linhas 
de texto têm a mesma largura, por isso ficam alinhadas tanto a esquerda quanto a 
direita, o que se consegue aumentando ou diminuindo o espaçado normal das 
letras. Este tipo de alinhamento é muito usado nos livros e jornais, porém nas 
páginas web há que aplicá-lo com precaução, destinando-o somente a blocos 
textuais de pouco largura (textos distribuídos em várias colunas, por exemplo).
Por último, vale dizer que se os alinhamentos são imprescindíveis, podem originar 
monotonia visual se forem seguidos ao pé da letra, ao produzir páginas quadradas 
e artificiais demais. Por isso, é bom introduzir alguns elementos que, sem romper o 
reticulado e os alinhamentos básicos, introduzam um pouco de variedade visual, de 
frescor no desenho. Buscar o equilíbrio entre alinhamentos e elementos que as 
rompam é uma das tarefas principais do web designer. 
Autoria e outras referências sobre este artigo 
Dentro deste artigo: 
+ 1 manual relacionado 
+ 2 Categorias relacionadas 
Informe de Luciano Moreno 
URL: http://www.htmlweb.net/ 
Acrescentar um comentário do artigo 
Manuais relacionados com este artigo 
Dentro de Curso prático de Web Design 
Seguinte: O design equilibrado. As simetrias 
Anterior: O design equilibrado. O reticulado 
< Índice de Curso prático de Web Design 
Categorias relacionadas 
Através das categorias do nosso diretório podem ser encontrados outros tipos de recursos relacionados 
com este artigo: 
+ Entrar em Design 
+ Entrar em Guias de desenho

Mais conteúdo relacionado

Semelhante a Equilíbrio visual com alinhamentos

Semelhante a Equilíbrio visual com alinhamentos (11)

O design equilibrado9
O design equilibrado9O design equilibrado9
O design equilibrado9
 
Composição gráfica
Composição gráficaComposição gráfica
Composição gráfica
 
A cor na web 1 3
A cor na web 1 3A cor na web 1 3
A cor na web 1 3
 
Formas básicas em design gráfico 4 o quadrado
Formas básicas em design gráfico 4   o quadradoFormas básicas em design gráfico 4   o quadrado
Formas básicas em design gráfico 4 o quadrado
 
Aula 06 linguagem visual
Aula 06   linguagem visualAula 06   linguagem visual
Aula 06 linguagem visual
 
aula-6_principios_design.pdf
aula-6_principios_design.pdfaula-6_principios_design.pdf
aula-6_principios_design.pdf
 
Design
DesignDesign
Design
 
Passos essenciais para criar um documento word acessível
Passos essenciais para criar um documento word acessível  Passos essenciais para criar um documento word acessível
Passos essenciais para criar um documento word acessível
 
Passos essenciais para criar um documento word acessível
Passos essenciais para criar um documento word acessível  Passos essenciais para criar um documento word acessível
Passos essenciais para criar um documento word acessível
 
Aula 5 - Comunicação Gráfica e Design
Aula 5   - Comunicação Gráfica e DesignAula 5   - Comunicação Gráfica e Design
Aula 5 - Comunicação Gráfica e Design
 
Diagramacao ua
Diagramacao uaDiagramacao ua
Diagramacao ua
 

Mais de Blogotipos - Diário das Marcas

Mais de Blogotipos - Diário das Marcas (20)

Teoria das cores
Teoria das coresTeoria das cores
Teoria das cores
 
Significado das cores para outros paises
Significado das cores para outros paisesSignificado das cores para outros paises
Significado das cores para outros paises
 
Significado das cores riccardo benetti
Significado das cores   riccardo benettiSignificado das cores   riccardo benetti
Significado das cores riccardo benetti
 
Hsv
HsvHsv
Hsv
 
Entendendo as cores e seus significados
Entendendo as cores e seus significadosEntendendo as cores e seus significados
Entendendo as cores e seus significados
 
Daltonismo
DaltonismoDaltonismo
Daltonismo
 
Cor
CorCor
Cor
 
Cor nas artes visuais
Cor nas artes visuaisCor nas artes visuais
Cor nas artes visuais
 
Cor na teatro
Cor na teatroCor na teatro
Cor na teatro
 
Cor na sinalização
Cor na sinalizaçãoCor na sinalização
Cor na sinalização
 
Cor na psicologia
Cor na psicologiaCor na psicologia
Cor na psicologia
 
Cor na moda
Cor na modaCor na moda
Cor na moda
 
Cor na arquitectura
Cor na arquitecturaCor na arquitectura
Cor na arquitectura
 
Cor azul
Cor azulCor azul
Cor azul
 
Anexo lista de cores
Anexo   lista de coresAnexo   lista de cores
Anexo lista de cores
 
A cor
A corA cor
A cor
 
Teoria da cor estudo de algumas cores ii
Teoria da cor   estudo de algumas cores iiTeoria da cor   estudo de algumas cores ii
Teoria da cor estudo de algumas cores ii
 
Teoria da cor estudo de algumas cores i
Teoria da cor   estudo de algumas cores iTeoria da cor   estudo de algumas cores i
Teoria da cor estudo de algumas cores i
 
Teoria da cor estudo de algumas cores ii
Teoria da cor   estudo de algumas cores iiTeoria da cor   estudo de algumas cores ii
Teoria da cor estudo de algumas cores ii
 
Formas básicas em design gráfico
Formas básicas em design gráficoFormas básicas em design gráfico
Formas básicas em design gráfico
 

Equilíbrio visual com alinhamentos

  • 1. O design equilibrado. Os alinhamentos Necessários para conseguir uma composição ordenada e lógica, assim como para relacionar elementos. Uma vez definido o reticulado que vamos usar em nossa composição, deveremos situar na mesma os elementos gráficos e textuais. Neste ponto aparece o conceito de alinhamento, como a colocação de elementos gráficos e textuais segundo uma linha dada, que geralmente será horizontal ou vertical. Geralmente haverá várias linhas guias de alinhamento em uma composição. Alinhar os elementos é uma operação imprescindível para conseguir uma composição ordenada e lógica, pois com isso se criam unidades visuais definidas e relações entre elementos. Se o alinhamento é importante na hora de situar elementos gráficos, será ainda mais se se trata de conteúdos textuais. Efetivamente, os textos perfeitamente alinhados são mais fáceis de ler, não cansam a vista e produzem um efeito de equilíbrio que convida à leitura. Ao contrário, um texto sem alinhamento resulta confuso, difícil de ler, desmotivando ao espectador. Tudo o que está sendo falado se acentua ainda mais se o suporte é uma página web, já que a forma do monitor e da janela do navegador impulsiona o uso de contornos retangulares, que unicamente se conseguem com alinhamentos perfeitos. Ademais, muitas vezes devemos desenhar as páginas com um importante número de elementos, por isso se a disposição dos mesmos não for perfeitamente regular será muito difícil criar uma composição aceitável. Os alinhamentos horizontais são imprescindíveis para conseguir um desenho em níveis estáveis, já que as linhas horizontais sugerem equilíbrio. Como podemos ter blocos lógicos de diferente altura, estes alinhamentos se definirão desde as bordas superiores dos blocos. Alinhamentos horizontais em EresMas Quanto às verticais, o alinhamento mais comum é a esquerda, já que é a normal nos livros e demais suportes textuais, estando nossa vista educada para tratar com ela.
  • 2. Alinhamentos de textos à esquerda Os alinhamentos centralizados são pouco comuns, salvo no caso de tabelas de dados com colunas que admitam bem este tipo de alinhamento, sobretudo se todos os valores da coluna tiverem a mesma largura. Se não for assim, é preferível optar pelo alinhamento à esquerda. Elementos centralizados em uma tabela Quanto aos alinhamentos à direita, são pouco freqüentes, já que criam tensões visuais na maioria dos casos. Podem-se usar naqueles blocos cujo conteúdo deva se adaptar a um reticulado que defina uma linha vertical à direita do mesmo, como ocorre em muitos menus de navegação situados à esquerda da página. Também são úteis nas colunas das tabelas que contiverem dados que devam seguir uma ordenação lógica a direitas, como é o caso de dados de moeda. Adequando o alinhamento ao tipo de dados de cada campo Existe outro tipo de alinhamento para textos, o justificado, no qual todas as linhas de texto têm a mesma largura, por isso ficam alinhadas tanto a esquerda quanto a direita, o que se consegue aumentando ou diminuindo o espaçado normal das letras. Este tipo de alinhamento é muito usado nos livros e jornais, porém nas páginas web há que aplicá-lo com precaução, destinando-o somente a blocos textuais de pouco largura (textos distribuídos em várias colunas, por exemplo).
  • 3. Por último, vale dizer que se os alinhamentos são imprescindíveis, podem originar monotonia visual se forem seguidos ao pé da letra, ao produzir páginas quadradas e artificiais demais. Por isso, é bom introduzir alguns elementos que, sem romper o reticulado e os alinhamentos básicos, introduzam um pouco de variedade visual, de frescor no desenho. Buscar o equilíbrio entre alinhamentos e elementos que as rompam é uma das tarefas principais do web designer. Autoria e outras referências sobre este artigo Dentro deste artigo: + 1 manual relacionado + 2 Categorias relacionadas Informe de Luciano Moreno URL: http://www.htmlweb.net/ Acrescentar um comentário do artigo Manuais relacionados com este artigo Dentro de Curso prático de Web Design Seguinte: O design equilibrado. As simetrias Anterior: O design equilibrado. O reticulado < Índice de Curso prático de Web Design Categorias relacionadas Através das categorias do nosso diretório podem ser encontrados outros tipos de recursos relacionados com este artigo: + Entrar em Design + Entrar em Guias de desenho