Escrever fontes

Para não sobrecarregar seu website, a WebAcappella permite que você defina 6 fontes diferentes.

Essas fontes são de 3 tipos:

  • Fonte de texto padrão (já instalada em seu sistema)

  • Fontes Web (como o GoogleFonts)

  • Fonte web personalizada (a partir de arquivos gratuitos ou pagos)

É aconselhável usar no máximo uma ou duas fontes da web em todo o seu site.

Isto permitirá uma rápida exibição e consistência gráfica.

../../_images/fonts_edition.webp

Fonte de texto padrão

As fontes de texto padrão foram selecionadas entre aquelas encontradas em quase todos os sistemas operacionais por padrão (Arial, Times …).

Este tipo de fonte não consumirá nenhum recurso da rede, pois já existe no terminal do visitante de seu site.

Fonte de texto web personalizada

Você encontrará sites que oferecem arquivos de fontes da web (gratuitos ou pagos).

../../_images/font_custom_edit.webp

Aqui está um exemplo de como hospedar a fonte ‘Amatic SC’

  • Digite o nome da fonte “Amatic SC

  • Adicione os arquivos woff e woff2 ao seu projeto

  • Copiar o código CSS com a url dos arquivos (‘{{{ WA_FONT_FAMILY }}}’ será substituído automaticamente por ‘Amatic SC’)

/* amatic-sc-regular - latin */
@font-face {
  font-family: '{{ WA_FONT_FAMILY }}';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('{{WA_FILE amatic-sc-v24-latin-regular.woff2}}') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('{{WA_FILE amatic-sc-v24-latin-regular.woff}}') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* amatic-sc-700 - latin */
@font-face {
  font-family: '{{ WA_FONT_FAMILY }}';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('{{WA_FILE amatic-sc-v24-latin-700.woff2}}') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('{{WA_FILE amatic-sc-v24-latin-700.woff}}') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

Fonte Web do Google

WebAcappella permite selecionar da lista de fontes web oferecidas pelo Google (Google Fonts)

WebAcappella fará automaticamente o download dos arquivos para instalá-los em seu servidor.

(A instalação automática no servidor requer uma licença WebAcappella FUSION PRO)

https://fonts.google.com/

../../_images/google_fonts.jpg