O design equilibrado6

3

Click here to load reader

description

Cores

Transcript of O design equilibrado6

Page 1: O design equilibrado6

O design equilibrado Os alinhamentos

Necessaacuterios para conseguir uma composiccedilatildeo ordenada e loacutegica assim como para relacionar elementos

Uma vez definido o reticulado que vamos usar em nossa composiccedilatildeo deveremos

situar na mesma os elementos graacuteficos e textuais

Neste ponto aparece o conceito de alinhamento como a colocaccedilatildeo de elementos

graacuteficos e textuais segundo uma linha dada que geralmente seraacute horizontal ou

vertical Geralmente haveraacute vaacuterias linhas guias de alinhamento em uma

composiccedilatildeo

Alinhar os elementos eacute uma operaccedilatildeo imprescindiacutevel para conseguir uma

composiccedilatildeo ordenada e loacutegica pois com isso se criam unidades visuais definidas e

relaccedilotildees entre elementos

Se o alinhamento eacute importante na hora de situar elementos graacuteficos seraacute ainda

mais se se trata de conteuacutedos textuais Efetivamente os textos perfeitamente

alinhados satildeo mais faacuteceis de ler natildeo cansam a vista e produzem um efeito de

equiliacutebrio que convida agrave leitura Ao contraacuterio um texto sem alinhamento resulta

confuso difiacutecil de ler desmotivando ao espectador

Tudo o que estaacute sendo falado se acentua ainda mais se o suporte eacute uma paacutegina

web jaacute 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 paacuteginas com um importante nuacutemero

de elementos por isso se a disposiccedilatildeo dos mesmos natildeo for perfeitamente regular

seraacute muito difiacutecil criar uma composiccedilatildeo aceitaacutevel

Os alinhamentos horizontais satildeo imprescindiacuteveis para conseguir um desenho em

niacuteveis estaacuteveis jaacute que as linhas horizontais sugerem equiliacutebrio Como podemos ter

blocos loacutegicos de diferente altura estes alinhamentos se definiratildeo desde as bordas

superiores dos blocos

Alinhamentos horizontais em EresMas

Quanto agraves verticais o alinhamento mais comum eacute a esquerda jaacute que eacute a normal

nos livros e demais suportes textuais estando nossa vista educada para tratar com

ela

Alinhamentos de textos agrave esquerda

Os alinhamentos centralizados satildeo 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 natildeo for assim eacute preferiacutevel optar

pelo alinhamento agrave esquerda

Elementos centralizados em uma tabela

Quanto aos alinhamentos agrave direita satildeo pouco frequumlentes jaacute que criam tensotildees

visuais na maioria dos casos Podem-se usar naqueles blocos cujo conteuacutedo deva

se adaptar a um reticulado que defina uma linha vertical agrave direita do mesmo como

ocorre em muitos menus de navegaccedilatildeo situados agrave esquerda da paacutegina

Tambeacutem satildeo uacuteteis nas colunas das tabelas que contiverem dados que devam seguir

uma ordenaccedilatildeo loacutegica a direitas como eacute 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 tecircm a mesma largura por isso ficam alinhadas tanto a esquerda quanto a

direita o que se consegue aumentando ou diminuindo o espaccedilado normal das

letras Este tipo de alinhamento eacute muito usado nos livros e jornais poreacutem nas

paacuteginas web haacute que aplicaacute-lo com precauccedilatildeo destinando-o somente a blocos

textuais de pouco largura (textos distribuiacutedos em vaacuterias colunas por exemplo)

Por uacuteltimo vale dizer que se os alinhamentos satildeo imprescindiacuteveis podem originar

monotonia visual se forem seguidos ao peacute da letra ao produzir paacuteginas quadradas

e artificiais demais Por isso eacute bom introduzir alguns elementos que sem romper o

reticulado e os alinhamentos baacutesicos introduzam um pouco de variedade visual de

frescor no desenho Buscar o equiliacutebrio entre alinhamentos e elementos que as

rompam eacute uma das tarefas principais do web designer

Autoria e outras referecircncias sobre este artigo

Dentro deste artigo + 1 manual relacionado + 2 Categorias relacionadas

Informe de Luciano Moreno URL httpwwwhtmlwebnet

Acrescentar um comentaacuterio do artigo

Manuais relacionados com este artigo

Dentro de Curso praacutetico de Web Design

Seguinte O design equilibrado As simetrias

Anterior O design equilibrado O reticulado

lt Iacutendice de Curso praacutetico de Web Design

Categorias relacionadas Atraveacutes das categorias do nosso diretoacuterio podem ser encontrados outros tipos de recursos relacionados com este artigo

+ Entrar em Design

+ Entrar em Guias de desenho

Page 2: O design equilibrado6

Alinhamentos de textos agrave esquerda

Os alinhamentos centralizados satildeo 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 natildeo for assim eacute preferiacutevel optar

pelo alinhamento agrave esquerda

Elementos centralizados em uma tabela

Quanto aos alinhamentos agrave direita satildeo pouco frequumlentes jaacute que criam tensotildees

visuais na maioria dos casos Podem-se usar naqueles blocos cujo conteuacutedo deva

se adaptar a um reticulado que defina uma linha vertical agrave direita do mesmo como

ocorre em muitos menus de navegaccedilatildeo situados agrave esquerda da paacutegina

Tambeacutem satildeo uacuteteis nas colunas das tabelas que contiverem dados que devam seguir

uma ordenaccedilatildeo loacutegica a direitas como eacute 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 tecircm a mesma largura por isso ficam alinhadas tanto a esquerda quanto a

direita o que se consegue aumentando ou diminuindo o espaccedilado normal das

letras Este tipo de alinhamento eacute muito usado nos livros e jornais poreacutem nas

paacuteginas web haacute que aplicaacute-lo com precauccedilatildeo destinando-o somente a blocos

textuais de pouco largura (textos distribuiacutedos em vaacuterias colunas por exemplo)

Por uacuteltimo vale dizer que se os alinhamentos satildeo imprescindiacuteveis podem originar

monotonia visual se forem seguidos ao peacute da letra ao produzir paacuteginas quadradas

e artificiais demais Por isso eacute bom introduzir alguns elementos que sem romper o

reticulado e os alinhamentos baacutesicos introduzam um pouco de variedade visual de

frescor no desenho Buscar o equiliacutebrio entre alinhamentos e elementos que as

rompam eacute uma das tarefas principais do web designer

Autoria e outras referecircncias sobre este artigo

Dentro deste artigo + 1 manual relacionado + 2 Categorias relacionadas

Informe de Luciano Moreno URL httpwwwhtmlwebnet

Acrescentar um comentaacuterio do artigo

Manuais relacionados com este artigo

Dentro de Curso praacutetico de Web Design

Seguinte O design equilibrado As simetrias

Anterior O design equilibrado O reticulado

lt Iacutendice de Curso praacutetico de Web Design

Categorias relacionadas Atraveacutes das categorias do nosso diretoacuterio podem ser encontrados outros tipos de recursos relacionados com este artigo

+ Entrar em Design

+ Entrar em Guias de desenho

Page 3: O design equilibrado6

Por uacuteltimo vale dizer que se os alinhamentos satildeo imprescindiacuteveis podem originar

monotonia visual se forem seguidos ao peacute da letra ao produzir paacuteginas quadradas

e artificiais demais Por isso eacute bom introduzir alguns elementos que sem romper o

reticulado e os alinhamentos baacutesicos introduzam um pouco de variedade visual de

frescor no desenho Buscar o equiliacutebrio entre alinhamentos e elementos que as

rompam eacute uma das tarefas principais do web designer

Autoria e outras referecircncias sobre este artigo

Dentro deste artigo + 1 manual relacionado + 2 Categorias relacionadas

Informe de Luciano Moreno URL httpwwwhtmlwebnet

Acrescentar um comentaacuterio do artigo

Manuais relacionados com este artigo

Dentro de Curso praacutetico de Web Design

Seguinte O design equilibrado As simetrias

Anterior O design equilibrado O reticulado

lt Iacutendice de Curso praacutetico de Web Design

Categorias relacionadas Atraveacutes das categorias do nosso diretoacuterio podem ser encontrados outros tipos de recursos relacionados com este artigo

+ Entrar em Design

+ Entrar em Guias de desenho