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í:
|
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:
|
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:
|
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:
|
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í:
|
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:
|
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:
|
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 (<, > y &, 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:
|
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:
|
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í:
|
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:
|