luis olsina dr. luis olsina internet servicios internet arquitectura tecnologías webcontenidos...
TRANSCRIPT
Dr. Luis Olsina Luis Olsina• Internet• Servicios Internet• Arquitectura• Tecnologías Web
Contenidos Contenidos Parte IParte I
GIDIS_Web, Facultad de Ingeniería, GIDIS_Web, Facultad de Ingeniería,
UNLPam, La Pampa - ArgentinaUNLPam, La Pampa - Argentina
TE 02302 430497 Ext. 6501TE 02302 430497 Ext. 6501
E-mail E-mail [email protected]@ing.unlpam.edu.ar© 2007 GIDIS_Web© 2007 GIDIS_Web
Ingeniería Web: Ingeniería Web: Marco de Marco de
Medición y Evaluación de CalidadMedición y Evaluación de Calidad
Curso de Posgrado Universidad Nacional de San Luis / La Rioja / Catamarca
EsquemaEsquema
• Introducción a InternetIntroducción a Internet• Servicios InternetServicios Internet• ArquitecturaArquitectura• Tecnologías WebTecnologías Web
InternetInternet
InternetInternet es un inmenso conjunto de es un inmenso conjunto de redes de redes de computadoras y otros dispositivoscomputadoras y otros dispositivos, que se , que se encuentran interconectadas entre sí, dando lugar a encuentran interconectadas entre sí, dando lugar a la mayor la mayor red integradared integrada de alcance mundial. de alcance mundial.
– Internet MóvilInternet Móvil– Aplicaciones con IU comúnAplicaciones con IU común
Proporciona recursos informáticos distribuidos para Proporciona recursos informáticos distribuidos para procesos de entrega/recuperación de datos, procesos de entrega/recuperación de datos, información y servicios en forma información y servicios en forma semi-estructuradasemi-estructurada y y estructuradaestructurada..
– Procesamiento de Información?Procesamiento de Información?
En evolución constante y crecimiento exponencial.En evolución constante y crecimiento exponencial.
InternetInternet Comparación respecto de la Comparación respecto de la Velocidad de Velocidad de
AdopciónAdopción con Otras Tecnologías con Otras Tecnologías
Años para alcanzar 50 M de usuarios::
Radio
Radio = 38
TV
TV = 13
Cable
Cable = 10
Internet/Web
Internet/Web = 5
0
30
60
90
120
‘22 ‘30 ‘38 ‘46 ‘54 ‘62 ‘70 ‘78 ‘86 ‘94 ‘02
Usu
ario
s (M
illon
es)
InternetInternet
AlgunasAlgunas características de características de Internet Internet desde el desde el punto de vista de infraestructurapunto de vista de infraestructura::
Constituye un Sistema Universal de comunicacionesConstituye un Sistema Universal de comunicacionesAdmite todo tipo de equipos (supercomputadoras, PCs, Admite todo tipo de equipos (supercomputadoras, PCs,
PDAs, celulares, etc.) de todo tipo de fabricantesPDAs, celulares, etc.) de todo tipo de fabricantesAdmite todo tipo de redes en cuanto: Admite todo tipo de redes en cuanto:
– a su alcance (locales o LAN, metropolitanas o MAN, extendidas a su alcance (locales o LAN, metropolitanas o MAN, extendidas o WAN); o WAN);
– tecnologías (protocolos) de red soportadas por TCP/IP tecnologías (protocolos) de red soportadas por TCP/IP (Ethernet, FDDI, ATM, Wireless etc.) ; (Ethernet, FDDI, ATM, Wireless etc.) ;
– medios físicos de transmisión (cables de cobre, fibra óptica, medios físicos de transmisión (cables de cobre, fibra óptica, ondas de radio, satélites, etc.)ondas de radio, satélites, etc.)
InternetInternet
Algunas características de Internet desde el Algunas características de Internet desde el punto de vista de las aplicaciones :punto de vista de las aplicaciones :
Es única en cuanto a múltiples serviciosEs única en cuanto a múltiples servicios– E-mail, FTP, Web, Chat, etc.E-mail, FTP, Web, Chat, etc.
Acceso público, generalmente anónimoAcceso público, generalmente anónimoAcceso privado (Intranet, Extranet, Internet)Acceso privado (Intranet, Extranet, Internet)Número ilimitado/limitado de usuarios Número ilimitado/limitado de usuarios Requerimientos de seguridad variados. Por ej., WebRequerimientos de seguridad variados. Por ej., Web
– Sitio Informativo – bajoSitio Informativo – bajo– Transacción de E-commerce -muy altosTransacción de E-commerce -muy altos
EsquemaEsquema
• Introducción a InternetIntroducción a Internet• Servicios InternetServicios Internet• ArquitecturaArquitectura• Tecnologías WebTecnologías Web
Servicios de InternetServicios de Internet
Servicios Básicos, Aplicaciones InternetServicios Básicos, Aplicaciones Internet Correo Electrónico (E-mail)Correo Electrónico (E-mail)Transferencia de Archivos (FTP - File Transfer Protocol )Transferencia de Archivos (FTP - File Transfer Protocol )World Wide Web (WWW o Web)World Wide Web (WWW o Web)Grupos de Noticias (Newsgroup)Grupos de Noticias (Newsgroup)Comunicación sincrónica y/o en tiempo real (IRC, ICQ, Comunicación sincrónica y/o en tiempo real (IRC, ICQ,
Video conferencia, Internet Phone -VoIP, etc.)Video conferencia, Internet Phone -VoIP, etc.)
Servicios de Internet: WebServicios de Internet: Web
Sitio Web:Sitio Web:Conjunto de páginas que se acceden a través Conjunto de páginas que se acceden a través
de un navegador Web. Puede contener textos, de un navegador Web. Puede contener textos, imágenes, sonidos, animaciones,..., y enlaces.imágenes, sonidos, animaciones,..., y enlaces.
Enlaces:Enlaces:Enlaza a páginas o partes de la misma, etc.Enlaza a páginas o partes de la misma, etc.
URL Pág. 2 Pág.1: FuentePág. 2: Destino
Enlace: Puede estar entreel textos, imágenes enlazadas,...
URL Pág. 1
Servicios de Internet: WebServicios de Internet: Web
Localizador Universal de Recursos Localizador Universal de Recursos (URL, (URL, Uniform Resource LocatorUniform Resource Locator)) Un URL permite ubicar la información o recursos Un URL permite ubicar la información o recursos
contenidos en un servidor.contenidos en un servidor. Un URL contiene una descripción completa de la Un URL contiene una descripción completa de la
ubicación de recursos dentro de los servidores.ubicación de recursos dentro de los servidores.Ejemplo de URL para la Web: Ejemplo de URL para la Web:
http://www.clarin.com/diario/2004/08/19/index_diario.htmlhttp://www.clarin.com/diario/2004/08/19/index_diario.html
Protocolo Dirección Web:IP o nombre
lógico
Directorios internos, documento
Estructuras Lógicas de un SitioEstructuras Lógicas de un Sitio
Jerárquica
Secuencial
Malla
URL base
Tipos de EnlacesTipos de Enlaces Enlaces (Enlaces (por su Funciónpor su Función))
Estructurales, Estructurales, – Navegacionales.Navegacionales.
Semánticos, Semánticos, – AsociativosAsociativos
Orientados a la AcciónOrientados a la Acción
Enlaces (Enlaces (por su Alcancepor su Alcance)) Internos, ExternosInternos, Externos
Enlaces (Enlaces (por su Tipo de Mediapor su Tipo de Media)) Textual, Gráfico, Mapa de ImagenTextual, Gráfico, Mapa de Imagen
... ... por su Generaciónpor su Generación Estáticos, DinámicosEstáticos, Dinámicos
(Pensar en tipos de páginas)(Pensar en tipos de páginas)
EsquemaEsquema
• Introducción a InternetIntroducción a Internet• Servicios InternetServicios Internet• ArquitecturaArquitectura• Tecnologías WebTecnologías Web
Internet y su InfraestructuraInternet y su Infraestructura
Caracterizado por una arquitectura Caracterizado por una arquitectura cliente-servidorcliente-servidor donde el servidor procesa y los clientes son múltiples, donde el servidor procesa y los clientes son múltiples, relativamente anónimos y por lo general de naturaleza relativamente anónimos y por lo general de naturaleza heterogénea (en cuanto a Sistemas Operativos, Sw heterogénea (en cuanto a Sistemas Operativos, Sw cliente, Hw servidor, …)cliente, Hw servidor, …)
Desde el punto de vista de Arquitectura de Sistemas (Sw) tres Desde el punto de vista de Arquitectura de Sistemas (Sw) tres componenetes básicos: componenetes básicos: el clienteel cliente, , el servidorel servidor, , la persistencia la persistencia (datos)(datos)
Y el soporte tecnológico de Y el soporte tecnológico de Infraestructura de RedesInfraestructura de Redes, que , que implica capas de red, protocolosimplica capas de red, protocolos y aplicaciones y aplicaciones disponibles en disponibles en Internet: Internet:
– Protocolo Protocolo TCP/IPTCP/IP,, HTTP HTTP yy Web Web
Arquitectura Cliente/ServidorArquitectura Cliente/Servidor
El cliente es el que inicia generalmente la El cliente es el que inicia generalmente la comunicación.comunicación.
El servidor es el que está siempre activo, El servidor es el que está siempre activo, esperando peticiones de servicio/conexión por esperando peticiones de servicio/conexión por parte de los clientes.parte de los clientes.
Se habla de Arquitectura de Sw en Capas:Se habla de Arquitectura de Sw en Capas:
Presentación (Clientes)Presentación (Clientes) Lógica de Negocio (Servidor)Lógica de Negocio (Servidor) Persistencia (Datos, Bases de Datos)Persistencia (Datos, Bases de Datos)
Arquitectura Cliente/ServidorArquitectura Cliente/Servidor
Evolución de las Arquitecturas Sistemas InformáticosEvolución de las Arquitecturas Sistemas Informáticos
Datos
Sistemas Monolíticos
BD
Negocio
Presentación
C/S 3 Capas
Datos
Negocio
Presentación
BD
Cliente Web
InternetTCP/IP
HTML yForms
Navegador Web Servidor Web
Páginas HTML
AppsCGI
HTTP HTTPDBMS
Cliente Web
HTML, Java
RMI
RMI
AppsObjetos deNegocios
Navegador Web
Arquitectura Cliente/ServidorArquitectura Cliente/Servidor
Arquitectura e Infraestructura de RedArquitectura e Infraestructura de Red
EsquemaEsquema
• Introducción a InternetIntroducción a Internet• Servicios InternetServicios Internet• ArquitecturaArquitectura• Tecnologías WebTecnologías Web
Cliente Web
HTTPTCP/IP
HTML
Navegador Web Servidor Web
Páginas HTML
DBMS
Cliente Web
Arquitectura y Tecnologías para la WebArquitectura y Tecnologías para la Web
Internet: Tecnologías WebInternet: Tecnologías Web
NavegadoresNavegadores ( (BrowsersBrowsers): Son aplicaciones cliente ): Son aplicaciones cliente que permiten acceder a que permiten acceder a servidores Webservidores Web, recuperar y , recuperar y visualizar páginas, habilitando así al usuario para la visualizar páginas, habilitando así al usuario para la navegación y búsqueda en el Web. navegación y búsqueda en el Web.
Ejemplos de navegadores:Ejemplos de navegadores: Netscape Communicator, Netscape Communicator, Internet Explorer, Internet Explorer, Opera, Opera, otros.otros.
Internet: Tecnologías WebInternet: Tecnologías Web
Los Navegadores como clientes WebLos Navegadores como clientes Web
Los Navegadores como clientes WebLos Navegadores como clientes Web Los Los navegadoresnavegadores presentan la información en el presentan la información en el formato formato
hipertextohipertexto y pueden soportar varios protocolos. Además y pueden soportar varios protocolos. Además de http, los protocolos ftp, nntp, file, etc.de http, los protocolos ftp, nntp, file, etc.
Para localizar un documento en el sistema de información Para localizar un documento en el sistema de información universal se utiliza el universal se utiliza el URL URL (Uniform Resource Locator).(Uniform Resource Locator). Sintaxis:Sintaxis:
esquema://dominio_servidor[:puerto]/ruta/fichero[#etiqueta]esquema://dominio_servidor[:puerto]/ruta/fichero[#etiqueta]Ej. Ej. httphttp://://www.ing.unlpam.edu.arwww.ing.unlpam.edu.ar//index.htmlindex.html
donde esquema puede ser http, file, ftp, etc. y el dominio donde esquema puede ser http, file, ftp, etc. y el dominio del servidor puede venir especificado por una dirección IP o del servidor puede venir especificado por una dirección IP o un DNSun DNS
Internet: Tecnologías WebInternet: Tecnologías Web
Servidor Web (Web Server):Servidor Web (Web Server):
Es un software de gestión de páginas (existe el hw en el que Es un software de gestión de páginas (existe el hw en el que se encuentran almacenadas las mismas). se encuentran almacenadas las mismas).
Se encarga de administrar el acceso a ellas respondiendo Se encarga de administrar el acceso a ellas respondiendo ante solicitudes del cliente por medio del navegador.ante solicitudes del cliente por medio del navegador.
Cliente WebServidor de Web
Página WebHTML, ...
Internet: TecnologíasWebInternet: TecnologíasWeb
HTTP
12
HTTP HTTP (HyperText Transfer Protocol)(HyperText Transfer Protocol):: Protocolo que Protocolo que permite la interacción: 1) entre servidores y un programa permite la interacción: 1) entre servidores y un programa cliente Web (1) entre servidores Web; con el objetivo de cliente Web (1) entre servidores Web; con el objetivo de intercambiar documentos hipermediales intercambiar documentos hipermediales básicamente en formato HTML. básicamente en formato HTML.
HTTP es un paradigma solicitud/respuesta entre cliente y HTTP es un paradigma solicitud/respuesta entre cliente y servidor Web.servidor Web.
El El protocolo de comunicación HTTPprotocolo de comunicación HTTP es un protocolo de es un protocolo de comunicación entre clientes y servidores Web a nivel de comunicación entre clientes y servidores Web a nivel de aplicación TCP/IP (niveles 4)aplicación TCP/IP (niveles 4)
Internet: TecnologíasWebInternet: TecnologíasWeb
Protocolo HTTP:Protocolo HTTP:
Internet: TecnologíasWebInternet: TecnologíasWeb
HTTP Status Codes: HTTP Status Codes: Algunos mensajes de Error
• 401 Unauthorized (requires authorization)
• 404 Can Not Found the URL requested
• 410 Can Not Found the URL requested and there is no forwarding info
• 500 Internal Server Error
• 503 Service Unavailable, cause server is too busy
Codificación:Codificación:Las páginas son especificadas haciendo uso del Las páginas son especificadas haciendo uso del
lenguaje lenguaje HTMLHTML (HyperText Markup Language)(HyperText Markup Language). . HTML es un lenguaje estándar para la HTML es un lenguaje estándar para la
codificación de documentos hipermediales.codificación de documentos hipermediales.HTML es texto ASCIIHTML es texto ASCIIAl igual que XML, derivan del SGML Al igual que XML, derivan del SGML (Standard (Standard
Generalized Markup Language)Generalized Markup Language)
Internet: TecnologíasWebInternet: TecnologíasWebImplementación de Páginas Web:Implementación de Páginas Web:
HTMLHTML (HyperText Markup Language)(HyperText Markup Language). . No es un lenguaje de programación sino de No es un lenguaje de programación sino de
codificación codificación Describe el contenido de un documento y de Describe el contenido de un documento y de
algún modo el formato de la página y su algún modo el formato de la página y su aparienciaapariencia
La representación de la página puede depender La representación de la página puede depender del navegador utilizado, de su versión y de los del navegador utilizado, de su versión y de los módulos de extensión instalados (módulos de extensión instalados (plug-insplug-ins).).
Internet: TecnologíasWebInternet: TecnologíasWebImplementación de Páginas Web:Implementación de Páginas Web:
Tecnología Web: Lenguaje HTMLTecnología Web: Lenguaje HTML
HTML (Hypertext Markup Language)HTML (Hypertext Markup Language) Consta de un conjunto de elementos, denominados Consta de un conjunto de elementos, denominados
etiquetas o marcas, que se utilizan par incluir texto, etiquetas o marcas, que se utilizan par incluir texto, imágenes, tablas, etc.imágenes, tablas, etc.
La mayoría de las etiquetas se desdoblan en dos una de La mayoría de las etiquetas se desdoblan en dos una de comienzo y una de fin. Y un conjunto de atributoscomienzo y una de fin. Y un conjunto de atributos
– <ETQ1><ETQ1> xxxxxxxxx xxxxxxxxx </ETQ1></ETQ1>– <ETQ1<ETQ1 atributo1atributo1=“valor1” =“valor1” atributo2atributo2=“valor2”...=“valor2”...>>
La última versión es HTML 4 aprobada por el W3C La última versión es HTML 4 aprobada por el W3C (World Wide Web Consortium) (World Wide Web Consortium) www.w3cwww.w3c..orgorg
Estructura de una página WebEstructura de una página Web<HTML> <HEAD> Información de la cabecera de la página </HEAD> <BODY> Información del cuerpo de una página </BODY></HTML>
Existe una etiqueta que no se incluye en la cabecera ni en el Existe una etiqueta que no se incluye en la cabecera ni en el
cuerpo cuerpo <!DOCTYPE><!DOCTYPE>
Ejemplo: <!DOCTYPE HTML PUBLIC “.//W3C//DTD HTML 4.0//EN”>
Tecnología Web: Lenguaje HTMLTecnología Web: Lenguaje HTML
<HTML><HTML>
<HEAD><HEAD>
<TITLE>Ejemplo de texto sin formato</TITLE><TITLE>Ejemplo de texto sin formato</TITLE>
</HEAD></HEAD>
<BODY><BODY>
El número de blancos que se incluyan El número de blancos que se incluyan
en una página HTML y los cambios de en una página HTML y los cambios de
línea se interpretan como un único blanco. línea se interpretan como un único blanco.
El navegador determina dónde debe El navegador determina dónde debe
incorporar los cambios de línea.incorporar los cambios de línea.
</BODY></BODY>
</HTML></HTML>
Ref. pt_texto12.html
Tecnología Web: Lenguaje HTMLTecnología Web: Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Elementos de la Cabecera (Head)Elementos de la Cabecera (Head) <TITLE><TITLE>
– Título de la página que aparecerá en los Título de la página que aparecerá en los navegadores.navegadores.
– Los buscadores lo utilizan para clasificar las páginas.Los buscadores lo utilizan para clasificar las páginas.
<META><META>– Sirve para incluir información sobre:Sirve para incluir información sobre:
» el autor de la página, el autor de la página, » nombre del editor de HTML,nombre del editor de HTML,» una descripción breve de la página, etc.una descripción breve de la página, etc.
Al mismo documentoAl mismo documento<A<A namename = “nombre” = “nombre”>> Texto…. Texto….</A> </A> <A<A hrefhref = “#nombre” = “#nombre”>> Texto del enlace Texto del enlace </A></A>
A otros documentoA otros documento<A<A hrefhref = destino = destino>> Texto del enlace Texto del enlace </A></A>
A contenidos especialesA contenidos especiales<A<A hrefhref = “archivo.ps” = “archivo.ps”>> Enlace a un archivo postcript Enlace a un archivo postcript</A></A><A<A hrefhref = “mailto:usuario1@direccion” = “mailto:usuario1@direccion”>> Enviar un email al Enviar un email al
usuario1usuario1</A></A>
Ref. H*.html
Lenguaje HTMLLenguaje HTML HiperenlacesHiperenlaces
Lenguaje HTMLLenguaje HTML ImágenesImágenes
ImágenesImágenes<IMG<IMG SRCSRC=“foto.gif”=“foto.gif”
ALIGNALIGN=“top | bottom | middle” =“top | bottom | middle”
LOWSRCLOWSRC=“fotobw.gif” =“fotobw.gif”
HSPACEHSPACE=x=x
VSPACEVSPACE=Y=Y
WIDTHWIDTH=120 =120 HEIGHTHEIGHT=200 =200
ALTALT=“Texto alternativo” =“Texto alternativo”
TITLETITLE=“Descripción”=“Descripción”>>
Tecnologías de Programación/Especificación del lado del Tecnologías de Programación/Especificación del lado del clientecliente DHTMLDHTML JavaScriptJavaScript CSS CSS Applets de Java – ActiveX de MicrosoftApplets de Java – ActiveX de Microsoft
Tecnologías del lado del el servidorTecnologías del lado del el servidor CGICGI
– C, Perl, etc.C, Perl, etc. JAVA (JSP y Servlets)JAVA (JSP y Servlets) ASP de ASP de MicrosoftMicrosoft PhP3PhP3
Tecnologías Web: Tecnologías Web: más allá del HTMLmás allá del HTML
Páginas Web Generadas Estática y DinámicamentePáginas Web Generadas Estática y Dinámicamente