ttramillas
Página principal Blog 4 maneras de identificar rápidamente una fuente en un sitio web

4 maneras de identificar rápidamente una fuente en un sitio web

4 maneras de identificar rápidamente una fuente en un sitio web

Un diseñador apasionado siempre está buscando activamente nuevas fuentes. No sólo durante el trabajo.

Al desplazarse por las redes sociales, los sitios web de marcas e incluso mientras se relaja mientras juega un juego de consola, puede notar una fuente que desea agregar a su colección. Queda un punto técnico: averigüe qué familia de fuentes se utiliza en el proyecto y compre una licencia para ello.

Hay varias formas de determinar una fuente; te contamos las más sencillas.

¿Por qué necesita saber qué fuente se utiliza en el sitio?

Para un aspirante a diseñador, aprender sobre las fuentes utilizadas en otros proyectos es beneficioso para el crecimiento profesional. Esto ayudará a desarrollar la observación.

Busca proyectos similares al tuyo y estudia fuentes que utilizan otros profesionales. De esta manera puedes determinar qué estilos de auriculares lucen mejor en un tema determinado. Estudia no sólo las obras que te gustan. Será útil comprender qué fuentes parecen inapropiadas y por qué. Para que el proceso sea aún más divertido, haga su propia lista de fuentes «malas» y «buenas» para varios proyectos.

4 maneras de identificar rápidamente una fuente en un sitio web

Buscar fuentes que se utilicen en otros proyectos también será útil para los diseñadores experimentados. De esta manera podrás ampliar tu colección de tipos de letra o encontrar nuevos estudios con fuentes interesantes y elegantes.

Cómo saber el nombre de una fuente en un sitio web

Hay varias formas de determinar la fuente que se utiliza en el sitio de un proyecto.

  • Extensión del navegador;
  • Busque un nombre en el código de la página;
  • Busque fuentes por imagen utilizando servicios en línea;
  • Definición de una fuente en Adobe Photoshop.

Echemos un vistazo más de cerca a cada uno de ellos.

Extensiones del navegador

Existen bastantes extensiones de navegador que pueden detectar la fuente en un sitio web. Compartiremos aquellos que los diseñadores utilizan con frecuencia y que nosotros probamos.

4 maneras de identificar rápidamente una fuente en un sitio web

Fonts Ninja

Navegadores: Chrome, Firefox, Safari.

Sitio web: https://www.fonts.ninja/

Una de las extensiones más populares y convenientes. Determina no sólo la fuente, sino también su estilo. Una ventaja adicional es que no sólo puedes ver, sino también comprar fuentes. Ninja tiene enlaces para comprar, conveniente y fácil.

Para utilizar la extensión, descárguela e instálela en su navegador. Después de esto, aparecerá un ícono con un ninja en la barra de herramientas. Al hacer clic en él, puede pasar el cursor sobre cualquier parte del texto para determinar la fuente. Haga clic en el texto para abrir un panel adicional y probar la fuente. Fonts Ninja también está disponible como aplicación para teléfonos inteligentes.

Por cierto, el sitio web oficial de Fonts Ninja utiliza el bestseller del estudio TypeType: TT Norms® Pro.

4 maneras de identificar rápidamente una fuente en un sitio web

WhatFont 

Navegadores: Chrome, Safari.

Sitio web: https://www.whatfontis.com/

Otra extensión de navegador popular que ayuda a reconocer fuentes.

Después de la instalación, seleccione el fragmento de texto requerido y haga clic en el icono «WhatFont». Puede averiguar qué familia de fuentes, estilo y tamaño se utilizan.

Además de las extensiones enumeradas anteriormente, los diseñadores usan CSS Pepper y TypeSample y otras. Cada uno tiene sus propias funciones adicionales, por lo que te recomendamos probar varios y elegir el que más te convenga.

Búsqueda manual en el código de la página.

4 maneras de identificar rápidamente una fuente en un sitio web

La forma más difícil y al mismo tiempo más sencilla de averiguar qué fuente se utiliza en el sitio es buscar en el código de la página. Esto no es ideal ya que se puede cambiar el nombre de las fuentes.

Para utilizar la búsqueda manual, seleccione un fragmento de texto y busque Familia de fuentes en el código de la página.

Para hacer esto en los navegadores Chrome y Firefox, haga clic derecho en el texto y seleccione el elemento del menú desplegable Vista de código, luego busque la pestaña «Elementos», luego «Estilos», que contendrá el código de la familia de fuentes. En Safari, los pasos serán similares, pero asegúrese de tener abierto el menú Desarrollador de antemano. Para hacer esto, marque la casilla correspondiente en la pestaña «Avanzado».

Servicios en línea para reconocer fuentes a partir de imágenes.

4 maneras de identificar rápidamente una fuente en un sitio web

A veces, la fuente que te gusta no está en la página del sitio, sino en la imagen. Puede ser un banner publicitario, una fotografía o una imagen en las redes sociales.

Para tales casos, existen varios servicios en línea que lo ayudarán a determinar la fuente que le gusta.

El principio de funcionamiento es similar en todos. Simplemente vaya al sitio web del servicio, cargue una imagen con la fuente requerida y espere el resultado.

Muy a menudo, se utilizan los siguientes servicios para determinar una fuente a partir de una imagen:

También puedes preguntar a otros diseñadores sobre la fuente que te interesa utilizando las redes sociales.

Definir una fuente en Adobe Photoshop

4 maneras de identificar rápidamente una fuente en un sitio web

Puede identificar la fuente en una imagen usando Adobe Photoshop. La función Font Match se mejora constantemente, pero actualmente no es compatible con todos los idiomas.

Para utilizar la función necesita:

  • Seleccione texto en la imagen usando la herramienta Marco rectangular;
  • Haga clic en el elemento «Texto» «Seleccionar fuente»;
  • Seleccione la más adecuada de la lista de fuentes similares.

Bonificación: aplicaciones para teléfonos inteligentes

4 maneras de identificar rápidamente una fuente en un sitio web

Por supuesto, las fuentes interesantes pueden sorprender a un diseñador no sólo en el ordenador de su trabajo. Para poder ampliar siempre su colección de fuentes, descargue la aplicación en su teléfono inteligente.

WhatTheFont y Find My Font son populares en este momento. Para determinar la fuente que le gusta, simplemente abra la aplicación y apunte la cámara a la imagen. De una lista de fuentes similares puedes elegir la más adecuada.

Go to catalog Thanks for your complete read-through!

Here is a promo code for you: 4Quickways
Enter it during checkout and get a 30% discount on any TypeType font.

En lugar de conclusiones

Las fuentes estéticas las encuentra el diseñador no solo durante el trabajo. Es mejor preparar con antelación herramientas con las que pueda determinar rápidamente qué fuente se utilizó en un sitio web, cartel, pancarta o letrero de cafetería. 

Últimas publicaciones

Retálica, o cursiva inversa: ¿qué es y por qué se inclina?

Retálica, o cursiva inversa: ¿qué es y por qué se inclina?

A muchos de nuestros lectores seguramente les resulta familiar el concepto de «itálica»: hablamos con mucha frecuencia sobre ellas, es decir, sobre las fuentes inclinadas y cursivas, en nuestros artículos. Sin embargo, el término «retálica» aparece con mucha menos frecuencia, e incluso los lectores versados en terminología tipográfica pueden no saber qué significa. ¡Vamos a aclararlo!

Buscar etiqueta
¿Cómo nombrar una fuente? Aprendiendo de ejemplos reales

¿Cómo nombrar una fuente? Aprendiendo de ejemplos reales

A menudo nos preguntan cómo los diseñadores de tipografías eligen los nombres para sus fuentes. No es tan sencillo como podría parecer, ya que cada estudio y diseñador tiene su enfoque único. En este artículo, exploraremos diferentes aspectos del nombrado de fuentes, desde las consideraciones creativas hasta las implicaciones legales.

Buscar etiqueta
Licenciamiento de fuentes: guía completa para diseñadores y clientes corporativos

Licenciamiento de fuentes: guía completa para diseñadores y clientes corporativos

La concesión de licencias para fuentes es un área que a menudo puede resultar complicada de entender, ya que existen muchos tipos de licencias, cada una con sus particularidades sobre el uso de las fuentes. ¿Qué tipos de licencias de fuentes existen? ¿Cómo elegir correctamente una licencia según las necesidades específicas?

Buscar etiqueta
Las Mejores Fuentes Cursivas de 2024: Una Guía Completa de Diseño

Las Mejores Fuentes Cursivas de 2024: Una Guía Completa de Diseño

Las fuentes cursivas son una herramienta de diseño poderosa que puede realzar tus proyectos visuales cuando se usan de manera reflexiva. Sin embargo, la clave está en saber aplicarlas de forma efectiva y adecuada. En esta guía integral, exploraremos el mundo de las fuentes cursivas.

Buscar etiqueta
Cómo Elegir las Mejores Fuentes para Infografías: Guía Completa

Cómo Elegir las Mejores Fuentes para Infografías: Guía Completa

Las infografías son una herramienta versátil y práctica que encuentra aplicación en todas partes: negocios, publicidad, ciencia, periodismo y más. Es una forma poderosa de comunicar información de manera simple y visual.

Buscar etiqueta
Las 10 principales tendencias tipográficas de 2024

Las 10 principales tendencias tipográficas de 2024

Vivimos en una época en la que las tendencias cambian casi a diario, y las tendencias en diseño tipográfico no son la excepción. Todos interactuamos con la tipografía a diario: en internet, en los supermercados y en los escaparates y carteles. Un diseño anticuado, en el mejor de los casos, genera aburrimiento; en el peor, desconfianza hacia el producto o servicio.

Buscar etiqueta
Las 15 mejores fuentes para revistas

Las 15 mejores fuentes para revistas

Las revistas son el lienzo perfecto sobre el que la tipografía puede revelar todas sus facetas. La fuente aquí no sólo transmite información al lector, sino que también influye directamente en el diseño. Transmite el mensaje de la revista, transmite valores e ideas. Este artículo habló sobre cómo elegir la mejor fuente para revistas y compiló una selección de 15 opciones actuales para publicaciones sobre diversos temas.

Buscar etiqueta
Las 15 mejores fuentes de contorno aprobadas por diseñadores en 2024

Las 15 mejores fuentes de contorno aprobadas por diseñadores en 2024

Las fuentes de contorno son una excelente manera de agregar variedad a su diseño y hacerlo atractivo y llamativo. ¿Qué son, dónde se utilizan y qué estilos de fuente se combinan con ellas? Hablamos de todo esto en nuestro artículo y también seleccionamos las mejores fuentes de contorno para varios proyectos.

Buscar etiqueta
Las 10 mejores fuentes para diseños de carteles

Las 10 mejores fuentes para diseños de carteles

Elegir la fuente adecuada para un proyecto es una tarea seria para un diseñador. ¿Cómo encontrar la mejor fuente entre muchas opciones y en qué criterios confiar a la hora de elegir? Te lo contamos en este artículo.

Buscar etiqueta

Buscar etiqueta

Fuentes para maquetación de libros: cómo elegir la mejor

Fuentes para maquetación de libros: cómo elegir la mejor

La web y la impresión son dos mundos diferentes en el diseño tipográfico. Al menos, así es como suelen presentarse. En la práctica, se pueden utilizar muchas fuentes en ambas áreas. Pero para entender qué tipo de letra elegir, es necesario conocer las diferencias entre las fuentes para libros y para la web.

Buscar etiqueta
Fuentes monoespaciadas en diseño y programación

Fuentes monoespaciadas en diseño y programación

Las fuentes monoespaciales están ganando popularidad entre los diseñadores. Lo más curioso es que el alcance de su aplicación se está ampliando. Atrás quedaron los tiempos en los que este tipo de fuentes se utilizaba solo en programación. Hoy en día, las fuentes monoespaciales decoran páginas de revistas, envases de marcas de moda, carteles y menús, sitios web, y no hay límites.

Buscar etiqueta
Fuentes para web: cómo elegir y utilizar fuentes en su sitio web

Fuentes para web: cómo elegir y utilizar fuentes en su sitio web

Para un diseñador novato, el tema de las fuentes web puede parecer desalentador e incluso estresante. No debes desesperarte, porque con el tiempo, estudiando información y practicando, te convertirás en un profesional.

Buscar etiqueta
Las 15 mejores fuentes Sans Serif modernas para tu diseño en 2023

Las 15 mejores fuentes Sans Serif modernas para tu diseño en 2023

La mayoría de las marcas modernas eligen una fuente que no tiene serifas como fuente corporativa. Estas fuentes comenzaron a ganar popularidad hace casi un siglo, pero todavía están en su apogeo. Descubramos qué atrae a la gente de estas fuentes y compartamos una selección de las mejores de la colección TypeType.

Buscar etiqueta
Las 15 mejores fuentes serif para proyectos de diseño en 2024

Las 15 mejores fuentes serif para proyectos de diseño en 2024

La tipografía moderna ofrece cientos de fuentes serif para proyectos de cualquier carácter y objetivo. A pesar de esto, muchos diseñadores todavía desconfían de las antiquas por temor a introducir algo anticuado en sus proyectos.

Buscar etiqueta
Complementándose entre sí: combinaciones tipográficas con TT Norms® Pro y TT Norms® Pro Serif

Complementándose entre sí: combinaciones tipográficas con TT Norms® Pro y TT Norms® Pro Serif

En casi cualquier pista musical donde el vocalista lleva el papel principal, no se utiliza una sola línea vocal. A veces, esto pasa desapercibido, pero los momentos que erizan la piel suelen estar reforzados por otra línea vocal, en un tono más alto o más bajo, para destacar acentos y potenciar el efecto.

Buscar etiqueta
Creando una fuente desde cero: una guía detallada y tips para escoger programas

Creando una fuente desde cero: una guía detallada y tips para escoger programas

Crear la primera fuente es lo más difícil, porque el diseñador aún no conoce todos los detalles del desarrollo y no tiene suficiente conocimiento ni experiencia. Cuando se desarrolla un tipo de letra por primera vez, hay que aprender mucho en el proceso, transfiriendo conocimientos teóricos sobre diseño tipográfico a la práctica, algo que siempre es difícil.

Buscar etiqueta
Fuentes en el diseño gráfico: tipos, categorías, características y estilos

Fuentes en el diseño gráfico: tipos, categorías, características y estilos

Una fuente apropiada no solo transmite información al público, sino que también complementa visualmente el proyecto. Una fuente incorrecta puede estropear la impresión y alejar al espectador del producto, ya sea un cartel, un letrero de una tienda o cafetería, un empaque, un sitio web o una app.

Buscar etiqueta
Antigua y grotesco: diferencias entre las tipografías

Antigua y grotesco: diferencias entre las tipografías

Visita los sitios web de tres de tus marcas favoritas y trata de analizar qué emociones te generan. Ya sea ropa o calzado, automóviles o electrónica, cosméticos o accesorios, cada empresa tiene su secreto: quieren convertirse en parte de tu vida.

Buscar etiqueta