Herramientas para el desarrollo web

1. HERRAMIENTAS PARA EL DESARROLLO WEB

1.1 HTML

El lenguaje que "hablan" las páginas web se llama HTML (HyperText Markup Language) y fue creado en 1992 por un físico nuclear llamado Tim Berners-Lee. Berners-Lee tomó dos herramientas preexistentes: el concepto de hipertexto (que permite conectar documentos entre sí a través de palabras que obran como puentes) y el SGML (siglas en inglés de lenguaje estándar de marcación general), que sirve para poner etiquetas o marcas en un texto que indiquen qué es cada parte y cómo debe verse.

El HTML (siglas en inglés de Lenguaje de Marcación General de Hipertexto) no es exactamente un lenguaje, sino un sistema muy simple de etiquetas (algo así como palabras claves) que contienen órdenes y se insertan en el texto que uno quiere publicar. Es decir: un documento HTML no es más que texto. Parte de ese texto es lo que uno quiere comunicar; el resto son las etiquetas HTML, que le explican a los browsers que reciban la página cómo va a estar dispuesta la información que se ve en pantalla. Por ejemplo, una etiqueta HTML puede servir para indicar: "el título a continuación va en negrita", o "acá va insertada una imagen".

La estructura de una etiqueta HTML es simple. La orden siempre va encerrada entre los signos mayor que (<) y menor que (>). Por ejemplo: "Acá empieza el título del documento" se escribe: .

Ahora que sabemos abrir y cerrar etiquetas vamos a meternos en la estructura básica de un documento HTML.

Cualquier documento HTML bien redactado tiene ocho etiquetas básicas que marcan las secciones principales del archivo:

[pic 1]

• La etiqueta  indica el inicio de un documento HTML.

• Cabecera:
  Las etiquetas  y  delimitan, respectivamente, el comienzo y el final de la cabecera del documento. La cabecera es un lugar en el que se puede guardar información acerca del documento que, en principio, no va a aparecer en el interior de la ventana del browser del usuario. Por ejemplo, aquí se coloca las etiquetas , entre medio de las cuales se pueden poner palabras que servirán para darle un nombre genérico al documento. Atención: este título aparecerá en la delgada barra superior de la ventana del browser (en Windows, típicamente dispuesta en azul), no dentro de la pantalla. Por lo tanto, el contenido dentro de (pese al nombre de estas etiquetas) no suele ser interpretado por los usuarios como el título real de la página; sólo sirve como una referencia. Hay otras etiquetas, que veremos más adelante, que cumplen mejor la función de titular un documento.

• Cuerpo:
  Las etiquetas  y , delimitan el cuerpo del documento. El cuerpo contiene todo lo que el usuario observará en pantalla, es decir, en la ventana principal del navegador. Entre estas dos etiquetas va el texto que uno quiere publicar, intercalado con las etiquetas HTML necesarias para que se vea adecuadamente en pantalla.

• En la última línea, la etiqueta  indica la finalización del documento HTML.

A continuación, vamos a ir descubriendo las etiquetas básicas que se pueden insertar dentro del espacio delimitado por  y para darle formato al texto que contenga el documento:

• Texto en negrita
• Texto realzado
• Texto en bastardilla
• Texto subrayado
• Texto tachado
• Párrafos
• Cómo alinear un párrafo
• Cortes
• Línea divisoria
• Comentarios

1.2 DHTML

Nestcape Navigator 2.0 e Internet Explorer 3.0 dieron a conocer modelos de objetos básicos para documentos HTML.  Sin embargo, el nivel de soporte estaba limitado a la lógica condicional durante la carga de la página y la validación de formularios.  No se aceptaban cambios que pudieran alterar la forma, estilo o presentación del documento.  Internet Explorer 4.0 elimina esta limitación por medio de un modelo de objetos mejorado.

En lugar de definir un modelo completamente nuevo, los desarrolladores crearon y diseñaron el modelo de objetos de Dynamic HTML como un super conjunto del modelo existente.  

El modelo de objetos de Dynamic HTML es sólido con los paradigmas actuales de programación, permitiendo a los desarrolladores apoyarse en sus conocimientos.

1.2 CARACTERISTICAS ESPECIALES

• Dynamic HTML permite crear páginas y aplicaciones web interactivas.

• Dynamic HTML proporciona un gran modelo de eventos estrechamente relacionados con la estructura del documento sobre el que trabaja, este modelo esta basado en dos grandes características nuevas para el control del comportamiento del documento.

1. Promoción de eventos: La promoción de eventos no existía en versiones anteriores del modelo de objetos de HTML porque no era necesaria.  Antes, los desarrolladores de los exploradores pensaban que únicamente una serie de elementos era bastante interesante como para provocar eventos.  Sin embargo, con la introducción de Dynamic HTML, todos los elementos provocan eventos.

1. Acciones predeterminadas:  Representan el manejo del evento por el mismo explorador.

Con el modelo de objetos de Dynamic HTML es posible sustituir una acción predeterminada existente por un comportamiento personalizado.  Si un evento no tiene acción predeterminada y vamos a escribir un comportamiento para el mismo, conviene cancelar la potencial acción predeterminada.  Con esto aseguraremos que el código seguirá ejecutándose correctamente si algún explorador incluye mas tarde una acción predeterminada para dicho evento.

...