Alinhamento e colunas
Por Paula Rocha.
Tabela de conteúdo |
[editar] Apresentação
Em tipografia, o alinhamento significa a definição da direção da margem de um texto e tem um papel muito importante na construção da conexão visual entre os elementos da página. Da mesma forma, as colunas são uma maneira de estruturação do texto escrito.
Por isso, este capítulo destina-se a entender melhor como funciona e quais as utilidades do alinhamento e das colunas.
[editar] Desenvolvimento
A partir do que explica Williams (1995, p. 61), o alinhamento pode ser considerado um recurso fundamental para a organização e unificação do conteúdo:
“A unidade é um conceito muito importante no design. Para que todos os elementos da página tenham uma estética unificada, conectada e inter-relacionada, é preciso que haja amarras visuais entre os elementos separados. Mesmo que eles não estejam próximos fisicamente na página, podem parecer conectados, relacionados, unificados a outras informações simplesmente pelo seu posicionamento.” (WILLIAMS, 1995)
Para fazer essa conexão, os diferentes tipos de alinhamento criam linhas imaginárias que ligam os elementos, sendo que cada um destes tipos apresenta certas características. O alinhamento centralizado, mais comum, é normalmente usado em textos curtos devido a sua pouca legibilidade; o justificado, onde todas as linhas têm a mesma largura, é muito usado em jornais e é uma solução prática, entretanto, pode prejudicar a harmonia do espaçamento entre letras; o alinhamento à direita também apresenta pouca legibilidade para textos longos, mas pode ser um destaque para escritos menores, já que marca fortemente a linha imaginária criada na página; e, finalmente, o alinhamento à esquerda, tradicionalmente mais legível por seguir a direção de leitura ocidental.
Além da questão da legibilidade, intrínseca ao alinhamento, há ainda a função estética do mesmo, pois a escolha de um tipo deles implica em certa aparência para o texto. O alinhamento centralizado, por exemplo, pode muitas vezes dar um caráter formal e pouco inovador à página, assim como o justificado pode aparentar ser muito rígido e monótono. Mas tudo depende do propósito do texto e da forma como os outros elementos são utilizados.
Estas produções gráficas, por exemplo, utilizam de maneira coerente o alinhamento centralizado: o primeiro valoriza o produto, já que este se torna o eixo principal de toda a página e o segundo, por sua vez, tem a adequação à forma como motivo para a centralização.
O exemplo acima mostra uma maneira criativa de usar o alinhamento justificado, retirando o seu caráter formal e sério como normalmente é usado. A brincadeira com as imagens motiva o tipo de alinhamento e o torna mais divertido.
Este exemplo mostra como usar diferentes tipos de alinhamento pode dar dinamicidade ao texto e não necessariamente causar confusão. Aqui, o alinhamento principal é o justificado, então os destaques estão à direita justamente para dar essa essa importância devida. Além disso, o alinhamento da página como um todo está à direita, o que abre espaço para a imagem.
Entretanto, apesar da facilidade de se compreender o alinhamento, a sua falta é um dos problemas mais comuns no design. Segundo William (op. C cit, p. 41), “provavelmente a falta de alinhamento seja a maior causa de materiais com uma aparência antiestética. Seus olhos gostam de ver tudo em ordem, pois isso cria uma sensação de calma e segurança”.
O site aparenta estar bagunçado pois apresenta alguns erros de alinhamento, como por exemplo no logo da CMDH: as palavras “Direitos Humanos” não estão alinhadas com a parte de cima (Prefeitura de São Paulo) e nem com a imagem, o que cria uma desconexão. Na verdade, existe um alinhamento "centralizado pelas bordas" que acaba gerando essa impressão de não alinhamento. No cabeçalho, o símbolo e o endereço “prefeitura.sp.gov.br” também não estão alinhados com a sigla “CMDH” que se encontra embaixo.
Este outro site não tem alinhamento nenhum por apresentar diferentes tipos de alinhamento em um mesmo layout: o título está centralizado, enquanto o texto principal está à esquerda e os boxes centralizados novamente, enfim, uma confusão. Ainda há elementos que não seguem ordem nenhuma, como o rodapé, que está centralizado, mas não a partir do mesmo centro que o título segue, causando uma grande poluição visual.
Por serem feitas sem consciência, quebras sutis como estas no alinhamento são consideradas erros e atrapalham a estética do texto. Porém, uma intervenção radical e consciente no alinhamento pode ser uma boa forma de tornar o texto mais atraente, já que abandona a obviedade. Mas isso só funciona quando os limites da página estão bem delimitados, então a mudança provoca um contraste, como podemos observar abaixo:
[editar] Colunas
Além do alinhamento, um recurso para organizar o texto é a sua divisão em colunas, que são mais um elemnto do grid. Elas são os alinhamentos verticais, que se cruzam com as guias horizontais, criando divisões horizontais entre as margens. Livros costumam usar uma ou duas colunas, revistas costumam usar duas ou três; jornais podem usar de cinco até sete. Quando existe mais do que uma coluna, elas são separadas por um espaço em branco denominado goteira, que, antigamente, costumava ser preenchido por um filete para acentuar a separação entre as colunas. Hoje, as goteiras são quase sempre um espaço deixado em branco. A largura de uma coluna depende de fatores estéticos e funcionais. Como constitui a principal forma de estruturar o texto corrido, a tendência é a de subordinar a largura da coluna à dimensão das linhas de texto, ao corpo da fonte usada e à legibilidade do texto.
Além disso, uma importante questão que envolve as colunas é a inserção de imagens entre elas. É necessário tomar o cuidado de posicionar a imagem de uma maneira que ela não fique negligenciada, já que a atenção do leitor "pula" de uma linha a outra. A melhor forma de evitar que a imagem não seja vista é colocando-a entre as colunas (e não como parte do texto), pois assim a atenção do leitor passará por ela várias vezes durante a leitura.
Abaixo podemos observar diferentes maneiras de inserir uma imagem em uma diagramação com colunas:
O primeiro exemplo, mais comum, pode ser uma boa disposição para a imagem, pois ela aparece imponente sobre o texto. O segundo e terceiro exemplos mostram maneiras mais criativas de dar destaque à imagem: elas estão entre as colunas, mas não com o mesmo tamanho e formato das mesmas, o que provoca uma quebra de alinhamento proposital e bem colocada.
[editar] Conclusão
Tanto o alinhamento quanto as colunas são formas de organizar o texto, tanto esteticamente como funcionalmente. Sem essas "ferramentas", toda criação com fontes demandaria mais esforço para ser compreendida ou talvez nem o fosse, por isso,vê-se a importância de um bom alinhamento para a manutenção da unidade da peça criada.
[editar] Glossário
Goteira: espaço de separação entre colunas, normalmente deixado em branco.
[editar] Referências
WILLIAMS, Robin. Design para quem não é designer: noções básicas e planejamento visual. São Paulo: Callis, 1995.
LUPTON, Ellen. Pensar com tipos.
SAMARA, Timothy. Grid: Construção e Desconstrução
www.chocoladesign.com
