5 fontes seguras da Web que você pode usar em seu site

Se você é proprietário de um site, deve saber que uma fonte HTML desempenha um papel importante em seu site. Todos os sites têm conteúdo de texto de uma forma ou de outra, se escolhido corretamente, uma boa fonte pode aumentar a estética da sua página e ter um impacto positivo na legibilidade do conteúdo, e é por isso que o design e desenvolvimento de um site é de fato um dos aspectos mais importantes para alavancar qualquer negócio. Uma fonte ruim afeta negativamente o desempenho da sua suíte, tudo depende se você está usando uma fonte segura da web ou não.

O que é uma fonte segura da Web?

Uma fonte é legível e tem a mesma aparência em qualquer navegador ou dispositivo (celular, tablet etc.) somente se a fonte estiver instalada nesse dispositivo. Fontes seguras da Web são aquelas fontes que geralmente são pré-instaladas em qualquer dispositivo – computadores, celulares, consoles de jogos, tablets e smart TVs.

Recomendado para você: 20 fontes impressionantes de design de logotipo que todo grande designer precisa.

Por que as fontes seguras da Web são importantes?

Em um mundo perfeito, você pode escolher qualquer fonte que desejar para o seu site. No entanto, com base no sistema operacional, os dispositivos vêm com suas próprias seleções de fontes pré-instaladas. O problema reside no fato de que seus designs geralmente diferem dependendo do sistema que você usa. Os dispositivos que operam no Windows podem ter um grupo, o MacOS pode ter outro e o Android do Google tem outra versão diferente.

Quando você abre um site, a fonte que você vê na viewport pode não ser necessariamente a fonte que o designer pretendia. Significado: digamos que o designer usa uma fonte relativamente obscura. Se você não tiver essa fonte instalada, seu site será revertido para a fonte genérica definida pelo sistema e você pode nem saber disso, para você, parecerá desagradável.

As fontes seguras da Web são uma coleção de fontes existentes em todos os sistemas e permitem que o designer especifique a fonte a ser utilizada caso o dispositivo não tenha a fonte necessária. Ele permite que você faça com que o site tenha a mesma aparência em vários dispositivos.

Quais são as cinco famílias de fontes?

Na tipografia, todas as fontes são categorizadas em uma das cinco famílias de fontes com base em suas semelhanças de design. Estes são os seguintes:

1. Cursiva (por exemplo, Zapf-Chancery)

A família Cursive de fontes imita a caligrafia humana com as letras geralmente unidas de maneira fluida. É frequentemente associado a pessoas com caligrafia e escrita mais rápida.

2. Fantasia (por exemplo, Star Wars)

As fontes da família de fontes Fantasy geralmente possuem elementos decorativos em cada letra, mas ainda representam o personagem. Os títulos de muitos livros e filmes de ficção usam fontes dessa família para fortalecer as nuances do conteúdo.

3. Serif (por exemplo, Times New Roman)

O recurso mais notável da família de fontes Serif é uma pequena linha no final de um grande traço em uma letra ou símbolo. Cria uma sensação de elegância e formalidade. É amplamente utilizado para corpo de texto por uma série de sites.

4. Sans-serif (por exemplo, Helvetica)

Ao contrário das fontes da família Serif, as fontes da família Sans-serif não possuem a pequena linha anexada a cada letra. A maioria das fontes pertencentes a esta família tem uma largura de traço semelhante, tornando-a minimalista e moderna.

5. Monoespaço (por exemplo, Courier)

Na família de fontes Monospace, cada letra e símbolo ocupa exatamente o mesmo espaço horizontalmente. Assim, tornando-os consistentes e fáceis de distinguir, é por isso que eles são frequentemente usados ​​com máquinas de escrever e, mais recentemente, com terminais de computador.

Você pode gostar: 11 fontes impressionantes do Photoshop que você precisa experimentar (GRÁTIS!).

Fontes populares da Web:

Agora que temos uma visão sobre as fontes, abaixo estão 5 fontes seguras da Web populares para adicionar ao seu site:

1. Arial

Uma das fontes sem serifa mais usadas na mídia online e impressa. É o padrão de fato. A versão 3.0 do OpenType o descreve como:

“Um design contemporâneo sem serifa, Arial contém mais características humanistas do que muitos de seus predecessores e, como tal, está mais em sintonia com o clima das últimas décadas do século XX. O tratamento geral das curvas é mais suave e cheio do que na maioria das faces sem serifa de estilo industrial. Os traços terminais são cortados na diagonal, o que ajuda a dar ao rosto uma aparência menos mecânica. Arial é uma família de fontes extremamente versátil que pode ser usada com igual sucesso para composição de texto em relatórios, apresentações, revistas, etc, e para exibição em jornais, publicidade e promoções.”

Também é a fonte padrão nos documentos do Google.

2. Times New Roman

Times New Roman é uma variação da antiga fonte Times da família de fontes Serif. Encomendado pelo jornal britânico 'The Times' em 1931 e projetado por Stanley Morison, o consultor artístico da Monotype, a empresa de equipamentos de impressão e em colaboração com Victor Lardent, do departamento de letras do braço de Publicidade da Time. Ela surgiu como uma das fontes mais populares de todos os tempos e vem pré-instalada na maioria dos dispositivos.

O nome Roman in Times New Roman é uma referência ao estilo romano, a primeira parte da família de fontes Times New Roman a ser projetada. Tem suas origens na impressão italiana do final do século XV e início do século XVI, o desenho não tem nenhuma conexão com Roma ou com os romanos.

3. Helvética

Helvetica ou Neue Haas Grotesk é uma fonte amplamente usada da família Sans-serif Font. Desenvolvido em 1957 pelo designer suíço de fontes Max Miedinger com a contribuição de Eduard Hoffmann. Ele é projetado em um design neo-grotesco com uma altura x alta, terminação de traços em linhas horizontais ou verticais e um espaçamento apertado muito incomum entre as letras, que se combinam para dar uma aparência sólida e densa. Originalmente projetada para uso como uma fonte neutra que tinha grande clareza, nenhum significado intrínseco na forma e poderia ser usada em uma variedade de sinalização e chamada de Neue Haas Grotesk (New Haas Grotesque), foi rapidamente licenciada pela Linotype e renomeada para Helvetica em 1960 , latim para suíço. A fonte é amada por designers por sua neutralidade e preferida por muitas marcas famosas como Jeep, Kawasaki, Motorola e BMW.

4. Correio

A fonte Courier é uma fonte pertencente à família Serif. Projetado por Howard “Bud” Kettler originalmente para as máquinas de escrever da IBM, ele foi adaptado para uso como uma fonte de computador e quase todos os computadores vêm com ele instalado. Devido ao seu tipo Monospace, na década de 1990 encontrou uso renovado na indústria eletrônica e de computadores, onde as colunas de caracteres devem ser alinhadas de forma consistente, por exemplo, na codificação onde é a fonte padrão para escrever ou representar qualquer tipo de código.

De acordo com o padrão da indústria, todos os roteiros deveriam ser escritos em Courier de 12 pontos. O Departamento de Estado dos EUA a usou como fonte padrão para todos os documentos até janeiro de 2004. Com o uso crescente nas indústrias digitais, Courier desenvolveu variantes com recursos como sinais de pontuação maiores, distinções mais fortes entre caracteres semelhantes (como o numeral 0 / O maiúsculo e numeral 1 / L minúsculo), etc., para maior legibilidade da tela.

5. Calibri

A fonte Calibri é um membro da família de fontes Sans-serif projetada por Lucas de Groot em 2002-2004. Foi lançado publicamente em 2007, junto com o Microsoft Office 2007 e o Windows Vista. A partir do Office 2007, substituiu Times New Roman como fonte padrão no MS Word e Arial como fonte padrão para MS Powerpoint, MS Excel, Microsoft Outlook e WordPad. Faz parte da coleção de fontes ClearType projetada para funcionar com o sistema de renderização de texto ClearType da Microsoft para tornar o texto mais claro para leitura em telas de cristal líquido (LCDs).

Ferramentas de fonte para verificar

Existem várias ferramentas online que você pode usar para testar as diferentes fontes antes de usá-las em seu site. Se você deseja explorar os tipos de fontes disponíveis ou está tendo dificuldades em escolher qual fonte usar, essas ferramentas são uma grande ajuda.

par de fontes

Font Pair é um site de nicho que possui muitos recursos relacionados à tipografia. Existem vários eBooks, guias, resenhas, vídeos e recomendações de plugins para fontes. Eles têm uma seção dedicada às fontes mais populares disponíveis no Google e uma comparação detalhada de quais fontes são melhores juntas.

Wordmark.it

O Wordmark.it oferece uma visualização rápida de como seu texto ficaria com uma fonte específica ou até mesmo várias fontes juntas. Basta inserir o texto na barra e pronto, ele mostrará como fica com fontes diferentes.

QualAFonte

WhatTheFont é para o texto o que a pesquisa reversa de imagens é para as imagens. Isso ajuda você a identificar uma fonte que você viu. Basta carregar a imagem da fonte e ela irá combiná-la com o banco de dados e fornecer a você o que acredita ser a correspondência mais próxima. Você também pode acessar os fóruns ativos para obter ajuda na identificação de fontes ou até mesmo consultas tipográficas gerais.

Você também pode gostar de: 3 maneiras diferentes de adicionar fontes personalizadas ao tema do seu site WordPress.

Como adicionar fontes seguras da Web ao meu site?

Agora que você escolheu uma fonte segura para a web, é hora de aplicá-la. Se você tiver pouca experiência em programação, siga estas etapas para adicionar uma fonte segura da Web à sua página da Web:

1. Abra seu arquivo header.php.

2. Copie a fonte/código padrão da fonte. Normalmente você pode encontrar isso através do Google.

3. Cole o código na parte superior do arquivo de cabeçalho.

4. Carregue seu style.css, coloque o código da fonte para alterar o texto da fonte de sua escolha.

No final, sua folha de estilo deve ficar assim:

 Este artigo foi escrito por Abhyank Srinet. Abhyank possui mestrado em gerenciamento pela ESCP Europe e é formado em engenharia com especialização em instrumentação e controle. Seu interesse pelo cenário digital o motivou a criar uma startup online de consultoria de aplicativos (MiM-Essay), focada em disseminar informações de qualidade sobre o mestrado em início de carreira.