Etiquetas

HTML

Este elemento indica al navegador que el fichero contiene información codificada en formato HTML. La extensión .html (o .htm) del fichero también indica que se trata de un documento HTML.

HEAD

El encabezado identifica la primera parte del documento HTML, que contiene el título.

TITLE

Este elemento contiene el título del documento e identifica su contenido en un contexto global. El título aparece siempre en la ventana del navegador (habitualmente en la barra de título), pero nunca en el área de texto. El título también aparece mostrado en la lista de favoritos, por tanto, conviene escoger un título descriptivo, unico y relativamente corto. Los títulos pueden tener hasta 64 caracteres de longitud.

BODY

La segunda parte de un documento HTML es el cuerpo, donde figura el contenido del documento, que será mostrado en el área de texto de la ventana del navegador. Las etiquetas explicadas a continuación son utilizadas en el cuerpo del documento.

Encabezados

El lenguaje HTML tiene seis niveles de encabezados, numerados del 1 al 6, siendo el 1 el más prominente. Los encabezados aparecen con una tipografía más grande que el texto normal. El primer encabezado de un documento debería ser etiquetado con <H1>. La sintaxis de este elemento es:

<Hn>Texto del encabezado</Hn>

donde n es un número entre 1 y 6 especificando el nivel del encabezado.

Párrafos

Al revés que en la mayoría de procesadores de texto, los retornos de carro en los ficheros HTML no son significativos. Por tanto, no debes preocuparte por la longitud de las líneas de texto.

En el ejemplo mostrado en Mi primer documento HTML, el primer párrafo está codificado como:

<P>Bienvenido al maravilloso mundo del HTML.
Este es mi primer párrafo, un poco breve,
pero no deja de ser un párrafo.</P>

En el fichero fuente hay saltos de línea, pero un navegador los ignorará e iniciará un párrafo nuevo sólo cuando encuentre otra etiqueta <P>. Debes indicar los párrafos con los elementos <P>; los navegadores ignoran cualquier sangría o línea en blanco del texto fuente. Sin elementos <P> el documento se convertiría en un enorme párrafo. Una excepción es el texto etiquetado como «preformateado», que se explica más adelante.

Para que los ficheros HTML sean más legibles es recomendable colocar los encabezados en líneas separadas, dejar líneas en blanco al inicio de nuevas secciones y separar los párrafos con una línea en blanco. Cuando edites tus documentos agradecerás estos espacios adicionales (aunque el navegador los ignorará).

La etiqueta </P>, que cierra los párrafos, es opcional y puede ser omitida. Cuando los navegadores encuentran una etiqueta <P> entienden que ahí está el final del párrafo anterior.

Usar <P> y </P> para un párrafo implica la posibilidad de alinear un párrafo si se incluye el atributo ALIGN. El siguiente párrafo:

<P ALIGN=CENTER>Esto es un párrafo centrado.</P>

se vería así:

Esto es un párrafo centrado.

Listas

El lenguaje HTML soporta listas numeradas, no numeradas y de definición. También permite anidar listas, pero conviene no abusar de esta característica para no dificultar la lectura.

Listas no numeradas

Para crear una lista no numerada hay que comenzar con una etiqueta de inicio de lista <UL>, introducir la etiqueta <LI> ante cada elemento individual de la lista y cerrar la lista con la etiqueta </UL>.

A continuación, una simple lista de ejemplo:

<UL>
<LI>chorizos
<LI>garbanzos
<LI>espinacas
</UL>

se vería del siguiente modo:

  • chorizos
  • garbanzos
  • espinacas

Los elementos <LI> pueden contener varios párrafos indicándolos con la etiqueta <P>.

Listas numeradas

Una lista numerada (u ordenada) es idéntica a una lista no numerada, excepto en el uso de la etiqueta <OL> en lugar de <UL>. Los elementos de la lista se etiquetan utilizando la misma etiqueta <LI>. La siguiente lista de muestra:

<OL>
<LI>chorizos
<LI>garbanzos
<LI>espinacas
</OL>

se vería de esta manera:

  1. chorizos
  2. garbanzos
  3. espinacas

Listas de definición

Una lista de definición (codificada como <DL>) consiste en la alternancia de un término (codificado como <DT>) y una definición (codificada como <DD>). Los navegadores suelen colocar la definición en una nueva línea.

El siguiente ejemplo es una lista de definición:

<DL>
<DT>Melodía de timbres
<DD>Sustitución de las series de notas según
su altura en la escala por sus valores tímbricos;
durante el mismo acorde cambian sin interrupción los
instrumentos y con ello el timbre.
<DT>Microtonalidad
<DD>Música que toma la escala temperada como
punto de partida, introduciendo nuevas notas por
medio de subdivisiones posteriores, produciendo
generalmente cuartos de tono.
</DL>

cuyo resultado sería el siguiente:

Melodía de timbres
Sustitución de las series de notas según su altura en la escala por sus valores tímbricos; durante el mismo acorde cambian sin interrupción los instrumentos y con ello el timbre.
Microtonalidad
Música que toma la escala temperada como punto de partida, introduciendo nuevas notas por medio de subdivisiones posteriores, produciendo generalmente cuartos de tono.

Las entradas <DT> y <DD> pueden contener párrafos, listas u otra información de definición.

El atributo COMPACT puede ser utilizado en caso de que los términos sean muy cortos para que la definición aparezca en la misma línea. El siguiente ejemplo:

<DL COMPACT>
<DT>-av
<DD>Añadir verificación de autenticidad
<DT>-mm
<DD>Compresión multimedia
<DT>-sfx
<DD>Crear archivo autoextraíble
</DL>

quedaría así:

-av
Añadir verificación de autenticidad
-mm
Compresión multimedia
-sfx
Crear archivo autoextraíble

Listas anidadas

Las listas se pueden anidar. Incluso es posible tener varios párrafos, cada uno con una lista anidada, en un único elemento.

El siguiente ejemplo es una lista anidada:

<UL>
<LI>Aragón
  <UL>
  <LI>Huesca
  <LI>Teruel
  <LI>Zaragoza
  </UL>
<LI>Cataluña
  <UL>
  <LI>Barcelona
  <LI>Girona
  <LI>Lleida
  <LI>Tarragona
  </UL>
</UL>

que aparecería del siguiente modo:

  • Aragón
    • Huesca
    • Teruel
    • Zaragoza
  • Cataluña
    • Barcelona
    • Girona
    • Lleida
    • Tarragona

Texto preformateado

Utiliza la etiqueta <PRE> para generar texto con una fuente de anchura fija. Esta etiqueta también hace significativos los espacios, las líneas en blanco y las tabulaciones. Resulta útil en muchas ocasiones, por ejemplo, para listar comandos o escribir tablaturas. El siguiente código:

<PRE>
void InitCRC(void)
{
  int I, J;
  UDWORD C;
  for (I=0;I<256;I++)
    {
    for (C=I,J=0;J<8;J++)
      C=(C & 1) ? (C>>1)^0xEDB88320L : (C>>1);
    CRCTab[I]=C;
  }
}
</PRE>

sería mostrado como:

void InitCRC(void)
{
  int I, J;
  UDWORD C;
  for (I=0;I<256;I++)
  {
    for (C=I,J=0;J<8;J++)
      C=(C & 1) ? (C>>1)^0xEDB88320L : (C>>1);
    CRCTab[I]=C;
  }
}

La etiqueta <PRE> puede ser empleada con el atributo opcional WIDTH, que especifica el número máximo de caracteres por línea. WIDTH también indica al navegador que escoga una fuente apropiada para el texto.

Aunque en las secciones preformateadas se pueden utilizar hiperenlaces, es conveniente evitar el uso de otras etiquetas HTML. Los caracteres <, > y & tienen significados especiales en el código HTML, por tanto, deben usarse sus entidades equivalentes (&lt;, &gt; y &amp;, respectivamente). Consulta la sección Entidades para más información.

Citas extendidas

Usa la etiqueta <BLOCKQUOTE> para incluir citas en un bloque separado. La mayoría de navegadores cambian los márgenes de la cita para separarla del texto que la rodea. En el siguiente ejemplo:

<P>La naturaleza sigue llena de misterios.</P>
<BLOCKQUOTE>
<P>La ciencia es incapaz de resolver los últimos misterios
de la naturaleza porque, en el último análisis, nosotros
mismos somos parte de la naturaleza y, por eso, también
parte del misterio que tratamos de resolver.</P>
<P>- Max Planck, 1858-1947</P></BLOCKQUOTE>

el resultado sería:

La naturaleza sigue llena de misterios.

La ciencia es incapaz de resolver los últimos misterios de la naturaleza porque, en el último análisis, nosotros mismos somos parte de la naturaleza y, por eso, también parte del misterio que tratamos de resolver.

- Max Planck, 1858-1947

Direcciones

La etiqueta <ADDRESS> se usa para especificar el autor de un documento, la manera de contactar con él (por ejemplo, una dirección electrónica) y la fecha de la última actualización. Suele ser el último elemento en un documento.

Por ejemplo:

<ADDRESS>
Cerveceros de España / info@cerveceros-es.com / Última revisión: diciembre 1997
</ADDRESS>

Daría el siguiente resultado:

Cerveceros de España / info@cerveceros-es.com / Última revisión: diciembre 1997

Saltos de línea

La etiqueta <BR> fuerza un salto de línea sin espacio entre líneas y resulta útil en direcciones postales.

Por ejemplo:

Radio Nacional de España, S.A.<BR>
Apartado de Correos 156.200<BR>
28080 - Madrid<BR>

Aparecería así:

Radio Nacional de España, S.A.
Apartado de Correos 156.200
28080 - Madrid

Barras horizontales

La etiqueta <HR> genera una línea horizontal, que resulta útil para separar secciones de un documento. Muchas páginas contienen una barra horizontal al final del texto, antes de la información de <ADDRESS>. Se puede modificar el grosor y la anchura de una barra horizontal. Prueba con diferentes parámetros hasta que el resultado te satisfaga.

El siguiente ejemplo:

<HR SIZE="5" WIDTH="50%">

se presentaría de este modo:




Anterior Siguiente
Sumario | Inicio