Web20 Completo

Servicios Web 2.
0 ::: Introducción 414

Diseño de materiales multimedia. Web 2.0
5. Servicios Web 2.0

Servicios Web 2.0 ::: Introducción 415
5.1 Introducción
Servicios Web 2.0 ::: Introducción 416
5.1 Introducción
El término Web 2.0 fue utilizado por primera vez por la empresa editorial estadounidense
O’Reilly Media (2004) para referirse a una segunda generación de Web basada en las
comunidades de usuarios. Abarca un amplio catálogo de sitios y servicios web que incluyen las
redes sociales, los blogs, los wikis, la sindicación de noticias RSS, etc. Su propósito
fundamental es fomentar la colaboración y el intercambio ágil de información entre los
usuarios.
El principio fundamental de la Web 2.0 es que “Todo está en la web”. Esto significa que el
usuario solo necesita un navegador web para conectarse desde cualquier equipo o lugar e
interactuar con los sitios o aplicaciones donde publicar contenidos, recopilar información,
comunicarse con otros usuarios, etc.
El propósito de este capítulo no es tratar la Web 2.0 con la extensión y calidad que se
merece. Más bien se trata de ver cómo es posible integrar algunos de sus servicios en una
página de nuestro sitio web.
Internet es algo vivo y en constante cambio. Al hablar de servicios web puede ocurrir que
alguno de ellos no funcione exactamente como se explica en este documento porque hayan
cambiado recientemente en alguno de los detalles o capturas presentados.
Servicios Web 2.0 ::: Flickr: galería de fotografías 417
5.2 Flickr: galería de

fotografías
5.2 Flickr: galería de fotografías
5.2.1 Introducción
Flickr (http://www.flickr.com) es un espacio donde se puedes administrar y compartir tus

fotos en línea. Las características más destacadas de este servicio son:
 Subir fotos. Puedes hacerlo desde tu equipo, enviándolas por correo electrónico o
utilizando el teléfono móvil con su cámara.
 Organizar. Clasifica las fotos en colecciones o álbumes. A cada imagen se le puede
asignar una etiqueta para facilitar su búsqueda.
 Compartir. Utiliza grupos y controles de privacidad para compartir tus fotos.
 Mapas. Sobre un mapa de Google Maps se puede geolocalizar el lugar donde se tomó
cada foto y compartirlo con los demás.
 Publicaciones. Puedes elaborar tarjetas, albumes, marcos, etc utilizando las
imágenes subidas.
 Mantenerse en contacto. Para enviar y recibir información sobre las actualizaciones
de fotografías de familiares y amigos.
La exploración de todas las posibilidades de Flickr excede el propósito de este curso. Se

propone centrarse en la utilización de estas imágenes en línea en documentos web.
Para disponer de acceso a Flickr es necesario disponer de una cuenta en Yahoo. Desde la
portada de Flickr se puede crear una pulsando en el botón Crear tu cuenta.
5.2.2 Subir fotografías a Flickr
1. Descarga y descomprime el archivo flickr.zip a una carpeta del equipo. Como

resultado de esta tarea se obtendrá una colección de fotografías para ser subidas a
Flickr.
2. Abre Mozilla Firefox y visita la web de Flickr en la URL: http://www.flickr.com.
3. Clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo.
4. Pulsa en el enlace Subir fotos. En este caso vamos a utilizar el Uploader Básico de
Flickr. Selecciona esta opción si no se muestra la página recogida en la captura de
pantalla adjunta.
5. En la página Subir fotos en Flickr pulsa en el botón Examinar para localizar la
primera fotografía en la carpeta de tu disco duro. Repite este paso para algunas
fotografías más del resto de la carpeta.
6. En el apartado Agregar etiquetas para TODAS estas imágenes introduce los términos
que luego facilitarán la localización de las imágenes en el buscador de Flickr.
Ejemplo: Asturias, paisajes
7. Configura el resto de opciones de privacidad, seguridad, tipo de contenidos, etc.
8. Clic en el botón Cargar.
9. Una vez concluido el proceso de subida se mostrará el panel Describe tus fotos donde
es posible asignar títulos, descripciones y etiquetas a cada imagen de forma
invididual. Para terminar pulsa en el botón Guardar el lote.
10. Las fotos estarán disponibles en la pestaña Tu > Tus fotos.
Nota:
Otra posibilidad para subir fotos a Flickr es descargar e instalar una herramienta de
carga que se ofrece en esta página. Se trata de una aplicación local que permite subir
imágenes con sólo arrastrar y soltar.
5.2.3 Organizar en álbumes
1. Si no estás autentificado debes hacer clic en el enlace Iniciar sesión e introduce tus
credenciales Yahoo.
2. Desde el menú superior horizontal haz clic en la opción Organizar. Tras unos
segundos de carga se mostrará el organizador de Flickr.
3. Clic en la pestaña Álbumes y luego en el enlace Crear nuevo álbum.

4. Desde el panel de nuevo album:
4.1 Introduce el título del álbum, p.e.: “Mi viaje por Asturias”.
4.2 Para añadir fotografías a este nuevo álbum debes arrastrar las imágenes que
aparecen en la franja inferior al panel derecho superior.
4.3 Arrastra una imagen del álbum al cuadrado visor que aparece sobre el título. Esta
será la imagen que represente el albúm.
4.4 Pulsa en el botón Guardar.
5.2.4 Situar las fotos en el mapa (geolocalización)
credenciales Yahoo.
2. Desde el menú superior horizontal haz clic en la opción Organizar. Tras unos
segundos de carga se mostrará el organizador de Flickr.
3. Clic en la pestaña Mapa para acceder al interfaz donde podremos situar sobre el
mapa cada una de las fotos (geolocalización). Conviene elegir que el mapa sea de
acceso público.
4. En la casilla Buscar un lugar introduce el término Asturias para obtener el mapa de
esta Comunidad Autónoma con el zoom adecuado.
5. En el panel inferior selecciona el álbum “Mi viaje por Asturias” y luego arrastra cada
fotografía para ubicarla en su localidad: Luarca (Valdés), Cudillero, Gijón, Luarca,
Oviedo y Cabo de Peñas. Para eliminar una imagen del mapa arrastra el círculo hasta
el panel inferior.
6. Una vez concluida la geolocalización de las distintas imágenes haz clic en el enlace
Tus fotos situado en la esquina superior derecha del mapa.
5.2.5 Integración HTML de una imagen Flickr
credenciales Yahoo.
2. Desde la página Tus fotos selecciona una imagen haciendo clic sobre ella para
visualizarla en solitario.
3. Haz clic derecho sobre la fotografía y selecciona la opción Copiar la ruta de la

imagen.
4. Abre Kompozer
5. Sobre un documento web nuevo añade un título con formato Título 1. Por ejemplo:
“Mi imagen en Flickr”
6. Haz clic sobre el documento para situar el cursor debajo del título.
7. Clic sobre el botón Imagen para insertar una imagen en el documento
8. En el cuadro de diálogo Propiedades de la imagen haz clic derecho sobre el cuadro

de texto Ubicación de la imagen y selecciona Pegar.
9. Esta tarea pegará la URL absoluta de la imagen que al cabo de unos segundos se
mostrará en la Vista preliminar.
10. Introduce el Texto alternativo. Por ejemplo: “El Faro de Cudillero”.
11. Clic en el botón Aceptar.
12. Pulsa en el botón Guardar, introduce un título de página y guardarla con el nombre
flickr_image.html
13. Clic en el botón Navegar de la barra de herramientas de Kompozer para visualizar el
resultado en el navegador Firefox.
5.2.6 Integración HTML de una presentación de fotografías Flickr
credenciales Yahoo.
2. En la barra de menús de Flickr selecciona Tú > Tus Álbumes.
3. A continuación haz clic sobre el album creado anteriormente. Una vez dentro del
álbum observa que existe un enlace con el texto Ver como presentación. Si se hace
clic en este enlace se mostrará una presentación con la secuencia de fotografías que
forman parte del álbum.
4. Mientras estás visualizando esta presentación se puede seleccionar la URL de esta
presentación en la barra de dirección del navegador. Para ello haz clic derecho sobre
la barra de direcciones y elige Seleccionar todo. A continuación haz clic derecho y
selecciona Copiar.
Otra posibilidad es regresar a la ventana anterior y hacer clic derecho sobre el enlace
Ver como presentación para seleccionar la opción Copiar la ruta del enlace. En
cualquiera de los dos casos se copia al portapapeles la URL de esta presentación.
5. Abre Kompozer y sobre un documento web nuevo escribe el texto “Mi presentación
en Flickr” en formato Titulo 1.
6. Sitúa el cursor debajo del título y a continuación selecciona Insertar > HTML.
7. En el cuadro de diálogo Insertar HTML haz clic sobre el cuadro de texto, haz clic
derecho y elige Pegar.
8. En el documento actual debes crear un marco interno (IFRAME) que apunte a esta URL
absoluta que hemos pegado. Para ello escribe:
<iframe src="<url>" width="800" height="600"> </iframe>
donde <url> es la dirección entre comillas que hemos copiado. Los atributos width y
height definen el tamaño del marco interno.
9. Clic en el botón Insertar.

flickr_gallery.html
5.2.7 Integración HTML de un mapa de Flickr
credenciales Yahoo.
2. En la barra de menús de Flickr selecciona Tú > Tu Mapa
3. Una vez dentro del mapa haz clic sobre el enlace inferior Filtros.
4. En la lista Persona elige la opción Tú para que en el mapa se muestren sólo las fotos
que has colocado sobre el mapa.
5. En la esquina inferior derecha del mapa pulsa sobre el enlace Vincular a esto
6. Se muestra el cuadro de diálogo Vincular a esta mapa. Clic derecho sobre el

contenido de este cuadro de texto y selecciona primero Seleccionar todo y luego
Copiar.
7. Abre Kompozer y sobre un documento web nuevo escribe el texto “Mi mapa en
Flickr” en formato Titulo 1.
derecho y elige Pegar.
10. En el documento actual debes crear un marco interno (IFRAME) que apunte a esta URL
absoluta que hemos pegado. Para ello escribe:
<iframe src="<url>" width="800" height="600"> </iframe>
donde <url> es la dirección entre comillas que hemos copiado. Los atributos width y
height definen el tamaño del marco.
11. Clic en el botón Insertar de este cuadro de diálogo.
flickr_map.html
Servicios Web 2.0 ::: Slide.com: presentación de imágenes 426
5.3 Slide.com:
presentación de
imágenes
5.3 Slide.com: presentación de imágenes

Slide.com (http://www.slide.com) es un servicio web 2.0 que nos permite subir una
colección de imágenes y luego obtener en línea una atractiva presentación que las muestra de
forma secuencial y con efectos especiales. Esta presentación tendrá una URL que podemos
compartir con otras personas. También es posible integrarla dentro de una página web. Este
servicio puede resultar interesante para publicar las fotos de los distintos eventos que se
celebran en el centro.
1. Descarga y descomprime el archivo slidecom.zip en una carpeta del disco duro. Como
resultado de esta tarea dispondrás de una colección de fotografías para crear tu
presentación. Otra posibilidad es utilizar una colección propia.
2. Abre el navegador web Firefox y visita la web de Slide.com: http://www.slide.com
3. Se puede crear una presentación sin necesidad de registrarse como usuario de este
servicio. Sin embargo conviene registrarse haciendo clic en el enlace Regístrate para
poder editar en cualquier momento las presentaciones creadas. Para ello introduce tu
email y la contraseña. Una vez completado el registro, en el formulario ENTRAR
introduce estos datos para autentificarte.
4. Clic en el botón Crear un Slide Show.
5. En la pestaña Mis archivos haz clic en el botón Busca para subir las imágenes desde el
equipo.
6. En el cuadro de diálogo Seleccione los archivos … navega para situarte dentro de la

carpeta anterior. Puedes seleccionar un solo archivo con hacer clic sobre él. Para
añadir, uno a uno, a la selección pulsa previamente la tecla Ctrl y sin soltarla vete
haciendo clic sobre los archivos que deseas elegir. Para añadir una lista de archivos:
haz clic en el primero, pulsa la tecla Mayus y sin soltarla haz clic en el último. Verás
que se seleccionan todos. Utiliza este truco para elegir todos los archivos de imagen
de esta carpeta.
7. Clic en el botón Abrir.

8. Transcurridos unos segundos se habrán subido estas imágenes al servidor remoto. Una
vez finalizado el proceso se mostrará el mensaje Subida terminada. En la vista previa
de la presentación que se muestra arriba ya aparecen estas imágenes.
9. En el panel inferior donde se muestran las imágenes subidas se puede realizar los
siguientes ajustes:
 Nombre de Slide Show: Mi viaje por Asturias
 Pies de foto: Escribe el pie de página para cada fotografía ya que por defecto se
sitúa el nombre del archivo.
 Orden de las fotografías. Arrastra las imágenes para colocarlas en el orden en
que se mostrarán.
 Azar. Si activas esta casilla las fotos se mostrarán de forma aleatoria.
10. En el panel derecho Personaliza se pueden configurar interesantes opciones de la

presentación:
 Estilo, Temas y Skins: puedes combinar las distintas opciones de estos
parámetros para conseguir presentaciones más personalizadas. En la pestaña
Estilo se puede activar la casilla Azar para que se muestre cada vez con un estilo
aleatorio y desplegar la lista Rapidez para elegir la velocidad de la animación:
Fast, Medium y Show (Rápido, Medio y Lento).
 Música: permite elegir una música de fondo.
 Fondo: para elegir un color de fondo.
 Efectos: para aplicar efectos de sepia, blanco/negro, etc a las fotos.
 Tamaño: en función del modelo definido para el estilo se podrá elegir un tamaño
estándar: small, medium o large (pequeño, mediano y grande).
 Privacidad: permite establecer si la presentación será de acceso público o
particular. Se recomienda la opción de acceso público.
11. Para terminar de configurar la presentación pulsa en el botón Guardar.
12. Si no te has registrado y autentificado Slide.com te ofrece la oportunidad de hacerlo.

Si continuas sin registrar no será posible editar el slide.com.
13. A continuación se muestra el código de integración HTML de la presentación para los
distintos formatos de blog. En este caso la tarea consiste en integrarla en una página
web que estamos elaborando. Para ello haz clic en la pestaña My Space (podría ser
otra), haz clic en el contenido del cuadro O copia este código.
14. Una vez seleccionado este texto haz clic derecho sobre este cuadro y elige Copiar en
el menú contextual que se muestra. También se puede copiar mediante la
combinación de teclas <Ctrl>+<C>.
Slide.com” en formato Titulo 1.
derecho y elige Pegar. Clic en el botón Insertar.
slidecom.html
Servicios Web 2.0 ::: Slideshare: presentaciones en línea 431
5.4 Slideshare:
presentaciones en línea
5.4 SlideShare: Presentaciones en línea

SlideShare (http://www.slideshare.net) es un servicio de alojamiento y publicación en línea
de presentaciones realizadas con herramientas como Powerpoint u OpenOffice. Puedes
utilizarlo para subir tus presentaciones y compartirlas. También puedes buscar y utilizar las
realizadas por otras personas. En este curso se propone SlideShare como una interesante
opción para publicar en la web nuestras propias presentaciones y luego poder integrarlas en
el código HTML de una página.
Conviene registrarse previamente para crear tu cuenta en SlideShare. Para ello haz clic en el
enlace Signup y completa el formulario indicando email, usuario y contraseña. A partir de ese
momento ya dispones de credenciales de identificación y acceso.
1. Descarga y descomprime el archivo TIC_project.zip en el disco duro de tu equipo.

Como resultado de esta tarea obtendrás el archivo TIC_project.ppt que contiene una
presentación realizada en PowerPoint.
2. Abre el navegador Firefox y visita la página de SlideShare:
http://www.slideshare.net
3. En el cuadro de Login introduce las credenciales de acceso.
4. Clic en el enlace Upload (Subir).
5. En la página se muestra información sobre el tipo de archivos que se pueden subir:
.ppt y .pps (Powerpoint), .odp (Impress de OpenOffice) y .pdf. También se indica que
este espacio es público. No se recomienda subir ningún material si se desea mantener
en privado. También se indica el tamaño máximo del archivo. En este caso son 30 MB.
6. Clic en el botón Browse and select files … (Navegar y elegir archivos …).
7. En el cuadro de diálogo Seleccione los archivos … navega para situarte en la carpeta
donde has descargado y descomprimido el archivo TIC_project.ppt.
8. Selecciónalo y pulsa en el botón Abrir.

9. Tras unos segundos de espera se subirá esta presentación en SlideShare.
10. Cuando el proceso de subida ha tenido éxito se solicitan algunos datos adicionales:
 Title (Título). Es el título de la presentación. Ejemplo: Proyecto TIC en un centro
educativo
 Tags (Etiquetas). Es una relación de palabras-clave separadas por comas que
permitirán localizar esta presentación utilizando la herramienta de búsqueda de
SlideShare. Ejemplo: TIC, proyecto, integración, educación, tecnologías
 Language (Idioma). Selecciona la opción Spanish (Español).
 Description (Descripción). Un breve comentario que a modo de introducción
permite describir la presentación.
 Allow file download. (Permitir descarga de archivo). Si marcas esta opción los
usuario podrán descargarse el archivo original.
11. Para concluir el proceso de subida pulsa en el botón Publish.

12. Tras pulsar este botón se produce otro tiempo de espera. SlideShare está
transformando el archivo original en una película Flash que se mostrará al usuario
mostrando el contenido de esa presentación.
13. Clic en el enlace superior My Slidespaces y luego en la imagen que muestra la
presentación que acabamos de subir. De esta forma se accede a la visualización de
esta presentación.
14. Haz clic derecho sobre el cuadro de texto Embed into your blog (Embebido dentro de
tu blog) para elegir Seleccionar todo y luego Copiar.
SlideShare” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde SlideShare se ha pegado
aquí. Clic en el boton Insertar.
slideshare.html
Nota:
Esta integración HTML también se puede realizar con presentaciones publicadas por
otras personas. Al situarse en su página también se ofrece el código Embed para
copiar y pegar en nuestra página web.
Servicios Web 2.0 ::: BooMP3: audio en línea 435
5.5 BooMP3: audio

en línea
5.5 BooMP3: Audio en línea
5.5.1 ¿Qué es BooMP3?
BooMP3 (http://boomp3.com/) es un interesante servicio Web 2.0 que permite subir archivos
MP3 y WMA (Windows Media Audio) desde el disco duro del equipo local o bien desde una
dirección web. A cada recurso sonoro se le puede asignar información textual: título de la
canción y descripción. Esto facilita su búsqueda. Cada pista de audio dispondrá de una página
propia donde se proporciona un código HTML para insertar su reproductor en nuestra página
web. No es necesario registrarse para utilizar este servicio.
5.5.2 Subir un archivo local
1. Descarga y descomprime el archivo africa.zip en el disco duro de tu equipo. Como

resultado de esta tarea obtendrás el audio: africa.mp3
2. Abre el navegador Firefox y visita la página de BooMP3: http://boomp3.com
3. En la página de entrada haz clic en el botón Click and select file to upload (Haz clic
y elige un archivo para subir).
4. En el cuadro de diálogo Seleccione los archivos que se cargarán con Boomp3.

Localiza en el disco duro de tu equipo el archivo de audio africa.mp3 anteriormente
descargado
5. Pulsa en el botón Abrir. Se iniciará automáticamente la subida del archivo o archivos
de audio al servidor remoto.
6. Una vez subido introduce los datos del audio para facilitar su búsqueda:
1. Song title (Título de la canción). Ejemplo: Sonidos de África.
2. Your email (Tu dirección de correo electrónico). Introduce tu dirección de correo
electrónico.
3. Copyright. Debes marcar esta etiqueta garantizando con ello que este archivo no
está protegido con derechos de autor.
4. Description (Descripción). Ejemplo: Loop musical extraído del portal FlashKit
7. Para terminar pulsa en el botón Save (Guardar ).

8. A continuación se muestra la página donde se muestra el título de la canción y el
sencillo reproductor de BooMP3 para escucharla.
Notas:
1. Para subir un audio es imprescindible introducir una dirección de correo electrónico.

Si pulsas en el enlace superior View your files (Ver tus archivos) se mostrará un
cuadro de texto donde si introduces tu correo electrónico, se mostrará una lista de
acceso a todos los audios subidos a BooMP3 con esa cuenta.
2. Al subir un audio recibirás un email en la cuenta de correo que has declarado. Este
mensaje contiene un enlace a la página del audio y otra al editor que permitirá
eliminar al archivo. Conserva este mensaje si deseas eliminar el audio
posteriormente.
5.5.3 Integración HTML del reproductor de BooMP3
1. Abre el navegador Firefox y visita la web de BooMP3: http://boomp3.com

2. Para visualizar tus archivos de audio pulsa en el enlace View your files (Ver tus
archivos) e introduce la dirección de correo electrónico que has utilizado para subir
los archivos de audio a BooMP3. Otra posibilidad es pulsar en View all uploaded files
para acceder al catálogo general de audios y situarse en uno de ellos.
3. Clic en el enlace del archivo de audio subido. Por ejemplo: Africa. Se mostrará una
página con el reproductor de BooMP3 que permite escuchar el audio.
4. Haz clic en el enlace Post this player to your blog (Publica este reproductor en tu
blog).
5. En el cuadro Posting player to your blog (Publicar el reproductor en tu blog) puedes

marcar dos opciones adicionales:
 Autoplay song: se inicia la reproducción de la canción al cargarse.
 Repeat song: se repite la canción en un bucle contínuo
6. Pulsa sobre el botón Copy (Copiar) para copiar el código embed
7. Abre Kompozer y sobre un documento web nuevo escribe el texto “Mi audio de
BooMP3” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde BooMP3 se ha pegado
boomp3.html
Multiply: repositorio de archivos 440
5.6 Multiply: repositorio

de archivos
5.6 Multiply: repositorio de archivos

Existen espacios donde es posible subir archivos multimedia (imagen, audio, vídeo,
animaciones, archivos etc) que luego se pueden integrar en la página web del centro o
proyecto.
En la siguiente tabla se recogen algunas webs donde se pueden almacenar archivos en línea.
Se indican sus prestaciones actuales para las cuentas gratuitas:
Sitio URL Capacidad Tráfico Por archivo

Multiply http://multiply.com/ --- --- 100 Mb
MediaMax http://www.mediamax.com 25 Gb 1 Gb/mes 10 Mb
Twango http://www.twango.com/ Ilimitado 250 Mb/mes 100 Mb
Box.net http://www.box.net/ 1 Gb 10 Gb/mes Ilimitado
Omnidrive http://www.omnidrive.com/ 1 Gb 5 Gb/mes Ilimitado
Capacidad: Capacidad total de almacenamiento por cuenta

Tráfico: Tráfico mensual de descargar permitido
Por archivo: Límite de subida por archivo
A continuación se describe el procedimiento para utilizar un repositorio como Multiply para

guardar y reutilizar archivos de imágenes, audios o vídeos.
5.6.1 Registrarse como usuario en Multiply
1. Accede a la web de Multiply en la dirección: http://multiply.com

2. Clic en el enlace Join for free para completar el formulario de registro. Puedes
utilizar una dirección de correo electrónico de Yahoo o MSN. Recuerda el usuario y
contraseña definido para posteriores accesos.
3. A continuación consulta el correo electrónico. Abre el mensaje de confirmación que
te ha enviado Multiply a tu cuenta. Pulsa en el enlace de confirmación para
completar el paso de verificación de la dirección de correo electrónico. Cierra el
correo electrónico y el navegador.
4. Tras la creación de una cuenta la dirección de la página de inicio en Multiply será del
tipo: http://<usuario>.multiply.com/
5.6.2 Subir e integrar una imagen al repositorio Multiply
1. Descarga y descomprime el archivo multiply.zip a la carpeta c:\multiply. Como

resultado de esta extracción dispondrás del archivo de imagen elogio.jpg y el archivo
de audio bistro.mp3.
2. Abre el navegador web y sitúate de nuevo en la web de Multiply. Introduce tu nombre
de usuario y contraseña. Pulsa en el botón Sign In (Entrar)
3. Pulsa en el botón My Site (Mi Sitio) y luego en el botón Add Photos (Añadir Fotos)
dentro del cuadro Photos (Fotos)
Nota:
Para que funcione correctamente la subida de archivos es necesario tener instalado en el

equipo Java Runtime Environment (JRE) http://www.java.com/es/download/
4. Existen dos procedimientos alternativos para seleccionar imágenes del disco duro
local.
• Arrastrar y soltar. Restaura la ventana del navegador web para que no ocupe
toda la pantalla. Abre Mi PC para navegar hasta la carpeta multiply. Arrastra el
archivo desde el explorador de archivos hasta el cuadro Upload Photos en el
navegador.
• Elegir fotos. Pulsa en el botón Choose Photos (Elige fotos). Se muestra un

cuadro de diálogo Enviando para desplegar la lista Buscar en y situarse en la
carpeta multiply. Selecciona el archivo elogio.jpg. Para terminar pulsa en el
botón Abrir.
5. Tras seleccionar las distintas imágenes de tu disco duro (en este caso sólo vamos a
hacerlo con una) pulsa en el botón Upload (Subir) que aparece debajo del cuadro de
vistas previas. Las imágenes se organizan en albums y posteriormente se pueden subir
o eliminar imágenes de un mismo album.
6. En el panel Album Details (Detalles del Album) introduce:

• Title (Título). Por ejemplo: Elogio al horizonte de Chillida
• Description (Descripción). Ejemplo: Lugares típicos de Asturias.
• Tags (etiquetas semánticas para facilitar la búsqueda). Ejemplo: monumentos,
asturias, lugares típicos, paisajes, etc.
7. Clic en el botón Save & Publish (Guardar y publicar).

8. Una vez concluido el proceso de subida al servidor remoto de todas las imágenes
seleccionadas se mostrará el mensaje Post Successful (Envío con éxito).
9. Pulsa en el enlace Go to your Multiply Site (Ir a tu sitio Multiply)
10. Pulsa sobre la imagen del album que has creado en el cuadro Photos.
11. Una vez dentro del álbum haz clic sobre la imagen que desees para que se muestre en
tamaño apropiado.
12. Clic derecho sobre la imagen y selecciona la opción Copiar la ruta de la imagen … De
esta forma se copiará al portapapeles la URL absoluta donde se encuentra
almacenada esta imagen
13. Sobre la barra de Dirección del navegador web haz doble clic sobre la URL actual y a
continuación haz clic derecho para seleccionar Pegar.
14. Puedes utilizar Kompozer para insertar esta imagen en una página web mediante
Insertar > Imagen. En la casilla Ubicación de la imagen pega la dirección
anteriormente copiada al portapapeles. Clic en Aceptar.
3. Subir e integrar un audio al repositorio Multiply
1. Accede al sitio web Multiply (http://multiply.com) y utiliza tus credenciales

personales para autentificarte en tu cuenta.
2. Clic en la pestaña superior My Site (Mi sitio).
3. Pulsa en el enlace Add Music del cuadro Music
4. En el panel Upload Music (Subir música) pulsa en el botón Examinar … del primer
cuadro. Navega por tu equipo local para seleccionar y abrir el archivo
multiply\bistro.mp3. Se puede subir varios archivos de audio y organizarlos en listas
de reproducción (playlists).
5. Para subir el archivo haz clic en el botón Upload (Subir). Transcurridos unos minutos
se completa el proceso.
6. En el panel Playlist Details (Detalles de la lista de reproducción) introduce:
• Playlist Name (Nombre de la lista). Ejemplo: Música de danza

• Description (Descripción). Ejemplo: Música para bailar
• Which songs should be included in this playlist? (¿Qué canciones se incluirán
en esta lista?). En este caso se marca la canción anteriormente subida.
• Tags (etiquetas semánticas para facilitar la búsqueda). Ejemplo: bistro,
mancini, danza, etc.
7. Clic en el botón Save & Publish para terminar.

8. Si todo ha ido bien se mostrará el mensaje Post Sucessful! (Envío con éxito).
9. Pulsa en el enlace Go to your Multiply Site (Ir a tu sitio Multiply)
10. Observa que en el cuadro Music ahora aparece la lista de reproducción anteriormente
creada. Haz clic sobre ella para abrirla.
11. En la pista que se ha subido pulsa sobre el enlace Play this playlist (reproducir esta
lista).
12. En el cuadro de diálogo Abrir con | Guardar en disco selecciona Abrir con y elige,
por ejemplo reproductor Windows Media Player o VLC Media Player.
13. Clic en el botón Aceptar. Tras su descarga comenzará la reproducción.
14. Pulsa sobre el enlace Share (Compartir)
15. En el cuadro de texto Link puedes copiar el enlace a la página de Multiply donde se
puede escuchar este audio.
16. Clic derecho sobre el cuadro de texto Link y elige Seleccionar todo. Clic derecho de
nuevo y selecciona Copiar.
17. Abre una página web con Kompozer. Sitúa el cursor donde deseas situar el enlace.
18. Selecciona Insertar > HTML. Clic derecho y selecciona Pegar. Se copiará el código
HTML que contiene el enlace.
Notas:
• No se ofrece una dirección absoluta al archivo de audio. En su defecto disponemos
de un enlace a una página desde donde se puede reproducir el audio.
• Para poder acceder a esa página es necesario que el usuario se autentifique con
unas credenciales de Multiply. Este requisito es algo relativamente nuevo.
4. Subir e integrar un vídeo al repositorio Multiply
1. Descarga y descomprime paisajes.zip para obtener el archivo paisajes.wmv en una

carpeta de tu equipo.
2. Accede al sitio web Multiply (http://multiply.com) y utiliza tus credenciales
personales para autentificarte en tu cuenta.
3. Clic en la pestaña superior My Site (Mi sitio).
4. Pulsa en el enlace Add Vídeo del cuadro Vídeo
5. Multiply puede alojar vídeos procedentes de 3 tipos distintos de fuentes:
• Upload a vídeo: subir un archivo del disco duro local.

• Record a vídeo: grabar un vídeo de la webcam o vídeo del equipo.
• Import vídeos: importar un vídeo de youtube, metacafe, myspace, google vídeo,
etc.
4.1 Subir un archivo de vídeo local
6. En el cuadro Upload a vídeo pulsa en el botón Examinar, navega para localizar y

abrir el archivo descargado paisajes.wmv. Clic en Abrir. Existe un límite de 100 MB
de tamaño en el archivo de vídeo para subir. Son aproximadamente 10 minutos de
grabación.
7. Para terminar pulsa en el botón Upload Video File (Subir archivo de vídeo).
4.2 Grabar un vídeo
Para realizar esta práctica es necesario disponer de una cámara DV o webcam + micrófono
conectados al equipo.
6. Seleccciona My Site > Vídeo > Add Vídeo

7. En la sección Record a Video (Grabar un Vídeo) haz clic en el botón Multiply Vídeo
Recorder (Grabador de vídeo Multiply). Es necesario tener instalado en el navegador
web el plugin del reproductor de Flash 8.
8. Pulsa en el botón Permitir para que la aplicación puedan acceder a la webcam y

micrófono conectados al equipo.
9. Se mostrará la captura de la cámara en el cuadro Video Recorder. Si tienes varios
dispositivos de captura de vídeo y de audio abre los cuadros desplegables y selecciona
los adecuados.
10. Para iniciar la grabación haz clic en el botón Record (Grabar) que aparece en el
centro del capturador o bien pulsa la tecla barra espaciadora.
11. Para detener la grabación haz clic en el botón Stop (Detener) que se muestra en la
esquina inferior izquierda del capturador o bien pulsa la tecla barra espaciadora.
12. Tras realizar la captura se mostrará una consola con varios botones: Play (reproducir
la captura realizada), Record (volver a grabar), Save (guardar) y Discard (descartar).
13. Para guardar el vídeo pulsa en el botón Save (Guardar).
Nota:
Conviene no exceder de 10 minutos en el tiempo de grabación. Recuerda que Multiply

tiene el límite de 100 MB por archivo subido.
4.3 Importar vídeos
6. Seleccciona My Site > Vídeo > Add Vídeo

7. En la sección Import vídeos (Importar un vídeo) pulsa sobre un servicio de vídeo. Por
ejemplo Youtube.com
8. En el cuadro de diálogo Import YouTube Video – by URL (Importar vídeo de Youtube

mediante URL) pega la dirección del vídeo que te interese. Por ejemplo:
http://www.youtube.com/watch?v=7vgAYTC9bRY y pulsa en el botón OK.
Nota:
Importar vídeos de Youtube y otros servidores a mi cuenta Multiply puede resultar
interesante para evitar los vídeos relacionados inapropiados.
4.4 Guardar el vídeo
9. En cualquiera de los casos anteriores (subir un archivo de vídeo local, grabar un vídeo
o importarlo desde Youtube), una vez concluido con éxito el proceso de subida se
mostrará una página donde debes introducir los datos del vídeo: Subject (Título),
Description (Descripción), Tags (Etiquetas) y Access (Acceso).
10. Para terminar pulsa en el botón Save & Publish (Guardar y publicar)
11. Clic de nuevo en la pestaña My Site.
12. Para visualizar el archivo de vídeo haz clic sobre su título dentro del cuadro Vídeo.
13. Pulsa sobre el enlace Share (Compartir)
14. Hay dos formas de integrar en una página HTML un vídeo alojado en Multiply:
• Embed (incrustado o embebido): inserta dentro de la página HTML un reproductor
mostrando el vídeo.
• Link (enlace): inserta un enlace a una página de Multiply donde se visualiza ese
vídeo.
15. En este caso haz clic derecho sobre el cuadro de texto Embed y elige Seleccionar
todo. Clic derecho de nuevo y selecciona Copiar.
16. Abre una página web con Kompozer. Sitúa el cursor donde deseas situar el enlace.
17. Selecciona Insertar > HTML. Clic derecho y selecciona Pegar. Se copiará el código
HTML que empotra el reproductor con el vídeo.
Nota:
Para acceder a la visualización de un vídeo no es necesario disponer de credenciales
de Multiply.
Servicios Web 2.0 ::: Scribd, documentos en línea 453
5.7 Scribd: documentos

en línea
5.7 Scribd: documentos en línea

Scribd (http://www.scribd.com/) es un espacio donde se pueden subir y alojar documentos
procedentes de distintos formatos de archivo: *.doc, *.xls, *.pdf, etc. Una vez subido se
proporciona un interfaz enriquecido que permite distintas opciones de visualización y manejo
del documento. El usuario sólo necesita disponer de un navegador web con el plugin de Adobe
Flash para poder acceder al mismo. Como veremos en este apartado este visor se puede
integrar en el código HTML de una página web de nuestro sitio web. El propósito de este
proyecto es crear una gran biblioteca de documentos para compartir entre los usuarios.
1. Descarga y descomprime a la carpeta scribd el contenido del archivo scribd.zip.

Como resultado de esta tarea obtendrás en esta carpeta el documento web20.doc
para Microsoft Office Word.
2. Visita la web de Scribd y registrate como usuario/a en Log In. Para ello elige un
nombre de usuario y contraseña e introduce estos datos junto con una dirección de
correo electrónico.
3. Utiliza estas credenciales para autentificarte y una vez superado este proceso
selecciona My docs en el menú superior, My Documents (Mis documentos) en el menú
lateral izquierdo y luego pulsa en el botón Upload (Subir)
4. Se muestra la página Publish a document ::: Step 1 of 2: Upload something

(Publicar un documento ::: Paso 1 de 2: Subir algo). Se pueden subir los siguientes
formatos de archivo: .doc (Microsoft Word); .pdf (Adobe Acrobat); .txt (texto plano);
.ppt, .pps (Microsoft Powerpoint); .xls (Microsoft Excel); .odt, odp, etc.
(OpenDocument Format / ODF - OpenOffice.org, KOffice, etc.); .sxw, sxi, etc.
(OpenDocument Format / ODF - OpenOffice.org, KOffice, etc.)
5. Clic en el botón Browse (Examinar).

6. En el cuadro de diálogo Seleccione los archivos que se cargarán con
www.scribd.com selecciona la carpeta scribd y dentro de ella haz clic sobre el
documento web20.doc. Pulsa en el botón Abrir.
7. Transcurridos unos segundos se habrá subido el documento al servidor mostrándose

una ventana donde podemos definir: Title (título), Description (Descripción) y Tags
(Ëtiquetas de contenido para la búsqueda). Para terminar pulsa en el botón Publish
(Publicar).
8. Se muestra la página Documents from your bulk upload (Documentos subidos desde
tu equipo). Clic en el enlace view here (ver aquí) para ver su aspecto.
9. Existen dos modos de visualización del documento: Formato HTML y Formato Visor
PDF. En la parte superior del título del documento, a la derecha, haz clic en el enlace
Switching to PDF player format (Cambiar al formato de Visor PDF). Para regresar al
modo HTML pulsa en el enlace que lo sustituye: Switching to HTML format (Cambiar
a formato HTML).
10. Cuando estás en el modo Visor PDF se puede navegar por el documento utilizando las
distintas opciones que proporciona el marco superior del visor.
• Activa el botón Mano para poder arrastrar y soltar las páginas del documento
utilizando el puntero del ratón.
• Activa la herramienta Selección para poder seleccionar fragmentos de texto
del documento con sólo arrastrar y soltar. El texto seleccionado se puede
copiar (<Ctrl>+<C>) y luego pegar (<Ctrl>+<V>) sobre otro documento.
• Introduce un término en el cuadro de texto y luego pulsa en el icono lupa
situado a su derecha para iniciar una búsqueda en el documento actual.
• Arrastra el deslizador para aumentar o disminuir el zoom de visualización del
documento o bien pulsa en los botones de ajuste de página o anchura de
página.
• Introduce el número de página para situarte directamente en ella tras pulsar
la tecla <enter>. Otra posibilidad es utilizar los botones adelante/atrás que
permiten desplazarse en ambas direcciones página a página sobre el
documento.
• Si deseas obtener una copia impresa del documento haz clic en el icono de la
impresora.
• Para ver el documento a pantalla completa pulsa en el botón situado más a la
derecha de la barra de herramientas.
11. En la base del visor se ofrece al usuario la posibilidad de descargarse el documento en

distintos formatos:
• Download as PDF (Descargar como PDF).
• MS Word (Microsoft Word)
• Plain text (Texto plano).
• MP3. Scribd genera mediante un sintetizador de voz una locución sonora del
texto subido. No tiene mucha calidad pero es curioso
12. En el área derecha del documento se muestra un panel donde se puede descargar el
documento (Download as) como PDF, MS Word, Texto plano o MP3. También se
dispone de una consola de reproducción el audio que nos permite escuchar la locución
sonora. Cuando el texto está en castellano apenas es inteligible.
13. Para insertar este documento en una página de nuestro sitio web, haz clic en la
casilla de texto Embed que muestra el código HTML de inserción y a continuación haz
clic derecho para seleccionar Copiar en el menú contextual que se muestra.
14. Abre Kompozer y selecciona Archivo > Nuevo > Un documento vacío.
15. Sobre la nueva página escribe el título “La Web 2.0” y asígnale el estilo Título 1.
16. Sitúa el cursor en la siguiente línea y a continuación elige Insertar > HTML
17. En la ventana Insertar HTML haz clic en el cuadro de texto y a continuación haz clic
derecho para seleccionar Pegar. Clic en el botón Insertar.
18. Pulsa en el botón Guardar. Introduce el título: “La Web 2.0” y guarda esta página en
la carpeta miweb con el nombre web20.html
19. Clic en el botón Navegar de Kompozer para visualizar a través del navegador
Firefox. Otra posibilidad es utilizar el explorador de archivos para hacer doble clic
sobre el archivo web20.html y verlo con el navegador web por defecto del equipo.
Servicios Web 2.0 ::: Youtube: video en streaming 460
5.8 Youtube:
vídeo en streaming
5.8 YouTube: vídeo en streaming
5.8.1 ¿Qué es Youtube?
YouTube (http://www.youtube.com) es un servicio de búsqueda y alojamiento de vídeos que

ofrece la posibilidad de asignar tags o etiquetas a los mismos para facilitar su localización.
En poco tiempo este sitio web se ha convertido en el mayor repositorio de vídeos en Internet.
Cualquier usuario puede registrarse de forma gratuita y subir sus vídeos. Estos pueden
ajustarse a cualquier temática siempre y cuando no sea pornográfica y no incumplan las leyes
vigentes sobre copyright y pertinencia de contenidos.
Cada usuario podrá subir todos los vídeos que desee en los formatos admitidos: *.AVI, *.MOV y
*.MPG. Existe la limitación de un tamaño máximo de 100 MB por archivo.
Para registrarse como usuario en YouTube pulsa en el enlace Sign up (Registrarse) y rellena
el formulario. Para concluir el proceso pulsa en el botón Sign up.
5.8.2 Publicar un vídeo en YouTube
1. Descarga y descomprime el archivo paisajes.zip en tu disco duro. Como resultado

obtendrás el archivo de vídeo paisajes.wmv
2. Abre el navegador Firefox y visita la web de Youtube : http://www.youtube.com.
3. Clic en el enlace Log in. Introduce el usuario y contraseña personales en Youtube y a
continuación pulsa en el botón Log In.
4. Una vez superado con éxito el proceso de autentificación haz clic en el botón Upload
Video (Subir Video)
5. En la página Video Upload (Subida de archivo) puedes definir los siguientes valores
para el vídeo:
• Title (Título). Ejemplo: Paisajes asturianos.
• Description (Descripción). Texto breve que describe el vídeo. Ejemplo:
Algunas fotografías de sitios asturianos.
• Video Category (Categoría del Vídeo). Selecciona una categoría o tema.
Ejemplo: Entertainment (Entretenimiento).
• Tags (Etiquetas). Facilitan la búsqueda del vídeo. Se introduce una o varias
etiquetas separadas por espacios. Ejemplo: asturias paisajes. Estos son los
campos obligatorios para poder subir un vídeo. En el resto se pueden dejar las
opciones por defecto.
Además de las opciones básicas es posible configurar otros parámetros haciendo clic
previamente en el enlace choose options (elige opciones) de los siguientes apartados:
• Broadcast Options (Opciones de difusión). Si pulsas en el enlace choose

options (elige opciones) podrás elegir entre Public para compartir el video
con todo el mundo (es la opción por defecto y recomendada) y Private donde
sólo será visible por ti o los usuarios que indiques.
• Date and Map Options (Opciones de fecha y mapa). Permite definir la fecha
en que fue grabado y sobre una mapa de Google Maps el lugar geográfico
concreto donde se tomó (geolocalización).
• Sharing Options (Opciones de compartición). En este apartado se puede
elegir entre …
Comments (Comentarios).
- Allow comments to be added automatically. Permitir que los
comentarios se añadan automáticamente. Es la opción por
defecto.
- Yes, allow comments after I approve them. Friends can add
automatically. Se permiten comentarios pero solo serán
visibles después de aprobarlos. Los amigos podrán añadirlos
automáticamente.
- Yes, allow comments after I approve them. Se permiten
comentarios pero solo serán visibles después de aprobarlos.
- No, don't allow comments. No se permiten comentarios.
Comment Voting (Votaciones).

- Yes, allow users to vote on comments. Permitir las
votaciones en los comentarios. Es la opción por defecto.
- No, do not allow users to vote on comments. No permitir las
votaciones en los comentarios.
Video Responses (Vídeos relacionados).

- Yes, allow video responses to be added automatically.
Permitir que otros usuarios de YouTube puedan relacionar
automáticamente sus vídeos con el mío. Es la opción por
defecto.
- Yes, allow video responses after I approve them. Permitir
que puedan relacionar otros vídeos con éste después de
haberlo aprobado.
- No, don't allow allow video responses. No permitir
relacionar este video con otros.
Ratings (Puntuaciones)
- Yes, allow this video to be rated by others. Permitir que

este video pueda ser puntuado por los usuarios. Es la opción
por defecto.
- No, don't allow this video to be rated. No permitir que este
video pueda ser votado.
Embedding (Incrustado)
- Yes, external sites may embed and play this video. Permitir
que sitios externos puedan incrustar y reproducir este vídeo.
Es la opción por defecto.
- No, external sites may NOT embed and play this video. No
admite que este video se pueda incrustar en una página web
externa y se reproduzca en ella.
Syndication (Sindicación)
- Yes, make this video available on mobile phones and TV.
Hacer que el vídeo esté disponible en teléfonos móviles y TV.
Es la opción por defecto.
- No, this video should not be available on mobile phones
and TV. Este vídeo NO estará disponible para teléfonos
móviles ni TV.
6. Pulsa en el botón Upload a vídeo … (Subir un vídeo).

7. En la página Video Upload (Subida de vídeo) pulsa en el botón Browse (Examinar)
para localizar el archivo que has descargado y descomprimido en tu equipo local:
paisajes.wmv. A continuación pulsa en el botón Upload Vídeo (Subir vídeo).
8. Tras unos segundos de espera si el vídeo se ha subido con éxito se mostrará el

mensaje: Video Upload – Upload Complete (Subida de vídeo – Subida completada).
9. Clic en el enlace My Videos (Mis vídeos) para acceder a la lista de archivos de vídeo
subidos.
Nota:
Después de subir el archivo al servidor puede ocurrir que tengas que esperar unos minutos
para que se complete la conversión del vídeo. YouTube procesa el formato original del
archivo para transformarlo en formato Video Flash.
5.8.3 Integración HTML de un vídeo YouTube
1. Abre el navegador Firefox y visita la web de Youtube : http://www.youtube.com.

Introduce tus credenciales para autentificarte.
2. Clic en la sección My Account > My Videos (Mis vídeos).
3. Clic en el título del vídeo que hemos introducido en el apartado anterior. Se visualiza
una página mostrando la reproducción del vídeo.
4. Clic sobre el cuadro de texto Embed para seleccionar el código. A continuación haz
clic derecho y selecciona Copiar. Con esta operación hemos copiado al portapapeles
el código HTML que permitirá incrustar el reproductor de Youtube y este vídeo en
nuestra página web.
Nota:
Sin necesidad de estar autentificado también es posible integrar en nuestra página HTML
cualquier vídeo de Youtube (a menos que su autor haya definido que no permite su
incrustación embed). Para ello navega para reproducir el vídeo que desees y copia el
código Embed que aparece en la página del vídeo.
5. Abre Kompozer y sobre un documento web nuevo escribe el texto “Mi video de
Youtube” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde YouTube se ha pegado
youtube.html
5.8.4 Crear un lista de reproducción de vídeos en Youtube
YouTube ofrece la posibilidad de crear listas de reproducción de vídeos alojados en este

servicio. Estos pueden ser propios o ajenos. En el siguiente ejemplo se recoge el
procedimiento para construir una lista de reproducción y luego insertarlo en una página web.
1. Visita la página de YouTube utilizando Mozilla Firefox: http://www.youtube.com

2. Introduce tus credenciales personales para autentificarte.
3. Visita la sección My Account (Mi cuenta)
4. Clic en el enlace Playlists (Listas de reproducción).
5. Clic en el botón Create Playlist (Crear lista de reproducción). En este caso vamos a
crear una lista de vídeos sobre el pintor Picasso.
6. En la página Create/Edit Playlist (Crear/Editar lista de reproducción) introduce el
nombre de la lista (Playlist Name). Ejemplo: Picasso en Youtube.
7. Rellena el cuadro de texto Description (Descripción) y los Tags (Etiquetas). Marca la

opción Public (Público) o Private (Privado) para indicar la privacidad de la lista de
reproducción. Se recomienda utilizar la opción por defecto: Public.
8. Clic en el botón Save PlayListInfo (Guardar Información de la Lista de Reproducción).
9. A continuación utiliza el buscador de YouTube para buscar vídeos sobre Picasso.
Introduce el término “Picasso” y pulsa en el botón Search (Buscar).
10. Haz clic sobre el título de uno de los vídeos para visualizarlo.
11. En la barra de opciones que aparece debajo del reproductor haz clic sobre el enlace
Save to Favorites (Guardar a Favoritos).
12. En la sección Add Video to a Playlist (Añadir Vídeo a una Lista de Reproducción)
despliega el combo para elegir la lista Picasso en YouTube. Para terminar pulsa en el
botón OK.
13. Repite los pasos 9-12 para añadir dos o tres vídeos más sobre Picasso. No es necesario
utilizar de nuevo el buscador porque en la lista Related (Relacionados) se muestran
algunos vídeos que están relacionados con el actual.
14. Clic en la entrada My Account (Mi Cuenta) y luego pulsa en PlayLists (Listas de
reproducción).
15. En el cuadro de texto Embed haz clic para seleccionar su contenido y luego clic
derecho y Copiar para copiar al portapapeles el código del reproductor de la lista
creada: Picasso en Youtube.
16. Abre Kompozer y sobre un documento web nuevo escribe el texto “Mi lista de
reproducción en Youtube” en formato Título 1.
derecho y elige Pegar. Observa que el código copiado desde YouTube se ha pegado
lista_youtube.html
Servicios Web 2.0 ::: Vídeos 468
5.9 Vídeos
5.9 Vídeos
5.9.1 Vídeos subtitulados en OverStream
Overstream (http://www.overstream.net) es un espacio donde puedes personalizar un vídeo

en línea mediante la incorporación de comentarios y subtítulos. Esto es posible gracias al
editor de Overstream que permite fácilmente crear y sincronizar tus subtítulos a cualquier
vídeo en línea, guardarlos en el servidor de Overstream para compartirlos con los demás.
Visita la web de Overstream y regístrate para disponer de un nombre de usuario y

contraseña. Una vez que dispongas de ella introdúcelas para entrar en sesión.
1. A través del navegador web localiza previamente en Youtube el vídeo en línea que
deseas subtitular. Una vez situado en él, selecciona la dirección en la barra del
navegador, clic derecho y elige Copiar.
2. Regresa a OverStream. Pulsa en el enlace Create overstream (Crear subtítulos).
3. Se muestra el cuadro de diálogo Vídeo URL (dirección del vídeo). En la casilla Enter
Vídeo URL (Introduce URL del vídeo) haz clic derecho y selecciona Pegar para pegar
la dirección copiada con anterioridad. Clic en el botón Ok.
4. Tras unos segundos de espera en el visor se cargará la película. Los pasos para crear
los subtítulos serían (ver imagen):
1) Clic en el botón play de la consola de reproducción. Cuando estimes necesario

añadir un comentario pulsa en el botón pause.
2) En la esquina inferior derecha pulsa en el botón add (añadir).
3) Introduce el subtítulo por teclado. Observa que en el listado se crea una entrada
con el texto y también se ofrece una vista previa en el visor de la película. Para
eliminar un texto se selecciona previamente en el listado y se pulsa en el botón
remove (eliminar). Es necesario tener en cuenta que el subtítulo se muestra por
defecto durante 3 segundos. Este valor se puede modificar en Options (opciones).
Si deseas ampliar la duración del subtítulo seleccionado utiliza los controles Start
Time y End Time (Tiempo de inicio y de fin).
4) Para guardar el proyecto pulsa en el botón save (guardar). Se muestra el cuadro
de diálogo Overstream Name Dialog (Save To Server) (Nombre de los subtítulos
para guardar en el servidor). Introduce un nombre y pulsa en OK.
5. Tras guardar el proyecto se mostrará el mensaje Overstream “título” created in the

database (Overstream “título” creado en la base de datos).
6. Pulsa sobre la pestaña Overstream Properties (Propiedades del Overstream). En esta

página conviene configurar los siguientes parámetros: Access Level (Nivel de acceso)
como Public, Subtitle Language (Idioma de Subtítulos) como Spanish, Tags
(Etiquetas) separados por comas, Ratings (Votaciones) y Comment (Comentarios)
activarlos o desactivarlos.
7. Para guardar los cambios introducidos en los parámetros de configuración pulsa en el

botón Save Overstream Properties (Guardar propiedades del OverStream)
8. Clic en el enlace My Overstream. Observa que aparece la entrada correspondiente a
los subtítulos recién creados. Para actualizar su contenido pulsa en el enlace Edit.
Para ver el resultado final pulsa en el enlace Play.
9. Debajo del reproductor se muestra un cuadro de texto con el código Embed.
10. Clic derecho y selecciona Copiar para copiar este código HTML al portapapeles.
11. Abre Kompozer y sobre un documento HTML nuevo selecciona Insertar > HTML.
12. En el cuadro de diálogo Insertar HTML haz clic derecho y selecciona Pegar.
14. Selecciona Archivo > Guardar introduce el título de la página y luego la carpeta
destino (por ejemplo miweb) y el nombre del archivo.
15. Desde el navegador web abre la página HTML creada para ver cómo se integra el
reproductor en ella.
5.9.2 Edición de vídeos con JumpCut
JumpCut (http://www.jumpcut.com) es un servicio web 2.0 que permite subir fotos y vídeos
para montar un clip de película que luego se puede compartir con otros usuarios.
Visita la web de JumpCut y regístrate para disponer de un nombre de usuario y contraseña.

Una vez que dispongas de ella introdúcelas para entrar en sesión. Si dispones de una cuenta
Yahoo es más que suficiente para acceder a este espacio.
1. Descarga y descomprime el contenido del archivo jumpcut.zip. Como resultado

obtendrás una carpeta jumpcut en cuyo interior dispones de varios fotografías de
paisajes.
2. Accede a la web de JumpCut y autentifícate como usuario.
3. Clic en el enlace Upload (Subir) que se muestra en el menú horizontal superior. Es
posible subir fotos, audios y vídeos pero en este caso vamos a subir sólo fotos.
4. Clic de nuevo en el botón gigante Upload. Se mostrará un cuadro de diálogo para

seleccionar los archivos que se cargarán. En la casilla Buscar en: despliega el combo
para seleccionar la carpeta jumpcut. Haz clic sobre la primera imagen y luego pulsa
la tecla <Mayus> y sin soltar haz clic sobre la última imagen. De esta forma se
seleccionan todas las imágenes. Para terminar pulsa en el botón Abrir.
5. Durante el proceso de subida se ofrece la posibilidad de decidir el tipo de visibilidad

(public) y los tags. A continuación haz clic en el enlace Done (Hecho).
6. Una vez concluido el proceso de subida se ofrece la posibilidad de elegir un estilo de
transición entre fotos (Pick a Style).
7. Si deseas publicar la película directamente sin más arreglos haz clic en el enlace
Publish My Movie (Publicar Mi Película). En el panel Publish define el título (Title) de
la película (por ejemplo: Paisajes de Asturias), las etiquetas o Tags (ejemplo:
asturias, paisajes, etc) y la visibilidad (Visibility), en este caso Public (Pública). Para
terminar haz clic en el botón Publish.
8. Se mostrará el visor del vídeo de Jumpcut donde puedes ver el aspecto final del
vídeo. Si deseas editarlo con mayor detalle pulsa en el botón Edit situado en la
esquina inferior derecha del visor.
9. Desde la página de edición que proporciona JumpCut es posible definir una transición
distinta para cada imagen, subir y añadir un audio, poner títulos, definir efectos, etc.
Si lo deseas puedes probar las distintas opciones. Para terminar Save (Guardar) que
aparece en la esquina inferior derecha de la página de edición.
10. Regresa al modo de reproducción del videoclip creado. Debajo del reproductor haz
clic en el enlace Post. Clic derecho sobre el cuadro de texto Player y selecciona la
opción Copiar.
11. Abre Kompozer y sobre un documento HTML nuevo selecciona Insertar > HTML.
12. En el cuadro de diálogo Insertar HTML haz clic derecho y selecciona Pegar.
14. Selecciona Archivo > Guardar introduce el título de la página y luego la carpeta
destino (por ejemplo miweb) y el nombre del archivo.
15. Desde el navegador web abre la página HTML creada para ver cómo se integra el
reproductor en ella.
JotForm: formularios en línea 475
5.10 JotForm:
formularios en línea
5.10 JotForm: formularios en línea

JotForm (http://jotform.com) es un sitio que permite crear formularios web susceptibles de
integrar en una página HTML. El diseño del formulario se realiza con facilidad mediante
arrastrar y soltar sus distintos elementos sobre la página: cuadros de texto, imágenes,
etiquetas, combos, botones, etc. Cada uno de estos elementos admite configuración de sus
propiedades para personalizar el resultado. El envío de los datos introducidos por el usuario
se puede recibir en una cuenta de correo electrónico o bien acceder a informes estadísticos
en varios formatos.
En esta práctica vamos a crear un formulario que luego integraremos en una página web para
recoger los datos de reserva de un aula de informática en nuestro centro. Las peticiones serán
recibidas en nuestro email.
Para crear y utilizar tus propios formularios en JotForm es necesario registrarse previamente.
Para ello visita su página, haz clic en Sign up y completa el formulario de registro.
5.10.1 Crear un formulario en JotForm
1. Abre el navegador web y visita la página de JotForm: http://jotform.com

2. Introduce tus credenciales de identificación y pulsa en el botón Login.
3. En la barra de botones superior haz clic en el botón My forms (Mis formularios).
4. Se muestra la ventana de edición del formulario. Clic en el botón New (nuevo).
5. En el cuadro de diálogo Form Wizard (Asistente de Formulario) selecciona un modelo,

por ejemplo, BLANK-Blank Form (en blanco) y pulsa en el botón inferior Next >>
(Siguiente).
6. A continuación elige un estilo. Para ello despliega el combo Theme y selecciona un

tema para tu formulario. Por ejemplo: Baby Blue. Para terminar pulsa en el botón
Finish
7. Ahora vamos a añadirle los elementos del formulario. En la siguiente tabla se recogen
los ítems que contendrá:
Etiqueta Tipo Características

Logo del centro Imagen URL absoluta
Profesor/a Textbox Requerido, Size=40, Max=100
Email Textbox Requerido, Validación=email, Size=40, Max=100
Asignatura DropDown Requerido, Matemáticas | Lengua Castellana |
Idioma | …
Aula solicitada DropDown Requerido, Aula 1 | Aula 2 | Aula 3 | Aula 4 …
Grupo DropDown Requerido, 1E1 | 1E2 | 1E3 | 2E1 …
Fecha DateTimePicker Requerido, Formato: ddmmyyyy (22012007)
Hora DropDown Requerido, 09:00-10:00, 10:00-11:00, …
Sistema RadioButton Windows XP, Windows Vista, Ubuntu Linux, Mac
operativo
Periféricos CheckBox Impresora | Portátil | Cañón | Pizarra interactiva
Observaciones TextArea Column Width=40, Rows=10
Enviar Button Submit Por defecto
8. Desde el cuadro de herramientas ToolBox arrastra el elemento TextBox para soltarlo

dentro del formulario por encima del botón Submit (Enviar) y por debajo del texto
“Drag and drop …” (Arrastra y suelta …)
9. Clic sobre este elemento para seleccionarlo. En el cuadro Properties (Propiedades)

define sus parámetros:
• Label (Etiqueta): Profesor/a
• Required (Requerido): yes
• Size (Tamaño): 40
• Max Size (Máximo tamaño): 100
• Validation (Validación): no
10. Para eliminar el texto Drag and drop questions … haz clic sobre él para seleccionarlo
y a continuación pulsa en el icono “X” en rojo que aparece a la derecha de su caja.
11. Repite los pasos anteriores para situar el resto de elementos del formulario:
• Email. Es un textbox (cuadro de texto) para recoger el email del solicitante.
• Label= Email.
• Required=yes.
• Size=40.
• Max Size=100.
• Validation= Email.
• Asignatura. Es un dropdown (cuadro desplegable) donde el usuario debe elegir la
asignatura para la que se realiza la petición.
• Label= Asignatura
• Required=yes
• Options = Matemáticas | Lengua Castellana | Idioma | Ciencias | Plástica |
Música … Cada una en línea aparte.
• Aula solicitada. En este dropdown (cuadro desplegable) el usuario elige el Aula
de informática a utilizar.
• Label= Aula solicitada
• Required=yes
• Options = Aula 1 | Aula 2 | Aula 3 …
• Grupo. Es un dropdown (cuadro desplegable) que recoge el grupo de alumnos con
que se ocupará el espacio solicitado.
• Fecha. Este elemento de tipo DateTimePicker permite al usuario seleccionar el

día en un calendario del mes.
• Label= Fecha
• Required=yes
• Format= ddmmyyyy
• Hora. En un dropdown (cuadro desplegable) se elige la hora de la sesión.
• Label= Hora
• Required=yes
• Options= 08:00-09:00 | 09:00-10:00 | …
• Sistema operativo. Se trata de un RadioButton (Botón de radio) que ofrece la
posibilidad de elegir una sola opción entre varias para indicar el sistema operativo
que se utilizará en ese espacio.
• Label= Sistema operativo
• Required=no
• Options= Windows XP | Windows Vista | Ubuntu Linux | Mac
• Periféricos. En este CheckBox (Casilla de verificación) el usuario podrá marcar
una o varias opciones (incluso todas) para indicar el equipamiento adicional que
necesitará en ese espacio.
• Label= Periféricos
• Options= Impresora | Portátil | Cañón proyector | Pizarra interactiva
• Observaciones. Mediante este TextArea (área de texto) se recoge información no
contemplada en los elementos anteriores.
• Label= Observaciones
• Required=no
• Column Width= 40 (Anchura del cuadro de texto).
• Rows=10 (Filas del cuadro de texto).
• Enviar. Es el botón de envío.
• Submit Text = Enviar.
12. Para insertar una imagen con el logo en la cabecera, abre la barra de herramientas
Power Tools (Herramientas avanzadas) y arrastra el elemento Image (Imagen) para
situarlo en el encabezado.
13. Selecciona el elemento imagen que has situado en En el apartado Properties

(Propiedades) de esa imagen introduce la URL de la imagen en la casilla Source-URL.
En las casillas Width (Anchura) y Height (Altura) escribe las dimensiones de la misma.
14. Para definir las propiedades generales del formulario haz clic en el botón Properties
situado en la barra de herramientas superior.
15. En el panel Properties define estos valores:
• Title (Título). Ejemplo: Reserva del Aula de Informática.
• Send Post Data (Enviar mensaje con datos): yes
• Send e-mail (Enviar mensaje): yes. Para desactivar el envío de datos a la
cuenta elige no.
• Email. Es la cuenta donde se recibirán los formularios.
• Form status (Status del formulario): Enabled. Para desactivar este formulario
puedes seleccionar Disabled.
16. Para comprobar su funcionamiento clic en el botón Preview (Vista previa). Puedes
rellenar el formulario y enviarlo para luego comprobar la recepción de datos en la
cuenta de correo indicada.
5.10.2 Integración HTML de un formulario JotForm
1. Navega al sitio web de JotForm: http://jotform.com

3. Clic en el botón my forms
4. En el panel My forms (Mis formularios) haz clic sobre el formulario Reserva de Aula
Informática y a continuación pulsa en el botón Source (Código).
5. En la Option 1: Embed Form into Your Site (Opción 1: Embeber Formulario en tu

sitio web) haz clic en el botón Copy para copiar al portapapeles el código que se
muestra: <iframe src= … > </iframe>
6. Abre Kompozer y sobre un documento web nuevo escribe el texto “Reserva del Aula
de Informatica” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde Jotform se ha pegado
9. Pulsa en el botón Guardar, introduce un título de página y guardarla en la carpeta
miweb, por ejemplo, con el nombre reserva.html
5.10.3 Consulta/publicación de resultados
JotForm permite la publicación web de los resultados estadísticos de los datos recogidos
desde el formulario.
1. Navega al sitio web de JotForm: http://jotform.com

3. Clic en el botón my forms
4. En el panel My forms (Mis formularios) haz clic sobre el formulario Reserva de Aula
Informática para seleccionarlo y a continuación pulsa en el botón Share (Compartir).
5. En la sección Share Results by Listings (Compartir resultados mediante listados) haz
clic en un tipo de listado. Los tipos de listado que se ofrecen son:
• Grid (Cuadrícula). Proporciona código para insertar en una página web los
resultados en formato cuadrícula.
• Calendar (Calendario). Ofrece código para insertar en la web los resultados
organizados en un calendario.
• RSS. Se dispone de un enlace para la suscripción a canales RSS con los resultados.
• Excel. Permite obtener un archivo XLS que se puede subir y enlazar en nuestra
página web.
6. Elige la opción Grid (Cuadrícula). Introduce el título del formulario en la casilla Title
y pulsa en el botón Check All para seleccionar todos los datos del formulario.
7. Clic en el botón Preview (Vista previa) para visualizar el informe de tipo Grid. Para
terminar pulsa en el botón Publish (Publicar).
8. En el segundo cuadro de código que se muestra You can get the iframe code and
embed to your site (Puedes conseguir el código iframe e integrarlo en tu sitio web),
haz clic en el botón Copy.
9. Abre Kompozer y sobre un documento web nuevo escribe el texto “Reservas

realizadas del Aula de Informatica” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde Jotform se ha pegado
miweb, por ejemplo, con el nombre listado.html
Servicios Web 2.0 – Polldaddy, encuestas en línea 484
5.11 Polldaddy,
encuestas en línea
5.11 Polldaddy: encuestas en línea

PollDaddy (http://www.polldaddy.com) es una herramienta en línea que permite crear de
forma libre y gratuita encuestas y situarlas en tu página web. Para crear tus encuestas es
necesario registrarse previamente. Para ello pulsa en el botón Sign up y completa el
formulario de inscripción.
1. Abre el navegador web y visita la página de PollDaddy: http://www.polldaddy.com

2. Clic en el botón log in, introduce tus credenciales de identificación y pulsa en el
botón Login.
3. Desde la página My polls (Mis encuestas) pulsa en el botón Create a Poll (crear una
encuesta) para crear una encuesta.
4. Please enter your poll question here. En este cuadro de texto introduce la pregunta
de la encuesta. Ejemplo: ¿Qué sueles comer durante el recreo?
5. Enter your answers here. Introduce tus respuesta aquí. Teclea en cada línea una
posible respuesta: Una bolsa de chips | Fruta | Bocadillo | Galletas o bollos | Nada.
En el apartado de Opciones puedes configurar algunas de estas opciones:
• Multiple Choice (Multiselección). Si activas esta opción el usuario podrá
elegir más de una respuesta.
• Allow ‘Other’ Answer. Permitir la respuesta ‘Otros’.
• Allow your voters to enter an answer of their own. Permitir que el usuario
introduzca su propia respuesta.
• Randomize Answers (Respuestas aleatorias). Las respuestas de la encuesta
aparecerán en un lugar diferente para cada usuario.
6. En la sección Poll Language (Idioma de la encuesta) selecciona como idioma Spanish.

7. Select a style for your poll. Marca la opción PollDaddy Style y luego selecciona una
máscara para la encuesta. Por ejemplo: White Plastic Standard.
8. Para terminar pulsa en el botón Save and Continue (Guardar y continuar).
9. En la página Poll HTML Code (Código HTML de la encuesta), pulsa sobre la pestaña
lateral derecha Flash Poll Method (Método Flash), haz clic derecho y elige
Seleccionar todo sobre el cuadro de texto que muestra el código <embed …>
</embed>. A continuación repite ese clic derecho para elegir la opción Copiar.
10. Abre Kompozer y sobre un documento web nuevo escribe el texto “La encuesta de la
semana” en formato Titulo 1.
derecho y elige Pegar. Observa que el código copiado desde PollDaddy se ha pegado
miweb, por ejemplo, con el nombre encuesta.html

Web20 Completo

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Web20 Completo

Diunggah oleh

Hak Cipta:

Format Tersedia

Servicios Web 2.

0 ::: Introducción 414

5. Servicios Web 2.0

5.2 Flickr: galería de

5.2 Flickr: galería de fotografías

Flickr (http://www.flickr.com) es un espacio donde se puedes administrar y compartir tus

La exploración de todas las posibilidades de Flickr excede el propósito de este curso. Se

5.2.2 Subir fotografías a Flickr

1. Descarga y descomprime el archivo flickr.zip a una carpeta del equipo. Como

5.2.3 Organizar en álbumes

3. Clic en la pestaña Álbumes y luego en el enlace Crear nuevo álbum.

5.2.4 Situar las fotos en el mapa (geolocalización)

5.2.5 Integración HTML de una imagen Flickr

3. Haz clic derecho sobre la fotografía y selecciona la opción Copiar la ruta de la

8. En el cuadro de diálogo Propiedades de la imagen haz clic derecho sobre el cuadro

5.2.6 Integración HTML de una presentación de fotografías Flickr

<iframe src="<url>" width="800" height="600"> </iframe>

9. Clic en el botón Insertar.

5.2.7 Integración HTML de un mapa de Flickr

6. Se muestra el cuadro de diálogo Vincular a esta mapa. Clic derecho sobre el

<iframe src="<url>" width="800" height="600"> </iframe>

5.3 Slide.com: presentación de imágenes

6. En el cuadro de diálogo Seleccione los archivos … navega para situarte dentro de la

7. Clic en el botón Abrir.

10. En el panel derecho Personaliza se pueden configurar interesantes opciones de la

11. Para terminar de configurar la presentación pulsa en el botón Guardar.

12. Si no te has registrado y autentificado Slide.com te ofrece la oportunidad de hacerlo.

5.4 SlideShare: Presentaciones en línea

1. Descarga y descomprime el archivo TIC_project.zip en el disco duro de tu equipo.

8. Selecciónalo y pulsa en el botón Abrir.

11. Para concluir el proceso de subida pulsa en el botón Publish.

5.5 BooMP3: audio

5.5 BooMP3: Audio en línea

5.5.1 ¿Qué es BooMP3?

5.5.2 Subir un archivo local

1. Descarga y descomprime el archivo africa.zip en el disco duro de tu equipo. Como

4. En el cuadro de diálogo Seleccione los archivos que se cargarán con Boomp3.

7. Para terminar pulsa en el botón Save (Guardar ).

1. Para subir un audio es imprescindible introducir una dirección de correo electrónico.

5.5.3 Integración HTML del reproductor de BooMP3

1. Abre el navegador Firefox y visita la web de BooMP3: http://boomp3.com

5. En el cuadro Posting player to your blog (Publicar el reproductor en tu blog) puedes

5.6 Multiply: repositorio

5.6 Multiply: repositorio de archivos

Sitio URL Capacidad Tráfico Por archivo

Capacidad: Capacidad total de almacenamiento por cuenta

A continuación se describe el procedimiento para utilizar un repositorio como Multiply para

5.6.1 Registrarse como usuario en Multiply

1. Accede a la web de Multiply en la dirección: http://multiply.com

5.6.2 Subir e integrar una imagen al repositorio Multiply

1. Descarga y descomprime el archivo multiply.zip a la carpeta c:\multiply. Como

Para que funcione correctamente la subida de archivos es necesario tener instalado en el

• Elegir fotos. Pulsa en el botón Choose Photos (Elige fotos). Se muestra un

6. En el panel Album Details (Detalles del Album) introduce:

7. Clic en el botón Save & Publish (Guardar y publicar).

3. Subir e integrar un audio al repositorio Multiply

1. Accede al sitio web Multiply (http://multiply.com) y utiliza tus credenciales

6. En el panel Playlist Details (Detalles de la lista de reproducción) introduce:

• Playlist Name (Nombre de la lista). Ejemplo: Música de danza

7. Clic en el botón Save & Publish para terminar.

4. Subir e integrar un vídeo al repositorio Multiply

1. Descarga y descomprime paisajes.zip para obtener el archivo paisajes.wmv en una

5. Multiply puede alojar vídeos procedentes de 3 tipos distintos de fuentes:

Comment Voting (Votaciones).

Video Responses (Vídeos relacionados).