Principios elementales

El principio esencial del lenguaje HTML (HyperText Markup Language) es el uso de las etiquetas (tags) que tienen la siguiente estructura:

<ETIQUETA> inicio
    [.......]
</ETIQUETA> cierre

Una etiqueta es una palabra (en mayúscula o minúscula), delimitada por los signos < (mayor que) y > (menor que).

Por regla general, las etiquetas forman bloques que se inician con una instrucción y finalizan con la misma instrucción a la que se le antepone una barra inclinada (/):

Cada elemento se divide en tres partes: una etiqueta inicial, el contenido, y una etiqueta final. Todo lo que hay entre la etiqueta de apertura y la etiqueta de cierre se ve afectado por esa etiqueta:

<ETIQUETA>
    [... contenido ...]
</ETIQUETA>

A veces, es necesario agregar datos adicionales a una instrucción, en ese caso, la etiqueta de apertura será la que contendrá esos parámetros llamados atributos:

<ETIQUETA atributo1="valor" atributo2="valor">
    ... contenido ...
</ETIQUETA>

Eventualmente, ciertas etiquetas no forman bloques ya que son autosuficientes, en ese caso, la barra inclinada se agrega al final de esa única etiqueta separada de esta por un espacio en blanco:

<ETIQUETA />

Este concepto de etiquetas de apertura y cierre es la clave para entender el lenguaje. Como cualquier elemento puede contener a otros elementos, las etiquetas deben abrirse y cerrarse en el mismo orden en que fueron creadas. Una página web está compuesta por elementos (objetos) metidos unos dentro de otros (anidados). El elemento principal, el que contiene a todos los demás es el documento HTML.

Toda página web está comprendida entre dos etiquetas: <HTML> y </HTML>. A su vez, el elemento HTML contiene otros dos, los elementos HEAD y BODY. Esas son las principales zonas de cualquier página web, el encabezamiento, comprendido entre las etiquetas <HEAD> y </HEAD> y el cuerpo, comprendido entre las etiquetas <BODY> y </BODY>.

Dentro del encabezado se coloca información genérica que afecta a toda la página pero que no son visibles. El elemento principal es el título, comprendido entre las etiquetas <TITLE> y </TITLE>. El título es un texto breve que describe el contenido y es el mismo que vemos cuando agregamos una página a los favoritos en Internet Explorer o a los marcadores en Firefox.

<TITLE> Título de la página </TITLE>

Aunque no es muy utilizado, dentro del encabezado también se puede incluir la etiqueta <BASE>.

En un documento HTML, los vínculos y los recursos externos (imágenes, hojas de estilo, etc) se indican con una URL. Cuando esas URL son relativas, se completan de acuerdo a una URL base. BASE permite especificar esa URL base.

Esta etiqueta debe aparecer antes que cualquier elemento que haga referencia a una fuente externa.

Por ejemplo, si se declarase esto:

<BASE href="http://bolsanegra.net/pages/pagina1.html">

y más tarde se hiciese una referencia a una URL relativa como esta:

<A href="../imagenes/ejemplo.gif">VINCULO</A>

la URL apuntaría a:

http://bolsanegra.net/imagenes/ejemplo.gif

Dentro del BODY se ubica todo lo que aparecerá en la pantalla (texto, imágenes, etc.)

De tal manera la estructura básica de cualquier página sería algo así:

<HTML>
  <HEAD>
      <TITLE>[Aquí va el título]</TITLE>
      [Aquí van las etiquetas del encabezado (no son visibles)]
  </HEAD>
  <BODY>
    [Aquí van las etiquetas del cuerpo (lo que muestra la página)]
  </BODY>
</HTML>
ver ejemplo

Las etiquetas pueden estar escritas en mayúsculas o minúsculas de manera indistinta y suele utilizarse sangría o tabulación entre los diferentes niveles de anidamiento para facilitar la lectura del código.