2023 UNIVERSIDAD RICARDO PALMA

Segunda Especialidad en Didáctica Universitaria

UNIDAD I Diseño Multimedia

De la Era PC a la Web 4.0

Ing. Jofré Hidalgo Alvarez

jofre.hidalgo@urp.edu.pe
 01 Introducción

02 Multimedia e Hipermedia

Tabla de 03 Niveles de Interactividad y Mapas de Navegación

Contenidos
04 Uso de Metáforas del Mundo Real

Sistemas de gestión de contenidos Online

05
De la Era PC a la Web 4.0
H i s t o r i a d e l a Te c n o l o g í a
¿Qué es la tecnología?
Es la aplicación de conocimientos para a la resolución de los problemas del ser
humano.
Esto significa: Crear, diseñar y mejorar bienes o servicios para facilitar la
adaptación de la especie al medio ambiente y satisfacer sus necesidades
(físicas, sociales, culturales).

… 1958

1958
H i s t o r i a d e l a Te c n o l o g í a

… “Era PC”, se dio el inicio de una revolución

tecnológica que permitió la creación de nuevas
formas de procesamiento de información y
comunicación

…
EN 1982, ARPANET adoptó el protocolo TCP/IP y en aquel
momento se creó Internet (International Net)
H i s t o r i a d e l a Te c n o l o g í a
 WEB

 World Wide Web: (también conocida como "la Web“, W3 o WWW), es

un sistema de distribución de documentos, interconectado a través de
enlaces de hipertexto y accesible vía Internet.

 Página Web: Es un documento o fuente de información,

generalmente en formato HTML, que puede contener enlaces a otras
páginas web. Podrá ser accesible desde un dispositivo computacional
a través de un software llamado navegador.

 Sitio Web: Es un conjunto de páginas web, típicamente comunes a un

dominio o subdominio en la World Wide Web.

 Servidor Web: Es un programa informático que procesa una

aplicación del lado del servidor, realizando conexiones bidireccionales
y/o unidireccionales (síncronas o asíncronas) con el cliente,
generando o cediendo una respuesta en cualquier lenguaje o
Aplicación del lado del cliente.
 WEB

 Dominio Web: Es el nombre que identifica a un sitio web,

tiene que ser único en Internet y apuntar solo a un servidor.

 Por ejemplo, "www.cocacola.com" es el nombre de dominio

de la página web de CocaCola.

 Un dominio se compone normalmente de tres partes, por

ejemplo: En www.cocacola.com, tenemos que www indica el
protocolo de comunicación por red de datos, CocaCola
indica el nombre de la organización y .com el tipo de
organización.

 Los tipos de organización más comunes

son .COM, .NET, .MIL, .EDU y .ORG, que se refieren a
comercial, network, militar, educativo y organización.
 WEB

Dominios temáticos: Dominios de países:

.com Empresas comerciales .es España
.edu Entidades educativas .co Colombia
.org Organizaciones sin ánimo de lucro .pt Portugal
.net Redes y proveedores de servicios .ca Canadá
.gov Entidades gubernamentales .mx Méjico
.mil Organismos militares .us Estados Unidos
.int Entes internacionales
.biz Business (negocios)

Ejemplos de dominios:
amnesty.org Amnistía Internacional
greenpeace.org Greenpeace
eu.int Unión Europea
Enredando.com En.red.ando revista española sobre Internet
unsystem.org Sistema de Naciones Unidas
 WEB

 .com Comercial  .cl Chile

 .org Org. no comerciales  .de Alemania
 .net Recursos de red  .es España
 .edu Educación  .fr Francia
 .mil Militar  .uk Gran Bretaña
 .ar Argentina  .it Italia
 .be Bélgica  .jp Japón
 .br Brasil  .pe Perú
 .ca Canadá
 WEB

¿Cómo funciona la web?

Internet

Servidor Web
Cliente Web
(Chrome, Internet Explorer, Firefox, etc.)

Servidor de nombres
(DNS)
Multimedia e Hipermedia
Multimedia e Hipermedia
Multimedia e Hipermedia

Es un sistema que utiliza más de un medio

de comunicación al mismo tiempo en la
presentación de la información, como el
texto, la imagen, la animación, el vídeo y el
sonido.

Por ejemplo un libro acompañado de un

CD de música ya es una obra multimedia
Multimedia e Hipermedia

• El término hipermedia toma su nombre de la suma de hipertexto y

multimedia
• Un documento hipermedia es siempre un multimedia, pero no al revés.
• A menudo se utilizan indistintamente los términos hipermedia y
multimedia.
• La principal característica es que el usuario interactúa con el programa
haciendo que aprenda o interprete la información.
• Ejemplo: La World Wide Web, Plataformas de enseñanza online, etc.

Aspen Movie Map permite al usuario hacer un recorrido

virtual a través de la ciudad de Aspen, Colorado. Es un
ejemplo temprano de un sistema hipermedia.
Multimedia e Hipermedia
WEB 1.0

• La Web 1.0 empezó en los años 90's de la

forma más básica que existe, con navegadores
de sólo texto bastante rápidos como ELISA.
• Aparece el lenguaje HTML (Hyper Text Markup
Language), que hizo las páginas web más
agradables a la vista (colores, imágenes).
• Primeros navegadores visuales tales como
Internet Explorer y Netscape.
• La Web 1.0 es de sólo lectura. El usuario no
puede interactuar con el contenido de la página,
(nada de comentarios, respuestas, citas, etc.),
está totalmente limitado a lo que el Webmaster
sube a ésta.
 WEB 2.0
• Surgió a finales de la década de 1990,
teniendo como principal característica a su
capacidad para interactuar con los
usuarios, permitiendo la creación de
contenidos dinámicos, colaborativos y
personalizados.

• El término Web 2.0 comprende a aquellos

sitios web que facilitan el compartir
información, la interoperabilidad, el diseño
centrado en el usuario y la colaboración en
la World Wide Web.

Se refleja en aspectos como:

o El auge de los blogs y de las redes sociales.

o Las webs creadas por los usuarios, usando plataformas de auto-edición.
o El contenido agregado por los usuarios como valor clave de la Web.
o El etiquetado colectivo (marcadores sociales).
 WEB 3.0
La Web 3.0 es conocida como Web Semántica. Busca mejorar la organización de la
información para agilizar las búsquedas.

Características que la identifican:

 Inteligencia. La web aprende del resultado de las búsquedas para próximas operaciones.
 Sociabilidad. Crecen las redes sociales y el número de formas en que se conectan a sus
miembros.
 Rapidez. Las principales operadores de telecomunicaciones usan la fibra óptica hacia los
usuarios.
 Abierta. El software libre. La información se distribuye libremente por la web, impidiendo
que un solo dueño se apropie de ella.
 Ubicuidad. El alcance de las redes inalámbricas y de telefonía de última generación se
multiplica ampliando la cobertura de la red.
 Facilidad. Fácil de entender y reconocer, además de crear espacios que el usuario pueda
configurar a su gusto.
 Tridimensionalidad. Los espacios tridimensionales, en forma de mundos virtuales en
forma de juegos y tele presencialidad serán cada vez más habituales (Second Life).
WEB 3.0
WEB 4.0

• Actualmente se encuentra en una fase de pruebas, aún no

masificado.
• Incorpora tecnologías emergentes como la inteligencia artificial
avanzada, el internet de las cosas (IoT), la robótica, la realidad
virtual y aumentada, y la computación cuántica.
• Se centra en la creación de entornos inteligentes y autónomos,
donde los sistemas son capaces de tomar decisiones por sí
mismos y ofrecer una experiencia personalizada y optimizada al
usuario.
• Incorpora tecnologías de seguridad avanzadas y
descentralización para garantizar la privacidad y la seguridad de
los datos.
• Ejemplos: Sistemas de conducción autónoma, Sistemas de
asistencia médica basados en inteligencia artificial
Niveles de Interactividad en web
Niveles de Interactividad en web

Refiere al grado de interacción entre el usuario y el contenido en una página web:

Nivel de lectura: El usuario solo lee la información presentada en la página. No hay

ninguna forma de interacción con el contenido, y el usuario no puede realizar ninguna
acción en la página.

Nivel de navegación: El usuario tiene la capacidad de navegar por diferentes secciones

de la página web mediante el uso de enlaces. El usuario puede hacer clic en enlaces
para acceder a diferentes secciones o páginas de contenido relacionado.

Nivel de interacción limitada: El usuario tienen la capacidad de interactuar con el

contenido en la página web de una manera limitada. Por ejemplo, los usuarios pueden
hacer clic en botones para agregar elementos a un carrito de compras o completar un
formulario de contacto.

Nivel de interacción completa: Los usuarios tienen la capacidad de interactuar

completamente con el contenido en la página web. Los usuarios pueden realizar acciones
complejas, como reproducir videos, utilizar herramientas de edición y personalización, y
participar en juegos en línea.
Mapas de navegación web
Son una representación visual de las páginas que conforman un sitio web y la
información que contendrán. Sirven para representar la arquitectura de las páginas
de un sitio web.

Tienen como objetivo el de estructurar los contenidos antes de crear un sitio web y
que los usuarios encuentren de forma sencilla lo que están buscando.

dos tipos principales de mapas de navegación web: mapas de sitio y mapas de

navegación local
Uso de metáforas del mundo real
Uso de Metáforas del Mundo Real en la web

Las metáforas del mundo real son elementos que se utilizan en la web para hacer que la
experiencia del usuario sea más familiar e intuitiva, permiten que los usuarios estén más
cómodos con los conceptos que ya conocen en su vida diaria.
Ejemplos:

• Navegador: Un navegador web es como un vehículo que lleva al usuario a través de la web,
permitiéndole explorar diferentes sitios web.

• Buscador: Un buscador web es sistema que ayuda a encontrar lo que se está buscando en la
web.

• Correo electrónico: Análogo al correo postal en el mundo real.

• Tienda en línea: Es como una tienda en el mundo real, donde puedes comprar productos y
servicios a través de la web.

• Nube: La nube es una metáfora de una red de almacenamiento en el mundo real. Es un lugar
donde puedes almacenar y acceder a tus archivos y datos desde cualquier lugar en línea.

• Carrito de compras: La metáfora del carrito de compras se utiliza en muchos sitios web de
comercio electrónico.
Sistemas de Gestión de contenidos en línea
Sistema de gestión de contenido (CMS)

Un Sistema de gestión de contenidos o CMS (Content

Management System), es un software que permite crear y
administrar contenidos de un sitio web por parte de los
participantes, sin necesidad de que el gestor del contenido
conozca del lenguaje HTML para publicar todo tipo de
textos, imágenes, archivos, etc.
Sistema de gestión de contenido (CMS)

• Acceso a través de un navegador web o un cliente FTP

para subir contenido, normalmente fotografías o audio.
• Front-end y Back-end.
• Configurable.
• Niveles de acceso (administrador, editor, creador de
contenido, entre otros).
• Plantillas.
Sistema de gestión de contenido (CMS)
 Foros: sitio que permite la discusión en línea donde los usuarios pueden
reunirse y discutir temas en los que están interesados. Ejemplos: phpBB,
SMF, MyBB, bbPress.

 Blogs: Publicación de noticias o artículos en orden cronológico con espacio

para comentarios y discusión. Ejemplos: WordPress, Movable Type, Drupal,
Blogger.

 Wikis: Sitio web dónde todos los usuarios pueden colaborar en los artículos,
aportando información o reescribiéndola. También permite espacio para
discusiones. Indicado para material que irá evolucionando con el tiempo.
Ejemplos: MediaWiki, TikiWiki.

 Portal: Sitio web con contenido y funcionalidad diversa que sirve como
fuente de información o como soporte a una comunidad. Ejemplos: PHP-
Nuke, Joomla, Drupal, MS SharePoint.

 Galería: Permite administrar y generar automáticamente un portal o sitio web

que muestra contenido audiovisual, normalmente imágenes. Ejemplo:
Gallery.
Sistema de gestión de contenido (CMS)

Gestión de Portales
Sistema de gestión de contenido (CMS)

Blogs
 UNIVERSIDAD RICARDO PALMA
Gracias Segunda Especialidad en Didáctica Universitaria

Diseño Multimedia

Ing. Jofré Hidalgo Alvarez

jofre.hidalgo@urp.edu.pe