De volta ao básico: Tipografia bonita em Web Design

/2015-03-17 18:05:29/
Kazaria
/O negócio/

Um ótimo site começa com uma bela tipografia. E, embora seja ótimo quebrar a regra ocasional, às vezes é bom voltar aos princípios do que faz uma ótima tipografia - e como criá-la.

É uma atualização vital que pode ajudá-lo a repensar projetos, considerar uma nova abordagem ou simplesmente voltar a um design mais simples e otimizado.

Então, hoje, estamos ignorando tendências e maneiras de quebrar as regras para focar na teoria da tipografia e como as "regras" podem ser uma ótima orientação para a criação de tipos fenomenais.

Tamanho e Hierarquia

Tamanho importa. O tamanho pode ser um dos fatores mais importantes ao criar um esboço para tipografia legível nas telas. Um texto minúsculo pode ser chocante e difícil de ver. Texto de tamanho grande pode quebrar linhas de maneiras estranhas e causar confusão.

A tipografia legível possui várias camadas de hierarquia para informar aos usuários o que ler primeiro, segundo e assim por diante. Há uma escala óbvia para que o texto do corpo seja de um tamanho no design, as manchetes sejam de outro tamanho e as brechas e subtítulos também tenham suas próprias especificações.

Rastreamento e Kerning

Muitas vezes confusos, rastreamento e kerning não são a mesma coisa. Kerning é o ajuste do espaço entre um par de letras. Rastrear é o ajuste do espaço entre um conjunto completo de caracteres, como um parágrafo ou o ajuste geral a um bloco de texto.

O Kerning é frequentemente aplicado a elementos individuais para criar precisão e aprimorar a legibilidade e até estilo para textos grandes. O rastreamento geralmente é usado para apertar um tipo de letra solto na cópia do corpo.

Limitar tipos de letra

Muitas fontes podem ser impressionantes e chocantes. Dois ou três tipos de letra são suficientes para a maioria dos projetos.

A chave para escolher uma opção de tipo sólido é escolher uma família de tipos com muita variação de estilo. A maioria das fontes de qualidade vem com vários estilos - negrito, regular, itálico, condensado, preto e assim por diante. Ao escolher um tipo de letra com várias opções, você terá peso e estilo para vários usos. (Algumas famílias ainda incluem opções com e sem serifa, se você deseja manter o design inteiro em uma única família de fontes.)

Misturar e combinar estilos

Quando você escolhe tipos de letra - é certo que essa pode ser a parte mais difícil de muitos projetos de design - é aceitável e até preferido escolher dois estilos diferentes de tipo.

O emparelhamento mais comum é um serif e sans serif. Mas você não precisa se ater a isso.

Ao emparelhar diferentes estilos e tipos de letra, procure letras com uma altura x semelhante (procure conjuntos de caracteres com o mesmo tamanho “x” minúsculo vertical) e formato de tigelas (espaço dentro de letras fechadas, como um “o”).

Esses detalhes podem fazer muita diferença em termos de como os tipos de letra se sentem juntos e de como é fácil para os usuários lerem o texto. O uso de formas de letra semelhantes em estilos diferentes ainda tem uma familiaridade visual que pode facilitar a leitura de todo o tipo.

Esqueça hífens e justificativa

Na maioria das vezes, hífens e justificativa completa são desnecessários.

Particularmente online, essas técnicas podem tornar o texto mais difícil de digerir e entender rapidamente. Os hífens interrompem a experiência de leitura e a justificação completa geralmente resulta em espaçamento estranho que é difícil de ler.

Embora ambos os elementos tenham seu lugar em alguns projetos, eles devem ser evitados com mais frequência.

Não alterar fontes

Você nunca deve ajustar uma fonte. Não tente torná-lo mais gordo, mais alto ou mais fino. Escolha um novo tipo de letra.

Os designers de tipos trabalham duro para criar um conjunto consistente de caracteres para um tipo de letra legível e adequado ao estilo da fonte. Não tente alterar a aparência de um conjunto de caracteres. Você não vai melhorá-los e muitas vezes fará uma bagunça do tipo no processo.

Se um tipo de letra não funcionar da maneira que você precisa, procure outra coisa. Experimente a ferramenta de fonte semelhante Identifont, que identifica tipos de letra com aparências semelhantes, para selecionar outra opção que possa funcionar melhor em seu projeto.

Contraste

Design para contraste usando tipografia. Assim como você usaria tamanhos diferentes para criar hierarquia, considere diferentes pesos, cores e estilos de fonte para fornecer interesse visual.

A cor é uma das maneiras mais eficazes - e fáceis - de criar contraste. O contraste ideal é texto escuro sobre fundo claro (ou o contrário). Há um número quase ilimitado de opções de cores para ajudá-lo a conseguir isso. Ao brincar com cores e tipografia, lembre-se de que algumas combinações de cores, como vermelho brilhante no azul direito, podem ser realmente difíceis de ler. Procure combinações diferentes em termos de luz versus escuridão, vibração e saturação.

Quando se trata de contraste, os fundos simples geralmente são melhores para dar espaço ao texto para ser lido. Mas se o plano de fundo contiver elementos visuais, como uma imagem ou padrão, aumente o tamanho das letras para criar uma separação entre o elemento de texto de segundo plano e o primeiro plano.

Medir questões

Uma medida é o tamanho do contêiner que contém texto. Pode ser a largura de um quadro de texto inteiro ou de uma única coluna em um formato de várias colunas.

Avalie as questões porque o número de caracteres (incluindo espaços, glifos e pontuação) na tela pode afetar a legibilidade. A teoria por trás desse conceito é que, se as linhas são muito longas ou muito curtas, pode ser cansativo para os olhos do usuário lerem devido a um movimento constante de um lado para o outro de uma linha para a outra.

Dos elementos do estilo tipográfico: “Qualquer coisa de 45 a 75 caracteres é amplamente considerada como um comprimento de linha satisfatório para uma página de coluna única definida em uma face de texto com serifa em um tamanho de texto. A linha de 66 caracteres (contando letras e espaços) é amplamente considerada como ideal. Para trabalhos com várias colunas, uma média melhor é de 40 a 50 caracteres. ”

Esse é um bom ponto de partida para a maioria dos projetos, embora muitos projetos estejam inclinando-se para tamanhos um pouco maiores, o que faria com que a contagem de caracteres caísse no final menor desse intervalo.

Embora a tipografia móvel não tenha sido uma preocupação quando o livro foi publicado pela primeira vez, a orientação para várias colunas é um ponto de partida aceitável. Você pode até optar por diminuir um pouco e procurar 35 caracteres por linha mais ideais para telas pequenas.