Cómo Saber la Tipografía de Una Web o Una Imagen

✔️Si quieres saber la tipografía de una web o el tipo de letra de una imagen, aquí encontrarás 3 metodos para descubrirlo.

Alguna vez te habrá llamado la atención una tipografía de un sitio web y te preguntarías cómo se llama para poder usarla en tu propio contenido. Una tipografía de calidad puede mejorar la experiencia de lectura de tus visitantes, vale la pena hacer un esfuerzo para identificarla. Independientemente del motivo por el que quieras saber qué fuente se utiliza en un sitio web, existen muchas herramientas que te pueden ayudar.

En este artículo, analizaremos por qué te interesa saber las fuentes que utiliza una página web. También veremos cómo hacerlo.

¡Empecemos!

¿Por qué te interesa cómo saber la tipografía de una web o una imagen?

Como ya mencionamos, las fuentes bonitas y legibles pueden mejorar la experiencia del usuario (UX) y la legibilidad de tu sitio. También garantizan que los visitantes puedan interactuar cómodamente con tu contenido sin tener que esforzarse por descifrarlo. Si tu texto es elegante pero ilegible, a los lectores les resultará difícil entender o apreciar tus contenidos.

Los botones de llamada a la acción (CTA) también pueden resultar casi inútiles si su texto no es legible. Por eso puede resultarte útil tener una lista de fuentes elegantes y legibles para usarlas en tu sitio o el de tus clientes, en el futuro.

También te puede interesar:

😉 Lectura recomendada: ¿Qué es un Blog y para qué sirve? ¿Por qué crear un blog?

😉 Lectura recomendada: ¿Cómo saber que plantilla y plugins usa una web?

Cómo saber la tipografía de una web (2 métodos)

Hay varios métodos que puedes utilizar para comprobar qué fuente utiliza un sitio web. La función de inspección de tu navegador es una excelente solución, pero hay extensiones que pueden producir efectos equivalentes. Incluso puedes encontrar fuentes a partir de imágenes utilizando herramientas online. Echemos un vistazo a cada una de estas opciones.

1. Utilizar el Inspector del navegador para saber el tipo de letra de una web

Una de las formas más fáciles de verificar qué fuente está usando un sitio web es con la herramienta de inspección de tu navegador. Aunque trabajaremos con el Inspector de Chrome en este ejemplo, señalar que otros navegadores tienen las mismas características.

Si nunca has trabajado con el inspector de elementos no le tengas miedo, cualquier cambio que efectúes desaparecerá en cuanto recargues la página.

Primero, haz clic con el botón derecho en la página web que contiene la fuente que deseas buscar. En el menú resultante, selecciona  Inspeccionar:

Si prefieres usar un atajo de teclado Ctrl + Shift + I para Windows o Linux. Si estás usando una Mac, el equivalente es Cmd + Shift + I.

Haz clic en el Icono 1 al pasar el puntero por encima del texto que quieres identificar te mostrará la información que buscas.

Al hacer clic en el texto que quieres identificar aparecerá el identificador del elemento 3 y en la pestaña Styles el tipo de fuente que usa el texto 4.

En la pestaña Styles  puedes desplazarte para Para ver el CSS relacionado con la fuente.

En la pestaña Computed puedes buscar está información en el apartado font family.

2.- Descubrir las fuentes de una web a través de una extensión del navegador

Las extensiones del navegador pueden proporcionar una forma más sencilla de identificar tipografías en un sitio web o imagen online, no es necesario que mires el código con el Inspector. Además, por lo general, pueden brindar la respuesta que estás buscando más rápido para que puedas volver a la tarea en cuestión.

Algunos de estos identificadores de tipografía online son:

  • Fontanello :  (Firefox y Chrome) esta extensión le permite encontrar el nombre, el peso, el estilo y la fuente de tipografías online. Simplemente resaltándolas y haciendo clic derecho sobre ellas mientras navega.
  • WhatFont : (Firefox, Chrome, Safari e Internet Explorer) este identificador de tipografía optimiza aún más la detección de fuentes. WhatFont TOOL te permite ver el nombre de un tipo de letra con solo pasar el mouse sobre él.
  • CSS Peeper : (Google Chrome) es un identificador de fuentes pensado para diseñadores de páginas web. Es una extensión un poco más robusta, puede identificar la fuente y otros detalles adicionales de código CSS de la página web.

Utilizar WhatFont para saber la tipografía o tipo de letra de una página web

WhatFont es la opción más fácil de usar para encontrar rápidamente el nombre de una fuente específica. Además también es compatible con la mayoría de los navegadores. Vamos a ver cómo funciona.

Instalar whatFont

1- Lo primero es buscar WhatFont en la Google Web Store. Cuando la tengas solo debes hacer clic en la opción  Agregar a Chrome.

cómo saber la tipografía de una web

2- En la siguiente ventana presionamos Agregar Extensión para instalarla en Chrome.

whatfont para saber fuentes de una web

3- WhatFont Ya se ha instalado en tu navegador. La podrás identificar con el símbolo F ? como se muestra en la imagen de abajo.

saber la tipografía de una web con whatfont

Utilizar WhatFont

Una vez instalado WhatFont, puedes verificar qué fuente está usando un sitio web activándola en la barra de herramientas de tu navegador y colocando el cursor sobre el texto que usa la tipografía que quieres identificar.

La primera vez que coloques el cursor sobre el texto, solo verás el nombre de la fuente. Sin embargo, al hacer clic en el nombre se mostrará una ventana emergente expandida con más detalles como el tamaño, el peso, el color y la altura de la línea. También puede identificar si un tipo de letra está disponible a través de Typekit o Google Fonts.

Cuando hayas terminado de verificar los detalles de la fuente, puedes salir de la herramienta usando el botón Exit WhatFont, en la esquina superior derecha de la ventana de tu navegador.

Cómo saber la tipografía de una imágen online

También puedes identificar fuentes utilizadas en imágenes. Esto incluye los tipos de letra presentes en logotipos, capturas de pantalla o infografías. Los siguientes detectores de tipografías online te pueden ayudar

Sin embargo, si estás dispuesto a usar una fuente similar a la que has encontrado en una imagen, un detector online te facilitará la información que necesitas.

La tasa de éxito puede variar según la fuente y la popularidad de la fuente. Si el nombre exacto del tipo de letra es muy importante para ti, puede ser difícil encontrar una herramienta que lo detecte. Los siguientes detectores de tipografías online te pueden ayudar:

WhatTheFont: Es posiblemente la más conocida de todas las aplicaciones gratuitas de búsqueda de fuentes. Muestra tipografías gratuitas y de pago.

Matcherator: Es más que un identificador de tipografías y una herramienta de búsqueda de fuentes. Funciona de la misma manera que WhatTheFont. También te permite descargar fuentes. Muestra tipografías gratuitas y de pago.

Whatfontis: Funciona de manera similar a los anteriores. Muestra tipos de letra de pago y de uso gratuito

 Estos tres detectores de tipografías online trabajan de manera parecida. A continuación vamos a ver como funciona WhatTheFont.

Cómo Saber la tipografía de una imagen online usando WhatTheFont

Para usar WhatTheFont, carga la imagen en cuestión y selecciona la sección con la fuente tipográfica que quieres descubrir.

cómo saber la tipografía de una imagen

Te devolverá una página de resultados con varias fuentes que son similares, si no coinciden exactamente, a la que está tratando de identificar:

saber tipo de letra en una imagen

Conclusiones

Las fuentes visualmente atractivas y legibles pueden mejorar la experiencia de lectura de los visitantes de tu sitio web. Por ello es importante el tipo de letra que usas en tu sitio web o en el de tus clientes. Independientemente de la razón por la que quieras comprobar qué tipo de letra utiliza un sitio web, existen muchas herramientas que pueden ayudarte.

En esta publicación, tratamos cómo saber la tipografía de una imagen o una web con tres métodos diferentes:

  1. Identificar las fuentes con la herramienta de inspección de tu navegador.
  2. Buscar fuentes utilizando una extensión de navegador como WhatFont .
  3. Detectar fuentes en imágenes usando WhatTheFont .

¿Tienes alguna pregunta sobre cómo saber la tipografía de una imagen o una web? ¡Te leo en los comentarios!

Te leo en los comentarios.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Responsable » Sergio Carreño -  Finalidad » moderar los comentarios -  Legitimación » tu consentimiento -  Destinatarios » tus datos serán guardados en los servidores de Lucushost,  nuestro hosting -  Derechos » por supuesto tendrás derecho, entre otros, a acceder, rectificar, limitar y suprimir tus datos

 

Ir arriba