Observação:

  O Typekit foi renomeado para Adobe Fonts e está incluído na Creative Cloud e em outras assinaturas. Saiba mais.

Trabalhar com fontes na Web do Adobe Fonts

As fontes na Web do Adobe Fonts já estão disponíveis para documentos HTML5 Canvas no Adobe Animate.

Por meio da integração do Adobe Fonts com o Animate, milhares de fontes da Web de alta qualidade, provenientes de parceiros estratégicos, estão instantaneamente disponíveis para documentos HTML5 Canvas.

Você pode testar uma seleção limitada de fontes da biblioteca do Adobe Fonts com qualquer plano da Creative Cloud e, caso tenha assinado um plano pago, você terá acesso a toda a biblioteca com milhares de fontes.

Para obter mais informações sobre planos de assinatura do Adobe Fonts, consulte Hospedagem de fontes da Web com o Adobe Fonts.

Diferentemente das fontes da Web, o Adobe Fonts hospeda as fontes que você decidir usar em seu conteúdo hospedado. Selecione fontes da biblioteca do Adobe Fonts e, então, publique o documento na Web. O Adobe Fonts hospeda automaticamente as fontes e conecta sua conta do Adobe Fonts ao conteúdo da Web.

A biblioteca do Adobe Fonts é disponibilizada com sua assinatura da Creative Cloud. Para obter mais informações, consulte cchttps://fonts.adobe.com. Além disso, também é possível comprar novas fontes do Adobe Fonts. Reinicie o Animate para exibir as fontes adquiridas na guia Todas as fontes da tela de fontes do Adobe Fonts.

Uso de fontes da Web em um documento HTML5 Canvas

  1. Abra um documento HTML5 Canvas e selecione a ferramenta Texto no painel Ferramentas.

  2. No painel Propriedades, selecione Texto dinâmico e clique no botão Adicionar fontes da Web, ao lado da caixa suspensa Família de fontes.

    TypeKit-Selection
  3. Na janela Adicionar Adobe Fonts que é exibida, clique em Começar a usar.  

    Adicionar Adobe Fonts
    Adicionar Adobe Fonts
  4. A caixa de diálogo Adicionar Adobe Fonts lista todas as fontes do Adobe Fonts disponíveis em seu plano de assinatura da Creative Cloud. Agora, você pode selecionar a fonte mais recomendada para as suas necessidades. Basta acessar as fontes e procurar fontes específicas, ou filtrar pelas propriedades de fonte.

    Clique em Filtro para aproveitar alguns dos filtros a seguir:

    • Classificação: você pode filtrar as fontes da Web com base em suas classificações, como Serif, Sans Serif e Script.
    • Recomendado para: filtre fontes com base nas recomendações das fontes da Web para parágrafos ou títulos.
    • Propriedades: filtre com base em propriedades como espessura, largura e altura.
    Adicionar caixa de diálogo do Adobe Fonts
    Adicionar caixa de diálogo do Adobe Fonts
  5. Ao encontrar a fonte desejada, basta clicar nela. Uma marca de seleção é exibida, indicando que a fonte está selecionada. Você poderá escolher várias fontes para adicionar de uma só vez. A guia Fontes selecionadas exibe todas as fontes que você selecionou.

    É possível clicar no rodapé da visualização de fonte para consultar todas as variações, como fino, negrito e itálico.

    Selecionar fontes
    Selecionar fontes

    Clique em OK para adicionar as fontes selecionadas. 

    selected-web-font-family-menu
    selected-web-font-family-menu
  6. Selecione a fonte da Web adicionada para usá-la no documento HTML5 Canvas.

    font-in-use
    Utilização da fonte selecionada no documento
  7. Antes de publicar seu conteúdo na Web, abra Configurações de publicação, clique na guia Fontes da Web e especifique o URL da página na qual o conteúdo HTML5 será publicado. Por exemplo, www.adobe.com/br. Você também pode especificar diversos URLs separados por vírgula.

    Caixa de diálogo de URL de fontes da Web
    Caixa de diálogo de URL de fontes da Web

    Observação:

    • As fontes da Web do Adobe Fonts serão carregadas somente nos nomes de domínio listados nas configurações de publicação. Se as fontes não funcionarem ou se aparecer um erro 403 do Adobe Fonts na sua página da Web, verifique se você incluiu o domínio do site na lista e publique novamente o projeto.
    • O conteúdo gerado pela opção TestMovie destina-se apenas à visualização. Use a opção Arquivo > Publicar para gerar o conteúdo da implementação final.

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online