Guía del usuario Cancelar

Aspectos básicos de las aplicaciones web

Buscar

Última actualización el 4 may. 2021

Nota:

la interfaz de usuario se ha simplificado en Dreamweaver CC y versiones posteriores. Como resultado, es posible que no encuentre algunas de las opciones que se describen en este artículo en Dreamweaver CC y versiones posteriores. Para obtener más información, consulte este artículo.

Acerca de las aplicaciones web

Una aplicación Web es un sitio Web que contiene páginas con contenido sin determinar, parcialmente o en su totalidad. El contenido final de una página se determina sólo cuando el usuario solicita una página del servidor Web. Dado que el contenido final de la página varía de una petición a otra en función de las acciones del visitante, este tipo de página se denomina página dinámica.

Las aplicaciones Web se crean en respuesta a diversas necesidades o problemas. En esta sección se describen los usos más habituales de las aplicaciones Web y se proporciona un ejemplo sencillo.

Usos comunes de las aplicaciones Web

Las aplicaciones Web pueden tener numerosos usos tanto para los visitantes como para los ingenieros de desarrollo, entre otros:

Permitir a los usuarios localizar información de forma rápida y sencilla en un sitio Web en el que se almacena gran cantidad de contenido.
Este tipo de aplicación web ofrece a los visitantes la posibilidad de buscar contenido, organizarlo y navegar por él de la manera que estimen oportuna. Entre los ejemplos se incluyen intranets de las empresas, Microsoft MSDN (www.msdn.microsoft.com) y Amazon.com (www.amazon.com).
Recoger, guardar y analizar datos suministrados por los visitantes de los sitios.
En el pasado, los datos introducidos en los formularios HTML se enviaban como mensajes de correo electrónico a los empleados o a aplicaciones CGI para su procesamiento. Una aplicación Web permite guardar datos de formularios directamente en una base de datos, además de extraer datos y crear informes basados en la Web para su análisis. Ejemplos de ello son las páginas de los bancos en línea, las páginas de tiendas en línea, las encuestas y los formularios con datos suministrados por el usuario.
Actualizar sitios Web cuyo contenido cambia constantemente.
Una aplicación Web evita al diseñador Web tener que actualizar continuamente el código HTML del sitio. Los proveedores de contenido, como los editores de noticias, proporcionan el contenido a la aplicación Web y ésta actualiza el sitio automáticamente. Entre los ejemplos, se incluyen The Economist (www.economist.com) y la CNN (www.cnn.com).

Ejemplo de aplicación web

Ana es una diseñadora web profesional y usuaria experimentada de Dreamweaver cuya tarea consiste en mantener los sitios de intranet e Internet de una empresa de tamaño medio en la que trabajan 1000 empleados. Un día, Pedro, del departamento de RR.HH., le expone un problema. Su departamento administra un programa de promoción de la salud por el que los empleados reciben puntos por cada kilómetro recorrido a pie, en bicicleta o corriendo. Cada empleado debe informar a Pedro del número total de kilómetros recorridos cada mes a través del correo electrónico. A finales de mes, Pedro reúne todos los mensajes de correo electrónico y entrega a los empleados pequeños regalos en metálico en función del total de puntos acumulados.

El problema de Pedro es que el programa de salud ha tenido demasiado éxito. Es tal el número de empleados que participan en él que Pedro se ve inundado de mensajes a final de cada mes. Pedro pregunta a Ana si se le ocurre alguna solución basada en la Web.

Ana le propone una aplicación Web basada en la intranet, que puede realizar las siguientes tareas:

Permitir a los empleados introducir los kilómetros recorridos en una página Web mediante un formulario HTML sencillo
Almacenar los kilómetros recorridos por cada empleado en una base de datos
Calcular los puntos en función de los datos de kilometraje
Permitir a los empleados supervisar su progreso mensual
Proporcionar a Pedro acceso mediante un solo clic al total de puntos al final de cada mes
Ana tiene la aplicación lista y en funcionamiento antes de la hora del almuerzo gracias a Dreamweaver, que proporciona las herramientas necesarias para crear este tipo de aplicación con rapidez y facilidad.

Funcionamiento de una aplicación Web

Una aplicación Web es un conjunto de páginas Web estáticas y dinámicas. Una página Web estática es aquélla que no cambia cuando un usuario la solicita: el servidor Web envía la página al navegador Web solicitante sin modificarla. Por el contrario, el servidor modifica las páginas Web dinámicas antes de enviarlas al navegador solicitante. La naturaleza cambiante de este tipo de página es la que le da el nombre de dinámica.

Por ejemplo, podría diseñar una página para que mostrara los resultados del programa de salud y dejara cierta información fuera (como el nombre del empleado y sus resultados) para calcularla cuando la página la solicite un empleado en particular.

En las siguientes secciones se describe con mayor detalle el funcionamiento de las aplicaciones Web.

Procesamiento de páginas web estáticas

Un sitio Web estático consta de un conjunto de páginas y de archivos HTML relacionados alojados en un equipo que ejecuta un servidor Web.

Un servidor Web es un software que suministra páginas Web en respuesta a las peticiones de los navegadores Web. La petición de una página se genera cuando el usuario hace clic en un vínculo de una página Web, elige un marcador en un navegador o introduce una URL en el cuadro de texto Dirección del navegador.

El contenido final de una página Web estática lo determina el diseñador de la página y no cambia cuando se solicita la página. A continuación se incluye un ejemplo:

<html> 
    <head> 
        <title>Trio Motors Information Page</title> 
    </head> 
    <body> 
        <h1>About Trio Motors</h1> 
        <p>Trio Motors is a leading automobile manufacturer.</p> 
    </body> 
</html>

El diseñador escribe todas y cada una de las líneas de código HTML de la página antes de colocarla en el servidor. El código HTML no cambia una vez colocado en el servidor y por ello, este tipo de páginas se denomina página estática.

Nota:

En sentido estricto, una página “estática” puede no ser estática en absoluto. Por ejemplo, una imagen de sustitución o contenido de Flash (un archivo SWF) puede hacer que una página estática tome vida. No obstante, en esta guía se habla de página estática cuando ésta se envía al navegador sin modificaciones.

Cuando el servidor Web recibe una petición de una página estática, el servidor lee la solicitud, localiza la página y la envía al navegador solicitante, como se muestra en el siguiente ejemplo:

A. El navegador web solicita la página estática. B. El servidor localiza la página. C. El servidor Web envía la página al navegador solicitante.

En el caso de las aplicaciones Web, algunas líneas de código no están determinadas cuando el usuario solicita la página. Estas líneas deben determinarse mediante algún mecanismo antes de enviar la página al navegador. En la siguiente sección se describe dicho mecanismo.

Procesamiento de páginas dinámicas

Cuando un servidor Web recibe una petición para mostrar una página Web estática, el servidor la envía directamente al navegador que la solicita. Cuando el servidor Web recibe una petición para mostrar una página dinámica, sin embargo, reacciona de distinta forma: transfiere la página a un software especial encargado de finalizar la página. Este software especial se denomina servidor de aplicaciones.

El servidor de aplicaciones lee el código de la página, finaliza la página en función de las instrucciones del código y elimina el código de la página. El resultado es una página estática que el servidor de aplicaciones devuelve al servidor Web, que a su vez la envía al navegador solicitante. Lo único que el navegador recibe cuando llega la página es código HTML puro. A continuación se incluye una vista de este proceso:

A. El navegador web solicita la página dinámica. B. El servidor web localiza la página y la envía al servidor de aplicaciones. C. El servidor de aplicaciones busca instrucciones en la página y la termina. D. El servidor de aplicaciones pasa la página terminada al servidor web. E. El servidor web envía la página finalizada al navegador solicitante.

Acceso a una base de datos

Un servidor de aplicaciones le permite trabajar con recursos del lado del servidor, como las bases de datos. Por ejemplo, una página dinámica puede indicar al servidor de aplicaciones que extraiga datos de una base de datos y los inserte en el código HTML de la página. Para más información, consulte www.adobe.com/go/learn_dw_dbguide_es.

El uso de una base de datos para almacenar contenido permite separar el diseño del sitio Web del contenido que se desea mostrar a los usuarios del sitio. En lugar de escribir archivos HTML individuales para cada página, sólo se necesita escribir una página —o plantilla— para los distintos tipos de información que se desea presentar. Posteriormente, podrá cargar contenido en una base de datos y, seguidamente, hacer que el sitio Web recupere el contenido en respuesta a una solicitud del usuario. También puede actualizar la información en un único origen y, posteriormente, implantar ese cambio en todo el sitio Web sin necesidad de editar manualmente cada página. Puede utilizar Adobe Dreamweaver para diseñar formularios web que inserten, actualicen o eliminen datos de la base de datos.

La instrucción para extraer datos de una base de datos recibe el nombre de consulta de base de datos. Una consulta consta de criterios de búsqueda expresados en un lenguaje de base de datos denominado SQL (Structured Query Language, lenguaje de consulta estructurado). La consulta SQL se escribe en los scripts o etiquetas del lado del servidor de la página.

Un servidor de aplicaciones no se puede comunicar directamente con una base de datos porque el formato de esta última impide que se descifren los datos, de una forma bastante similar a cuando un documento de Microsoft Word no puede descifrarse al abrirlo con el Bloc de Notas o BBEdit. El servidor de aplicaciones sólo se puede comunicar con la base de datos a través de un controlador que actúe de intermediario con la base de datos: el software actúa entonces como un intérprete entre el servidor de aplicaciones y la base de datos.

Una vez que el controlador establece la comunicación, la consulta se ejecuta en la base de datos y se crea un juego de registros. Un juego de registros es un conjunto de datos extraídos de una o varias tablas de una base de datos. El juego de registros se devuelve al servidor de aplicaciones, que emplea los datos para completar la página.

A continuación se ofrece una consulta de base de datos sencilla escrita en SQL:

SELECT lastname, firstname, fitpoints 
FROM employees

Esta instrucción crea un juego de registros de tres columnas y lo completa con filas que contienen el apellido, el nombre y los puntos de forma física de todos los empleados de la base de datos. Para más información, consulte www.adobe.com/go/learn_dw_sqlprimer_es.

En el siguiente ejemplo se muestra el proceso de consulta de base de datos y de devolución de los datos al navegador:

A. El navegador web solicita la página dinámica. B. El servidor web localiza la página y la envía al servidor de aplicaciones. C. El servidor de aplicaciones busca instrucciones en la página. D. El servidor de aplicaciones envía la consulta al controlador de la base de datos. E. El controlador ejecuta la consulta en la base de datos. F. El juego de registros se devuelve al controlador. G. El controlador pasa el juego de registros al servidor de aplicaciones. H. El servidor de aplicaciones inserta los datos en una página y luego pasa la página al servidor web. I. El servidor Web envía la página finalizada al navegador solicitante.

Puede utilizar prácticamente cualquier base de datos con su aplicación Web, siempre y cuando se haya instalado el controlador de base de datos correcto en el servidor.

Si tiene intención de desarrollar pequeñas aplicaciones de bajo coste, puede utilizar una base de datos basada en archivos, como las que permite crear Microsoft Access. En cambio, si desea desarrollar aplicaciones empresariales críticas, puede utilizar una base de datos basada en servidor, como las que permite crear Microsoft SQL Server, Oracle 9i o MySQL.

Si la base de datos está situada en un sistema distinto del servidor Web, asegúrese de disponer de una conexión rápida entre ambos sistemas para que la aplicación Web pueda funcionar de forma rápida y eficiente.

Creación de páginas dinámicas

La creación de una página dinámica implica, en primer lugar, escribir el código HTML y, seguidamente, añadir los scripts o etiquetas del lado del servidor al código HTML para crear la página dinámica. Al visualizar el código resultante, el lenguaje aparece incrustado en el código HTML de la página. Por esta razón, estos lenguajes se conocen como lenguajes de programación incrustados en HTML. En el siguiente ejemplo básico se utiliza ColdFusion Markup Language (CFML):

Nota: La compatibilidad con CFML se ha eliminado de Dreamweaver CC y las versiones posteriores.

<html> 
    <head> 
        <title>Trio Motors Information Page</title> 
    </head> 
    <body> 
        <h1>About Trio Motors</h1> 
        <p>Trio Motors is a leading automobile manufacturer.</p> 
        <!--- embedded instructions start here ---> 
        <cfset department="Sales"> 
        <cfoutput> 
        <p>Be sure to visit our #department# page.</p> 
        </cfoutput> 
        <!--- embedded instructions end here ---> 
    </body> 
</html>

Las instrucciones incrustadas de esta página realizan las siguientes acciones:

Crean una variable denominada department y le asignan la cadena "Sales".
Inserta el valor de la variable, "Sales", en el código HTML.

El servidor de aplicaciones devuelve la siguiente página al servidor Web:

<html> 
    <head> 
        <title>Trio Motors Information Page</title> 
    </head> 
    <body> 
        <h1>About Trio Motors</h1> 
        <p>Trio Motors is a leading automobile manufacturer.</p> 
        <p>Be sure to visit our Sales page.</p> 
    </body> 
</html>

El servidor Web envía la página al navegador solicitante, que la muestra de la siguiente forma:

About Trio Motors

Trio Motors is a leading automobile manufacturer.

Be sure to visit our Sales page.

La utilización de un lenguaje basado en etiquetas o en scripts se decide en función de la tecnología de servidor disponible en el servidor. A continuación se enumeran los lenguajes más utilizados para las tecnologías de servidor compatibles con Dreamweaver:

Tecnología de servidor	Lenguaje
ColdFusion	ColdFusion Markup Language (CFML)
Active Server Pages (ASP)	VBScript JavaScript
PHP	PHP

Dreamweaver puede crear los scripts (archivos de comando) o las etiquetas del lado del servidor necesarias para que sus páginas funcionen, o puede escribirlos usted manualmente en el entorno de programación de Dreamweaver.

Terminología de aplicaciones web

En esta sección se definen los términos utilizados con frecuencia en relación con las aplicaciones web.

Servidor de aplicaciones

Software que ayuda al servidor Web a procesar las páginas que contienen scripts o etiquetas del lado del servidor. Cuando se solicita al servidor una página de este tipo, el servidor Web pasa la página al servidor de aplicaciones para su procesamiento antes de enviarla al navegador. Para más información, consulte Funcionamiento de una aplicación Web.

Entre los servidores de aplicaciones más comunes figuran ColdFusion y PHP.

Base de datos

Conjunto de datos almacenados en tablas. Cada fila de una tabla constituye un registro de datos, y cada columna constituye un campo del registro, como se indica en el siguiente ejemplo:

Controlador de base de datos

Software que actúa como intérprete entre una aplicación Web y una base de datos. Los datos de una base de datos se almacenan en un formato propio de dicha base de datos. Un controlador de base de datos permite a la aplicación Web leer y manipular datos que, de otro modo, resultarían indescifrables.

Sistema de administración de base de datos

(DBMS o sistema de base de datos) Software que se utiliza para crear y manipular bases de datos. Entre los sistemas de bases de datos más habituales figuran Microsoft Access, Oracle 9i y MySQL.

Consulta de base de datos

Operación mediante la cual se extrae un juego de registros de una base de datos. Una consulta consta de criterios de búsqueda expresados en un lenguaje de base de datos denominado SQL. Por ejemplo, la consulta puede especificar que sólo se incluyan determinadas columnas o determinados registros en el juego de registros.

Página dinámica

Página web personalizada por el servidor de aplicaciones antes de que la página se envíe a un navegador.

Juego de registros

Conjunto de datos extraídos de una o varias tablas de una base de datos, como se ilustra en el siguiente ejemplo:

Base de datos relacional

Base de datos que contiene múltiples tablas que comparten datos. La siguiente base de datos es relacional porque dos tablas comparten la columna DepartmentID.

Tecnología de servidor

Tecnología que utiliza un servidor de aplicaciones para modificar páginas dinámicas en tiempo de ejecución.

El entorno de desarrollo de Dreamweaver admite las siguientes tecnologías de servidor:

Adobe® ColdFusion®
Microsoft Active Server Pages (ASP)
PHP: Hypertext Preprocessor (PHP)
También puede utilizar el entorno de programación de Dreamweaver para desarrollar páginas para cualquier otra tecnología de servidor no incluida en la lista.

Página estática

Página Web que el servidor de aplicaciones no modifica antes de que la página se envíe a un navegador. Para más información, consulte Procesamiento de páginas Web estáticas.

Aplicación web

Sitio Web que contiene páginas con contenido sin determinar, parcialmente o en su totalidad. El contenido final de estas páginas se determina sólo cuando un visitante solicita una página del servidor Web. Dado que el contenido final de la página varía de una petición a otra en función de las acciones del visitante, este tipo de página se denomina página dinámica.

Servidor web

Software que suministra páginas Web en respuesta a las peticiones de los navegadores Web. La petición de una página se genera cuando un visitante hace clic en un vínculo de una página Web en el navegador, elige un marcador en el navegador o introduce un URL en el cuadro de texto Dirección del navegador.

Entre los servidores web más utilizados se incluyen Microsoft Internet Information Server (IIS) y Apache HTTP Server.

Páginas relacionadas

Adobe

Obtén ayuda de forma más rápida y sencilla

¿Nuevo usuario?