Escolhendo as fontes e as cores certas

Deixe as fontes e cores no seu site com uma estética agradável.

Ultima atualização 6 de Dezembro de 2024

Assim como a pintura e o papel de parede de uma sala, as fontes e as cores dão o tom do seu site e passam uma bela primeira impressão.

Se você não sabe por onde começar, use as ideias deste guia para criar o design do seu site. Recomendamos testar diferentes combinações antes de publicar. 

Este guia é recomendável para após você criar um novo site e adicionar conteúdo. Para aprender o básico sobre como alterar fontes e cores, confira nossos outros guias:

Combine as fontes com a sua marca

Ao ajustar o estilo do site, é bom combinar o design dele com as ideias e as metas do seu conteúdo.

Diferentes tipos de fonte evocam diferentes humores. Na tipografia, serifa é uma pequena linha ou traçado anexado ao fim de um traçado maior em uma letra ou símbolo dentro de uma família de fontes. Letras sem serifa vêm sem traços extras e têm linhas mais limpas. 

As fontes sem serifa hoje são mais comuns nos textos na web, pois os detalhes finos, como as serifas, podem sumir ou ficarem grandes demais em telas com resolução mais baixa. Ainda assim, uma fonte serifada pode ser melhor para o seu site. Se você tem um blog sobre manuscritos medievais, uma fonte com serifa provavelmente é mais fiel à personalidade do blog. Se você vende móveis modernos ou dá aulas de codificação, uma fonte sem serifa pode criar um visual conciso e contemporâneo.

trial-drip-content-fonts-colors-1-v2.jpg

Ao escolher uma fonte, pense no seu público e no seu conteúdo para restringir as opções. Considere: 

  • O site trata do quê? Qual é o objetivo principal? 
  • Quem visitará o site? Qual a faixa etária? 
  • Qual é o clima da sua marca? Divertido ou sério? Moderno ou clássico? 

Decididos o tom e a textura do site, confira nossa coleção com mais de 600 fontes do Google e 1.000 fontes do Adobe e escolha uma fonte que combine com seu estilo exclusivo. Atenção: essa coleção não inclui todas as fontes disponíveis do Google nem do Adobe. Para limitar suas opções, o painel "Fontes" mostra os pacotes mais usados e os recém-usados. Se você souber o nome da fonte desejada, é possível procurá-la

Misture e combine

Assim como queijo e goiabada, algumas fontes se combinam perfeitamente. No caso da fonte sans serif simples, experimente combiná-la com uma fonte serif mais ornamentada. Fontes finas e intrincadas combinam bem com fontes em negrito.

No painel "Fontes", comece explorando as combinações predefinidas na aba Mista. Procure uma serifa e sem serifa que combinem com o ritmo e ao humor do seu site.

mixed_font_packs.png

Na tipografia, menos é mais. O melhor é usar até duas fontes em todo o site. Duas opções complementares deixam o site legível enquanto destacam, com bom gosto, os pontos-chave.

Para ter ainda mais contraste, experimente textos de diferentes tamanhos. Você quer destacar um novo produto na loja? Use um título. Vai escrever uma longa publicação no blog? Use uma fonte menor, mas ainda acessível. Use tamanhos diferentes em grupos de texto diferentes para padronizar a mensagem em todo o site. 

Use as cores para criar uma personalidade

Qual é a principal ideia do seu site? Se você vende roupas de praia ou quer expor retratos, combine o conteúdo do site com uma paleta de cores para dar personalidade. As roupas de praia ficam melhores em tons suaves de azul e amarelo; já o preto e branco clássico destacam suas fotografias. 

Seja qual for a sua visão, há uma paleta de cores que revela você. Para começar, dê uma olhada ao redor: se você tem um restaurante, deixe a paleta te guiar. Você escreve sobre a natureza? Os tons terrosos podem trazer o humor adequado. Vai ministrar uma aula de ginástica? As cores brilhantes e animadas motivam mais. Se sua marca tem um logotipo, considere incorporar a cor dela em realces como os botões e a navegação

carmine.png

Outro ótimo lugar para começar é nas imagens. Veja, nas imagens que você usa com sua marca, se há certas cores ou tons que aparecem repetidamente. Use o painel "Cores" para encontrar uma paleta que combine com as imagens; ou carregue uma imagem e deixe o seu site gerar uma paleta de cores para você. 

Assim como na tipografia, cores demais podem atrapalhar a mensagem. Quando você usa apenas os temas gerados automaticamente pela paleta de cores, o site fica mais equilibrado e mais fácil de navegar. Ao personalizar as cores do tema, guarde as cores fora da paleta para os realces, como botões e ícones de redes sociais.

As cores não podem entrar em conflito. A letra amarela no fundo branco pode deixar o texto ilegível; já uma fonte preta no fundo vermelho pode causar dor de cabeça. O contraste alto entre as cores também deixa o site acessível

Acima de tudo, divirta-se. O site deve ser uma extensão das suas ideias e sua identidade no mundo on-line. O Squarespace ajuda você a colocar suas ideias on-line, mas é você quem dá a personalidade, o cor, o tom e o design a elas. Ao ter um site com a sua cara, o seu jeito, o seu estilo, você sempre terá prazer em revisitar e melhorar à medida que suas ideias evoluem.

Mais ajuda

Para mais ajuda no design do seu site, confira nossos outros recursos: 

Footer Image
  • Peça ajuda à nossa comunidade

  • Peça ajuda à nossa comunidade sobre personalizações avançadas.

  • Contrate um Squarespace Expert

  • Ganhe destaque on-line com a ajuda de um designer ou desenvolvedor experiente.

Escolhendo as fontes e as cores certas