Alterar a fonte em HTML é uma das competências centrais de cada desenvolvedor web. Este processo inclui não só a alteração da fonte em HTML, mas também as cores da fonte e o tamanho da fonte em HTML.
Mas quais são os códigos HTML que são utilizados para alterar a fonte do conteúdo que compõe uma página web? quais são os passos para alterar a fonte e modificar o tamanho da fonte nesta linguagem de programação?
Não se preocupe, porque ao longo deste artigo do WP, iremos dizer-lhe em detalhe tudo o que precisa de saber sobre o procedimento para alterar a fonte em html. E assim, poderá optimizar a apresentação dos seus sites em linha e fazer com que os seus projectos de design pareçam 100% profissionais.
1. Alterar a fonte em html
Se quiser alterar a fonte em HTML, deve utilizar a font-family de propriedade CSS, que lhe permite definir um determinado valor e colocá-lo como um atributo de estilo. Depois deve adicioná-lo a um elemento HTML, tal como um parágrafo, um título ou um botão .
Como resultado, o CSS em linha será aplicado; e isto significa que o HTML e o CSS serão definidos simultaneamente dentro do corpo do documento HTML. Assim, ocorrerá uma mudança de fonte no HTML.
De acordo com uma análise HubSpot, 48% dos utilizadores consideram o design da web como a principal variável que determina o nível de credibilidade profissional de um site em linha. Com esta premissa em mente, é essencial que saiba como alterar a fonte em html, se quiser aprender a codificar.
Desta forma, poderá escolher a fonte em html, tamanho, cores, etc. de acordo com as preferências dos seus clientes e a mensagem que pretende transmitir ao público alvo através de uma página web.
Tomemos como exemplo que queremos alterar a fonte em HTML de um parágrafo tendo em conta a fonte Arial. Para tal, devemos utilizar o código da fonte em HTML:
<font face=”Arial”>Texto</font>
Contudo, ao alterar a fonte em HTML, tenha em mente que esta tag HTML não funciona normalmente com HTML5, a última versão do HTML. Nem todos os utilizadores têm todas as fontes disponíveis, dependendo da plataforma que utilizam. Neste caso, a página web não exibirá a fonte que definimos no código HTML. Em vez disso, o texto será exibido por defeito, ou seja, com uma fonte Times New Roman, e isto pode afectar a harmonia visual que se pretende comunicar.
Como alternativa para esta situação, ao alterar a fonte em HTML, pode normalmente definir várias fontes separadas por vírgulas no código. Assim, ao alterar as fontes, se o navegador não tiver a primeira fonte disponível,verificará a disponibilidade da segunda fonte, e se esta também não estiver disponível, continuará a tentar a terceira fonte .
Aqui está um exemplo para que saiba como escrever o seu código ao alterar a fonte em HTML e evitar que a fonte padrão apareça nos seus designs web:
<font face=”nunito,arial,verdana”>Texto</font>
Fonte: Pexels
Embora a utilização do CSS em linha seja boa, também se pode utilizar outros estilos de CSS, tais como o CSS interno. Isto pode ser definido no cabeçalho do documento HTML e definir o estilo em diferentes elementos da página.
Assim, caso pretenda alterar a fonte HTML de todos os elementos que compõem um parágrafo para Arial, deverá utilizar um selector CSS como se segue:
p {
font-family: Arial;
}
E como consequência, a fonte HTML de todo o texto da sua página irá mudar.
Bem, nesta discussão sobre como alterar a fonte em HTML, já sabe como fazê-lo usando CSS interno e em linha. Agora, veremos como alterar o tamanho da fonte com esta linguagem de programação em mente.
2. Alterar o tamanho da fonte em html
Alterar o tamanho da fonte em HTML é fácil. Tudo o que tem de fazer é usar a propriedade do tamanho da fonte CSS. Define-se o valor desejado e coloca-se dentro de um atributo de estilo. Em seguida, adicione-o a um elemento HTML, tal como um cabeçalho, parágrafo, botão ou etiqueta de extensão .
De facto, para alterar a fonte em HTML, tendo em conta o tamanho, tem disponível 7 graus de tamanho que são numerados de 1 a 7 de acordo com uma variável dimensional crescente. Assim, size=”1″ implica o menor tamanho da fonte; e size=”7″, o maior. 
Fonte: Pexels
Vamos supor que queira definir um tamanho de 4 para um determinado texto na sua página. Para o fazer, escreveria o seguinte código:
<tamanho de letra=”4″; Texto com tamanho4</font>.
Assim, caso queira alterar o tamanho da fonte em HTML para um determinado parágrafo, deve usar a etiqueta <p>Text</p> paragraph tag. Depois, deve incluir a etiqueta da fonte desta forma:
<p><tamanho de letra=”4″>Texto com tamanho 4</font></p>.
Se, por outro lado, quiser alterar o tamanho da fonte em HTML num cabeçalho, terá de usar a etiqueta <h1>, <h2>, etc. juntamente com a etiqueta da fonte .
Também pode utilizar um selector CSS se quiser que todos os elementos de um parágrafo tenham o mesmo tamanho de fonte. Aqui está um exemplo para o ajudar a compreender perfeitamente este procedimento, ao alterar a fonte em HTML da perspectiva de um tamanho 3:
p {
tamanho de letra: 3;
}
Note que pode variar a alteração do tamanho da fonte em HTML dependendo do texto anterior, definindo o número de níveis que deseja aumentar ou diminuir usando um sinal “+” ou “-“. Desta forma, caso tenha definido o seu atributo de estilo como size=”+1″, e o seu tamanho de fonte tenha sido definido para 4, quando continuar a digitar, mudará para um tamanho de 5.
Dentro deste procedimento para alterar o tamanho da fonte em HTML, o elemento <BASEFONT SIZE=value> torna-se importante . Como resultado, o texto na página será o tamanho que foi definido como “valor”. E será mantido até que outro <BASEFONT SIZE=valor> elemento apareça e restabeleça o tamanho ou modifique-o para um tamanho diferente.
Assim, os tamanhos podem ser indicados relativamente (+ ou -) de acordo com uma comparação com a dimensão de base. Um exemplo para alterar a fonte padrão em HTML com fonte de base, seria o seguinte
<BASEFONT SIZE=”2″>
Este é o tamanho de texto 2,
<TAMANHO DA FONTE=”+4″>
este é o tamanho 6,
</FONT>
<TAMANHO DA FONTE=”+1″>
e este é um texto de tamanho 3
</FONT>
Em suma, utilizando a etiqueta da fonte de base, pode definir o tamanho padrão de uma fonte em HTML. Contudo, a etiqueta da fonte de base não pode ser aplicada em HTML5 e é desencorajada em HTML 4.01. Por isso, é conveniente usar CSS.
Dentro deste processo de aprendizagem de como alterar a fonte em HTML; e especialmente, o tamanho, não se esqueça que o tamanho real dependerá da dimensão da fonte que é definida no navegador. É possível alterar a fonte em HTML de uma forma personalizada. Para o fazer, vá para o menu superior e clique em View/Font Size .
3. Variar a cor da fonte em html
De acordo com um estudo da Forbes, a escolha da paleta de cores em qualquer desenho é essencial para os utilizadores descodificarem a mensagem que desejam comunicar. E, por exemplo, no contexto do marketing digital, saber escolher as cores das fontes em HTML será essencial se quiser gerar uma chamada à acção na audiência, que consistirá em marketing ou posicionamento de um determinado produto e/ou serviço no mercado.
Portanto, caso pretenda alterar a fonte em HTML tendo em conta a cor, terá de utilizar a <font> tag e a propriedade cor CSS. Depois, terá de definir o valor pretendido e colocá-lo dentro de um atributo de estilo. Em seguida, adicionar esse atributo de estilo a um elemento HTML como um parágrafo, título, botão ou etiqueta de extensão. 
Fonte: Pexels
Cada uma das cores do texto é definida por uma numeração hexadecimal, consistindo em três padrões que se referem à paleta de cores (RGB), constituída por vermelho (Vermelho), verde (Verde) e azul (Azul), através do seguinte código: #RRRGGBB.
Combinando estas três cores, é possível obter um total de 16 milhões de tonalidades para mudar as fontes em HTML. No início, a definição das cores das fontes para os seus designs da web pode ser complicada, mas com a prática, verá que é um procedimento simples e que dará uma aparência visual ideal aos seus sites em linha .
Assim, as cores são definidas por meio de valores que vão de 00 (0 decimal) a FF (255 decimal). Neste processo de alteração da fonte em HTML, de uma perspectiva de cor, lembre-se que a intensidade da cor escolhida dependerá do aumento da numeração do valor. A escala, então, poderia ser composta da seguinte forma:
Escala de cor mínima: nula = 00.
Escala decor média : média = 80.
Escala decor máxima: saturada = FF.
Aqui, deixamos-lhe o código de cor HTML (Hex Code) para que possa utilizar em todos os seus projectos de web design; e para ilustrar os conceitos que temos vindo a apresentar nesta análise sobre como alterar a fonte em HTML do ponto de vista da cor.
Fonte: HubSpot
Por exemplo, caso queira utilizar o código HEX e escolher o chocolate de cor (D2691E) para um dos seus cabeçalhos (H2), escreveria o seguinte código em html:
<h2 style=”cor: #D2691E”>Cabeçalho 2</h2>
Por outro lado, se quiser alterar a fonte em HTML, definindo a cor vermelha (FF0000) no corpo do seu texto, deve escrever o seguinte código em HTML:
<corpo>
<p style=”cor: #FF0000″;>Texto de parágrafo vermelho</p>
</ corpo>
No entanto, também pode alterar a fonte em HTML; e especialmente, as cores da fonte em HTML através de um sistema baseado em nomes. De facto, só tem de definir o nome da cor como um valor em inglês. Note que alguns browsers não suportam este tipo de cores quando se alteram as fontes em HTML.
Para lhe dar uma ideia de algumas das cores disponíveis para mudar as fontes em HTML, aqui estão algumas delas:
Preto
Branco
Verde
Maroa (castanho-avermelhado)
Azeitona (verde azeitona)
Marinha (azul-marinho)
Púrpura (violeta)
Vermelho (vermelho)
Amarelo (amarelo)
Azul (azul)
Teal (teal)
Cal (verde lima)
Aqua (azul claro)
Fúcsia (fúcsia)
Prata (cinzento claro).
Em conclusão e exemplificando, para que possa alterar a cor do seu texto em HTML, deve escrever o seguinte código, assumindo que quer definir a cor azul para os seus textos:
<cor da fonte=”azul”>Texto</fonte>
Fonte: Pexels
Como verá, mudar a fonte em html é um processo simples, se tiver em conta estas dicas que lhe demos ao longo deste guia. A geração de conteúdo de qualidade, com fontes HTML apelativas que correspondam aos pedidos dos seus clientes, aumentará a sua credibilidade como programador web.