You are on page 1of 71

Multimedia y Web 2.0 Imagen digital.

Integracin

Contenido
Imagen II (Integracin) .................................................................................................................. 3 Objetivos ................................................................................................................................... 3 Flickr: galera de fotos ............................................................................................................... 4 Subir fotografas a Flickr ........................................................................................................ 5 Organizar en lbumes ........................................................................................................... 8 Publicacin de una imagen Flickr en el blog ......................................................................... 9 Publicacin de presentacin Flickr en Blogger.................................................................... 14 Publicacin de presentacin Flickr en Wordpress .............................................................. 17 Picasa Web, lbums de fotos .................................................................................................. 19 Subir fotografas a Picasa Web I .......................................................................................... 21 Subir fotografas a Picasa Web II ......................................................................................... 24 Publicacin de una imagen Picasa en el blog ...................................................................... 32 Publicacin de presentacin Picasa en Blogger .................................................................. 37 Publicacin de presentacin Picasa en Wordpress ............................................................. 40 Slide.com: presentaciones de fotos ........................................................................................ 42 Crear una presentacin Slide .............................................................................................. 42 Publicar la presentacin Slide en Blogger ........................................................................... 47 Publicar la presentacin Slide en Wordpress ...................................................................... 49 Slideshare: presentaciones en lnea .................................................................................... 52 Subir una presentacin a Slideshare.net............................................................................. 52 Publicar un Slideshare en Blogger ....................................................................................... 55 Publicar un Slideshare en Wordpress ................................................................................. 58 Google Maps ........................................................................................................................... 60 Crear un mapa en GMap ..................................................................................................... 60 Publicar un mapa Google en Blogger .................................................................................. 64 Publicar un mapa Google en Wordpress............................................................................. 67 Actividades .............................................................................................................................. 70

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Imagen II (Integracin)

Existen mltiples servicios Web 2.0 que permiten crear una cuenta de usuario para subir tus fotografas. Estas imgenes se pueden organizar por albumes, asociarles etiquetas para facilitar su bsqueda, compartirlas con los dems, geolocalizarlas en un mapa de Google Maps, crear presentaciones o animaciones que las muestren, etc, etc. Flickr o Picasa, entre otros, son espacios que ofrecen todas estas prestaciones. Adems es posible integrar y mostrar en las entradas de tu blog las imgenes que se encuentren alojadas en estos sitios.

Objetivos

Objetivo general Integrar en el blog imgenes a partir de archivos grficos propios o ajenoa alojados en un servicio Web 2.0 como Flickr, Picasa, Slide.com, etc. Objetivos especficos

Crear una cuenta en Flickr o Picasa para subir las imgenes de tu cmara digital organizndolas en lbumes. Integrar en tu blog una imagen o presentacin de imgenes alojadas en Flickr o Picasa. Disear una presentacin de fotografas en Slide.com aadiendo estilos grficos y transiciones adecuados a la temtica. Mostrar una presentacin de imgenes de Slide.com en una entrada de tu blog. Subir a una cuenta personal en SlideShare.net una presentacin de diapositivas elaborada previamente con Powerpoint u OpenOffice Impress para compartirla con los dems. Embeber en una entrada de tu blog una presentacin propia o ajena alojada en Slideshare.net Crear un mapa Google Maps que contenga algunos marcadores con ttulo, texto, imagen y enlace. Enlazar o embeber un mapa personalizado de GMaps en una entrada de tu blog.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Requisitos previos

Para abordar este mdulo con ciertas garantas es necesario dominar previamente las siguientes competencias:

Utilizar un navegador web para localizar informacin en internet utilizando un buscador como Google. Descargar y organizar en una carpeta del equipo imgenes obtenidas de Internet o de una cmara digital. Disear una presentacin bsica con OpenOffice Impress o Microsoft Powerpoint.

Flickr: galera de fotos


Flickr (http://www.flickr.com) es un servicio Web 2.0 donde puedes administrar y compartir tus fotos en lnea. Las caractersticas ms destacadas de este servicio son:

Subir fotos. Puedes hacerlo desde tu equipo, envindolas por correo electrnico o utilizando el telfono mvil con su cmara. Organizar. Clasifica las fotos en colecciones o lbumes. A cada imagen se le puede asignar una etiqueta para facilitar su bsqueda. 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 dems. Publicaciones. Puedes elaborar tarjetas, albumes, marcos, etc utilizando las imgenes subidas. Mantenerse en contacto. Para enviar y recibir informacin sobre las actualizaciones de fotografas de familiares y amigos.

La exploracin de todas las posibilidades de Flickr excede el propsito de estos materiales. Se propone centrarse en la utilizacin de estas imgenes en lnea en los artculos de tu blog. Tambin admite la subida de vdeos pero esta prestacin no se cita. Para utilizar Flickr es necesario disponer de una cuenta en Yahoo. Desde la portada de Flickr se puede crear una pulsando en el botn Crear tu cuenta.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Subir fotografas a Flickr

Descarga y descomprime el archivo gallery.zip a una carpeta del equipo. Como resultado de esta tarea se obtendr una coleccin de fotografas para ser subidas a Flickr. Abre Mozilla Firefox y visita la web de Flickr en la URL: http://www.flickr.com. Clic en el enlace Iniciar sesin e introduce tus credenciales Yahoo. Desde la portada selecciona T > Cargar fotos y vdeos

Clic en el enlace del Paso 1: Elegir fotos y vdeos

Ministerio de Educacin. ITE |Multimedia y Web 2.0

En el cuadro de dilogo Seleccione los archivos ... despliega la lista Buscar en: para situarte en la carpeta galera anteriormente descargada y descomprimida. Clic en la primera imagen, mantn pulsada la tecla Mayus y sin soltar haz clic en la ltima imagen. De esta forma seleccionars todas las imgenes. Clic en el botn Abrir.

Se muestra un cuadro de dilogo donde aparecen seleccionadas las fotos elegidas. Si pulsas en Agregar ms podrs aadir ms a este listado.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Puedes decidir si las fotos sern Pblicas (opcin recomendada y por defecto) o bien Privadas.

Para continuar pulsa en el botn Cargar fotos y vdeos. Transcurridos unos minutos se mostrar el mensaje de xito en la subida y un enlace de acceso para aadir descripciones a las fotos. Si haces clic en l se mostrar una pgina donde es posible definir para cada una: ttulo, descripcin y etiquetas.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Los datos que ya existen para cada imagen fueron generados por Flickr a partir de los metadatos contenidos en el archivo de cada imagen subida. En esta pgina es posible modificarlos. Para terminar no olvides pulsar en el botn Guardar situado en la parte ms inferior de la pgina. Las fotos estarn disponibles en la opcin de men: Tu > Tu galera.

Nota:

Otra opcin para subir fotos es utilizar el Uploader bsico cuyo enlace de acceso se ofrece desde la pgina Cargar fotos y vdeos

Organizar en lbumes

Si no ests autentificado debes hacer clic en el enlace Iniciar sesin e introduce tus credenciales Yahoo. Desde el men superior horizontal haz clic en la opcin Organizar. Tras unos segundos de carga se mostrar el organizador de Flickr.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Clic en la pestaa lbumes y luego en el enlace Crear nuevo lbum. Desde el panel de nuevo album:

Introduce el ttulo del lbum, p.e.: "Mi viaje por Asturias". Para aadir fotografas a este nuevo lbum debes arrastrar las imgenes que aparecen en la franja inferior al panel derecho superior. Arrastra una imagen del lbum al cuadrado visor que aparece sobre el ttulo. Esta ser la imagen que represente el albm. Pulsa en el botn Guardar.

Publicacin de una imagen Flickr en el blog

Si no ests autentificado debes hacer clic en el enlace Iniciar sesin e introduce tus credenciales Yahoo. Desde la pgina Tus fotos selecciona una imagen haciendo clic sobre ella para visualizarla en solitario. Por ejemplo, sobre la foto del Faro de Cudillero.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

Haz clic derecho sobre la fotografa y selecciona la opcin Copiar la ruta de la imagen. Esta accin copiar al portapapeles la URL absoluta a la imagen almacenada en tu cuenta de Flickr.

Insertar la imagen en Blogger

Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Faro de Cudillero En el editor de artculos pulsa en el botn Aadir imagen.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

10

En el cuadro de dilogo Blogger: Subir imgenes, en el apartado Aadir una imagen de la web, haz clic derecho sobre el cuadro de texto URL y selecciona Pegar.

Esta tarea pegar la URL absoluta de la imagen. Elige un diseo de alineacin (Ninguno) y un tamao de imagen (Grande) y haz clic en el botn SUBIR IMAGEN. Al cabo de unos segundos se mostrar en la Vista preliminar y un mensaje de que se ha aadido su imagen. Clic en el botn FINALIZADO.

Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente texto descriptivo:

Conocido como "El guardin del vrtigo", el faro de Cudillero se asienta en la Punta Roballera sobre un acantilado a ms de 75 m. sobre el nivel del mar. Situado al este del puerto pesquero se accede a l gracias a un camino peatonal. Con ms de un siglo de existencia ha experimentado distintas reformas algunas de las cuales fueron en su momento reivindicadas por los lugareos en el cancionero popular: ""El faro de Cudillero lo van a poner ms alto, pa que alumbre a los marinos y no se pierdan los barcos".

Ministerio de Educacin. ITE |Multimedia y Web 2.0

11

Clic en el botn PUBLICAR Para ver el aspecto del artculo haz clic en el enlace Ver Blog.

ENTRADA.

Nota: El procedimiento descrito se puede utilizar para mostrar en un artculo del blog cualquier imagen que encontremos en Internet. Basta con hacer clic derecho sobre ella en el navegador web para elegir la opcin Copiar la ruta de la imagen. De esta forma dispondremos de su URL absoluta para luego aadirla en nuestro artculo del blog siguiendo los pasos explicados.

Insertar la imagen en Wordpress


Accede al interfaz de gestin de contenidos de tu blog en Wordpress.com. Selecciona Entradas > Aadir.

Aade como ttulo: Faro de Cudillero


En el editor de artculos pulsa en el botn Aadir una imagen.

En el cuadro de dilogo haz clic en la pestaa Desde una URL. Clic derecho sobre el cuadro URL de la imagen y selecciona Pegar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

12

Introduce como Texto alternativo en este caso: Faro de Cudillero. Pulsa en el botn Insertar en la entrada

Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente texto descriptivo: Conocido como "El guardin del vrtigo", el faro de Cudillero se asienta en la Punta Roballera sobre un acantilado a ms de 75 m. sobre el nivel del mar. Situado al este del puerto pesquero se accede a l gracias a un camino peatonal. Con ms de un siglo de existencia ha experimentado distintas reformas algunas de las cuales fueron en su momento reivindicadas por los lugareos en el cancionero popular: ""El faro de Cudillero lo van a poner ms alto, pa que alumbre a los marinos y no se pierdan los barcos".

Clic en el botn Publicar. Para ver el aspecto del artculo haz clic en el enlace Vista previa

Ministerio de Educacin. ITE |Multimedia y Web 2.0

13

Nota:

El procedimiento descrito se puede utilizar para mostrar en un artculo del blog cualquier imagen que encontremos en Internet. Basta con hacer clic derecho sobre ella en el navegador web para elegir la opcin Copiar la ruta de la imagen. De esta forma dispondremos de su URL absoluta para luego aadirla en nuestro artculo del blog siguiendo los pasos explicados.

Publicacin de presentacin Flickr en Blogger

Si no ests autentificado en Flickr debes hacer clic en el enlace Iniciar sesin e introduce tus credenciales Yahoo. En la barra de mens de Flickr selecciona T > Tus lbumes.

A continuacin haz clic sobre el lbum creado anteriormente. Una vez dentro del lbum observa que existe un enlace con el texto Presentacin. Si se hace clic en este enlace se mostrar una presentacin con la secuencia de fotografas que forman parte del lbum.

Durante la visualizacin de la presentacin haz clic en el enlace Compartir situado en la esquina superior derecha de la presentacin. Esta accin mostrar el cuadro Compartir esta presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

14

Existen dos formas de integrar una presentacin de fotos de Flickr en una pgina de tu blog:

Opcion A Marco interno: Utilizando una etiqueta iframe (marco interno) que apunte a la direccin URL de esa presentacin. Opcin B Visor de Flash. Utilizando el objeto de Flash con el visor que ofrece el propio servidor Flickr.

Segn el mtodo utilizado:


Opcin A Marco interno: En el cuadro de texto Seleccionar la direccin URL: haz clic en el botn Copiar en el portapapeles. Opcin B Visor de Flash. En el cuadro de texto Seleccionar el cdigo HTML pulsa en el botn Copiar en el portapapeles.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

15

Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Mis viajes por Asturias En el editor haz clic en el enlace Edicin de HTML para mostrar el cdigo HTML del artculo.

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. Si has optado por la opcin A Marco interno en el cuadro de dilogo Insertar HTML debes crear un marco interno (IFRAME) que apunte a esta URL absoluta que hemos pegado. Para ello escribe:

<iframe src="<url>" width="400" height="300"> </iframe> donde <url> es la direccin entre comillas que hemos copiado. Los atributos width y height definen el tamao del marco interno.

Si has optado por la opcin B Visor de Flash y ya has pegado el cdigo <object ...> no ser necesario hacer nada ms.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

16

Clic en el botn PUBLICAR ENTRADA.

Pulsa en el enlace Ver blog para comprobar cmo se visualiza la presentacin.

Publicacin de presentacin Flickr en Wordpress

Si no ests autentificado en Flickr debes hacer clic en el enlace Iniciar sesin e introduce tus credenciales Yahoo. En la barra de mens de Flickr selecciona T > Tus lbumes.

A continuacin haz clic sobre el album creado anteriormente. Una vez dentro del lbum observa que existe un enlace con el texto Presentacin. Si se hace clic en este enlace se mostrar una presentacin con la secuencia de fotografas que forman parte del lbum.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

17

Durante la visualizacin de la presentacin haz clic en el enlace Compartir situado en la esquina superior derecha de la presentacin. Esta accin mostrar el cuadro Compartir esta presentacin.

En el cuadro de texto Seleccionar la direccin URL pulsa en el botn Copiar en el portapapeles. Wordpress NO permite copiar y pegar cdigo HTML del tipo iframe o bien object/embed por razones de seguridad. Por este motivo vamos a crear un enlace en el artculo a la direccin o URL de la presentacin de imgenes en Flickr. Accede al interfaz de administracin de Wordpress y elige Entradas > Aadir. Introduce como ttulo: Mis viajes por Asturias. Teclea el texto: "Ver presentacin de fotografas". Selecciona este texto y pulsa en el botn Insertar/Editar enlace del editor.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

18

Haz clic derecho sobre el cuadro de texto URL del enlace y elige Pegar. Introduce como Ttulo, por ejemplo, Mis viajes por Asturias.

Clic en el botn Insertar. De regreso a la edicin del artculo haz clic en el botn Publicar. Pulsa en el enlace Ver entrada para comprobar cmo se visualiza el artculo y la presentacin de fotografas.

Picasa Web, lbums de fotos


Picasa Web (http://picasaweb.google.com/) es un servicio Web 2.0 asociado a las credenciales de usuario Google donde puedes administrar y compartir tus fotos en lnea. Las caractersticas ms destacadas de este servicio son:
Ministerio de Educacin. ITE |Multimedia y Web 2.0 19

Subir fotos en lnea. Puedes hacerlo desde tu equipo utilizando el programa instalado Picasa o bien desde el navegador web o incluso envindolas por correo electrnico. Organizar. Clasifica las fotos en lbumes. A cada imagen se le pueden asignar etiquetas para facilitar su bsqueda. Compartir. Es posible compartir tus fotos con todo el mundo, slo con los amigos que desees o mantenerlas en privado. Picasa incorpora la posibilidad de asociar una licencia Creative Commons a cada foto o lbum indicando las condiciones de uso. Mapas. La integracin con Google Maps y Google Earth facilitan aadir a tus fotos informacin de su ubicacin geogrfica y verlas en el mapa. Sincronizacin. Picasa y Albumes web de Picasa pueden trabajar de forma sincronizada para garantizar que los cambios realizados en tu equipo se reflejan tambin en los lbumes online.

En un principio hemos de distinguir claramente entre Picasa que es el software que se instala en el equipo para manejar y editar nuestros archivos de fotos en local y por otra parte Picasa Web que es la aplicacin web que nos permite almacenarlas en un servidor remoto para compartirlas con los dems. La exploracin de todas las posibilidades de ambas aplicaciones excede el propsito de este material. Por ello se propone incidir especialmente en la integracin de estas imgenes en lnea en los artculos de tu blog. Para utilizar Picasa Web es necesario disponer de una cuenta en Google. Si ya dispones de credenciales para tu blog de Blogger conviene que utlices las mismas. Existen dos formas alternativas para acceder a Picasa Web:

Visita la URL de Picasa Web: http://picasaweb.google.com/ e introduce tus credenciales Google. Visita la URL de de Blogger: http:///www.blogger.com e introduce tus credenciales Google. A continuacin haz clic en Mi cuenta y luego en Albumes Picasa Web.

Al entrar por primera vez a Picasa Web y haber realizado los ejercicios del mdulo de Blogs con Blogger vers que ya dispones de algunas fotos subidas en tu cuenta. Esto es debido a que cuando subes imgenes en los artculos de tu blog en Blogger, stas se guardan automticamente en un lbum de Picasa Web con el nombre asignado al blog. Desde Picasa Web puedes administrar estas fotos pero hazlo con cautela porque si eliminas una fotografa desde aqu puede ocurrir que sta no se vea luego en el correspondiente artculo de tu blog.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

20

Subir fotografas a Picasa Web I

A continuacin se explica el procedimiento para subir fotos a tu cuenta de Picasa Web utilizando el navegador web. Descarga y descomprime el archivo gallery.zip a una carpeta del equipo. Como resultado de esta tarea se obtendr una coleccin de las fotos. Visita la web de Picasa Web en la URL: http://picasaweb.google.com/ e introduce tus credenciales Google. Se muestra una pgina con los lbumes que ya tenemos en Picasa Web. Vamos a subir todas las imgenes a un lbum independiente. Clic en el botn Subir.

En el cuadro de dilogo Subir fotos puedes seleccionar un lbum existente o crear uno nuevo. Para elegir uno haz clic en la entrada correspondiente y pulsa en el botn Seleccionar lbum. En este caso se propone crear un lbum nuevo. Para ello haz clic en el enlace crea uno nuevo.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

21

Introduce como Ttulo el siguiente texto: Mis viajes por Asturias.

Clic en la opcin Pblico en el apartado de Visibilidad para este lbum. Para terminar haz clic en el botn Continuar. Selecciona cada archivo de imagen pulsando en el botn Examinar... y localizando cada uno de los archivos obtenidos del ZIP anterior. Puedes subir hasta 5 imgenes en cada intento.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

22

Observa que en la columna derecha se muestran los lmites de subida: 500 fotos por lbum y un espacio mximo total de 1 GB (1024 MB) para todos los lbumes subidos.

Clic en el botn Iniciar subida. Transcurridos unos instantes se mostrar una pgina con las fotos subidas en el nuevo lbum. Repite los pasos anteriores para subir el resto de imgenes pero ahora eligiendo el mismo lbum.

Dentro del lbum se pueden editar algunos de sus parmetros en el men Editar:
Ministerio de Educacin. ITE |Multimedia y Web 2.0 23

Propiedades del lbum. Permite modificar el ttulo, fecha de creacin, visualizacin pblica o privada, etc. que se ha establecido al crear el lbum. Tapa del lbum. Ofrece la posibilidad de elegir la imagen que representar al lbum en el listado de lbumes. Mapa del lbum. Se accede a un mapa Google donde es posible situar cada una de las fotos. Ttulos. Si deseas modificar el ttulo descriptivo que acompaa a cada imagen. Eliminar lbum. Para eliminar el lbum y liberar el espacio ocupado en el servidor. Organizar y cambiar orden. Esta opcin da paso a un interfaz que permite redefinir el orden secuencial en que se mostrarn las fotos mediante "arrastrar y colocar".

Clic en el botn Presentacin de diapositivas para ver una proyeccin que muestra la secuencia de fotos contenidas en el lbum.

Los lbumes guardados se encuentran haciendo clic en la pestaa Mis fotos.

Subir fotografas a Picasa Web II

En este apartado vamos a explicar el procedimiento para crear un lbum y subir las imgenes a Picasa Web desde tu equipo utilizando el programa Picasa 3.
Ministerio de Educacin. ITE |Multimedia y Web 2.0 24

Instalacin de Picasa 3 en Windows


Descarga e instala en tu equipo el instalador picasa3-setup.exe del programa Picasa 3. Como resultado de este proceso de instalacin obtendrs en el escritorio de tu equipo el icono de acceso directo al programa. Tambin puedes descargar la ltima versin en la web de Google Picasa: http://picasa.google.com/intl/es/

Instalacin de Picasa 3 en Ubuntu


Descarga e ejecuta en tu equipo el instalador picasa_3.0-current_i386.deb. Como resultado del proceso de instalacin obtendrs un acceso al programa mediante Aplicaciones > Grficos > Picasa > Picasa. Tambin puedes descargar la ltima versin en la web de Google Picasa para Linux: http://picasa.google.com/linux/

Subir imgenes a Picasa Web


Descarga y descomprime el archivo fauna.zip a una carpeta del equipo. Como resultado de esta tarea dispondrs de una carpeta con el nombre fauna y en su interior podrs encontrar una coleccin de las fotos sobre animales salvajes. Inicia el programa Picasa 3. En primer lugar comprueba si la carpeta fauna se encuentra en la lista de carpetas que se muestra en la columna izquierda de Picasa.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

25

Si no es as elige Archivo > Aadir carpeta a Picasa. En el Administrador de carpetas localiza y selecciona la carpeta fauna en el listado de carpetas y en la columna derecha activa la opcin Explorar una vez o bien Explorar siempre. Pulsa en el botn Aceptar.

En la seccin Carpetas se mostrar una nueva carpeta con el nombre fauna y al hacer clic sobre ella, en el panel derecho se mostrarn las imgenes que contiene.

En la columna de Carpetas haz clic derecho sobre el nombre de esta carpeta y elige la opcin Seleccionar todas las imgenes.
Ministerio de Educacin. ITE |Multimedia y Web 2.0 26

En la esquina inferior izquierda se mostrar la coleccin de miniaturas correspondiente a la seleccin de fotos realizada. Clic en el botn de lbumes que se muestra y selecciona Nuevo lbum.

En el cuadro del dilogo Propiedades del lbum introduce como Nombre el siguiente: Fauna africana y haz clic en el botn Aceptar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

27

Tras esta accin se habr creado una entrada en la columna de lbumes disponibles.

Para subir este lbum haz clic derecho sobre l y elige la opcin Subir a los lbumes web ...

Ministerio de Educacin. ITE |Multimedia y Web 2.0

28

Introduce las credenciales de acceso a tu cuenta en Picasa Web y pulsa en el botn Acceder.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

29

Se crea el nuevo lbum en Picasa Web y se ofrecen, entre otros, los siguientes parmetros de configuracin: a. Tamao para subir. En este caso vamos a elegir Pequeo: 640 pxeles (blogs y pginas web) porque ser el destino final de publicacin de algunas de estas imgenes. b. Visibilidad para este lbum. En este caso elegiremos Pblico.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

30

Clic en el botn Subir. Se inicia un proceso de subida progresiva de las distintas imgenes que se muestra en el Administrador de subidas.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

31

Al finalizar el proceso con xito se mostrar un mensaje de proceso finalizado. Clic en el botn Ver online y cierra la ventana del Administrador de subidas.

Se abrir el navegador web configurado por defecto en el equipo mostrando esta galera subida a Picasa Web. Cuando una imagen ha sido subida del equipo local a Picasa Web en su vista previa en Picasa 3 se mostrar un icono de una flecha verde apuntando hacia arriba para indicar esta circunstancia.

Publicacin de una imagen Picasa en el blog

Obtener la URL de la imagen


Si no ests autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botn Acceder. Al acceder autentificado se mostrar la pgina Mis fotos donde son accesibles los lbumes que tenemos subidos al servidor. Clic sobre el lbum Fauna africana creado con anterioridad para abrirlo.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

32

Selecciona una imagen del lbum haciendo clic sobre ella para visualizarla en solitario. Por ejemplo, sobre la foto del buitre. Se puede obtener la URL absoluta de la fotografa mediante clic derecho sobre la fotografa y seleccionando la opcin Copiar la ruta de la imagen. Esta accin copiar al portapapeles la URL absoluta a la imagen almacenada en tu cuenta de Flickr. El principal inconveniente es que quizs esta imagen sea muy grande para incrustar en un artculo de tu blog.

Otra posibilidad es utilizar la URL de embed que se ofrece en la columna derecha donde se muestra la imagen. Esta opcin nos permitir elegir el tamao de la imagen que deseamos utilizar en nuestro blog. Para ello haz clic en Enlace a esta foto. Despliega el combo Seleccionar tamao para elegir un tamao, por ejemplo, de 400 pxeles.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

33

Clic sobre el cuadro de texto Incrustar imagen para seleccionar todo el cdigo HTML que se ofrece. A continuacin haz clic derecho y elige Copiar. Abre el Bloc de Notas y elige Edicin > Pegar. Esta accin pegar el cdigo completo en un documento para su posterior manipulacin. Aunque se podra pegar completo en el cdigo HTML de un artculo, en este caso nos vamos a quedar nicamente con la URL absoluta a la imagen en el tamao seleccionado.

Selecciona la URL a la imagen que viene a continuacin de la etiqueta <img src="... Es la direccin que est entre comillas pero sin incluirlas. A continuacin elige Edicin > Copiar.

Insertar la imagen en una entrada de Blogger


Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: El buitre En el editor de artculos pulsa en el botn Aadir imagen.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

34

En el cuadro de dilogo Blogger: Subir imgenes, en el apartado Aadir una imagen de la web, haz clic derecho sobre el cuadro de texto URL y selecciona Pegar.

Esta tarea pegar la URL absoluta de la imagen. Elige un diseo de alineacin (Ninguno) y un tamao de imagen (Grande) y haz clic en el botn SUBIR IMAGEN. Al cabo de unos segundos se mostrar en la Vista preliminar y un mensaje de que se ha aadido su imagen. Clic en el botn FINALIZADO.

Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente texto descriptivo: Los buitres son aves rapaces que suelen alimentarse nicamente de animales muertos, aunque a falta de estos, son capaces de cazar piezas vivas. Los buitres se encuentran distribuidos por todos los continentes, excepto la Antrtida y Oceana. Son de gran tamao y estn adaptados para volar a gran altura.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

35

Clic en el botn PUBLICAR Para ver el aspecto del artculo haz clic en el enlace Ver Blog.

ENTRADA.

Insertar la imagen en una entrada de Wordpress


Desde el interfaz de gestin de contenidos de tu blog en Wordpress elige la opcin Entradas > Aadir para crear una nueva entrada. Aade como ttulo: El buitre En el editor de artculos pulsa en el botn Aadir una imagen.

En el cuadro de dilogo Aadir una imagen, haz clic en la pestaa Desde una URL. Haz clic derecho sobre el cuadro de texto URL de la imagen y selecciona Pegar.

Esta tarea pegar la URL absoluta de la imagen. Introduce el Texto alternativo


Ministerio de Educacin. ITE |Multimedia y Web 2.0 36

de la imagen. Clic en el botn Insertar en la entrada que se muestra en este panel.

Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente texto descriptivo: Los buitres son aves rapaces que suelen alimentarse nicamente de animales muertos, aunque a falta de estos, son capaces de cazar piezas vivas. Los buitres se encuentran distribuidos por todos los continentes, excepto la Antrtida y Oceana. Son de gran tamao y estn adaptados para volar a gran altura.
Clic en el botn Para ver el aspecto del artculo haz clic en el enlace Ver Entrada. Publicacin de presentacin Picasa en Blogger Publicar.

Si no ests autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botn Acceder. Al acceder autentificado se mostrar la pgina Mis fotos donde son accesibles los lbumes que tenemos subidos al servidor. Clic sobre el lbum Fauna africana creado con anterioridad para abrirlo.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

37

Una vez dentro del lbum haz clic en Enlazar a este lbum. Se mostrar los enlaces para enviar por correo electrnico o para embeber en tu blog una imagen con un enlace al lbum en Picasa Web.

Clic en el enlace Incrustar proyeccin de diapositivas. Se muestra el cuadro de dilogo Crear una presentacin de diapositivas.

Elige como tamao de la presentacin Grande 400 px. y marca las opciones Mostrar ttulos y Reproducir automticamente. Selecciona el cdigo HTML mediante clic derecho y elegir Seleccionar todo. De nuevo haz clic derecho para elegir Copiar. Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Fauna africana En el editor haz clic en el enlace Edicin de HTML para mostrar el cdigo HTML del artculo.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

38

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Clic en el botn PUBLICAR ENTRADA.

Pulsa en el enlace Ver blog para comprobar cmo se visualiza la presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

39

Publicacin de presentacin Picasa en Wordpress

Si no ests autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botn Acceder. Al acceder autentificado se mostrar la pgina Mis fotos donde son accesibles los lbumes que tenemos subidos al servidor. Clic sobre el lbum Fauna africana creado con anterioridad para abrirlo.

Una vez dentro del lbum haz clic en Enlazar a este lbum. Se mostrar los enlaces para enviar por correo electrnico o para embeber en tu blog una imagen con un enlace al lbum en Picasa Web.

Selecciona el cdigo HTML que se ofrece en la casilla Copiar el HTML para inscrustarlo en el sitio web. Haz clic derecho y elige Seleccionar todo. De nuevo haz clic derecho para elegir Copiar.
Ministerio de Educacin. ITE |Multimedia y Web 2.0 40

Accede al interfaz de gestin de contenidos y selecciona Entradas > Aadir para crear un nuevo artculo. Aade como ttulo: Fauna africana Clic en el pestaa HTML para acceder al cdigo HTML de la entrada.

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Clic en el botn Publicar

Ministerio de Educacin. ITE |Multimedia y Web 2.0

41

Pulsa en el enlace Ver entrada para comprobar cmo se visualiza la presentacin.

Slide.com: presentaciones de fotos


Slide.com (http://www.slide.com) es un servicio web 2.0 que nos permite subir una coleccin de imgenes y luego obtener en lnea una atractiva presentacin que las muestra de forma secuencial y con efectos especiales. Esta presentacin tendr una URL que podemos compartir con otras personas. Tambin es posible integrarla dentro de una pgina web o artculo de un blog. Este servicio puede resultar interesante para publicar las fotos de los distintos eventos en que participes.
Crear una presentacin Slide

Descarga y descomprime el archivo gallery.zip en una carpeta del disco duro. Como resultado de esta tarea dispondrs de una coleccin de fotografas para crear tu presentacin. Otra posibilidad es utilizar una coleccin propia. Abre el navegador web Firefox y visita la web de Slide.com: http://www.slide.com Se puede crear una presentacin sin necesidad de registrarse como usuario de este servicio. Sin embargo conviene registrarse haciendo clic en el enlace
Ministerio de Educacin. ITE |Multimedia y Web 2.0 42

Regstrate para poder editar en cualquier momento las presentaciones creadas. Para ello introduce tu email y la contrasea. Una vez completado el registro, en el formulario ENTRAR introduce estos datos para autentificarte. Clic en el botn Crear un Slide Show o bien en ingls Make a Slide Show.

En la pestaa Mis archivos haz clic en el botn Busca para subir las imgenes desde el equipo.

En el cuadro de dilogo Seleccione los archivos ... navega para situarte dentro de la carpeta anterior. Puedes seleccionar un solo archivo con hacer clic sobre l. Para aadir, uno a uno, a la seleccin pulsa previamente la tecla Ctrl y sin soltarla vete haciendo clic sobre los archivos que deseas elegir. Para aadir una lista de archivos: haz clic en el primero, pulsa la tecla Mayus y sin soltarla haz clic en el ltimo. Vers que se seleccionan todos. Utiliza este truco para elegir todos los archivos de imagen de esta carpeta.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

43

Clic en el botn Abrir. Transcurridos unos segundos se habrn subido estas imgenes al servidor remoto. Una vez finalizado el proceso se mostrar el mensaje Subida terminada. En la vista previa de la presentacin que se muestra en la parte superior de la pgina ya aparecen estas imgenes. En el panel inferior donde se muestran las imgenes subidas se puede realizar los siguientes ajustes:

Nombre de Slide Show: Mi viaje por Asturias Pies de foto: Escribe el pie de pgina para cada fotografa ya que por defecto se sita el nombre del archivo. Orden de las fotografas. Arrastra las imgenes para colocarlas en el orden en que se mostrarn. Azar. Si activas esta casilla las fotos se mostrarn de forma aleatoria.

En el panel derecho Personaliza se pueden configurar interesantes opciones de la presentacin:

Estilo, Temas y Skins: puedes combinar las distintas opciones de estos parmetros para conseguir presentaciones ms personalizadas. En la pestaa Estilo se puede activar la casilla Azar para que se muestre cada vez con un

Ministerio de Educacin. ITE |Multimedia y Web 2.0

44

estilo aleatorio y desplegar la lista Rapidez para elegir la velocidad de la animacin: Fast, Medium y Show (Rpido, Medio y Lento).

Msica: permite elegir una msica de fondo entre un amplio repertorio de melodas. Si desactivas la casilla Toca automticamente en Slide Show la msica no sonar hasta que el usuario efecte clic sobre el icono del altavoz.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

45

Fondo: para elegir un color de fondo. Efectos: para aplicar efectos de sepia, blanco/negro, etc a las fotos. Tamao: en funcin del modelo definido para el estilo se podr elegir un tamao estndar: small, medium o large (pequeo, mediano y grande).

Privacidad: permite establecer si la presentacin ser de acceso pblico o particular. Se recomienda la opcin de acceso pblico.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

46

Para terminar de configurar la presentacin pulsa en el botn Guardar.

Si no te has registrado y autentificado Slide.com te ofrece la oportunidad de registrarte. Si continuas sin registrar no ser posible editar ms adelante el slide creado. En este caso no es necesario por lo que pulsa el botn Continuar para seguir. Al final vers la presentacin de tus fotos con los parmetros de estilo, audio y animacin definidos.

Atencin: No cierres el navegador web para poder realizar el prximo apartado de publicacin en tu blog.

Publicar la presentacin Slide en Blogger

En la pgina Compartir Slide Show que aparece una vez has creado la presentacin de fotos en Slide.com se muestra el cdigo de integracin HTML de la presentacin para los distintos formatos de blog. Clic en la pestaa Blogger. Haz clic en el contenido del cuadro Copia este cdigo. Observa que se selecciona el cdigo completo. Una vez seleccionado este texto haz clic derecho sobre este cuadro y elige Copiar en el men contextual que se muestra. Tambin se puede copiar mediante la combinacin de teclas Ctrl + C

Ministerio de Educacin. ITE |Multimedia y Web 2.0

47

Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Mi presentacin Slide En el editor haz clic en el enlace Edicin de HTML para mostrar el cdigo HTML del artculo.

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Clic en el botn PUBLICAR ENTRADA.

Pulsa en el enlace Ver blog para comprobar cmo se visualiza la presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

48

Publicar la presentacin Slide en Wordpress

En la pgina Compartir Slide Show que aparece una vez has creado la presentacin de fotos en Slide.com se muestra el cdigo de integracin HTML de la presentacin para los distintos formatos de blog.

Haz clic en el contenido del cuadro Copia este cdigo. Observa que se selecciona el cdigo completo. Una vez seleccionado este texto haz clic derecho sobre este cuadro y elige Copiar en el men contextual que se

Ministerio de Educacin. ITE |Multimedia y Web 2.0

49

muestra. Tambin se puede copiar mediante la combinacin de teclas Ctrl + C Abre el Bloc de Notas y sobre l elige Edicin > Pegar.

Selecciona el cdigo numrico que identifica al slide de fotos. Es el valor numrico del parmetro channel o bien id. A continuacin en la barra de mens selecciona Edicin > Copiar.

Al final del documento del bloc de notas teclea el siguiente cdigo: [slideshow id=&w=426&h=320]
A continuacin del parmetro id en este cdigo pega el valor numrico copiado anteriormente y correspondiente a tu slideshow. El resultado final ser del tipo: Ministerio de Educacin. ITE |Multimedia y Web 2.0 50

[slideshow id=144115188096768696&w=426&h=320] Selecciona esta etiqueta [slideshow ...] y en el bloc de notas elige Edicin > Copiar. En el interfaz de gestin de Wordpress elige Entradas > Aadir para crear un nuevo artculo. Aade como ttulo: Mi presentacin Slide Con la pestaa Visual seleccionada, haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Clic en el botn Publicar. Pulsa en el enlace Ver entrada para comprobar cmo se visualiza la presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

51

Slideshare: presentaciones en lnea

Slideshare (http://www.Slideshare.net) es un servicio de alojamiento y publicacin en lnea de presentaciones realizadas con herramientas como Powerpoint u OpenOffice. Puedes utilizarlo para subir tus presentaciones y compartirlas. Tambin puedes buscar y utilizar las realizadas por otras personas. En este material se propone Slideshare como una interesante opcin para publicar en la web nuestras propias presentaciones y luego poder integrarlas en el cdigo HTML de una pgina de tu blog. 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 contrasea. A partir de ese momento ya dispones de credenciales de identificacin y acceso.
Subir una presentacin a Slideshare.net

Descarga y descomprime el archivo TIC_project.zip en el disco duro de tu equipo. Como resultado de esta tarea obtendrs el archivo TIC_project.ppt que contiene una presentacin realizada en PowerPoint. Abre el navegador y visita la pgina de Slideshare: http://www.Slideshare.net En el cuadro de Login introduce las credenciales de acceso. Clic en el enlace Upload (Subir).

Ministerio de Educacin. ITE |Multimedia y Web 2.0

52

En la pgina se muestra informacin sobre el tipo de archivos que se pueden subir: .ppt, .pps, .pptx, .ppsx (Powerpoint), .odp (Impress de OpenOffice), .pdf o bien documentos de Office 97-2003-2007 (.doc, .rtf y .xls) u OpenOffice (.odt, .ods u .pdf). Actualmente el lmite mximo es 100 MB.

Clic en el botn Browse and select files ... (Navegar y elegir archivos ...). En el cuadro de dilogo Seleccione los archivos ... navega para situarte en la carpeta donde has descargado y descomprimido el archivo TIC_project.ppt.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

53

Seleccinalo y pulsa en el botn Abrir. Tras unos segundos de espera se subir esta presentacin en Slideshare. Cuando el proceso de subida ha tenido xito se solicitan algunos datos adicionales:

Title (Ttulo). Es el ttulo de la presentacin. Ejemplo: Proyecto TIC en un centro educativo Tags (Etiquetas). Es una relacin de palabras-clave separadas por espacios en blanco que permitirn localizar esta presentacin utilizando la herramienta de bsqueda de Slideshare. Ejemplo: TIC proyecto integracion educacion tecnologias Language (Idioma). Selecciona la opcin Spanish (Espaol). Description (Descripcin). Un breve comentario que a modo de introduccin permite describir la presentacin. Allow file download. (Permitir descarga de archivo). Si marcas esta opcin los usuario podrn descargarse el archivo original.

Para concluir el proceso de subida pulsa en el botn Publish. Tras pulsar este botn se produce otro tiempo de espera. Slideshare est transformando el archivo original en una pelcula Flash que se mostrar al usuario mostrando el contenido de esa presentacin. Clic en el enlace superior My Slidespace.

Clic en la imagen que muestra la presentacin que acabamos de subir. De esta forma se accede a la visualizacin de esta presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

54

Notas:

Recuerda que las transiciones de diapositivas, efectos animados, audios y vdeos introducidos en la presentacin original se pierden cuando la subes a Slideshare.net. Una vez subida la presentacin se ofrece la posibilidad de aadir un audio MP3 a la presentacin para crear un SlideCast donde audio e imagen se muestran sincronizados. El audio debe estar alojado en un servidor web. Tambin se ofrece la posibilidad de insertar vdeos de Youtube.

Publicar un Slideshare en Blogger

Haz clic derecho sobre el cuadro de texto Embed (embebido) para elegir Seleccionar todo. Vuelve a hacer clic derecho sobre el cuadro de texto y elige la opcin Copiar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

55

Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Mi presentacin Slideshare En el editor haz clic en el enlace Edicin de HTML para mostrar el cdigo HTML del artculo.

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Clic en el botn PUBLICAR ENTRADA.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

56

Pulsa en el enlace Ver blog para comprobar cmo se visualiza la presentacin.

Nota:

Esta integracin HTML tambin se puede realizar con presentaciones publicadas por otras personas. Al situarse en su pgina tambin se ofrece el cdigo Embed para copiar y pegar en nuestra pgina web.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

57

Publicar un Slideshare en Wordpress

Haz clic en el botn More options (Ms opciones) que aparece en la parte derecha del cuadro de texto que contiene el cdigo Embed.

Se muestra el cdigo para Wordpress.com en la casilla for WordPress.com. Haz clic derecho en este cuadro de texto y selecciona la opcin Copiar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

58

Desde el interfaz de gestin de contenidos de tu blog en Wordpress elige la opcin Entradas > Aadir. Aade como ttulo: Mi presentacin Slideshare En el editor haz clic en la pestaa Visual y a continuacin clic derecho sobre el cuadro del editor para pegar el cdigo de SlideShare.

Haz clic en el botn Publicar. Haz clic en el botn Ver entrada para comprobar cmo se visualiza la presentacin.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

59

Nota:

Esta integracin HTML tambin se puede realizar con presentaciones publicadas por otras personas. Al situarse en su pgina tambin se ofrece el cdigo para copiar y pegar en las entradas de nuestro blog.

Google Maps
Google Maps (http://maps.google.es/) proporciona herramientas para la integracin de mapas geogrficos en nuestro sitio web o blog. De esta forma es posible proporcionar a los lectores de nuestro blog un mapa con la ubicacin de centros de inters referenciados. Bsicamente consiste en aadir al mapa una capa con sealadores, textos, imgenes, enlaces, etc. Estas prestaciones son susceptibles de aplicarse a mltiples contextos educativos, culturales, empresariales, etc donde sea interesante la tcnica de geolocalizacin de recursos multimedia: visitas, itinerarios, noticias, proyectos, fotografas, etc.
Crear un mapa en GMap

Accede a la web de Google Maps: http://maps.google.es/

Ministerio de Educacin. ITE |Multimedia y Web 2.0

60

Clic en el enlace Acceder situado en la esquina superior derecha. Introduce las mismas credenciales (usuario y contrasea) que utilizas habitualmente para Blogger.

Para situar un marcador sobre el mapa es necesario autentificarse previamente. Si ya lo has hecho pulsa en el enlace Mis Mapas.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

61

Clic en el botn Crear un mapa nuevo

Utiliza el buscador y las opciones de zoom y navegacin del mapa para situarte en el mapa de la zona que deseas mostrar. Por ejemplo: la pennsula ibrica. Elige como vista el modo Satlite. En la columna izquierda del nuevo mapa introduce el Ttulo y la Descripcin. Asegrate de que est marcada la opcin Pblico para que el recurso sea accesible por cualquier usuario.

Descarga y descomprime el archivo gmaps.zip. Como resultado obtendrs un archivo de texto gmaps.txt. Haz doble clic sobre l para abrirlo con el Bloc de Notas. En l se proporciona ttulo, descripcin e imagen de algunos de los
Ministerio de Educacin. ITE |Multimedia y Web 2.0 62

monumentos ms importantes de Espaa. Puedes seleccionar otros si lo estimas conveniente. Regresa al mapa de Google y haz clic en el botn Aadir un marcador de posicin y a continuacin haz clic en el punto del mapa donde desees situarlo. Por ejemplo: Coloca un alfiler en Barcelona.

Se mostrar un recuadro para introducir los datos del marcador. Activa el modo Texto enriquecido para facilitar la insercin de imgenes. En la casilla Ttulo introduce el ttulo del marcador, p.e. Sagrada Familia y en Descripcin copia y pega el texto descriptivo de este monumento contenido en el archivo de texto descargado. Clic en el botn Aadir imagen y en el cuadro Introduce la URL de la imagen copia y pega la URL absoluta a la imagen contenida en el archivo de texto. Para terminar la edicin de las propiedades de este marcador pulsa en el botn Aceptar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

63

Repite los pasos anteriores para situar el resto de marcadores contenidos en el documento de texto: La Giralda (Sevilla), la Alhambra (Granada), El Escorial (San Lorenzo de El Escorial) y la Catedral de Santiago. Observa que los marcadores que se van aadiendo aparecen en la parte inferior de la columna izquierda del mapa. Una vez que hayas terminado el mapa haz clic en el enlace Guardar y luego en el enlace Listo.

Tras pulsar en Listo se visualizar el mapa tal y como lo ver un visitante. Puedes navegar por l y comprobar si la informacin que se muestra en los distintos marcadores es correcta y se visualiza adecuadamente al pulsar sobre cada uno de los marcadores. Para cambiar algn dato sera necesario pulsar en el botn Editar.

Publicar un mapa Google en Blogger

Pulsa en el botn Enlazar que se muestra en la esquina superior derecha del mapa. En el cuadro que aparece se ofrece en primer lugar un enlace directo a este mapa en Google Maps. Esta direccin se puede copiar (clic
Ministerio de Educacin. ITE |Multimedia y Web 2.0 64

derecho+Seleccionar todo y clic derecho+Copiar) y pegar (clic derecho+Pegar) sobre el cuerpo de un mensaje de correo electrnico para enviarlo a otros usuarios y compartir con ellos este mapa. Para insertar el mapa en un artculo del blog hay que copiar el cdigo que se ofrece en el cuadro Pegar HTML para insertar en sitio web. Para ello haz clic derecho sobre este cuadro y elige Seleccionar todo. Despus haz clic derecho y elige la opcin Copiar.

Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la cuenta Google. Desde el Escritorio haz clic en el botn Nueva entrada. Aade como ttulo: Mi mapa Google En el editor haz clic en el enlace Edicin de HTML para mostrar el cdigo HTML del artculo.

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

65

Clic en el botn PUBLICAR ENTRADA.

Pulsa en el enlace Ver blog para comprobar cmo se visualiza el mapa Google.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

66

Publicar un mapa Google en Wordpress

Pulsa en el botn Enlazar que se muestra en la esquina superior derecha del mapa. En el cuadro que aparece se ofrece en primer lugar un enlace directo a este mapa en Google Maps. Esta direccin se puede copiar (clic derecho+Seleccionar todo y clic derecho+Copiar) y pegar (clic derecho+Pegar) sobre el cuerpo de un mensaje de correo electrnico para enviarlo a otros usuarios y compartir con ellos este mapa. Para insertar el mapa en un artculo del blog hay que copiar el cdigo que se ofrece en el cuadro Pegar HTML para insertar en sitio web. Para ello haz clic derecho sobre este cuadro y elige Seleccionar todo. Despus haz clic derecho y elige la opcin Copiar.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

67

Accede al interfaz de gestin de contenidos de Wordpress y elige la opcin Entradas > Aadir para crear un nuevo artculo. Aade como ttulo: Mi mapa Google En el editor haz clic en la pestaa HTML para mostrar el cdigo HTML del artculo

Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. Observa que se pega una etiqueta de cdigo HTML iframe. Wordpress no admite esta etiqueta al guardar el artculo por motivos de seguridad. Sin embargo cuando se guarda el artculo y se publica, el sistema transformar esta etiqueta en otra del tipo [googlemaps ...] que insertar el mapa deseado en la entrada actual.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

68

Clic en el botn Publicar. Pulsa en el enlace Ver entrada para comprobar cmo se visualiza el mapa Google.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

69

Actividades
Actividad 1: Subir fotografas a Flickr

Crea una cuenta en Yahoo (https://login.yahoo.com/config/login?.intl=es) si no dispones de ella y utiliza estas credenciales para subir a Flickr (http://www.flickr.com/) una coleccin de fotografas obtenidas de la cmara digital o descargadas de Internet.

Actividad 2: Albumes en Flickr Tras subir las fotografas a tu cuenta de Flickr organiza las mismas creando un album o coleccin.

Actividad 3: Integracin de Flickr en tu blog


Crea una entrada en tu blog que incorpore una imagen alojada en tu cuenta de Flickr. Integra una presentacin de imgenes de Flickr en una entrada de tu blog.

Actividad 4: Subir fotografas a Picasa Web Crea una cuenta en Google (https://www.google.com/accounts/Login?hl=es) si no dispones de ella y utiliza estas credenciales para subir a Picasa Web (http://picasaweb.google.com/home?hl=es) una coleccin de fotografas obtenidas de la cmara digital o descargadas de Internet.

Actividad 5: Integracin de Picasa Web en tu blog Obtn el cdigo embed o enlace a una presentacin de imgenes que tengas guardadas en Picasa Web para integrarla en una entrada de tu blog.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

70

Actividad 6: presentacin de fotos en Slide.com

Sigue las instrucciones del material para crear una presentacin Slide.com (http://www.slide.com/) a partir de una coleccin de fotografas extradas de la cmara digital o descargadas del Banco de imgenes del ITE. Incorpora efectos de transicin, fondos,audios y animaciones personalizados. Copia y pega el cdigo embed/enlace para integrar esta presentacin Slide.com en una entrada de tu blog.

Actividad 7: presentacin de diapositivas en Slideshare.net


Disea una presentacin de diapositivas sobre un tema educativo que resulte de tu inters. Puedes utilizar Microsoft Powerpoint o bien OpenOffice Impress. Crea una cuenta en SlideShare.net (http://www.slideshare.net/) y sube tu presentacin. Obtn el cdigo embed para insertar en una entrada de tu blog el visor de slideshare que muestra esta presentacin.

Actividad 8: Mapa de Google Maps

Utiliza tu cuenta como usuario Google para disear un mapa de Google Maps sobre una regin geogrfica concreta. Sita varios marcadores sobre puntos de inters de la zona aadiendo en cada uno: ttulo, texto, imagen y enlace. Localiza el cdigo embed correspondiente a esa mapa para insertarlo en una entrada de tu blog.

Ministerio de Educacin. ITE |Multimedia y Web 2.0

71

You might also like