XHTML - el esqueleto de la web!

publicado el 2007-11-07 por ikki - categoría: Tecnología

XHTML - el esqueleto de la web!

Hace no mucho me encontré a mi mismo recordando cuando hice mi primera página web. Como todo principiante, encontraba difícil entender como era todo (sobre todo cuando se trataba de usar las famosas y casi extintas tablas). Recuerdo que mi primer sitio era de juegos flash, yo mismo diseñé algunos de ellos y otros los conseguí en la red. Eran bastante entretenidos (y creo que aún andan por allí).

Desde entonces, las cosas han cambiado un poco. Yo inicié en el mundo web con el HTML 2.0 (HyperText Markup Language) más o menos a finales del '99. Ahora ya vamos por el XHTML 2.0 (Extensible Hypertext Markup Language). ¿Qué? ¿no sabes de qué te hablo? Entonces comencemos por el principio!.

HTML es un lenguaje de marcación diseñado para estructurar documentos, de forma tal que puedan ser mostrados como hipertextos (documento con enlaces a otros documentos). Este es el formato estándar actual de la web. Este tipo de archivos es interpretado por programas conocidos como browsers o navegadores web (como por ejemplo el Firefox o Internet Explorer) quienes luego envían a pantalla el contenido estructurado como hipertexto.

Puedes reconocer fácilmente si un archivo es un hipertexto al examinar su extensión: los podrás encontrar comúnmente como .html ó .htm. Para construir un archivo html sólo necesitas un editor de texto (que pudiera ser el notepad de Windows por ejemlo), y claro está conocer la estructura básica del html para poner manos a la obra.

¿No sabes cómo estructurar un documento html? Tranquilo, es bastante sencillo pues como mínimo:

  • Debe iniciar siempre declarando el DOCTYPE del html.
  • Continúa con la etiqueta <html>, que es la que define el lenguaje.
  • Le sigue la etiqueta <head>, que contiene todas las cabeceras.
  • No puede faltar <title>, que le da el nombre al sitio.
  • Cierras el head y aquí va <body>: el cuerpo del html.
  • Y finalmente cierras el documento con </body></html>

Para que quede más claro, y ya que una imagen dice más que mil palabras, utilicemos la que muestro a continuación:

HTML
Ejemplo de una estructura HTML



Cabecera (header):
Aquí se declara el documento html como tal. Van definidos el tipo de documento (DOCTYPE); se da inicio al mismo declarando la etiqueta <html>; luego va el head, donde se envía al navegador información sobre tu sitio como el título, metatags, etc.

Cuerpo:
Aquí va todo el contenido de tu sitio: textos, imágenes, links, formularios, videos, etc. Pueden estructurarse de diversas formas, de las que hablaremos más adelante. Debe ir contenido entre las etiquetas <body> y </body>.

Cierre:
Se utilizan las etiquetas de cierre </html> para declarar el fin del documento.

En el próximo artículo iremos más a fondo sobre cada una de las etiquetas que necesitarás para hacer tu primer sitio web!
Hasta luego!