UT 2: Lenguajes de Marcas: HTML
2.4.2.- Metadatos de una página
Los metadatos es información que añadimos a nuestras páginas. Esta información es utilizada por los
buscadores para indexar en sus bases de datos nuestras páginas.
Para la creación de metadatos usamos la etiqueta <meta />, que no tiene cierre.
Esta etiqueta tiene varios atributos:
➢ name: Indica el tipo de información.
➢ content: Indica el valor de dicha información.
➢ http-equiv: Indica el conjunto de caracteres usado en la página y si hay o no que redireccionar
la página web.
Los principales valores de name son los siguientes:
➢ description: Breve descripción de la temática de la página web.
➢ keywords: Listado de palabras clave separadas por coma a utilizar por los robots de los
buscadores. En el caso de que la palabra clave sea compuesta, deberá ir entre comillas simples.
➢ generator: Programa utilizado para crear la página web.
➢ robots: Permite a los robots de los buscadores entrar o no en tu sitio web. Los valores posibles
para content son:
✔ index para que tenga en cuenta la página
✔ follow para que siga los enlaces que puedan ver en la página.
✔ nofollow para que no siga los enlaces que puedan ver en la página.
✔ all es lo mismo que index,follow
✔ none es lo mismo que noindex,nofollow
2.4.3.- Redireccionamiento
En el caso de que queramos referscar o redirigir una página a otra transcurrido un cierto tiempo:
<meta http-equiv="refresh" content="20;URL=./indice.html" />
En content le decimos el número de segundos (si indicamos CERO será inmediato) y a continuación
indicamos la página a la que debe dirigirse, para ello usamos URL=nombre de la página.
En este ejemplo, se cargará la página indice.html que esté en el directorio actual transcurridos 20
segundos.
7
UT 2: Lenguajes de Marcas: HTML
2.4.4.- Codificación de caracteres
Para declarar la codificación de caracteres que vamos a emplear en nuestra página web, utilizamos
también la etiqueta meta, pero en este caso con otros atributos que vemos a continuación:
<meta http-equiv=”Content-Type” content=”text/html;charset=...”/>
En esta caso estaremos diciendo que el contenido textual de nuestra página html está codificada en el
conjunto de caracteres cuyo valor vendrá indicado por el atributo charset.
Este atributo puede tomar cualquiera de los tres siguientes valores, que son los que están reconocidos
por los estándares web:
1. UTF-8
2. UTF-16
3. iso-8859-1
2.4.4.- Elemento DOCTYPE
Todos los documentos HTML válidos deben llevar un elemento llamado DOCTYPE, el cual no es
parte del documento html en sí. Define el tipo de DTD (Document Type Definition) a emplear en
nuestros documentos, es obligatorio y puede ser uno de estos tres:
✔ XHTML 1.0 Strict: Usado cuando deseamos utilizar al 100% XHTML, su nombre lo dice
bien claro, es XHTML estricto. La declaración del mismo es como sigue:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
✔ HTML 1.0 Transitional: Es el más usado ya que permite manejar elementos de XHTML y
HTML 4.01. Su declaración es la que sigue:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 1.0 Transitional//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
✔ XHTML 1.0 Frameset: Se debe usar cuando se manejen frames. Su declaración es la
siguiente:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
Este elemento se pone en todas la páginas web a desarrollar justo antes de la etiqueta <html>.
8
UT 2: Lenguajes de Marcas: HTML
2.5.- Elementos básicos de body
2.5.1.- Los encabezados
Usados para destacar texto dentro de una página web, o bien para crear distintas secciones dentro de
la misma.
Se disponen de hasta 6 niveles de encabezado. Las etiquetas que definen estos encabezados son:
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>
La etiqueta <h1> es la de mayor importancia, y por lo tanto la utilizamos para definir los titulares de
la página. Los encabezados h1 a h4 pueden usarse como titulos, mientras que los h5 y h6 se suelen
utilizar para poner notas a pie de página, o comentarios de poca importancia. Ejemplo 3
Figura 6. Ejemplo 3. Uso de h1...h6
9
UT 2: Lenguajes de Marcas: HTML
2.5.2.- Líneas horizontales
Para la inserción de líneas horizontales utilizamos la etiqueta <hr/>. Se usa normalmente como
separador. Y tiene los siguientes atributos:
➢ size: Usado para indicar un grosor a la línea.
➢ color: Usado para indicar el color de la línea.
➢ width: Usado para indicar el ancho del navegador a ocupar por la línea. Se puede indicar su
valor en pixeles o en %.
➢ align: Usado para indicar la alineación de la línea en la página. Sus valores pueden ser :
1. center: Para centrar la línea.
2. left: Para alinearla a la izquierda.
3. right: Para alinearla a la derecha.
➢ noshade: Es usado cuando no queremos que salga sin sombra.
Ejemplo 4
10
UT 2: Lenguajes de Marcas: HTML
Figura 7. Ejemplo 4. Uso de hr
11
