Si eres apasionado del diseño, coincidirás en que los pequeños detalles son aquellos que realmente marcan la diferencia en cualquier proyecto. La tipografía en particular es algo que siempre atrapa la atención, por lo que con frecuencia querrás saber la fuente que ha sido usada. Hoy te vamos a hablar sobre cómo saber la fuente de una web con algunas herramientas.
La elección de una tipografía acertada puede determinar el éxito o fracaso de un proyecto, como es el caso de una página web. Descubre las fuentes usadas en tus páginas web preferidas y descubre cuáles son los secretos de estas que han logrado llamar tu atención.
¿Cómo saber la fuente de una web?
Usando Google Chrome
Sí, puedes hacer uso de Google Chrome con la herramienta de desarrolladores para saber el código de fuente de tu página web. Estas herramientas son precisamente para usuarios que se dediquen al desarrollo de páginas web, aunque en tu caso pueden serte de ayuda y podrás usarlas con bastante facilidad.
Gracias a que los códigos de fuente y estilos que utilizan todos los sitios web se encuentran disponibles para ser consultados por cualquier persona, es que podrás hacer uso de esta herramienta.
Para hacerlo tienes que:
- Vete a Google Chrome y abre tu sitio web o el sitio web del cual deseas conocer la fuente.
- Selecciona la opción Ver fuente de la página, también puedes hacer clic en ctrl+U en el teclado de tu ordenador, esto es si cuentas con un ordenador con sistema operativo Windows
- En caso de que tengas una Mac, entonces será Cmd + Opción + U.
- Luego, tendrás que abrir las herramientas para desarrolladores haciendo clic en F12 en un ordenador Windows y cmd + Opción + I si se trata de una Mac.
- Justo en la parte superior derecha de la pantalla deberás hacer clic en la opción Personaliza y controla DevTools.
- Seguidamente tienes que pasar el cursor sobre la opción Más herramientas para luego seleccionar Condiciones de red.
- En el apartado Usuario Agente debes desmarcar la opción Usar la configuración predeterminada del navegador.
- En el menú desplegable que se te mostrará selecciona la opción Googlebot.
- Finalmente, actualiza la página para obtener toda la información que buscas sobre la fuente.
Aunque quizás estos pasos pueden parecerte algo complejos, lo cierto es que en la práctica es muy sencillo, y Google Chrome se encuentra optimizado para ofrecer esta información.
A través del navegador Safari
Justo como lo hacen los motores de búsqueda, podrás ver el código de fuente de tu página web a través del navegador Safari.
Para usar Safari tienes que:
- Hacer clic en Safari localizado en menú superior.
- Selecciona la opción Configuración y luego el apartado Avanzado.
- Seguidamente, marca la casilla de verificación para Mostrar funciones para desarrolladores de web.
- Tendrás que abrir la página web en Safari y en el menú superior haz clic en la opción Desarrollo.
- Pasa el cursor sobre la opción Agente de usuario y luego elige la opción Otro, localizada en la parte inferior de la pantalla.
- Finalmente deberás reemplazar el texto en este campo con lo siguiente: Mozilla/5.0 AppleWebKit/537.36 (KHTML, como Gecko; compatible; Googlebot/2.1; +http://www.google.com/bot.html) Safari/537.36
- Así se mostrará el código de fuente de un sitio web determinado, solo haz clic en OK para finalizar.
Microsoft Edge
Microsoft Edge se encuentra dentro de la herramienta para la navegación web más utilizadas junto con Google Chrome y Safari. A través del tiempo Microsoft Edge, ha ido ganando relevancia dentro de la navegación web.
A día de hoy, es el elegido por millones de usuarios gracias a sus potentes características, entre ellas la utilización de Copilot como modelo de inteligencia artificial integrado.
¿Cómo usarlo para ver la fuente de una página web?
- Busca en el navegador Microsoft Edge el sitio web sobre el que quieres conocer la fuente que usa.
- Haciendo clic derecho sobre la pantalla se te mostrarán varias opciones entre las cuales deberás seleccionar Inspeccionar.
- Desliza el cursor sobre el menú desplegable y elige la pestaña Estilos.
- En la barra de búsqueda que se te mostrará inserta la palabra «Fuente».
- Junto al comando font-family podrás visualizar la fuente utilizada en esta página web.
¿Se pueden usar herramientas de terceros para saber la fuente de una web?
Por supuesto, la disponibilidad de herramientas de terceros para poder conocer la fuente de un sitio web no es para nada despreciable, existiendo un gran número de opciones en la actualidad.
Algunas de las más populares son:
WhatFont
Es una herramienta que te será tu mejor aliada si con frecuencia necesitas conocer las fuente utilizadas en distintas páginas web que visites con frecuencia. Una vez instalado WhatFont, lo tendrás siempre al alcance como una extensión, la que podrás consultar constantemente.
Al posicionar el cursor sobre la pantalla podrás conocer todas las fuentes en cuestión de una manera casi instantánea. Esta herramienta nos parece muy atractiva y útil para obtener este tipo de información.
WhatFont es gratuita y muy accesible para los usuarios, sin dudas una opción infalible si te dedicas o apasiona el diseño web.
Fontanello
Esta herramienta nos ofrece una experiencia bastante similar a WhatFont, aunque la verdad mucho más sencilla y algo menos atractiva visualmente.
Igual que WhatFont, Fontanello es una extensión bastante popular y usada, la misma se encuentra disponible para ser usada en Google Chrome. Es simple y fácil de aplicar, por lo que es considerada una excelente alternativa.
What the Font
Simple, práctica y versátil, esta app nos agrada por la facilidad de su uso. Eso sí, las funcionalidades que ofrece son bastante básicas. Te será de ayuda para obtener información sobre la fuente de una página web o incluso fotografía, pero poco más.
A través de inteligencia artificial What the Font identifica la fuente utilizada y además te brinda fuentes similares a esta. La puedes hallar en la Play Store y en la App Store por si deses contar con una de estas herramientas en tu móvil.
Puedes obtener esta app para iOS aquí y para Android aquí.
¡Y esto ha sido todo por hoy! Déjanos saber en los comentarios qué te han parecido estos herramientas y tips para saber la fuente de una web. ¿Cuál ha sido tu preferida?