Etiquetas tipográficas

Aún existen otras etiquetas que aquí agrupamos como etiquetas tipográficas(code, pre, samp...) cuyo efecto visual es mínimo, en general aparecen como cursiva o con alguna fuente de texto diferente, aunque por supuesto usando estilos CSS este aspecto puede ser alterado a nuestro gusto.

Como las restantes etiquetas de texto su valor reside en un significado propio, que robots analizadores de las páginas van a interpretar para entender mejor el significado de un fragmento del contenido. En este grupo el aspecto visual también dice mucho del contendio de estos elementos.

<!doctype html>

<html><head>

<meta charset="utf-8">

<title>Documento sin título</title>

</head>

<body>

Para comprar un ebook en nuestra tienda instala nuestro programa<br>

Ve a la carpeta <var>c:\ebooks</var>

y escribe esto:<br>

<kbd>install.exe</kbd><br>

A continuación verás una ventana que dice<br>

<samp>La instalación fue correcta</samp><br>

Y recuerda<br>

<pre>

###### #### ###### ###### # #

# # # # # # # # #

#### #### # # # # ##

# # # # # # # # #

###### #### ###### ###### # #

</pre>

</body>

</html>

Las etiquetas tipográficas

Observa este ejemplo de uso de las etiquetas tipográficas. Salvo var las restantes dan el aspecto de texto de consola por su funte monospace. Y fíjate en el uso del elemento pre: mantiene el texto tal y como se escribe en el código fuente de la página: respeta los saltos de linea y espacios, si la quitas verás como las marcas del dibujo se acumulan en una linea, y no se ve la figura.
En general estos tipos son muy útiles para escribir código en la página web. Y como siempreol, no solo por el aspecto visual sino por el significado semántico de la etiquetas.

Etiqueta Descripción Ejemplo
<code> El texto que encierra es código de programa. El ancho de carácter es fijo y no implica salto de linea antes y depués. Para imprimir usa la orden print("Hola mundo")
<kbd> El texto que encierra se interpreta como entrada desde teclado. El ancho de carácter es fijo Escribir el texto Los libros entretienen
<samp> El texto que encierra se interpreta como un texto de salida, resultado de algo. El ancho de carácter es fijo. El resultado de la orden dir es 15/05/2018 20:15 854 list.sql
<var> En un código indica un identificador de variable o constante física o elemento de programa, útil en un contexto matemático. E = m c2
<pre> Se usa para texto preformateado, respeta los espacios en blanco y los saltos de linea (sin necesidad de <br>
o &nbsp;), es decir, el texto aparece tal y como se escrib en el código fuente la página. Se usa un tipo de letra con ancho de carácter es fijo (monospace).		 
En este texto
se respetan
	los espacios 
	 y tabulaciones
Estas etiquetas definen como se escribe el texto en el flujo de la página