Typekit, mais opções de fontes na web

Por: em 27/08/09 na(s) categoria(s): Indústria, Internet, Miscelâneas, Web 2.0


Do ponto de vista tipográfico, há várias limitações para um designer na hora de criar um site na web. Se ele quiser utilizar outras fontes em seu layout além daquelas “padrões” que já vêm com o sistema operacional, poderá recorrer a duas saídas: usar imagens, ou fazer uma gambiarra com JavaScript – o que pode ferir a EULA da fonte em questão, já que, fuçando nos arquivos do site, o usuário poderia tranqüilamente conseguir este arquivo. Ambas as soluções são pouco práticas e tornam o uso limitado. Além dessas, existe uma terceira solução, que virá com a próxima versão do CSS, que continua dependente das fontes instaladas na máquina do usuário.

O que pouca gente sabe é que fontes têm tantos problemas relacionados a licenciamento quanto softwares. A verdade é que fontes são, até certo ponto, consideradas software, e suas licenças são muito parecidas. Porém, por se tratarem de um arquivinho quase insignificante na máquina do usuário, parece até que a pirataria de tipos é menos errada que a de qualquer outra coisa. O valor e o trabalho monstro gastos na produção de uma fonte de qualidade não são percebidos quando o que se tem diante dos olhos é uma porção de letrinhas.

Até agora, não havia muito o que fazer quanto a isso, e de um amplo espectro de fontes existentes no mundo, os designers estavam restritos a algumas poucas famílias tipográficas, como Arial, Times, Trebuchet, Verdana, Courier e Georgia, algumas de qualidade bastante questionável. Até agora.

Usando a propriedade @font-face do CSS3 já suportada por alguns browsers, mas ao invés de referenciar arquivos na máquina do usuário o faz num serviço próprio, o Typekit vem para acabar com esse problema. Funciona assim: o webdesigner se registra no Typekit, registra o site que utilizará o serviço, e tem a opção de escolher planos pagos ou o gratuito. Dependendo do plano, ele terá uma determinada gama de fontes para utilizar em seus sites, disponibilizadas pelas typefounderies cadastradas. Mesmo no plano gratuito, o número de tipos é muito maior que a meia dúzia de tipos default.

Para ver o Typekit em ação, basta ver esta e esta página num browser que suporte a propriedade @font-face do CSS3, no site da typefounderie brasileira Outras Fontes, de Ricardo Esteves.

  • http://bilgi.com.br/mr moi.robles

    Ideia muito interessante e que pode resolver a vida de muita gente!

    Eu já fiz alguns sites pra pessoas chegadas, não posso ser chamado de designer mas gosto da área! Acho que as poucas fontes listadas realmente acabam com a vida de muitos. Algumas fontes diferentes podem criar menus ou até mesmo textos longos um pouco menos “Arial”.

    A opção de utilizar imagens é interessante ainda mais nos tempos de banda larga, mas mesmo nos dias de hoje, designers profissionais se preocupam com o peso do conteúdo de suas paginas! Vou testar o serviço quando possível, estou fazendo um projeto de site “to myself”.
    ______________________________________________________________
    I Wanna Rock N’ Roll All Night And Party Every Day!

    • http://victorfranco.net victorfranco

      Sem contar que utilizar imagens no lugar de texto é um crime para quem se preocupa com SEO.


      E meu blog também se chama Victor Franco.
      Twitter: @victorfranco

      • http://bilgi.com.br/mr moi.robles

        Isso é e não é problema ao meu ver! Não consigo fechar uma opinião sobre isso!

        Depois que o google começou à indexar conteúdo em .SWF eu imaginei que logo existiria algum recurso de OCR para poder fazer a indexação de imagens também, mas para isso, o software precisa estar preparado para “ler” a fonte corretamente e tem muitos sites que usam fontes que nós humanos mal conseguimos interpretar além de ter efeitos de luz e sombra que pioram ainda mais o reconhecimento via OCR.

        Mas pra quem se preocupa com SEO a melhor coisa do mundo é todas as páginas estáticas em HTML puro e com as devidas configurações no cabeçalho! (ta bom, já acordei pra realidade e os publicadores de conteúdo…)

        ______________________________________________________________
        I Wanna Rock N’ Roll All Night And Party Every Day!

      • vincentvega

        Utilize title e alt para o Google ler e entender o que está escrito na imagem. Vale a pena repetir o que está escrito na img.

        De qualquer forma, pouca coisa justifica substituir o texto por imagem.

  • http://melinka.net Rocky

    Pra que outroas fontes?

    As padrões servem perfeitamente para qualquer texto, esse seletor do CSS3 só sirvirá para causar poluição visual com fontes estranhas.

    E visite meu twitter.
    _____________________
    About MeM.E. Linka – Tudo sobre web e twitter
    01010010 01101111 01100011 0

    • http://bilgi.com.br/mr moi.robles

      As vezes é bom mudar!

      Para hotsites ou campanhas de lançamento (ta meio redundante…) seria legal você poder ter alguma variedade!

      Ninguém nega que não há nada mais legível do que Verdana/Arial/Times New Roman (acho que as mais clássicas). Algumas variações seriam interessantes.

      Os textos dos exemplos que estão no post (não sei se você viu) estão escritos com uma fonte bem legal e manuscrita, hoje não temos essa opção!
      ______________________________________________________________
      I Wanna Rock N’ Roll All Night And Party Every Day!

      • http://megalopolis-blog.com Fabiane Lima

        Comparada à Verdana, pra tela, realmente só tem a Trebuchet, que é muito mais bonita, por sinal. Foi feita pelo mesmo cara que, pasme!, fez a Comic Sans. No que diz respeito a fontes feitas pra tal, temos também a Georgia, utilizada nos títulos dos textos aqui do Meio Bit.

        Das pouco conhecidas, existem as famílias Vera (da Bitstream, uma “releitura” sem vergonha da Verdana), e DejaVu, que nada mais é que um fork da Vera, que é uma fonte open source.

        As principais são essas, e as outras que existem são pouco utilizadas justamente porque nem todo mundo as têm instaladas em suas máquinas. Devido a esta limitação, acho que os designers não se interessaram muito em fazer fontes para tela.

        Megalopolis

        • ovtbqr

          Hey eu gosto da DejaVu Sans Mono, pq a Terminus escalável é ruim que dói só a Bitmap presta.

          O DejaVu é o Bitstream Vera com suporte extendido à Unicode.

          • http://megalopolis-blog.com Fabiane Lima

            [quote=ovtbqr]O DejaVu é o Bitstream Vera com suporte extendido à Unicode.[/quote]

            Exatamente.

            Megalopolis

        • http://bilgi.com.br/mr moi.robles

          Eu gosto bastante da Verdana, na minha opinião é a que tem leitura mais agradável para textos nos sites. Mas é o que eu tinha respondido anteriormente, para textos longos, não precisamos mudar muito, mas que tal algo tipo a Calibri, é uma fonte super legível e bem agradável!

          Gostei muito da notícia, mais ainda discutir sobre ela com uma especialista :P
          ______________________________________________________________
          I Wanna Rock N’ Roll All Night And Party Every Day!

    • http://megalopolis-blog.com Fabiane Lima

      Vários motivos:

      - Da mesma forma que ninguém usa layout igual, as fontes também poderiam variar;

      - Porque existem fontes melhores (do ponto de vista técnico e estético – já ouviu falar de hinting?) que as “padrões” por aí;

      - Porque a gama de escolha pra criação de layout é muito pequena e muitas vezes as fontes “padrão” não dão conta do recado;

      - Porque site todo em Flash (dependendo do contexto, claro) é uma bosta, e por enquanto este é o único meio de se usar plenamente uma fonte diferente na web;

      - Porque fonte bonita e bem feita faz diferença, ergonomicamente falando;

      - Porque Arial e Times são medíocres, principalmente pra leitura em tela.

      Não discuta tipografia com uma tipógrafa. ;-)

      Megalopolis

      • http://dleafy.deviantart.com/gallery/ DavidS

        Tradução da última frase:

        “Não discuta tipografia com uma tipógrafa.”

        “Fica quieto porque disso eu entendo”

        haha.

        Gostei da novidade. Por um lado vai dar uma gama maior aos designers, o que é muito bom, mas por outro, pode se tornar uma arma fatal na mão dos pseudo-designers… OMG, não quero nem imaginar o que vai acontecer quando encontrar um site todo feito com Monotype Corsiva em maiúsculo ~__~

        _____

        David!

      • ovtbqr

        O melhor Hinting é No Hinting. Monospace, baby. Tem gente que não acha agradável (eu pessoalmente acho lindo), mas é mto mais fácil calibrar o olho pra ler rapidamente.

        E site todo em flash é hediondo, eu já fiz duzias de comentários sobre isso. Flash é pra animações ou videogames.

        • http://megalopolis-blog.com Fabiane Lima

          Desculpe desapontá-lo, mas até fontes Monoespaçadas têm hinting. E até fontes monoespaçadas têm dezenas de famílias, umas melhores que outras.

          Eu, pessoalmente, gosto da Lucida Console.

          Megalopolis

          • ovtbqr

            Malz, madruguei Hinting com Kerning.

      • http://melinka.net Rocky

        A questão que o que isso vai causar.

        Se um simples seletor de CSS1 gera tanto problema por ai imagina um seletor de fontes.

        Esse tipo de coisa só serve para tornar a internet menos cross-browser e dar trabalho pra quem bota a mão na massa e não o cursor no Photoshop/Gimp. ;)

        E visite meu twitter.
        _____________________
        About MeM.E. Linka – Tudo sobre web e twitter
        01010010 01101111 01100011 0

        • http://megalopolis-blog.com Fabiane Lima

          Vai causar o que todo recurso causa: bom uso e mal uso por parte de pessoas com bom senso e falta dele, respectivamente.

          Megalopolis

        • http://www.zergovermind.co.cc Decapattack

          Os browsers q têm q se virarem para sempre aumentarem a interatividade e a variedade de experiências para o usuário.

          Eu não me imagino utilizando um browser via texto do Linux q esqueci o nome.

          Deus Ex Machina

          • http://bilgi.com.br/mr moi.robles

            elinks ou linx!
            ______________________________________________________________
            I Wanna Rock N’ Roll All Night And Party Every Day!

    • Overlord

      Estava pensando exatamente isto!
      É uma ótima solução para designers e tudo mais.

      Mas e o “outro lado”?
      Será que os usuários querem isto?
      Ou, pelo menos, irão gostar?

      Sei que as páginas que a Fabiane postou são só exemplos para mostrar como a tecnologia funciona mas mostra bem como o futuro será triste se abusarem de fontes bizarras.

      Mesmo se o recurso for otimamente utilizado, não sei se o benefício para o usuário é existente.

      EDIT: se o serviço do Typekit ficar indisponível, como funciona?
      Uma fonte alternativa, das famílias comuns, será então utilizada?

      ———–
      Overlord @ PoA\RS

      • http://nada-aqui.blogspot.com Marcio Neves

        [quote=Overlord]EDIT: se o serviço do Typekit ficar indisponível, como funciona?
        Uma fonte alternativa, das famílias comuns, será então utilizada?[/quote]Exato. Tanto que o texto aparece em outra fonte, comum, assim que carrega, e depois comuta para a fonte diferente, nos exemplos acima

      • vincentvega

        Quanto mais fontes bizarras disponíveis, mais os verdadeiros designers se destacarão entre os profissionais não qualificados.

        Uma fonte não estraga nenhum layout, a sua utilização é que distingue o belo do bizarro.

    • http://erasedcitizen.wordpress.com Adriano-Lepper

      Olha como é um site sem fontes bonitas:

      http://stallman.org

      I rest my case.

      ———
      I’ve exposed your lies baby, the underneath’s no big surprise… Now it’s time for changing and cleansing everything to forget your love

      • vincentvega

        Impressionante a organização do site. Fácil de achar o que procura, visualmente agradável, visual moderno e arrojado…

        :P

  • http://nada-aqui.blogspot.com Marcio Neves

    Eu sempre me perguntei porque que não era assim desde o início. Legal que tanto o FF3 quanto o IE8 suportam na boa, e aparece a fonte correta. Só tem um leve delay de carga, a ponto de poder ver a fonte original baseada no que tem instalado no computador, que depois é trocada para a fonte baixada. Bem útil. O chato é ter que pagar por isso :P

  • guicpv

    A primeira fonte ali, “good dog”, parece com a comic sans…

    O que acontece quando uma fonte se parece com a outra, mas não é igual?

    • http://megalopolis-blog.com Fabiane Lima

      A Good Dog é TOTALMENTE diferente da Comic Sans.

      Megalopolis

      • http://erasedcitizen.wordpress.com Adriano-Lepper

        [quote=Fabiane Lima]A Good Dog é TOTALMENTE diferente da Comic Sans[/quote]

        [2]

        Comic Sans tem AIDS. Alguém, com um mínimo de noção ainda usa aquilo?

        ———
        I’ve exposed your lies baby, the underneath’s no big surprise… Now it’s time for changing and cleansing everything to forget your love

  • kotter