5 formas de Identificar Fuentes en una página Web

Publicado por Rob Hope en Tutoriales de Landing Page, el 20 de mayo 2018

Entonces, ¿estás haciendo lo tuyo navegando por la web y te topas con la combinación de fuentes más mala, pero no puedes identificar la fuente? Bueno, en este video (y resumen de la lista a continuación) te muestro exactamente cómo encontrar esas fuentes

Fontanello (Chrome + Firefox)

La extensión Fontanello Chrome y Firefox, en mi opinión, es la forma más rápida de averiguar qué fuente está utilizando una página web. Simplemente haga clic derecho en el texto, encuentre Fontanello en el menú y pow allí está la familia de fuentes y algunos atributos adicionales.

WhatFont (Chrome y Safari)

La extensión WhatFont para Chrome y Safari es mi opción favorita cuando se trata de descubrir fuentes. Para activar la herramienta, debe hacer clic en el icono de fuente en el menú del navegador. Ahora puede seleccionar varias partes de texto, lo que permite una mejor visualización del desglose de fuentes frente a Fontanello.

Visual Inspector (Chrome)

La extensión de Visual Inspector Chrome ofrece un poco más de profundidad que las dos anteriores. Simplemente haga clic en el icono del Inspector Visual en el menú de Chrome para activar la herramienta y, a continuación, diríjase a la sección de tipografía en el menú desplegable. Ahora se le presentan las familias de fuentes utilizadas con un desglose adicional de toda la tipografía dentro de la página web.

Inspección de Código antiguo (Todos los navegadores)

Así que si está tratando de evitar instalar docenas de extensiones de navegador, podemos encontrar más información sobre las fuentes utilizadas a través de una inspección de código antiguo:

Si está utilizando Google Chrome, haga clic con el botón derecho en el texto misterioso, seleccione Inspeccionar. Aparece DevTools, asegúrate de estar en la pestaña Estilos y dirígete a los atributos de la familia de fuentes para obtener más información sobre las fuentes.

Si está utilizando Firefox, haga clic con el botón derecho en el texto y seleccione Inspeccionar elemento. Su inspector aparece, ahora dirígete a la pestaña de Fuentes convenientes para obtener la información que necesitas.

Si está utilizando Safari, asegúrese de que el menú Desarrollador esté visible marcando la casilla en la parte inferior de la pestaña Avanzado de preferencias de Safari. Ahora haga clic con el botón derecho en el texto, seleccione Inspeccionar elemento. Abra la barra lateral de detalles si está cerrada y seleccione la opción Estilos calculados. La sección familia de fuentes presentará la información de fuentes dentro de los atributos de estilo.

Descubrir fuentes renombradas (método avanzado)

Un obstáculo que podemos enfrentar es cuando una familia de fuentes no tiene un nombre claro, deseche naturalmente las herramientas y métodos de inspección de fuentes. Comenzamos la misión de rescate descargando la fuente.

Hay varias maneras de hacer esto, pero comienzo anotando el nombre de la fuente actual. Ahora abre la herramienta Inspector (estoy usando Google Chrome), dirígete a la pestaña de Aplicaciones y desplázate hasta la sección de Marcos y abre las fuentes. Necesitamos hacer coincidir el nombre del archivo con el nombre de la fuente indicado anteriormente. Ahora abra esa fuente en una nueva pestaña para descargarla. Finalmente, arrastramos ese archivo de fuente al impresionante ¿Qué puede Hacer Mi fuente? sitio web y bam, la información de la fuente se presenta maravillosamente.

Mucho amor,
Rob
Twitter: @robhope
LinkedIn: @robhope
Correo electrónico:

Deja una respuesta

Tu dirección de correo electrónico no será publicada.