14 mejores herramientas de tipografía para diseñadores web

14 mejores herramientas de tipografía para diseñadores web

type_tools

La tipografía con el paso del tiempo ha ido siendo más importante en el diseño de un sitio web. Por eso es necesario disponer de muchas tipografías gratuitas para elegir, además de herramientas, con las que podremos hacer el trabajo mucho más rápido y sencillo. En esta entrada os mostraré las mejores herramientas de tipografía para diseñadores web. La mayoría son gratuitas, espero que os simplifiquen el trabajo.

CSS Type Set

Typography Tools

CSS Type Set te permite visualizar e interactuar con el estilo de la tipografía y generar el código CSS.

Typetester

Typography Tools

Typetester es una aplicación online para comparar distintas fuentes en la misma ventana. Esto hace el trabajo del diseñador web mucho más sencillo. La lista de las fuentes comunes a los sistemas operativos se va actualizando con el paso del tiempo.

Typechart

Typography Tools

Con Typechart podrás comparar y previsualizar tipografías web y obtener su respectivo código CSS.

WhatTheFont

Typography Tools

WhatTheFont te permite escanear dentro de una página o identificar, mediante una dirección, la fuente que se está mostrando.

Fontstruct

Typography Tools

Con FontStruct podrás construir tipografías rápidamente y de forma sencilla mediante recuadros geométricos ubicados dentro de una cuadrícula.

Baseline Rhythm Calculator

Typography Tools

Baseline Rhythm Calculator genera el código CSS de un tamaño de fuente y line-height especificado por el usuario.

PXtoEM

Typography Tools

PXtoEM es una calculadora que convierte píxeles, em’s, puntos y porcentajes.

Font Burner

Typography Tools

Font Burner te muestra un simple bloque de código para insertar en tu sitio web con el que podrás transformar encabezados de aburridos sistemas de fuentes a algunos de sus sistemas de calidad provistos en su sitio.

TypeNavigator

Typography Tools

TypeNavigator es uno de los mejores buscadores interactivos de tipografías.

Font Tester

Typography Tools

Font Tester es una herramienta online gratuita que te permitirá previsualizar y comparar distintas fuentes de forma fácil con la posibilidad de comparar los estilos aplicados a ellas.

Flipping Typical

Typography Tools

Flipping Typical te permite introducir un texto y previsualizarlo con muchas fuentes distintas en la misma ventana.

Identifont

Typography Tools

Identifont identifica un tipo de letra desde un ejemplo contestando a una serie de preguntas.

STC FontBrowser

Typography Tools

STC FontBrowser previsualiza todas las fuentes activas en tu ordenador.

Convert TrueType Font to Sifr Flash File

Typography Tools

Convierte fuentes TrueType a Sifr (más información sobre el formato Sifr). El archivo se enviará por email.

Vía | WDL

Autor de CSSBlog ES

Post relacionados


  • Pedro CM
    @José GDF cuando todos los navegadores soporten la propiedad @font-face, efectivamente todo esto resultará mucho más cómodo y sencillo.

    Un saludo.
  • @FontFace ya lo intenté hacer funcionar, con tus propias instrucciones, y sólo me ha funcionado en Opera (imagino que en IE también, pero como uso Ubuntu, no tengo acceso a ese navegador). No me funcionó en FireFox 3.5, que se supone que ya lo soporta.

    También intenté un invento llamado TypeFace, que convierte fuentes en scripts, que luego renderizan los textos en imágenes, pero no funcionaba siempre con Opera.

    Sin embargo, he abierto la página de pruebas de sIFR con Firefox y Opera, y parece que sí funciona a la perfección. Incluso con el Chrome para Linux, con el flash recién implementado, también va. Parece mi solución para los encabezados de los posts del nuevo diseño de mi blog personal.

    Al menos hasta que todos los navegadores soporten plenamente @fontface, ¿verdad? ;)

    Muchas gracias por tu información.
  • Pedro CM
    @José GDF convierte fuentes con formato TrueType a formato Sifr. Aquí tienes más información sobre el formato Sifr (enlace externo): http://www.mikeindustries.com/blog/sifr/

    También te recomiendo leer estas entradas:

    http://www.cssblog.es/font-face-inserta-cualqui...

    http://www.cssblog.es/sintaxis-de-font-face/

    Un saludo.
  • ¿Para qué sirve el último? Me ha dejado intrigado lo del flash.

    Por lo demás, excelente recopilación de herramientas. Esta entrada va directa a mis marcadores para futuras referencias.

    Un saludo.
  • Matias
    Quiero compartir también. En mi busqueda dí con un complemento fantástico para Firefox, Font Finder. Excelente juguete para saber todos los atributos de cualquier texto con css. Seleccionas, botón derecho, Font Finder. Listo! Justo lo que buscaba.

    https://addons.mozilla.org/es-ES/firefox/addon/...

    Un abrazo, espero que les sirva también.
  • Matias
    Hola, estube viendo whats font, porque estoy buscando alguna herramienta que me ayude a identificar que fuente y con que atributos, es usada en cualquier sitio. El tema es que en esa página te permite identificar una tipografía por medio de una imágen, no identifica el código css aplicado a un párrafo por ejemplo.
    Muchas Gracias por el post, excelente!
  • Alberto
    Muchas gracias por la clasificación, es muy interesante saber que estas funciones están en la nube.

Get Adobe Flash playerPlugin by wpburn.com wordpress themes