Introducción: Cronología de la Web
Abraham Sánchez López FCC/BUAP
Grupo MOVIS
Introducción
Desde el comienzo de la Internet, la Web ha evolucionado a través de varias fases y pasos que han tenido éxito, antes de obtener las aplicaciones en línea que se utilizan en la actualidad.
Curiosamente, los períodos de estos acontecimientos remarcables están separados aproximadamente cada 5 años y si se anticipo en esto una evolución futura, es probable que haya sido el 2010, el año en que se haya cumplido el vencimiento de la Web 2.0.
1990: inicio de la Web estática
Al comienzo de la Web, las páginas HTML estaban limitadas a la visualización de texto simple y a algunas ilustraciones (la pantalla se bloqueaba a menudo para mejorar la fluidez de la navegación en redes de baja velocidad).
A través de los años, con el advenimiento de la Internet como la conocemos, los requisitos de los usuarios evolucionaron.
De hecho, la única interacción posible era las páginas HTML para mostrar una nueva página al hacer clic en un hipervínculo.
Por consiguiente, era imposible obtener cualquier efecto visual (como un vuelco (roll-over) en una imagen, por ejemplo) sin tener que recurrir a una tecnología complementaria.
Además, el envío de una solicitud al servidor Web, después de hacer clic en un hipervínculo, por ejemplo, generaba un ciclo de tratamiento largo y tedioso que dificultó considerablemente la reactividad de las aplicaciones en las redes y los servidores a menudo insuficiente para el tráfico que comenzaba a crecer exponencialmente.
Los sitios estáticos, I
Los sitios estáticos están constituidos de un conjunto de páginas HTML unidas entre ellas por medio de vínculos de hipertexto que permiten navegar de una a la otra.
El protocolo utilizado para transferir la información Web sobre Internet es el HTTP.
Una solicitud HTTP (http://www.google.com.mx/ por ejemplo) se envía hacia el servidor con el fin de acceder a la página deseada y visualizarla en el navegador del cliente (ver etapa 1 de la siguiente figura).
Cuando el servidor Web recibe esta solicitud (petición), buscará la página solicitada entre todas las páginas HTML en el sitio en cuestión y luego la reenvía enseguida al cliente (ver el paso 2 en la figura).
El código HTML recibido por el cliente entonces se interpreta y muestra por el navegador (ver etapa 3 de la figura).
Esto se conoce como arquitectura cliente-servidor: el cliente es el navegador
Los sitios estáticos, II
Este tipo de sitio es muy simple de desarrollar y la mayoría de los primeros sitios fueron diseñados bajo este modelo. Sin embargo, este concepto está limitado debido a que falta por obvias razones, la interactividad.
La arquitectura cliente-servidor de un sitio estático: el cliente envía al servidor una solicitud HTTP; el servidor Web busca y proporciona al cliente la página solicitada, que a continuación es interpretada por el navegador.
HTTP
HTTP (Hyper Text Transfer Protocol) es el protocolo utilizado principalmente por todas las aplicaciones Web: permite el intercambio de datos entre un servidor Web y un navegador Web instalado en un cliente.
Así, el navegador puede enviar al servidor Web una solicitud formalizada como la dirección de la página destino (URL) y recibir en respuesta la página HTML correspondiente que sustituirá completamente la página que se muestra en el navegador.
Al igual que la mayoría de los protocolos para las aplicaciones Internet (FTP, SMTP, POP3 ...) HTTP se basa en otro protocolo de transporte, el TCP/IP (Transmission Control Protocol / Internet Protocol), que asegura el enrutamiento de datos por paquetes (todos los datos se dividen en pequeños paquetes para la fase de transferencia) de un punto a otro.
(x)HTML
HTML (HyperText Markup Language) es el lenguaje de descripción de una página Web.
Este lenguaje se basa en un conjunto de etiquetas estándar interpretadas por el navegador para definir el contenido y el diseño de la página.
El XHTML (eXtensible HyperText Markup Language) por su parte, es una evolución del lenguaje anterior de acuerdo con las restricciones de XML e impone ciertas reglas para que una página este bien formada (nombres en minúsculas de las etiquetas, atributos de etiquetas obligatoriamente delimitados con comillas dobles, cierre obligatorio de todas las etiquetas ...).
1995: la Web orientada al cliente, I
Para hacer frente a la falta de interactividad y a los problemas de congestión de la red y la saturación de los servidores Web, los desarrolladores empezaron a aplicar diversas tecnologías del lado del cliente para descargar el servidor de tareas que pueden ser manejadas directamente por el navegador.
Esto reduce fuertemente el tráfico de la red.
Así, cada editor del navegador Web rápidamente comenzó a implementar en su software los intérpretes de su propio lenguaje.
Además, Microsoft con JScript y Netscape con JavaScript permiten ejecutar finalmente del lado del cliente los scripts.
El incumplimiento de los estándares del W3C de ciertos editores complicaba el trabajo de los desarrolladores que debían de considerar las diferencias en la interpretación de su código de un navegador a otro.
Estas nuevas tecnologías cliente han planteado también otro problema: la seguridad de los usuarios.
1995: la Web orientada al cliente, II
Los navegadores y editores tuvieron que agregar rápidamente las opciones en su software para deshabilitar la ejecución de las diferentes tecnologías del lado del cliente para responder a la preocupación de los usuarios.
El hecho de que algunos navegadores no pueden ejecutar scripts del lado del cliente ha sido un gran obstáculo para su uso, ya que los desarrolladores deberían entonces ofrecer alternativas en modo degradado para permitir que todos los usuarios utilicen su aplicación.
Posteriormente, otras empresas han desarrollado programas propietarios (applets Java, controles ActiveX, Flash ...) que se pueden integrar en una página Web y ejecutarse en el navegador a través de un plug-in (extensión del navegador).
La Web entonces disponía de una gran cantidad de tecnologías del lado del cliente, pero la falta de estandarización y la heterogeneidad de los navegadores hace una utilización muy difícil.
Los sitios interactivos del lado del cliente, I
La solución más simple para crear la interactividad consiste en integrar algunas líneas de código JavaScript en una página HTML.
Cuando una solicitud HTTP llama a la página HTML (ver la etapa 1 de la siguiente figura), el servidor Web la devuelve al cliente para que esta pueda ser interpretada como una página HTML normal (ver las etapas 2 y 3 en la figura).
El script incluido en la página se procesa a continuación por el navegador (es decir, en el lado del cliente) cuando se produce el evento para el cual ha sido programado (ver la etapa 4 en la figura).
Los scripts del lado del cliente son fáciles de implementar, ya que no requieren una infraestructura de servidor dedicado.
Además, son muy reactivos debido a que el script se ejecuta directamente en el cliente.
Sin embargo, los programas JavaScript sufren de problemas de compatibilidad con la configuración del cliente en el que se ejecutan y puede comportarse de
Los sitios interactivos del lado del cliente, II
Existe una dependencia relativa al navegador pero la interactividad es rápida.
Por ejemplo, un script de JavaScript puede trabajar perfectamente en Firefox, pero tener problemas con Internet Explorer.
Del mismo modo, los resultados pueden variar dependiendo de si se utiliza una PC o una Mac.
Todo esto impone al diseñador multimedia efectuar pruebas importantes si desea que su página interactiva funcione en todas las plataformas y en todas las
Los sitios interactivos del lado del cliente, III
Otros problemas relacionados con la seguridad de los datos son también un obstáculo para el uso de las tecnologías de lado del cliente.
De hecho, el código fuente de los programas que está integrado en la página reenviada por el servidor al cliente, se hace más legible para que un desarrollador malintencionado altere el funcionamiento de los scripts, simplemente consultando el código fuente de la página HTML.
Por último, la posibilidad de que el usuario desactive el funcionamiento de JavaScript en su navegador obligó (restringió) al desarrollador a prever soluciones alternativas para que sus aplicaciones puedan cuando menos funcionar en modo degradado.
JavaScript
JavaScript se llama a menudo, por abuso del lenguaje, a la combinación de las dos tecnologías cliente más utilizadas en la Web: el "JavaScript" desarrollado por Netscape Communications (que no debe confundirse con Java) y el
"JScript" más adelante desarrollado por Microsoft para competir con la tecnología de Netscape.
En realidad, ambos son consistentes (o se supone que ...) con la ECMAScript (European Computer Manufacturers Association), que es un estándar europeo, pero también a nivel internacional, de estas tecnologías cliente.
De todos modos, el funcionamiento de las dos tecnologías es el mismo.
Las instrucciones JavaScript o JScript se incluyen en el código HTML de las páginas enviadas por el servidor al cliente, ya que están manejadas directamente por el navegador a través de un intérprete estándar implementado en el software cliente.
2000: La Web orientada al servidor, I
A partir del año 2000, la evolución creciente de las complicaciones encontradas con las tecnologías del cliente, ha provocado una migración gradual de las aplicaciones del lado de servidor.
Motivados por los problemas de compatibilidad y de seguridad vinculados a las aplicaciones del lado del cliente, muchos desarrolladores han adaptado e instalado su programa del lado del servidor para satisfacer a los usuarios (lo que en parte explica el extraordinario desarrollo de lenguajes para servidores como PHP).
En pocos años la mayoría de los sitios han experimentado reajustes estructurales para adaptarse a una infraestructura Web que explote principalmente las aplicaciones del lado del servidor y esto a pesar de una organización del servidor Web más compleja, relacionada con el uso de estas tecnologías de servidor.
Sin embargo, el uso intensivo de las tecnologías de servidor no está exenta de
2000: La Web orientada al servidor, II
Es decir, el uso exclusivo de las aplicaciones de servidor (si bien algunas se beneficiaran al ser ejecutadas del lado del cliente) hace que el intercambio, entre el cliente y el servidor, tenga un gran número de consultas que obstruyen fuertemente a la red y hacen muy lenta la respuesta de las aplicaciones.
Del mismo modo, para cada solicitud, el servidor envía la página HTML completa con toda una gran cantidad de información redundante, lo que reduce en gran medida el intercambio de información que conduce a largos tiempos de espera para el usuario.
Los sitios interactivos del lado del servidor, I
Cuando la interactividad se coloca en el lado del servidor, el servidor Web debe tener un preprocesador PHP para procesar los scripts PHP incrustados en la página, antes de enviarla al cliente que realizó la petición (ver la etapa 1 y 2 de la siguiente figura).
Si lo comparamos con un script del lado del cliente, la reacción de un script del lado del servidor a un evento es mucho más lenta, ya que requiere el envío de una solicitud al servidor (ver etapa 1 de la siguiente figura), su ejecución en el servidor (etapa 2), el retorno de la respuesta a través de Internet (etapa 3) y la carga de una página completa HTML en el navegador (etapa 4).
En contraste, los lenguajes del lado del servidor son independientes de la plataforma del cliente o de la versión del navegador.
Es decir, la interpretación del script se realiza del lado del servidor y el
código enviado hacia a la computadora del cliente es compatible con el
Los sitios interactivos del lado del servidor, II
Utilización de un script del lado de servidor: no hay dependencia en el navegador pero la interactividad es más lenta.
Entre las desventajas del scripting del lado del servidor, debe tenerse en cuenta que su uso requiere la disponibilidad de un servidor adaptado.
Incluso las ofertas de los proveedores que ofrecen servidores que integran scripts dinámicos son ahora muy accesibles, debe tenerse en cuenta esto a la
Los sitios dinámicos, I
La ejecución del script del lado del servidor permite crear una página “sobre la marcha" durante su ejecución por el preprocesador PHP integrado al servidor.
La página creada contiene la misma información que una simple página HTML. Esta se puede interpretar fácilmente (sin problemas) por el navegador del lado del cliente (ver la siguiente figura).
Los sitios dinámicos, II
Al crear esta página, se ejecutan los scripts (PHP por ejemplo) integrados en el archivo dinámico y, si es necesario, establecen una conexión con un servidor de datos.
Con este proceso, la página dinámica se convierte en un modelo de presentación de la información. Este modelo se puede personalizar mediante diferentes contenidos según la petición del cliente.
Ya no es necesario, por ejemplo, crear una página específica para presentar cada producto de un catálogo: se puede utilizar una única página dinámica.
Al indicar el ID del producto solicitado a través de una variable que se pasa al mismo tiempo como su llamada; la página reenviada al cliente contiene entonces toda la información y fotografías relacionadas con el producto en cuestión.
El árbol del sitio se simplifica desde esta página dinámica para reemplazar muchas páginas estáticas para cada producto.
MySQL y PHP
MySQL (My Structured Query Language) es un sistema de gestión de bases de datos relacional, multihilo y multiusuario con más de seis millones de instalaciones. Esta frecuentemente acoplada con el lenguaje de script para servidores PHP.
PHP (inicialmente llamado Personal Home Page, después Hypertext Pre- Processor) es un lenguaje de script libre utilizado principalmente como lenguaje de programación Web del lado del servidor.
2005: el compromiso cliente-servidor, I
Afortunadamente, los navegadores más comunes mejoraron progresivamente y le dieron mayor importancia a los estándares (aunque sigue habiendo discrepancias entre algunos de ellos...), lo que reduce los problemas de compatibilidad relacionados con el uso de las tecnologías del lado del cliente.
Del mismo modo, el valor agregado resultante de las aplicaciones del lado del cliente rápidamente compensa los temores de los usuarios hacia ellos.
El hecho de que muchos sitios populares ahora utilizan JavaScript, condujo progresivamente a una desaparición de los usuarios que desactivaban las tecnologías cliente en su navegador.
Estos cambios han tenido un impacto positivo en los desgloses de las aplicaciones y ha permitido un retorno a un justo equilibrio de responsabilidades entre el cliente y el servidor.
Ahora, el uso de JavaScript, DOM y CSS entró a la normalidad y estas tecnologías también se recomiendan para garantizar la accesibilidad del sitio a las personas con discapacidad.
2005: el compromiso cliente-servidor, II
Ahora, las aplicaciones pueden distribuirse de manera uniforme entre el cliente y el servidor promoviendo así una mejor respuesta del sistema, mientras que las tareas tales como la persistencia de los datos (el enlace con las bases de datos se realiza siempre del lado del servidor) o la gestión de autenticación siguen siendo un privilegio de las tecnologías del servidor.
DOM
El DOM (Document Object Model) es una tecnología que permite la modelización de los elementos de una página XHTML bajo forma de una jerarquía normalizada independiente de todo tipo de lenguaje. Gracias a la tecnología JavaScript, es también posible modificar la estructura de una página Web sobre la marcha. El DOM forma parte de las tecnologías explotadas por Ajax para interactuar con el contenido o la forma de una página XHTML.
CSS
La CSS (Cascading Style Sheets) permite describir precisamente el formato de una página HTML, XHTML o XML. Es igualmente posible separar claramente el
Las tendencias de la Web 2.0, I
Dado que la situación parece haberse estabilizado después del equilibrio de las tareas entre el cliente y el servidor, podríamos preguntarnos de qué forma Ajax podría mejorar aún más el uso de las aplicaciones Web en Internet.
Si la ruptura de scripts cliente-servidor ha demostrado ser fructífera para una mejor respuesta de la aplicación, el problema de la inercia de las peticiones HTTP está sin embargo, aún presente.
Además, el envío de una solicitud bloquea las acciones del usuario hasta la respuesta del servidor, y el hecho de que la respuesta del servidor este constituida por el código completo de la página y que la página actual sea obligatoriamente refrescada, son desventajas que deben eliminarse.
La tecnología Ajax puede ser una solución a este problema.
De hecho, basándonos en la observación de que el rendimiento de los programas del lado del cliente es ahora más confiable en la mayoría de los navegadores y que el objeto XMLHttpRequest está implementado en la mayoría de ellos, es posible implementar aplicaciones Ajax para gestionar el
Las tendencias de la Web 2.0, II
El modo asíncrono es posible gracias al uso adecuado del objeto XMLHttpRequest que permite enviar una solicitud servidor en segundo plano sin bloqueo de la actividad de la aplicación cliente mientras espera la respuesta del servidor.
En la recepción de la respuesta del servidor, el dato (y no toda la página HTML como fue anteriormente el caso) se insertará automáticamente en la página Web actual sin que haya un refrescado completo de la página (ver la siguiente figura).
Las tendencias de la Web 2.0, III
La figura anterior muestra la utilización de un motor AJAX para el lado del cliente con el fin de interactuar de forma asíncrona con un programa servidor en PHP.
Con este tipo de procesos, las aplicaciones Web son cada vez más flexibles de usar, porque no bloquean más al usuario durante el tiempo de espera del servidor.
Asimismo, permiten una mayor capacidad de respuesta de la aplicación porque sólo los datos solicitados se devolverán al cliente.
Por último, el hecho de que solo hay que cargar una nueva página para cada solicitud, mejora considerablemente la comodidad del usuario.
Todas estas ventajas ahora proporcionan a los usuarios, aplicaciones más
ricas muy reactivas que anuncian una nueva era, la de la Web 2.0.
Ajax
AJAX, Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es un combinación de tecnologías (XHTML, DOM, CSS, XML, JavaScript) y más particularmente su objeto XMLHttpRequest) para el desarrollo de aplicaciones interactivas Web o RIA (Rich Internet Applications).
Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano.
De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, la interactividad, velocidad y usabilidad en las aplicaciones.
XMLHttpRequest
Es una clase JavaScript que dispone de propiedades y de métodos que permiten recuperar los datos en el lado del servidor de una manera asíncrona.
