Introducción a la web

Aplicaciones Web

Prof. Javier Tuñoque Gálvez

¿Qué es Internet?• Incluye distintos servicios:– Correo electrónico. 1971, Ray Tomlinson

– Chat (o IRC).1988, en Finlandia

– Transferencia de archivos– Foros de discusión–World Wide Web, 1989, Tim Berners Lee

y el belga Robert Cailliau

Introducción a la Web

Origen de la Web

¿Qué es Internet?

Uno de los servicios que más éxito ha tenido en Internet ha sido la World Wide Web (WWW, o "la Web"), hasta tal punto que es habitual la confusión entre ambos términos.


Origen de la Web

¿Qué es Internet?Internet es un conjunto descentralizado de

redes de comunicación interconectadas que utilizan la familia de protocolos TCP/IP, garantizando que las redes físicas heterogéneas que la componen funcionen como una red lógica única, de alcance mundial.

Sus orígenes se remontan a 1969, cuando se estableció la primera conexión de computadoras, conocida como ARPANET, entre tres universidades en California y una en Utah, Estados Unidos


Origen de la Web

¿Qué es web? “La cara gráfica de Internet” La parte multimedia de Internet Es un espacio de almacenamiento y un

sistema de publicación mundial al que se accede en cualquier momento y desde cualquier lugar

Compuesta por millones de sitios web, cada uno de los cuales puede tener varias páginas

Web: Hipertexto + Internet


Origen de la Web


Evolución de la Web

La Web de hoy es un universo de aplicaciones y páginas web interconectadas lleno de vídeos, fotos y contenido interactivo. Lo que no ve el usuario es cómo interactúan los navegadores y las tecnologías web para hacer que esto sea posible.

A lo largo del tiempo, las tecnologías web han evolucionado hasta permitir que los desarrolladores puedan crear nuevas e increíbles experiencias web.



1ª Generación o Generación de Contenido

Estático

2ª Generación o Generación de Contenido Dinámico o Interactivo

3ª Generación o Generación de Contenido Colaborativo

La Web ha pasado por tres etapas o generaciones muy claras, a saber:



• Generación de Contenido Estático, se corresponde con la Web que va desde que se crea por Tim Berners-Lee hasta la aparición de la 2ª Generación a mediados de los años 90.

• Esta generación se caracteriza porque las páginas Web son completamente estáticas, es decir, el contenido que presentan es el que es y no permiten al usuario realizar ningún tipo de interacción con las mismas, salvo la manipulación propia del manejo del hipertexto y los hiperenlaces, esto es, saltar de una página web a otra.

1ª Generación o Generación de Contenido Estático



• Generación de Contenido Dinámico, se corresponde con la Web en la que aparecen las primeras técnicas para permitir la inclusión de contenido dinámico, se puede decir que es la Web que hoy por hoy está más extendida y es la que se utiliza más comúnmente.

• Las páginas Web son generadas por alguna tecnologías para la generación de contenido dinámico (CGIs, ASP, ASP.NET, JSP o PHP, entre otros), permiten la interacción con el usuario en un nivel en donde éste, puede hacer preguntas y el sistema responder.

2ª Generación o Generación de Contenido Dinámico o Interactivo



• Es el modelo que se está imponiendo poco a poco, y que haciendo uso de las capacidades adquiridas en la generación anterior, permite que la experiencia del usuario con la Web mejore espectacularmente.

• En esta generación, las aplicaciones van más allá de la mera interacción entre aplicación-usuario-aplicación, ahora son el mecanismo que permiten que se produzca interacción entre usuario-usuario llegando a crearse un entorno de contenido colaborativo, en donde, el usuario es un participante más en la creación del contenido que aparece en la web..




Ideas como los wikis, los blogs, etc. han cambiado la forma en la que el usuario interactúa con la web haciendo de esta un lugar mucho más rico e interesante para trabajar.

Estas ideas se engloban en algo mucho más amplio y que se denomina Web 2.0.




La Web actual es el resultado de los continuos esfuerzos de una comunidad web abierta que ayuda a definir estas tecnologías web, tales como HTML5, CSS3 y WebGL, y garantiza que todos los navegadores web las admitan..



Evolución de la Web3ª Generación o Generación de

Contenido Colaborativo


Conceptualización de la Web

• En informática, es el nombre que recibe el texto que en la pantalla de un dispositivo electrónico, permite conducir a otros textos relacionados, pulsando con el ratón en ciertas zonas sensibles y destacadas

Hipertexto



• Término que hace referencia al conjunto de métodos para escribir, diseñar, o componer contenidos que tengan texto, video, audio, mapas, etc, y que poseen interactividad con los usuarios.

Hipermedio



World Wide Web (o la "Web") o Red Global Mundial es un sistema de documentos de hipertexto y/o hipermedios enlazados y accesibles a través de Internet. Con un navegador Web, un usuario visualiza páginas web que pueden contener texto, imágenes, vídeos u otros contenidos multimedia, y navega a través de ellas usando hiperenlaces.

¿Qué es la www?



El protocolo de transferencia de hipertexto (HTTP, HyperText Transfer Protocol) es el protocolo usado en cada transacción de la Web (WWW).

HTTP define la sintaxis y la semántica que utilizan los elementos software de la arquitectura web (clientes, servidores, proxies) para comunicarse.

Es un protocolo orientado a transacciones y sigue el esquema petición-respuesta entre un cliente y un servidor.

Al cliente que efectúa la petición (un navegador) se lo conoce como "user agent" (agente del usuario). A la información transmitida se la llama recurso y se la identifica mediante un URL.

¿Qué es http?



Acrónimo de Uniform Resource Locator (Localizador Uniforme de Recursos /Identificador Uniforme de Recursos). Sistema unificado de identificación de recursos en la red. Es el modo estándar de proporcionar la dirección de cualquier recurso en Internet.

¿Qué es URL?

Dirección Única

Combina nombre de servidor, archivo y protocolo

http://www.google.com

.ec



Una página web es una fuente de información adaptada para la World Wide Web (WWW) y accesible mediante un navegador de Internet.

Esta información se presenta generalmente en formato HTML y puede contener hiperenlaces a otras páginas web, constituyendo la red enlazada de la World Wide Web.

¿Qué es una página web?

http://es.wikipedia.org/wiki/World_Wide_Web

http://es.wikipedia.org/wiki/World_Wide_Web


Conceptualización de la Web¿Cuáles son los tipos de páginas web?

Se conoce con el nombre de página web dinámica a aquélla, cuyo contenido se genera a partir de lo que un usuario introduce en un web o formulario.El contenido de la página no está incluido en un archivo html como en el caso de las páginas web estáticas.

Se conoce con el nombre de página web dinámica a aquélla, cuyo contenido se genera a partir de lo que un usuario introduce en un web o formulario.El contenido de la página no está incluido en un archivo html como en el caso de las páginas web estáticas.

DinámicasDinámicas


Conceptualización de la Web¿Cuáles son los tipos de páginas web?Los sitios Web

estáticos son aquellos sitios enfocados principalmente a mostrar una información permanente, donde el navegante se limita a obtener dicha información, sin que pueda interactuar con la página Web visitada.

Los sitios Web estáticos son aquellos sitios enfocados principalmente a mostrar una información permanente, donde el navegante se limita a obtener dicha información, sin que pueda interactuar con la página Web visitada.

EstáticasEstáticas



• Un sitio web es una colección de páginas web relacionadas entre sí.

• El conjunto de páginas web que forman un sitio web suelen compartir la primera parte de la dirección web (el dominio).

¿Qué es un Sitio Web?

http://es.wikipedia.org: Sitio web de la wikipedia en Español


Conceptualización de la Web¿Tipos de sitios web?

• Web corporativas de empresas

• Blogs, redes sociales• Páginas personales• Buscadores• Sitios de noticias• Enciclopedias


Conceptualización de la WebAplicación web

• Una aplicación web es aquella aplicación que los usuarios pueden utilizar accediendo a un servidor web a través de Internet mediante un navegador.

• Es una aplicación software que se implementa para que su interfaz de usuario se utilice desde un navegador web.

• Las aplicaciones web son muy populares• El navegador web como cliente ligero.• Independencia del sistema operativo.• Facilidad para actualizar y mantener

aplicaciones web sin distribuir e instalar software a miles de usuarios potenciales.


Conceptualización de la WebAplicación web

La web sigue una arquitectura cliente-servidor.

• El navegador web actúa como cliente.• El servidor web actúa como servidor.• La comunicación se establece usando

el protocolo http.


Aplicaciones WebUn servidor web

Software • Alberga sitios web estáticos y los sirve

con el protocolo http a los navegadores web.

• Ejecuta aplicaciones web que el usuario utiliza desde un navegador web (usando http).

Hardware • Servidor en el que se ejecuta el software

de servidor web. • Generalmente dispone de otros servicios

adicionales como un sistema gestor de base de datos.


Aplicaciones WebServidor web

• Un servidor web básico sirve por http los ficheros que están en el disco duro.

• Puede servir cualquier tipo de fichero, aunque lo habitual son los ficheros que un navegador reconoce (html, jpg, png, pdf…).

• Cuando recibe una petición, devuelve el fichero del disco duro que se ajuste a la ruta indicada en la URLs.



• La mayoría de los servidores web permiten que en cada petición se ejecute un pequeño programa que genera dinámicamente el recurso que se envía al usuario (server-side scripting).

• A este contenido generado “al vuelo” se le denomina contenido dinámico, en contraposición al contenido estático obtenido del disco duro.

• Es bastante habitual que el contenido dinámico se genere con la información de una base de datos.



• Los servidores web con contenido dinámico no sólo envían recursos al navegador, también pueden procesar información que les llega del mismo.• Datos contenidos en formularios web.• Ficheros enviados desde el navegador.• Información codificada en los links que

pulsan los usuarios (URL).

• Esta funcionalidad permite el desarrollo de completas aplicaciones web.


Aplicaciones WebServidores web• Apache.• Desarrollado por la Apache Software

Fundation con licencia software libre Apache License.

• Multiplataforma.

• Microsoft Internet Information Services (IIS).• Es un producto propietario de Microsoft

integrado en su sistema operativo Windows y su base de datos MS SQL Server.


Aplicaciones WebServidores web


Aplicaciones WebProgramación del lado del servidor• Server-side scripting se puede traducir por

“Programación del lado del servidor”.• Esta técnica se inventó en 1995 por Fred

DuFresne mientras hacía la página de la televisión de Boston.

• La tecnología que conectaba el servidor web con un programa para generar las páginas web se denominada CGI (Common Gateway Interface).

• Los programas, llamados CGIs, se ejecutaban completamente en cada petición http que se hacía al servidor.

• Estos programas estaban implementados en lenguajes como C o scripts de Perl, Shell y PHP.


Aplicaciones Web

Programación del lado del servidor

• Debido a los problemas de rendimiento con los CGIs surgieron nuevos mecanismos para la programación del lado del servidor.

• Se empiezan a desarrollar técnicas para incluir las aplicaciones dentro de los servidores (módulos de Apache, etc…).

• Existen muchas tecnologías para la programación del lado del servidor. Las más conocidas son Java EE, PHP, ASP.NET, Ruby on Rails, Django, Node.js…


Aplicaciones Web

Programación del lado del servidor


Aplicaciones Web

Aplicaciones de Internet en dispositivos móviles• Existen varios tipos de dispositivos móviles,

pero los más populares son los teléfonos móviles y las tabletas.

• Estos dispositivos suelen disponer de navegadores web completos, por lo que pueden acceder a cualquier aplicación web.

• Debido a sus características (pequeña pantalla y control táctil) es recomendable que exista una versión adaptada de la aplicación web.


Aplicaciones Web

Responsive web design

• Traducido como “Diseño web adaptable”.

• Técnicas y herramientas que permiten que los elementos de la web se adapten al tamaño del dispositivo y su forma de interacción.

• Algunos autores indican que incluso el contenido tiene que ser diferente porque el usuario tiene intenciones diferentes cuando accede a una web desde el móvil o desde el PC.


Aplicaciones Web

Responsive web design


Aplicaciones Web

Modelo MVC

Gracias

Introducción a la web

Technology

Transcript of Introducción a la web