La sección Head de HTML
Aquí ubicamos datos de importancia para el navegador y para los buscadores
El elemento head
Este elemento está determinado por las etiquetas <head> y </head>. Dentro de las mismas queda determinada la sección head la cual contiene toda la información sobre el documento.
Esta información no será mostrada por el navegador pero es de suma importancia para los navergadores y para los motores de búsqueda.
De acuerdo a los estándares de HTML solo un número reducido de etiquetas pueden incluirse en la sección head:
El elemento base
En HTML, los vínculos y las referencias a recursos externos como imágenes, hojas de estilo, etc., se especifican siempre mediante una dirección URL.
Sintaxis
<title>Título del documento</title>
<base href="http://www.virtualnauta.com/imagenes/">
</head>
En este ejemplo podemos observar que la dirección de referencia sirve de base para todas las imagenes que se inserten en la página.
Es decir, que en la sección body para cada imagen que deseo ingresar solo debo escribir:
<img src="/paisaje.jpg">
</body>
En lugar de:
El elemento link
Este elemento está definido por la etiqueta <link> y establece un enlace que solo puede aparecer en la sección head.
Sintaxis
<title>Título del documento</title>
<link href="http://www.susitio.com/fuentes.css" type="text/css" rel="stylesheet">
</head>
En este ejemplo podemos observar como definir un enlace hacia un archivo de hojas de estilo externo.
El elemento meta
Este elemento está definido por la etiqueta <meta> y puede ser usado para identificar propiedades de un documento(autor, descripción, palabras claves, etc.)
Sintaxis
<title>Título del documento</title>
<meta name="author" content="Jorge Perez">
<meta name="description" content="La sección head de html contiene información sobre el sitio web">
</head>
En este ejemplo podemos observar como definir el autor y la descripción de un sitio.
Si deseas etudiar en profundidad el uso de las etiquetas <meta>, dirígete a las meta etiquetas
El elemento title
Este elemento debe figurar en la sección head y nos define el título de la página Web.
Para ello utilizamos las etiquetas <title> y </title>.
Es recomendable poner títulos ricos en contexto ya que estos aparecen en los motores de búsqueda y ayudan al usuario a identificar el contenido de la página.
Sintaxis
<title>Curso introductorio al diseño de páginas Web</title>
</head>
El elemento style
Este elemento define estilos dentro del documento y utiliza las etiquetas <style> y </style>.
Sintaxis
<title>Título del documento</title>
<style type="text/css">
p {color:blue}
h2 {color:red}
</style>
</head>
Si deseas etudiar como funcionan las hojas de estilo dirígete al tutorial de CSS
El elemento script
El elemento script se utiliza para insertar scripts en el documento.
Lo definimos por medio de las etiquetas <script> y </script>
Sintaxis
<title>Título del documento</title>
<script type="text/javascript" src="http://misitio.com/calculos/calculos.js">
</script>
</head>
Para más información sobre scripts dirígete a HTML Scripts
Etiquetas y atributos de los elementos en la sección head
| Etiquetas | Atributos | Valor | Descripción |
|---|---|---|---|
| <head> | profile | URL | Especifica la localización de uno o más perfiles de metadatos. |
| <title> | Define el título del documento. | ||
| <meta> | Especifica una pareja propiedad/valor del documento. | ||
| name | author | Identifica un nombre de propiedad. | |
| description | |||
| keywords | |||
| generator | |||
| revised | |||
| otros | |||
| http-equiv | content-type | Los servidores HTTP utilizan este atributo para obtener información sobre los encabezados. | |
| expires | |||
| refresh | |||
| set-cookie | |||
| content | valor | Este atributo especifica el valor de una propiedad. | |
| scheme | valor | Proporciona a los agentes de usuario más contexto para la interpretación correcta de los datos. | |
| <link> | Define un vínculo. Solo puede aparecer en la sección head de un documento. | ||
| charset | codif. de caracteres | Especifica la codificación de caracteres. Valor por defecto: ISO=8859-1. |
|
| href | URL | Especifica la localización de un recurso de la web. | |
| hreflang | código de lenguaje | Especifica el lenguaje de la URL. | |
| media | El medio para la información del estilo. | ||
| screen | Para pantallas no paginadas de computadora. | ||
| tty | Para medios que utilicen una cuadrícula de caracteres de ancho fijo, como teletipos. | ||
| tv | Para dispositivos tipo televisión. | ||
| projection | Para proyectores. | ||
| handheld | Para dispositivos de mano (pantalla pequeña, monocromos,etc). | ||
| Para material paginado, opaco, y para documentos que se ven en una pantalla en modo de presentación preliminar a la impresión. | |||
| braille | Para dispositivos táctiles braille. | ||
| aural | Para sintetizadores de voz. | ||
| all | Apropiado para todos los dispositivos. | ||
| rel | Especifica la relación entre el documento actual y el destino del vínculo. | ||
| alternate | |||
| designates | |||
| stylesheet | |||
| start | |||
| next | |||
| prev | |||
| contents | |||
| index | |||
| glossary | |||
| copyright | |||
| chapter | |||
| section | |||
| subsection | |||
| apendix | |||
| help | |||
| bookmark | |||
| rev | Especifica la relación entre el destino del vínculo y el documento actual(vínculo inverso). | ||
| alternate | |||
| designates | |||
| stylesheet | |||
| start | |||
| next | |||
| prev | |||
| contents | |||
| index | |||
| glossary | |||
| copyright | |||
| chapter | |||
| section | |||
| subsection | |||
| apendix | |||
| help | |||
| bookmark | |||
| target | Indica donde abrir el URL. | ||
| _blank | El URL se abrirá en una nueva ventana. | ||
| _parent | El URL se abrirá en el frameset padre. | ||
| _self | El URL se abrirá en el mismo frame donde fue apretado. | ||
| _top | El URL se abrirá en una ventana de tamaño completo. | ||
| type | tipo de contenido | Especifica el tipo de contenido a conectar. | |
| <base> | href | URL | Especifica la URL base que será usada para todos los vínculos de la página. |
| target | Indica donde abrir el URL. | ||
| _blank | El URL se abrirá en una nueva ventana. | ||
| _parent | El URL se abrirá en el frameset padre. | ||
| _self | El URL se abrirá en el mismo frame donde fue apretado. | ||
| _top | El URL se abrirá en una ventana de tamaño completo. | ||
| <script> | Coloca un script dentro del documento. | ||
| src | URL | Especifica la localización de un script externo. | |
| type | tipo de contenido | Especifica el lenguaje de scripts de los contenidos del elemento. | |
| language Desaprobado |
javascript | Use el atributo type en su lugar. | |
| livescript | |||
| vbscript | |||
| otros | |||
| defer | Indica al agente de usuario que el script no va a generar ningún contenido en el documento. |
Atributos estándard
Si desea una descripción completa, dirígete a: atributos estándard.
Eventos intrínsecos
Si desea una descripción completa, dirígete a: eventos intrínsecos.
<<< Hojas de estilo Meta etiquetas >>>