Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones

Introducción a la web

2016-02-10
Conceptos Fundamentales de la Web

W. Libardo Pantoja Y.
wpantoja@unicauca.edu.co

Facultad de Ingenierı́a Electrónica y Telecomunicaciones

Departamento de Sistemas
Universidad del Cauca

10 de febrero de 2016

Conceptos Fundamentales de la Web

W. Libardo Pantoja Y.
wpantoja@unicauca.edu.co

Facultad de Ingenierı́a Electrónica y Telecomunicaciones

Departamento de Sistemas
Universidad del Cauca

10 de febrero de 2016
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Tabla de contenido

2016-02-10
1 Preguntas preliminares

2 Los primeros sitios web

Tabla de contenido 3 Cómo funciona la web

Tabla de contenido 4

5
Protocolo HTTP/HTTPS

HTML

6 Sesiones

1 Preguntas preliminares

2 Los primeros sitios web

3 Cómo funciona la web

4 Protocolo HTTP/HTTPS

5 HTML

6 Sesiones
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Preguntas preliminares

2016-02-10
Preguntas preliminares
¿Qué es la web?

Preguntas preliminares ¿Cuál es la arquitectura básica de la web? Dibuje un esquema.

¿Qué diferencias existen entre Sitio Web y Aplicación web?
¿Qué son los hipertextos?

Preguntas preliminares ¿Para qué sirve el HTML, las CSS y el JavaScript?

¿Qué es la web?
¿Cuál es la arquitectura básica de la web? Dibuje un esquema.
¿Qué diferencias existen entre Sitio Web y Aplicación web?
¿Qué son los hipertextos?
¿Para qué sirve el HTML, las CSS y el JavaScript?
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Los primeros sitios web...

2016-02-10
Los primeros sitios web Las aplicaciones web han evolucionado a partir
de Sitios o Sistemas Web...

Los primeros sitios web... El primer sitio web, fue creado por Tim
Berners-Lee, y era un sistema de hipermedios
distribuido que permitı́a a los investigadores

Los primeros sitios web... Figura: Tim

Berners-Lee,
Director del
W3C, inventor
tener acceso directamente desde sus
computadores a documentos e información
publicados por otros investigadores.
de la WWW

Las aplicaciones web han evolucionado a partir

de Sitios o Sistemas Web...
El primer sitio web, fue creado por Tim
Berners-Lee, y era un sistema de hipermedios
distribuido que permitı́a a los investigadores
Figura: Tim tener acceso directamente desde sus
Berners-Lee, computadores a documentos e información
Director del
publicados por otros investigadores.
W3C, inventor
de la WWW
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web World wide-web

2016-02-10
Los primeros sitios web La World Wide-Web (abreviado Web; escrito también
WWW o incluso W3) significa algo ası́ como red (o
telaraña) global.

World wide-web
World wide-web El CERN lo define como un sistema hipermedia distribuido
(Boutell 1994). En principió se pensó como un medio para la
distribución de la información entre equipos de
investigadores geográficamente dispersos; concretamente se
dirigı́a a la comunidad de fı́sicos de altas energı́as vinculados
al CERN (Berners-Lee 1994).

La World Wide-Web (abreviado Web; escrito también

WWW o incluso W3) significa algo ası́ como red (o
telaraña) global.

El CERN lo define como un sistema hipermedia distribuido

(Boutell 1994). En principió se pensó como un medio para la
distribución de la información entre equipos de
investigadores geográficamente dispersos; concretamente se
dirigı́a a la comunidad de fı́sicos de altas energı́as vinculados
al CERN (Berners-Lee 1994).
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web ¿Como funciona la web?

2016-02-10
Cómo funciona la web La World Wide Web (Telaraña Mundial), la Web o WWW, es
un sistema de hipertexto que funciona sobre Internet.

¿Como funciona la web? Hipertexto es un documento digital que se puede leer de

manera no secuencial. Ciertos puntos del texto están unidos
con otros mediante relaciones (llamados enlaces, hiperenlaces

¿Como funciona la web? o links). En lugar de leer un texto en forma continua, como se
hace normalmente (por ejemplo en un libro), el hipertexto da
la posibilidad de cambiar el recorrido de la lectura al saltar de
un punto a otro del texto, de un tema a otro.

La World Wide Web (Telaraña Mundial), la Web o WWW, es

un sistema de hipertexto que funciona sobre Internet.
Hipertexto es un documento digital que se puede leer de
manera no secuencial. Ciertos puntos del texto están unidos
con otros mediante relaciones (llamados enlaces, hiperenlaces
o links). En lugar de leer un texto en forma continua, como se
hace normalmente (por ejemplo en un libro), el hipertexto da
la posibilidad de cambiar el recorrido de la lectura al saltar de
un punto a otro del texto, de un tema a otro.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Arquitectura básica

2016-02-10
Cómo funciona la web
Arquitectura básica
Arquitectura básica
Figura: Arquitectura de un sistema web básico

Figura: Arquitectura de un sistema web básico

 Diferencia Sitio Web y Aplicación Web

Diferencia Sitio Web y Aplicación Web Introducción a la web “Una aplicación Web es un sitio Web donde la navegación a

2016-02-10
través del sitio, y la entrada de datos por parte de un usuario,

Cómo funciona la web afectan elestado de la lógica del negocio”. En esencia, una
aplicación web usa un sitio Web como entrada (front-end) a
una aplicación tı́pica (back-end).

“Una aplicación Web es un sitio Web donde la navegación a Diferencia Sitio Web y Aplicación Web “...Si no existe lógica del negocio en el servidor, el sistema no
puede ser llamado aplicación Web.”[Conallen 99]
¿Es google (o cualquier search engine) un sitio Web o una
aplicación Web? ¿Qué pasa con un sitio Web como

través del sitio, y la entrada de datos por parte de un usuario, mercadolibre donde hay que registrase para comprar o vender
un producto?

afectan elestado de la lógica del negocio”. En esencia, una

aplicación web usa un sitio Web como entrada (front-end) a
una aplicación tı́pica (back-end).

“...Si no existe lógica del negocio en el servidor, el sistema no

puede ser llamado aplicación Web.”[Conallen 99]
¿Es google (o cualquier search engine) un sitio Web o una
aplicación Web? ¿Qué pasa con un sitio Web como
mercadolibre donde hay que registrase para comprar o vender
un producto?
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Protocolo HTTP

2016-02-10
HTTP (HyperText Transfer Protocol), es un protocolo

Protocolo HTTP/HTTPS especial que define exactamente cómo un navegador debe dar
formato y enviar una solicitud a un Servidor Web.
HTTP define la sintaxis y la semántica que utilizan los

Protocolo HTTP
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.
Protocolo HTTP HTTP es un protocolo sin estado (connectionless), es decir,
que no guarda ninguna información sobre conexiones
anteriores. Cookies.
HTTP corre sobre TCP (Transmisión Control Protocol).
La versión actual de HTTP es la 1.1, y su especificación está
en el documento RFC-2616.

HTTP (HyperText Transfer Protocol), es un protocolo

especial que define exactamente cómo un navegador debe dar 1. Al cliente que efectúa la petición (un navegador o un spider) se lo
formato y enviar una solicitud a un Servidor Web. conoce como üser agent”(agente del usuario). A la información
HTTP define la sintaxis y la semántica que utilizan los transmitida se la llama recurso y se la identifica mediante un
elementos software de la arquitectura web (clientes, URL(Uniform Resource Locator). Los recursos pueden ser archivos,
el resultado de la ejecución de un programa, una consulta a una
servidores, proxies) para comunicarse. Es un protocolo
base de datos, la traducción automática de un documento, etc.
orientado a transacciones y sigue el esquema 2. El desarrollo de aplicaciones web necesita frecuentemente mantener
petición-respuesta entre un cliente y un servidor. estado. Para esto se usan las cookies, que es información que un
HTTP es un protocolo sin estado (connectionless), es decir, servidor puede almacenar en el sistema cliente. Esto le permite a las
que no guarda ninguna información sobre conexiones aplicaciones web instituir la noción de ”sesión”, y también permite
rastrear usuarios ya que las cookies pueden guardarse en el cliente
anteriores. Cookies.
por tiempo indeterminado.
HTTP corre sobre TCP (Transmisión Control Protocol). 3. TCP es un protocolo de red de bajo nivel usado por internet y
La versión actual de HTTP es la 1.1, y su especificación está cualquier compañı́a de red, permite que los computadores se
en el documento RFC-2616. conecten e intercambien información. Es una implementación de
capas del Modelo de Referencia OSI (Open System
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Protocolo HTTPS

2016-02-10
Protocolo HTTP/HTTPS
El protocolo de red HTTPS es la versión segura del protocolo

Protocolo HTTPS HTTP. El sistema HTTPS utiliza un cifrado basado en las

Secure Socket Layers (SSL) para crear un canal cifrado (cuyo
nivel de cifrado depende del servidor remoto y del navegador

Protocolo HTTPS utilizado por el cliente) más apropiado para el tráfico de

información sensible que el protocolo HTTP.

1. Cabe mencionar que el uso del protocolo HTTPS no impide que se

pueda utilizar HTTP. Es aquı́, cuando nuestro navegador nos
El protocolo de red HTTPS es la versión segura del protocolo advertirá sobre la carga de elementos no seguros (HTTP), estando
conectados a un entorno seguro (HTTPS).
HTTP. El sistema HTTPS utiliza un cifrado basado en las
2. Es utilizado principalmente por entidades bancarias, tiendas en
Secure Socket Layers (SSL) para crear un canal cifrado (cuyo lı́nea, y cualquier tipo de servicio que requiera el envı́o de datos
nivel de cifrado depende del servidor remoto y del navegador personales o contraseñas.
utilizado por el cliente) más apropiado para el tráfico de
información sensible que el protocolo HTTP.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Hipertexto

2016-02-10
Protocolo HTTP/HTTPS El hipertexto es una tecnologı́a que organiza una
base de información en bloques distintos de

Hipertexto contenidos, conectados a través de una serie de

enlaces cuya activación o selección provoca la
recuperación de información [Dı́az et al, 1996]

Hipertexto Figura: Hipertexto

Los nodos contienen textos y si contienen
además gráficos, imágenes, audio, animaciones y
video, ası́ como código ejecutable u otra forma
de datos se les da el nombre de hipermedio, es
decir, una generalización de hipertexto.

El hipertexto es una tecnologı́a que organiza una

base de información en bloques distintos de
contenidos, conectados a través de una serie de
enlaces cuya activación o selección provoca la
recuperación de información [Dı́az et al, 1996]
Los nodos contienen textos y si contienen
además gráficos, imágenes, audio, animaciones y
Figura: Hipertexto video, ası́ como código ejecutable u otra forma
de datos se les da el nombre de hipermedio, es
decir, una generalización de hipertexto.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web HTML

2016-02-10
HTML HTML, sigla de HyperText Markup Language (Lenguaje de
Etiquetas de Hipertexto), es el lenguaje de marcado
predominante para la construcción de páginas web.

HTML Describir la estructura y el contenido en forma de texto, ası́

como para complementar el texto con objetos tales como
imágenes. HTML se escribe en forma de .etiquetas”, rodeadas

HTML por corchetes angulares (¡,¿).

Define la apariencia de una página web. Puede incluir
javascript para afectar el comportamiento de la página.
HTML es un lenguaje de etiquetas basado en SGML
(Standard Generalized Markup Language).

HTML, sigla de HyperText Markup Language (Lenguaje de 1. SGML es de proposito general, HTML es una aplicación especı́fica
Etiquetas de Hipertexto), es el lenguaje de marcado de SGML, adaptada a la presentación de documentos de texto
predominante para la construcción de páginas web.
Describir la estructura y el contenido en forma de texto, ası́
como para complementar el texto con objetos tales como
imágenes. HTML se escribe en forma de .etiquetas”, rodeadas
por corchetes angulares (¡,¿).
Define la apariencia de una página web. Puede incluir
javascript para afectar el comportamiento de la página.
HTML es un lenguaje de etiquetas basado en SGML
(Standard Generalized Markup Language).
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Cómo construir páginas web

2016-02-10
HTML
Las páginas HTML son documentos de texto que se

Cómo construir páginas web almacenan en el sistema de archivos del servidor web. Se creó
con la premisa: ”fácil de aprender”. Se puede utilizar editores
WYSYWYG.

Cómo construir páginas web En la actualidad se utilizan CSS (Cascading Style Sheets)
para separar contenido de presentación.

Las páginas HTML son documentos de texto que se

almacenan en el sistema de archivos del servidor web. Se creó
con la premisa: ”fácil de aprender”. Se puede utilizar editores
WYSYWYG.
En la actualidad se utilizan CSS (Cascading Style Sheets)
para separar contenido de presentación.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Sesiones

2016-02-10
Sesiones Una sesión es la secuencia de páginas que un usuario visita
en un sitio web, desde que entra en nuestro sitio, hasta que lo

Sesiones abandona.
El término sesión se aplica a esta secuencia de navegación,
para ello se crea un identificador único que se asigna a cada
Sesiones una de estas sesiones de navegación. A este identificador de
sesión se le denomina, comúnmente, como la sesión.

Una sesión es la secuencia de páginas que un usuario visita

en un sitio web, desde que entra en nuestro sitio, hasta que lo
abandona.
El término sesión se aplica a esta secuencia de navegación,
para ello se crea un identificador único que se asigna a cada
una de estas sesiones de navegación. A este identificador de
sesión se le denomina, comúnmente, como la sesión.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Sesiones

2016-02-10
Sesiones El proceso en cualquier lenguaje de programación podrı́a ser
algo ası́:
Iniciar sesión

Sesiones Existe una sesión?

Si existe la retomamos
Si no existe creamos una nueva

Sesiones Generar un identificador único

La administración de sesiones utiliza cookies, de esta forma,
se tiene en el servidor un diccionario que contiene el estado de
cada cliente.
Estas sesiones se borran para no llenar el servidor.

El proceso en cualquier lenguaje de programación podrı́a ser

algo ası́:
Iniciar sesión
Existe una sesión?
Si existe la retomamos
Si no existe creamos una nueva
Generar un identificador único
La administración de sesiones utiliza cookies, de esta forma,
se tiene en el servidor un diccionario que contiene el estado de
cada cliente.
Estas sesiones se borran para no llenar el servidor.
Preguntas preliminares Los primeros sitios web Cómo funciona la web Protocolo HTTP/HTTPS HTML Sesiones
Introducción a la web Bibliografı́a

2016-02-10
Sesiones
Bibliografı́a Building Web Applications with UML. Jim Conallen.
Wikipedia.

Bibliografı́a

Building Web Applications with UML. Jim Conallen.

Wikipedia.