Cómo usar fuentes de Typekit en tu escritorio (Photoshop, Illustrator, Fireworks…)

Las webfonts molan. Trabajar con ellas en el escritorio, no tanto.

Servicios como Typekit o Fontdeck son interesantes tanto por el extenso catálogo de fuentes de calidad que ofrecen, como por la facilidad de servir el formato adecuado para cada navegador.

Pero hay una gran desventaja de estos servicios respecto a otros como Fontsquirrel, Fontspring, o Google Web Fonts. En estos últimos podemos descargar la versión OpenType a nuestro escritorio y usarla durante la fase de diseño en programas como Photoshop, Illustrator, Fireworks… Por el contrario, con Typekit o Fontdeck no dispondremos de una versión de escritorio, por lo que no podremos usarlas durante la fase de diseño, a no ser que dispongamos de una licencia específica para escritorio de esas fuentes.

Typekit en Photoshop/Illustrator/Fireworks? Tendrás que esperar.

Desde que Adobe compró Typekit muchos hemos estado esperando el momento de verlo integrado en las principales herramientas de diseño de Adobe (Photoshop, Illustrator, Fireworks…).

Había esperanzas de que esto ocurriera en la última versión de la suite de Adobe (CS6). Pero no fue así, lamentablemente sólo está disponible en Muse. Además, necesitarás acogerte al pago por suscripción vía Creative Cloud.

Un experimento

Siendo éste uno de los mayores inconvenientes de trabajar con servicios de webfonts bajo suscripción, y viendo que Adobe no lo integrará a corto plazo en el resto de sus aplicaciones, he decidido realizar un sencillo experimento para ver si sería posible usar las fuentes de Typekit en el escritorio.

Hay seguramente muchas posibilidades de realizar lo que voy a describir a continuación, pero para evitar tener que instalar scripts o aplicaciones sólo disponibles para una u otra plataforma, lo haré con un par de sencillas herramientas online y gratuitas.

DISCLAIMER

• Esto no es más que un experimento.
• Usar las fuentes de Typekit como voy a describir a continuación no está contemplado en la licencia de usuario final (EULA).
• Si vas a usar dichas fuentes en programas de escritorio deberás comprar una licencia adecuada de las mismas.
• No hagas el mal. No distribuyas ni embebas en tu sitio fuentes de las que no tienes licencia.
• Typekit describió en su blog cómo protegen sus fuentes y cómo pueden ser evitadas estas medidas.

Vale, a lo que venías.

1. Elige la fuente con la que quieres realizar el experimento. Por ejemplo, Cora Web.

2. En el inspector de Webkit (Chrome, Safari…) o en Firebug, localizas la webfont descargada.

3. Copia el código de dicha fuente disponible en la pestaña “Headers”. Copia sólo el contenido del campo “Request URL:”. También lo podrás localizar en la hoja de estilo CSS. Elimina la cabecera “data:font/opentype;base64,” del texto copiado y quédate con el resto.

4. Pega el texto en este decodificador base64, y selecciona las opciones “decode the data from a Base64 string (base64 decoding)” y “export to a binary file, filename: base64.bin”. Cuando lo tengas, dale al botón “Convert the source data”. Se descargará un archivo llamado base64.bin.

5. Sube el archivo base64.bin a este conversor de WOFF a OTF y pulsa “Convert”. Descarga la fuente convertida a OTF, “base64.ttf” (en vez de .ttf, puede que el archivo generado tenga la extensión .otf o .ttc).

6. Fin del experimento. Borra la fuente creada, no la uses.

Respondiendo al título de este post, no puedes usar de manera legal fuentes de Typekit en tu escritorio. La licencia de Adobe Typekit (EULA) no permite usar ni instalar fuentes creadas por este método. Además, debes saber que dicha fuente podría no estar completa, es decir podría no contener todos los caracteres (para más información lee el apartado “Segmenting and subsetting” de Serving and Protecting Fonts on the Web).