Você atualiza ou cria um site do zero ? Agora chegou a hora de escolher a melhor fonte. Esta é uma escolha crucial. Por quê? O layout e a aparência dos textos afetam significativamente a estética, a funcionalidade e a legibilidade do site. Um site com boas fontes é muito mais fácil de usar e se traduz em uma conversão maior!
Escolher a melhor fonte para um site não é fácil. No entanto, tudo que você precisa fazer é seguir este guia para garantir que você selecione a melhor fonte da web!
Como escolher a melhor fonte para usar no site?
Aqui estão os 7 principais passos que você deve tomar!
1. Defina a voz da sua marca
2. Defina os objetivos dos textos e da fonte do seu site
3. Verifique se a fonte tem todos os caracteres que você precisa
4. Verifique a licença da fonte
5. Escolha as fontes Primária e Secundária
6. Combine habilmente as fontes
7. Procure legibilidade
Vamos dar uma olhada em como fazer cada um deles na prática.
Etapa I: defina a voz da sua marca
Quando se trata de fontes, sua marca é tudo. É o que os clientes veem e com que se identificam quando pensam na sua empresa. É por isso que é tão importante garantir que você escolha a fonte certa para o seu negócio. Mas como você determina a voz da sua marca? E como você escolhe uma fonte que reflete isso?
Para determinar a natureza da sua marca, você precisa se fazer algumas perguntas:
1. Quais são os valores da sua empresa?
2. Quem são os destinatários da empresa?
3. Qual é a missão da sua empresa?
4. O que você quer que seus clientes pensem de sua empresa?
Anote as respostas para essas perguntas! Eles o ajudarão com os próximos passos na seleção de fontes, que explicaremos neste artigo!
Passo II: Defina os objetivos dos textos e da fonte do seu site
Em relação ao design do site, o texto e a fonte escolhidos são importantes. Eles ajudam a definir o tom e transmitir sua mensagem aos visitantes. Então, quais são os objetivos do seu texto e fonte?
O texto em seu site deve ser fácil de ler. Deve ser grande o suficiente para ser visto rapidamente e a fonte deve ser fácil de entender. Além disso, é essencial usar uma fonte consistente em todo o site. Isso ajudará a criar uma aparência unificada. Você também deve saber o quão importante será o papel do texto.
Em alguns sites, o texto não desempenha um papel significativo. Ele é usado, por exemplo, para criar descrições curtas, para que sua fonte possa ser mais decorativa nesse caso. Por outro lado, aqueles que comunicam a maioria das informações por meio de texto (por exemplo, blogs) devem se concentrar principalmente em torná-las convenientes e fáceis de ler.
A fonte escolhida também deve ser apropriada para o conteúdo do seu site. Por exemplo, se você estiver executando um site comercial, convém usar uma fonte com serifa para tornar o texto mais profissional. Por outro lado, se você estiver executando um site com um tom mais casual, convém usar uma fonte sem serifa.
Categorias de fontes
As fontes são divididas principalmente em:
1. Fontes com serifa
2. Fontes sem serifa
3. Fontes de script
4. Fontes decorativas ou de exibição
Fontes com serifa
Essas fontes têm terminações de linhas transversais ou diagonais (chamadas serifas) decorando o script.
O uso de serifas confere aos textos um caráter tradicional e mais elegante. Essas fontes são usadas há muito tempo em publicações longas em papel (principalmente em livros), pois as serifas ajudam os leitores a seguir a linha do texto, facilitando a leitura.
Devido ao seu caráter decorativo, as fontes com serifa também ficam bem em sites ... mas principalmente quando são usadas como elementos de conteúdo adicionais, por exemplo
1. títulos,
2. citações,
3. legendas,
4. logotipos,
5. slogan
Eles podem ser usados por empresas que desejam enfatizar seus muitos anos de experiência, remeter à tradição e sinalizar certeza e estabilidade.
Fontes serif populares: Times New Roman, Georgia, Palatino, Bookman Old Style, Garamond, Courier, Lucida, Century, Arno Pro, MS Serif.
Fontes sem serifa
As fontes sem serifa são desprovidas de serifas. Por isso, têm um caráter mais moderno e minimalista.
Seu uso na Internet tornou-se comum porque as telas não podiam exibir corretamente as fontes com serifa no passado. Além disso, as fontes sem serifa exibidas na tela não cansam a visão.
Devem ser utilizados por empresas inovadoras ou que desejam ser percebidas como modernas e dinâmicas. Apresentam acessibilidade e simplicidade , pelo que serão uma boa opção para uma empresa que dirige os seus serviços à geração mais jovem.
Fontes sans serif populares: Arial, Open Sans, Montserrat, Helvetica, Futura, Verdana, Trebuchet MS, Univers.
Fontes de script
São fontes que imitam a caligrafia. Eles são elegantes e formais, mas também um pouco bem-humorados. Entre eles, você pode encontrar fontes muito ornamentais e bastante simples.
Sua vantagem é a alta expressividade. Eles carregam uma enorme carga emocional que você pode usar para evocar uma reação específica nos destinatários. Além disso, fontes de script atraem a atenção e permitem que você comunique conteúdo sério ou humorístico (dependendo do tipo de fonte).
As fontes de script elegantes são perfeitas para convites de casamento e cartões comemorativos. Em sites, eles funcionarão quando você os usar para escrever elementos de texto menores - por exemplo, títulos ou citações.
Ao usar essas fontes, você deve prestar atenção à sua legibilidade. Quanto mais decorativa e "complicada" a fonte - maior a chance de ser ilegível para o destinatário.
Fontes de script populares: Great Vibes, Lobster, Grand Hotel, Sofia, Arizonia, Black Jack, Cookie, Germanica, Miama, Pacifico, Tangerine.
Fontes decorativas e de exibição
É um grande grupo de fontes muito diversas que se distinguem por formas elaboradas e alta ornamentação.
Sua forma pode estar relacionada a emoções específicas (por exemplo, medo - com fontes decorativas góticas que o título de filmes de terror às vezes é escrito) ou a um determinado tempo, lugar ou objeto histórico . As fontes decorativas também costumam se referir a fenômenos culturais, por exemplo, graffiti. Às vezes, a forma se assemelha a imagens.
São fontes muito expressivas e originais. Portanto, você deve ter cuidado com o uso - eles podem rapidamente se tornar fora de moda porque geralmente refletem as tendências de design de determinadas épocas.
⚡Hack de crescimento BOWE:
Você já definiu a natureza da sua marca. Você conhece os tipos de fontes e suas características. Agora tente encontrar fontes que expressem os mesmos recursos e valores que sua empresa possui. Para encontrar rapidamente ideias de fontes, você pode consultar nossa lista das melhores fontes para diferentes setores.
Passo III: Verifique se a fonte tem todos os caracteres que você precisa
Você já começou a considerar sua escolha de várias fontes? Bom!
Antes de decidir, no entanto, certifique-se de que a fonte escolhida tenha todos os caracteres necessários.
Não ter todos os sinais é uma armadilha comum. É fácil cair nisso quando você usa geradores de texto e verifica a aparência da fonte não com nosso conteúdo de destino, mas com, por exemplo, Lorem ipsum.
Como este texto está escrito inteiramente em latim, você pode não notar a falta de sinais vitais, incluindo diacríticos de linguagem.
A falta de diacríticos de linguagem não é a única armadilha que você pode encontrar. que fontes populares (tanto pagas quanto gratuitas) têm problemas com certos caracteres... ou não os têm.
Etapa IV: Verifique a licença da fonte
O que também é crucial na escolha de uma fonte é a licença do utilitário. Você precisa verificar se a licença pela qual você possui a fonte permite usá-la em geral em sites.
Tenha cuidado, especialmente com as fontes instaladas com o Adobe Creative Suite ou o sistema operacional. Sua licença geralmente só permite que eles sejam usados em materiais impressos, não em sites. Portanto, nem todo tipo de letra pode ser convertido em uma fonte digital e colocado no site.
Se você quiser ter certeza de que pode usar uma determinada fonte na web, use a Google Fonts biblioteca
Etapa V: escolha a fonte primária e secundária
Você gosta de algumas fontes, mas tem dificuldade em tomar a decisão final? Lembre-se que você não pode usar muitos deles. 2-3 fontes em um site são o número ideal.
O uso de muitas fontes gera caos no site e dificulta a leitura do texto - assim, você não alcançará clientes em potencial.
A maioria dos sites profissionais incluem:
1. Fontes primárias
2. Fontes Secundárias
3. Fonte de destaque (opcional)
Cada uma dessas fontes tem uma função diferente e é usada para conteúdo diferente. Para dar ao seu site uma aparência profissional e facilitar a escolha das melhores fontes - veja como cada um desses grupos difere um do outro:
Fonte principal
O mais visível em seu site. Usado em slogans, títulos e títulos. Embora não seja o mais utilizado, os clientes devem identificar sua marca com ele. Vale a pena combinar a fonte do seu logotipo (desde que contenha texto).
Fonte secundária
Será aquele que preencherá os blocos de texto: parágrafos, descrições de produtos ou entradas de blog. Essa é a fonte mais usada em todos os sites ou lojas online.
Embora a fonte primária possa ser original, o objetivo principal de uma fonte secundária é a legibilidade. É vital - os clientes devem ler seu conteúdo com facilidade.
Fonte de destaque (opcional)
Não é uma fonte obrigatória, mas você deve considerar selecioná-la.
Você pode usá-lo, por exemplo, em botões de CTA (Call To Action) para atrair atenção e gerar cliques. A fonte de destaque também pode enfatizar as partes essenciais do texto ou destacar aspas.
Este tipo de fonte deve ser diferente do resto para atrair a atenção do seu público de forma eficaz.
⚡Hack de crescimento BOWE:
Você quer encontrar uma fonte de um site que você estava visitando? Você gostaria de usá-lo em seu próprio site?
Instale um plug-in - Chrome FontFace Ninja . Com sua ajuda, você pode verificar o nome de cada fonte usada em um site. Basta clicar no ícone do plugin instalado e usar o cursor do mouse para selecionar a fonte cujo nome você deseja saber.
Passo VI: Combine habilmente as fontes
Você conhece os tipos básicos de fontes e como priorizá-las em seu site. Agora é a hora de aprender como você pode dominar a arte de combiná-los. A melhor maneira de fazer isso é seguindo estes truques:
1. Serifa com sem serifa
As fontes com serifa e sem serifa são uma combinação segura - principalmente quando você as usa em tamanhos diferentes. Essas fontes são tão diferentes que, em muitos casos, parecem atraentes.
2. Peso contrastante
Use uma fonte mais grossa para títulos e uma fonte mais fina para textos mais longos. Isso fará com que os títulos se destaquem mais e tornem o texto mais fácil de ler.
3. Fontes de uma família de fontes
O uso de fontes da mesma família pode atingir rapidamente a espessura mencionada acima (por exemplo, Open Sans e Open Sans Semibold). Muitas fontes têm muitas variantes - considere combinar duas delas em seu site.
Por exemplo, no BOWWE Website Builder , você encontrará diferentes versões da fonte Roboto: fonte Roboto, Roboto Condensed e Roboto Slab.
4. Evitando fontes muito parecidas
Esta regra também se aplica ao contraste. Suponha que a diferença entre a fonte seja muito pequena (as fontes são muito semelhantes entre si). Nesse caso, a conexão não ficará boa - mesmo que uma seja fontes Serif e a segunda - seja sem serifa.
5. Fontes com expressão emocional semelhante
Existem fontes, que são as portadoras da emoção. Por exemplo, eles devem ser sofisticados, profundos, dinâmicos ou divertidos. Seria melhor não combinar fontes de grupos tão diferentes porque criaremos comunicação e caos visual.
6. Fontes expressivas com neutro
Se você usar uma fonte de script (semelhante à escrita à mão) em seu cabeçalho, use uma fonte neutra para escrever o corpo do texto. Além disso, usar duas fontes expressivas próximas uma da outra distrairá o leitor e dificultará a leitura.
7. Proporções de fontes correspondentes
Se duas fontes tiverem proporções totalmente diferentes (por exemplo, uma terá letras distorcidas e a outra condensada), elas podem parecer horríveis. Vale a pena verificar se a altura das letras minúsculas é a mesma - se sim, é mais provável que as fontes correspondam.
⚡Hack de crescimento BOWE:
Abaixo, você encontrará links para ferramentas úteis para ajudá-lo a combinar fontes com precisão.
A página apresenta pares de fontes que ficam bem juntas. Os pares de fontes preparados podem ser baixados do site imediatamente (todas as fontes estão disponíveis no Google Fonts).
2. Tipo.io
O site mostra várias fontes com exemplos. Atenção especial deve ser dada às listas de fontes usadas nos sites.
Passo VII: Busque a legibilidade
Que fatores afetam a legibilidade do texto no site?
Luzes entre letras
A maioria das fontes são bem projetadas a esse respeito, mas como fonte básica, vale a pena escolher sua variante universal, não, por exemplo, estreita.
Conduzindo
A entrelinha muito pequena dificultará a leitura. Idealmente, o espaçamento entre linhas deve ser mínimo. 120% de letras maiúsculas (150% geralmente é considerado o ideal).
Espaçamento entre parágrafos
Para uma legibilidade ainda maior, use um espaçamento ligeiramente maior entre os parágrafos.
Alinhamento de texto
Muito texto e margens pequenas em uma linha podem efetivamente desencorajar a leitura. A Regra de Ouro descreve 50-60 caracteres em verso como um ideal.
Contraste
A fonte deve ter uma cor que se destaque no plano de fundo em que é apresentada. Tanto o contraste muito baixo quanto o muito alto dificultarão a leitura.
Tamanho
O tamanho da fonte indica a importância de um determinado elemento e permite dividir o texto em seções legíveis. Tamanhos de fonte ideais para elementos individuais:
1. Títulos: 30 - 70 px,
2. Subtítulos: 22 - 30 px,
3. Texto simples: 16 - 20 px.
Itálico, negrito, sublinhado
Melhor usado com moderação. O sublinhado raramente é usado em páginas da web. O negrito enfatiza a importância dos itens, aumentando sua visibilidade. O itálico é ótimo para expressões e citações em língua estrangeira.
COMECE AGORA
Você está pronto para escolher as melhores fontes para o seu site?
Primeiro - vamos lembrar o que deve ser feito ao escolher uma fonte para um site:
1. Defina a voz da sua marca
2. Defina os objetivos dos textos e da fonte do seu site
3. Verifique se a fonte tem todos os caracteres que você precisa
4. Verifique a licença da fonte
5. Escolha as fontes Primária e Secundária
6. Combine habilmente as fontes
7. Procure legibilidade
Quando estiver familiarizado com a seleção de uma fonte para um site, você poderá passar para a próxima fase - escolher as fontes finais a serem usadas em seu site. Para fazer isso, confira nossa lista das melhores fontes de sites para decidir qual é a perfeita para você!
Leia também:
Karol é empreendedor serial, palestrante de e-commerce, entre outros para o Banco Mundial, e fundador de 3 startups, das quais já assessorou várias centenas de empresas. Foi também responsável por projetos das maiores instituições financeiras da Europa, no valor superior a 50 milhões de euros.
Obteve dois mestrados, um em Informática e outro em Gestão de Marketing, durante os seus estudos na Polónia e em Portugal. Ele ganhou experiência no Vale do Silício e enquanto dirigia empresas em muitos países, incluindo Polônia, Portugal, Estados Unidos e Grã-Bretanha. Há mais de dez anos, ele ajuda startups, instituições financeiras, pequenas e médias empresas a melhorar seu funcionamento por meio da digitalização.