HTML (HyperText Markup Language, Lenguaje de marcas de hipertexto)

Capítulo 1

HTML

INTRODUCCIÓN

HTML (HyperText Markup Language, Lenguaje de marcas de hipertexto) es la lingua mater de la web. Fue el lenguaje pionero para la creación de páginas web estáticas, páginas que siempre tienen los mismos contenidos salvo que se modifique el archivo. Aunque el mundo de la World Wide Web ha evolucionado mucho, incorporando nuevos lenguajes y tecnologías, HTML sigue jugando un papel fundamental en él.

Es un lenguaje etiquetado. Un documento HTML no es más que un fichero de texto en el que la estructura y el formato son aplicados con etiquetas.

El lenguaje HTML fue ideado en 1990 por Tim Berners-Lee en el CERN (Suiza). Originalmente, no iba a ser más que un lenguaje para facilitar el intercambio de datos científicos. El lenguaje HTML, y la WWW, se hicieron muy populares. En 1994 se creó el World Wide Web Consortium (W3C), con el propósito de definir los estándares de la WWW (incluido el HTML).

En 1995 Internet se abrió por completo al público general. Muchas compañías empezaron a desarrollar navegadores, implementando el estándar HTML de maneras distintas. El lenguaje se “desestandarizó”, a pesar de los esfuerzos del W3C. Además, HTML empezó a utilizarse para publicar contenidos multimedia, a pesar de que el lenguaje no fue diseñado para eso.

Muchos documentos HTML se ven de manera distinta según el navegador que se utilice.

A finales de los 90, el lenguaje alcanzó una masa crítica. Ya era imposible ampliarlo más.

La solución que se adoptó fue empezar ‘desde cero’ y resolver todos los problemas del HTML de golpe.

Así surge XHTML (Extensible HyperText Language). Es la reformulación del HTML en XML (XML + HTML = XHTML)

HTML es un lenguaje formulado en SGML, un lenguaje de etiquetas muy complicado. XML es mucho más ligero que SGML y, por ello, más fácil de implementar. Eventualmente sustituirá al HTML. Es un lenguaje mucho más sólido y estable que HTML.

Su Sintaxis más estricta, y es menos ambiguo. Otra característica es que es fácilmente expansible: XHTML Modules. Sintácticamente es muy parecido al HTML. Solo hay unas pequeñas diferencias.

1.1 EDITORES DE HTML

La herramienta principal en el desarrollo de páginas web es el editor que se usa para escribir el código. Los editores pueden ser de dos tipos dependiendo de la funcionalidad visual que ofrezcan. Por un lado, están los editores puros que muestran el código tal cual es, con la consiguiente dificultad para imaginar la página que resulta de dicho código conforme se va elaborando la misma. Un ejemplo de este tipo de programas podría ser el Bloc de notas de Windows. Por otro lado, se encuentran los llamados programas WYSIWYG, que ofrecen la enorme ventaja de permitir al usuario saber en todo momento cómo le está quedando la página ya que muestran el diseño de la misma. Ejemplos de este tipo de programas son Dreamweaver , Nvu, UltraEdit. Este último lo puedes descargar de www.ultraedit.com.

1.2 NAVEGADORES

Un navegador web es un programa que interpreta el código HTML de una página, reconstruyendo a partir de dicho código la imagen de la web que recibe el usuario. La reconstrucción de una página puede variar dependiendo del navegador que se utilice para visualizarla. Por ello, es conveniente, cuando se programa una página web, comprobar que se visualiza correctamente en varios navegadores distintos, especialmente en los más extendidos: Internet Explorer, Opera y Firefox.

Que una página no se vea bien en un navegador, no quiere decir que su código HTML esté redactado de forma incorrecta. Para evitar cualquier duda al respecto, merece la pena “validar” el código HTML a través del W3C (World Wide Web Consortium). Dicha organización pone a disposición de los desarrolladores un servicio de validación http://validator.w3.org que permite comprobar si una página cumple con el estándar HTML, asegurando así una mayor compatibilidad con los navegadores web (los cuales suelen atenerse a dicho código).

1.3 LAS ETIQUETAS HTML

HTML (HyperText Markup Language, Lenguaje de marcas de hipertexto ) no es un lenguaje de programación, sino un conjunto de reglas de cómo se debe visualizar un documento. Es un subconjunto derivado del SGML (Standard Generalized Markup Language), y lo único que contiene es un conjunto de etiquetas que indican cuándo el navegador debe visualizar un texto en negrita, un subrayado, etc. En principio, este es el comportamiento de cualquier programa de procesamiento de texto, aunque en el caso de HTML es más “visible” ya que el código se puede ver fácilmente.

Es un lenguaje muy sencillo que permite describir hipertexto, es decir, texto estructurado en que se incluyen hiperenlaces (hyperlinks) que conducen a otros documentos, objetos multimedia (gráficos, sonidos, etc.) u otros elementos de información relacionados. Con el hipertexto lo que se hace realmente es especificar tanto la estructura lógica del contenido (títulos, párrafos, listas, definiciones, citas, etc.) como los diferentes efectos que se quieren dar a dicho contenido (se especifican los lugares del documento donde se ha de poner cursiva, negrita o insertar un gráfico determinado). Esta información es interpretada por el navegador web o browser, el cual se encargará de reproducir la página web tal y como la puede ver el usuario.

Se dice también que el HTML es un lenguaje de marcas o etiquetas porque las instrucciones que permiten estructurar los contenidos de las páginas y darles estilos o formatos son porciones de texto diferenciadas del resto de elementos. Es decir, dichas instrucciones en forma de etiquetas marcan los elementos del documento. Estos son:

• Estructura lógica del documento: Las etiquetas diferencian los párrafos de texto, establecen los títulos, etc. En general, determinan todos los elementos que forman parte de las estructura del documento.

• Diferenciación del texto mediante estilos: Las etiquetas permiten añadir al texto y a los elementos de la página diferentes estilos y formatos, diferenciando por ejemplo, si una palabra debe ir en cursiva o en negrita.

• Incrustación de información o contenidos externos: Las etiquetas permiten definir hiperenlaces, los cuales pueden servir para acceder a contenidos alojados en otras páginas o sitios web.

• Insercción

...