Login:

iMasters | Por uma internet mais criativa e dinâmica

Feeds

Teoria/Design

Feed da seção Teoria/Design

Newsletter de Teoria/Design


Sexta-feira, 13/12/2002 - 03:59 - Por Redação iMasters
Seções relacionadas:

Tipografia: fazendo as palavras sobressairem o tempo todo

Fonte: Stephen Van Doren

A tipografia tem sofrido um bocado nos domínios digitais da internet. De sites que usam o tamanho padrão 100% e preto com Times New Roman até as pessoas que pensam que você deve ter as mesmas fontes que elas tem instaladas, temos sacrificado muito da nossa integridade como designers. Alguns pode até pensar que o surgimento dos Style Sheets - o tratamento tipográfico é suportado em quase todos os browsers que aceitam includes, em grande extensão, Netscape 4 - não deveríamos ter como superadas essas barreiras.

Contudo, a vasta maioria de desenvolvedores independentes de internet acham que a tipografia na web nunca será como é no papel, então porque se importar?

Francamente, minha opinião é que isso é algo em que devemos começar a nos concentrar. E logo.

Não há razão alguma para lamentar a futilidade de usar algumas características proprietárias no texto HTML. Isto não vai alterar o futuro próximo. Se você está realmente entre aqueles que pensam assim, faça todo o conteúdo em Flash, onde você tem total controle de como seus tipos irão aparecer e se comportar em qualquer monitor.

Caso contrário, vamos em frente.

Times New Roman, a primeira barreira

Primeiramente vamos dar uma olhada na disponibilidade das fontes que você pode usar na web. Claro, existem a Times New Roman e a Arial. Todo mundo sabe delas. Temos escutado de nossos colegas da área impressa que em tamanhos suficientemente grandes, a Times New Roman é a fonte disponível mais legível. As serifas, embora perturbem uma pequena minoria, ajudam o leitor a passar os olhos sobre as palavras numa velocidade considerável. A Arial, sem nenhuma serifa, tende a fazer o leitor concentrar-se ligeiramente melhor. Isto não é realmente um problema, uma vez que a maioria dos internautas hoje em dia estão acostumados a tipos de fontes sem serifa, as quais fomos criados para amar, e nenhuma delas será a mais lembrada. Os resultados são os mesmos quando Helvetica, Geneva e Palatino são especificadas para usuários de Macintosh.

Nos últimos dois anos ou menos, um bando de novas fontes tem tomado a web como uma tempestade, graças à Microsoft. As primeiras da fila são Verdana e Georgia, ambas projetadas por Matthew Carter. Ambas as fontes estão imediatamente disponíveis e configuradas padrão em praticamente todas as máquinas nas quais o Internet Explorer foi instalado. E nós, como desenvolvedores de web, temos nos sentido perfeitamente confortáveis usando-as como padrão. Especificar tipos para Linux é algo mais que um desafio, mas falando meio por cima você pode nutrir a esperança de que eles também terão essas fontes instaladas.

Isto tudo não é novidade. Isto é o que temos tentado fazer por um bom tempo. Eu já nem posso mais contar o número de vezes em que tive de conversar com um programador sobre a tipografia de elementos estabelecidos colocando de lado coisas importantes, usando os tipos para trasmitir algum capricho.

Mas será que é apenas isso que temos à nossa disposição? Será isso tudo apenas a formatação de grandes blocos de texto? Satisfeito? É isso tudo que está para mudar a web? Eu espero que não. Seja bem-vindo à hierarquia da tipografia e aos inerentes benefícios que ela oferece.

Novos passos em negrito

Você pode notar que a Digital Web Magazine (N.T.: este artigo foi traduzido deste site que acaba de ser citado, vale a pena conhecê-lo para compreender melhor as idéias do autor. O link abre em outra janela.) é formatada com diversos formatos tipográficos por hierarquia. Isto é extremamente importante num site que possua muito conteúdo. Primeiro de tudo, isto torna o conteúdo interessante. Até algo simples como uma palavra em itálico ou em negrito faz com que a palavra/frase fique mais interessante, e que ao mesmo tempo deve ser enfatizado.

Olhando para usos isolados de itálico ou negrito, você pode ver uma tendência, um hábito de aplicação. Simplesmente mudando uma palavra que você julga importante (como eu acabei de fazer nesta frase), você não leva o leitor ao ponto - apenas o confunde, e ele procurará buscar a informação/produto em outra parte.

Vamos imaginar que se tenha um pedaço de texto num site falando sobre encanamentos. E o conteúdo fosse como esse:

Ser encanamendor é fácil e divertido! Qualquer um pode fazê-lo, e ainda economizar um bom dinheiro para melhorar a casa e resolver apuros!

...então o público iria deduzir algumas coisas sobre como o autor se sente sobre encanamentos (e é como ele queria que tivessem essa impressão, de fato).

Primeiramente, o autor está levando ao ponto de que qualquer que pode fazer o serviço. Pense na frase novamente e enfatize a palavra "pode". Você notará que isso soa superior, condescendente. Além disso, o público veria que a única razão para ser encanador seria melhorar as instalações da casa e resolver apuros. Se a proposta fosse vender algo, teria falhado. Reescrevendo a frase...

Ser encanamendor é fácil e divertido! Qualquer um pode fazê-lo, e ainda economizar um bom dinheiro para melhorar a casa e resolver apuros!

...então a frase levaria ao ponto de economizar dinheiro - algo com que qualquer um se identifica. Deu para perceber uma tendência?

Títulos que Falam

Títulos são um importante aspecto da tipografia na web (assim como no design gráfico). O que seria importante para um leitor para vendê-lo equipamentos de encanamento? A marca, o preço e o porque se deveria comprá-lo, correto? Bem, nós podemos usar a tipografia como mais uma ferramenta para fazer desta uma tarefa mais fácil.

Recentemente vi um comercial de televisão dos Fundos Janus. Fiquei admirado com a incrível tipografia que eles escolheram. As palavras caíam através da tela enquanto o narrador as pronunciava. Mas alguma coisa me chamou a atenção: na frase "Janus pode ajudá-lo a economizar dinheiro e manter seu negócio vivo", as palavras "Janus", "dinheiro" e "vivo" apareceram por um pouco mais de tempo que as demais. Por um tempo ínfimo, apenas as palavras "Janus", "dinheiro" e "vivo" aparecem na tela. Claramente, isso não diz muita coisa, a não ser pleo fato de que o Janus é algo sobre dinheiro e manter-se vivo. Você também sabe que o Janus trabalha exclusivamente para negócios, portanto sua mente conclui que eles irão salvar seu negócio do fim.

Faz sentido? É tão sutil quanto efetivo.

Porque mencionei tudo isso? Simples. Se você está usando os títulos com eficácia (assim como "Janus", "dinheiro" e "vivo" são títulos no comercial e foram usados eficientemente) então seu público é capaz de pular de ponto em ponto, prestando menos atenção e aprendendo mais. Para que isso?

Porque - sejamos honestos - seu público não irá perder um tempão lendo seu texto de missão corporativa. Transforme tudo em pedaços, dê um título sujestivo e vamos em frente!

Imagens Típicas

O último passo para vincular tudo por completo é o trabalho com imagens que você fizer que fará de seu design um todo. Estou falando sobre seu sistema de navegação, assim como as fontes que você usa para transmitir seu estilo em seu design em geral.

Se todo seu conteúdo, por exemplo, está em Times New Roman, seus títulos de segundo nível estão escritos em Georgia e seu título principal em Georgia caixa alta, isto só fará sentido se seus elementos gráficos estiverem com uma fonte serifada, preferencialmente algo que combine bem com a fonte serifada do corpo do texto.

Isto é o que se entende por consistência. Eu jamais ousaria sugerir que se usasse a mesma fonte para tudo - isto é simplesmente chato - mas vincular seu sistema de navegação, por exemplo, com seu conteúdo, faz todo sentido.

Divirta-se no resto das coisas, mas mantenha-as juntas. Combine-as!

Até muito recentemente, era assumido que a tipografia na web tinha os designers pela garganta. Essas regras estão mudando rapidamente e é importante para nós ficar lado-a-lado das novas possibilidades de desenvolvimento. Flash, CSS e outras ferramentas tem nos dado a habilidade de manter nosso público interessado em nossas palavras, enquanto ao mesmo tempo preservamos razoáveis tempos de download e mante-mos os sites altamente práticos.

Além Disso Tudo

Eu mencionei previamente que alguns elementos sobre tipos devem ser vistos à parte, ou algum conteúdo irá falhar ao tentar captar o interesse do leitor.

Não estamos colocando livros online, um fato que pede por um novo direcionamento. O melhor exemplo de bom direcionamento que tenho visto online (consistentemente) tem sido a Adobe. Em seus artigos (assim como no HTMHell por Jeffrey Zeldman), partes do corpo do texto são cortadas fora e transformadas em elementos gráficos para dar ao leitor um ponto de foco (uma frase, talvez duas) que ajudarão a decidir se o artigo será vagamente interessante.

Esta é uma ferramenta potente para uso dos designers. Cotar o artigo numa barra lateral (ou bloco "flutuante") e dar uma chance ao leitor para decidir se o conteúdo é importante o suficiente para ser lido.

Não apenas esta técnica de design nos dá a oportunidade de usar uma determinada fonte como um mecanismo de design no conteúdo, mas também faz do conteúdo algo mais fácil de se ler. Simplesmente colocado, o elemento gráfico irá quebrar o conteúdo suficientemente para, mesmo que haja muito texto a ser lido, não seja tão monótono. Tente fazer a quebra a cada 5 ou 6 parágrafos - você ficará surpreso com a força do que acabara de desencadear.

Estes elementos são especialmente efetivos como títulos para o conteúdo. Cada um serve como apoio para o conteúdo que seguirá. Num blog, como direcionamento, pode ser usado em pedaços com links. Isso estabelece, imediatamente, o que o autor/designer acredita ser mais importante no artigo. Sem isso, ficamos apenas com a hierarquização - texto arrumado, como o que existe neste site (N.T.: referindo-se ao site Digital-Web).

Se este artigo não tiver nenhum leitor, eu duvico eu mesmo que leria té aqui. Enorme, blocos chatos de texto não se fazem fáceis de ler na tela. Temos de começar a estragar tudo se for o caso.

Vinculando Tudo

Vimos a hierarquia, temos texto partido em pedaços para que o leitor possa entender e seguir em frente e elementos à parte para levar em frente a navegação visual entre o conteúdo. O que mais falta?

A peça final do quebra-cabeça tipográfico é a aceitação e a consistência. Se você pode seguir os passos para tornar seu conteúdo mais interessante, na base do dia-a-dia, as chances dele continuar a ser interessante e divertido para seguir são bastante boas.

Eu irei agradecer, a web irá agradecer e seus leitores irão definitivamente agradecer!

 

0 comentários publicados

Poste um comentário


Os textos publicados neste espaço são de responsabilidade única de seus autores (colunistas e leitores) e podem não expressar necessariamente a opinião do iMasters.


2001 - iMasters FFPA Informática Ltda - Todos os direitos reservados.