Em 2006 Oliver Reichenstein, designer e fundador da iA (Information Architects) disse que “web design é 95% tipografia”. De 2006 até hoje muita coisa mudou; o uso de imagens em web design se tornou mais forte, bem como o uso de efeitos baseados em programação, ao contrário do Adobe Flash, que perdeu força. Mesmo com tantas mudanças, a tipografia ainda tem um grande valor (quem sabe até maior) em web design. Por um tempo, os web designers passaram a exigir mais opções, mais fontes para usarem em seus projetos, e chegaram a criar meios para burlar os procedimentos e usar fontes TTF (True Type Font) e OTF (Open Type Font) online, mas isso tornava as fontes vulneráveis, fáceis de serem baixadas como uma imagem qualquer. Por muito tempo soluções foram pensadas, mas a maioria não era aceita pelos criadores de fontes, principalmente por não serem seguras o suficiente. As webfonts vieram como uma solução viável e inovadora, o novo formato garantia segurança por conter a fonte e seus dados de uso e permissão comprimidos e codificados em um arquivo. Atualmente existem mais opções de fontes para usar online, mas a boa tipografia na web vai muito além de escolher uma boa fonte, ou usar muitas fontes no site. Com conhecimento de tipografia e web design aliados é possível criar uma hierarquia de informação equilibrada, harmoniosa e dinâmica, e a partir disso, fazer o design ganhar vida através da tipografia. A web oferece muitas ferramentas e sites que podem ajudar a entender mais e usar melhor a tipografia, dentro e fora da web. Experimente!

WhatFont Tool

Uma extensão para o Chrome que mostra, com um clique, qual é a fonte, a família, o tamanho, e o fornecedor do texto de um site. Esqueça aquela coisa de olhar o código fonte, esse é com certeza o jeito mais fácil de descobrir tudo o que você precisa. Mais informações > What Font Tool

Colour Contrast Check Tool

Esse site permite que você teste a legibilidade da cor da fonte junto da cor de fundo, escolhendo duas cores e comparando o contraste. Ele ainda te dá informações técnicas, como diferença de brilho e matiz, em números. Mais informações >

Color Contrast Font Tool

 Typewolf

O Typewolf faz um apanhado de uso de tipografia na web, ao mesmo tempo identificando quais as fontes usadas em cada site e servindo de recomendação e inspiração. Mais informações >

Tiff

Um site que te permite comparar duas fontes, sobrepondo as duas e evidenciando as diferenças de traço. O site te deixa escolher quais caracteres você deseja usar para compará-las. Mais informações >

Captura de Tela (4)

The Web Font Combinator

Uma ferramenta que te permite testar o uso de diferentes fontes, para título, corpo, subtítulo.. e visualizar como elas ficariam combinadas em um site. Te permite alterar a cor, tamanho, entrelinha e o fundo da página. Mais informações > Captura de Tela (5)

FFFALLBACK

Nem todos os browsers ou pessoas têm instaladas as fontes que você escolheu para o seu layout, por isso é bom sempre escolher uma boa fonte para substituir a original. Essa extensão é muito útil, de fácil instalação, e garante bons resultados para tornar seu design à prova de balas. Mais informações >

Typewonder

O typewonder te ajuda a testar fontes usando sites que já existem. Criando uma cópia do layout do site que você escolher, você pode editar a fonte principal, escolhendo uma nova da lista que ele te oferece. Mais informações >

Referência

REICHENSTEIN, Oliver. Web Design is 95% Typography. Disponível em http://ia.net/blog/the-web-is-all-about-typography-period/

Publicidade