tipografía-página-Web

¿Cómo buscar la tipografía usada en una página Web que te gustó?

Aprende a leer códigos HTML  y CSS para buscar la tipografía usada en una página Web que te gustó

Muchas veces  al navegar por internet encuentras que te gusta el diseño web, diagramación o una tipografía  interesante en una página web que visitaste, quieres saber cómo se llama para buscarla y poder utilizarla en tu sitio pero no sabes cómo. En el siguiente artículo te mostraremos los pasos para lograrlo. Es muy sencillo, gracias a que puedes visualizar el código fuente desde tu navegador. No debes ser un experto para lograrlo solo debes tener conocimientos básicos de cómo leer código HTML y CSS con el fin de darle una mirada y utilizar la fuente que te gustó en tu sitio web. Sigue los siguientes pasos para lograr tus objetivos:

typography-725149_1920

Paso 1

Ve a la página web con la fuente que te gustó y resalte una línea del texto en la página con esa fuente. Pulse la tecla “Ctrl-C” para copiar la línea de texto.

Paso 2

Haga clic en la página Web y haga clic en la opción “Ver código fuente” o “Inspeccionar” en el menú contextual. El código HTML de la página se abre en una ventana de diálogo.

Paso 3

Pulse la tecla “Ctrl-F” para abrir el cuadro de diálogo Buscar, haga clic en la tecla “Ctrl-V” para pegar la línea de texto en el cuadro, a continuación, pulse “Enter” para ir a la sección de código que contiene información sobre el tipo de letra.

Paso 4

Desplazarse hacia arriba desde esa línea de texto hasta que vea una etiqueta <font>, que contiene el nombre de la fuente utilizada en el texto. Debe tener un aspecto similar al siguiente: <font face = “Calibri”> Si no hay ninguna etiqueta <font> al principio del texto, mira en lugar de una etiqueta HTML, como <p> o <div>, con una atributo “class”. Por ejemplo: <p class = “estilo de texto”> o <div class = “textformat”>

Paso 5

Ir a la parte superior del código fuente y haga clic en el enlace a la hoja de estilo CSS, que se encuentra dentro de la apertura <head>. Es similar a la siguiente: <link rel = “stylesheet” type = “text / css” href = “style.css” />

Paso 6

Desplazarse por el código CSS para el código de clase que coincide con el nombre de la clase que pueda encontrar. Por ejemplo: p.textstyle {font-family: trebuchet ms “”; } O div.textformat {font-family: “Georgia”; } El nombre de fuente para el texto en cuestión está contenida en las citas siguientes el atributo “font-family”.

¡Listo! Ahora puedes saber qué tipo de fuente utiliza tu sitio web favorito y has aprendido un poco más sobre códigos HTML y CSS.