Principal

Cómo averiguar qué fuentes hay en una web sin mirar el código

4/5 - (14 votos)

No sé si os he contado ya que soy un apasionado del diseño web —de hecho creo que es DISEÑO con mayúsculas, más que cualquier otra especialidad en nuestra disciplina, pero eso es otra historia— y me encanta inspeccionar el código de las páginas que me gustan; se aprende un huevo (desde luego con este lenguaje no llegaré nunca a catedrático).

Cuando quieres saber qué tipografía/cuerpo/interlínea/interletraje/márgenes/etc. tiene un texto en una web, a los que nos dedicamos a esto nos gusta mucho usar Firebug y herramientas de desarrollo parecidas. Pero para sacarles partido has de saber qué buscas, has de conocer cómo funciona html y css.

Hoy te quiero explicar las alternativas que he probado —aunque a mí me sigue gustando hacerlo a pelo— para que no tengas que volverte loco con el código de una página web:

    • Para Firefox llamada Context Font que añade información sobre la tipografía y el cuerpo de un texto seleccionado.
      Context-font

 

  • Para Chrome he instalado y estoy probando What Font Tool, en este caso tienes que activar la herramienta y posarte sobre el texto; si pinchas te despliega información detallada, lo mejor es que te indica qué servicio de alojamiento (Typekit, Google Fonts) está sirviendo la tipografía.
Aprovechad los comentarios para añadir extensiones que funcionen mejor y para otros navegadores/plataformas. Gracias.

 

11 Responses to Cómo averiguar qué fuentes hay en una web sin mirar el código

  1. Sergio 26/01/2013 at 04:09 #

    Muy interesantes estas herramientas… te las voy a robar 🙂

  2. Toñi 03/12/2013 at 16:40 #

    Hola, soy una gran enamorada de la tipografia, tardé mucho en darme cuenta en como algo me llamaba la atención y era por el tipo de letra empleado, es como un cuadro.
    Aunque me gustaría aprender creo que soy mas observadora del arte.
    Este post era para preguntaros algo que creo que es imposible pero yo voy a intentarlo, ya conocía la herramienta «What Font Tool» y la uso mucho, pero ¿qué ocurre cuando la fuente que quieres averiguar está dentro de un jpg?…

    ¿habría algun modo de averiguarlo?.

    Saludos y muchas gracias por sus aportes

    • Daniel Rodríguez 04/12/2013 at 09:33 #

      Puedes probar el servicio What the Font de MyFonts, hasta tienen un foro donde preguntar los casos muy raros.

  3. lixotuka 15/01/2014 at 00:08 #

    ¡Gracias!

    Qué cosa tan cómoda 😀

  4. Diego 21/11/2014 at 03:47 #

    Excelente herramienta. Muchas gracias. Ahorra mucho tiempo en el diseño de Desarrollos web que hacemos.

    Excelente Aporte.

  5. Jose Gosálbez 23/07/2015 at 12:33 #

    Interesante aporte. Yo añadiría «Font Finder» para Firefox, aunque yo también utilizo las distintas herramientas para ver el código css. Gracias Daniel!

  6. alvaro 22/03/2018 at 14:10 #

    grandioso

Trackbacks/Pingbacks

  1. Cómo averiguar que fuentes hay en una web sin mirar el código | Programación en Internet - 01/02/2014

    […] Pues eso es lo que ha escrito mi amigo y compañero Daniel Rodríguez en su blog sobre tipografía digital: Cómo averiguar que fuentes hay en una web sin mirar el código. […]

  2. Práctica 4: Tipografía | Comunicación Visual en los Nuevos Medios - 24/03/2014

    […] Daniel Rodríguez: Cómo averiguar qué fuentes hay en una web sin mirar el código (enlace) […]

  3. Cómo averiguar qué fuentes hay en una web sin mirar el código – Tipografía Digital | Blog de @AselaVit - 28/09/2014

    […] Source: tipografiadigital.net […]

Deja una respuesta

https://plausible.io/js/plausible.js