miércoles, 4 de febrero de 2009

Elementos multimedia en el blog: insertar video, audio, imágenes, documentos en diversos formatos

En el blog, además de texto podemos incluir dibujos, gráficos o imágenes que pueden ilustrar lo escrito, pero podemos incluir otros elementos multimedia y/o documentos que pueden estar alojados en otros sitios de Internet.

1. Subir Imágenes

Las imágenes en el blog, se pueden subir directamente, para ello disponemos de hasta 1Gb de espacio en el blog. No deben superar los 8 Mb en los formatos: jpg, bmp, gif o png, que son los más conocidos. La imagen también puede ser direccionada desde Internet.
Desde el botón "añadir imagen", insertaremos entre el texto una foto o gráfico, así como la posición y el tamaño.

Blogger permite subir fotos, al igual que Wordpress, pero para crear álbumes hemos de recurrir a Picasa que es otro servicio de Google, tal que las fotos puedan incluirse rápidamente en blogger y aparecer como una presentación y colocarlas en un lateral.


Atención: No todo lo que es público, es de servicio público. Quiero decir que muchas imágenes, vídeos, documentos, etc..., tienen su derechos de autor (copyright), aunque en internet muchos autores utilizan la licencia (creative commons) o copyleft, para permitir publicarlo si se indica el autor que lo ha hecho, en algunos casos se exige también que el producto que se obtenga (blog, libro...) sea también con la misma licencia que se obtuvo. Por eso es conveniente que los docente hagamos uso de los "repositorios" o almacenes de archivos libres, en el (CNICE) del Ministerio de Educación tenemos un banco muy importante de imágenes y sonidos...

2. Visualizar Vídeos.

La etiqueta es la que se utiliza para insertar archivos de vídeo dentro de las páginas web en HTML.

Este código tiene algunos atributos. Es el caso de src donde hay que especificar la ruta y el nombre del archivo de vídeo

Los videos insertados a través de esta etiqueta se reproducen automáticamente al cargarse la página, y se reproducen solamente una vez.

Esto puede cambiarse a través de los atributos autostart y loop.

El atributo autostart indica si el archivo se reproducirá automáticamente al cargarse la página, y puede tomar los valores true o false.

El atributo loop indica si el archivo se reproducirá continuamente en un bucle, y también puede tomar los valores true o false.

Los atributos width (anchura) y height (altura) sirven para especificar el tamaño de la consola de control de vídeo. Estos atributos pueden tomar como valor un número, que indica el tamaño en píxeles. Si no se especifican estos atributos, la consola de control de vídeo se mostrará con el tamaño más adecuado al tamaño del vídeo.

Ejemplo de un código tomado de un vídeo de Youtube, solo tendremos que copiar y pegar en Edición HTML.
Valores de ancho y alto Lugar donde se aloja el vídeo, con su referencia





Desde estos repositorios de vídeos como Googlevideo, youtube, revver, etc...nos dan un código que podemos pegar en el editor de texto, pero no en la etiqueta Redactar, sino en la de Edición de HTML . Después de guardar la entrada, nos aparecerá el video cono si estuviera en nuestro blog, aunque lo tiene que cargar desde el lugar que hemos seleccionado.Los vídeos en blogger se pueden subir también desde el editor de texto, pues en el botón se nos abre una ventana desde donde se puede subir, con la condición de que sean menos de 100 Mb y en formatos: AVI, MPEG, QuickTime, Real y Windows Media. También tenemos las ventaja de que los servicios de alojamiento de vídeos como Googlevideo, youtube, revver, etc...nos dan un código que podemos pegar en el editor de texto, pero no en la etiqueta Redactar, sino en la de Edición de HTML . Después de guardar la entrada, nos aparecerá el video cono si estuviera en nuestro blog, aunque lo tiene que cargar desde el lugar que hemos seleccionado.


Una vez que agreguemos el código podemos seguir escribiendo ( aunque el vídeo no aparezca en el momento ), si queremos visualizarlo antes de publicar la entrada simplemente podemos hacer click en "Vista Previa" así observamos como quedará.

En éste último caso y al tener ya una cuenta gmail, contamos con este servicio gratuito de Google Video, que también nos permitirá subir nuestros vídeos y compartirlos si queremos desde Google, sólo debemos activarlo.Ver código . En un blog nos quedaría algo así.

Algo que debemos tener en cuenta, no es lo mismo el código que nos faciliten para blogger que para wordpress.

Ahora realiza este Ejercicio nº9




3. Insertar Audio

Para insertar en el blog un reproductor sencillo, el problema que nos vamos a encontrar primero es el lugar donde almacenamos nuestro mp3, podemos buscar un alojamiento gratuito, lo subimos y después localizamos la URL y además el reproductor suele ser un fichero en flash (.swf) que también debe de estár con la música, y a continuación insertamos este código, cambiando la ruta del archivo y el nombre del fichero reproductor.

Bájate un modelo(botón derecho del mouse y guardar destino cómo...) y lo subes al servidor: normal, nimi y múltiple . En un blog quedaría así . Ahora realiza tú este Ejercicio nº10

Para conocer más reproductores de Audio y Vídeo visita esta página de José Mª Campo en este taller multimedia

Otra forma más sencilla de introducir audio es usar este servicios web 2.0: Goear donde a través de la suscripción básica: usuario y contraseña nos ofrece el reproductor directamente de lo que hemos subido como mp3 o de lo que hemos buscado en su almacén de ficheros.

Un ejemplo:

Cuentacuentos: La Rana Voladora





Esta utilidad es muy interesante en las áreas de idiomas o cursos con Secciones Europeas, incluido en las asignaturas no ligüísticas, tal que podemos grabar nuestras pronunciaciones o incluir textos grabados para listening. Veámos algunos ejemplos:

Richards Family





Unidad 2b





4. Cómo incluir otros documentos

  • Flash en el Blog:

Hay otros servicios web 2.0, que nos ofrecen subir documentos y visualizarlos en nuestro blog, generalmentel todos se transforman en formato (.swf) más conocidos como fichero flash.Para insertar Ficheros Flash debemos usar el siguiente modelo de código, cambiando la ruta del fichero flash que tenemos alojado en el servidor.


En la Práctica es así, ver este código El resultado es algo así en el blog
Este fichero con la extensión (.swf), se puede subir a un servidor gratuito y direccionarlo como hemos indicado anteriormente.

Aunque también podemos buscar en la web recursos interactivos en Flash que podemos incrustar en nuestro blog



  • Documentos Word, Power Point, pdf:

Documentos en distintos formatos: Hay servicios de alojar estos archivos como scribd.com , donde podemos subir varios tipos de archivos. El servicio issuu.com transforma los documentos de texto en formato pdf pero se ven como un libro virtual. Un ejemplo




Presentaciones: Otro servicio es slideshare.com para subir preferentemente presentaciones en power point o Impress, como la que hay al principio del blog, todas ellas nos da un código "share" para compartir nuestro trabajo, que debemos copiar y pegar en una entrada. Otro de los servicios muy elegantes a la hora de presentar el documento es calaméo, que pueden verse los documentos como si de un libro se tratara, veamos un ejemplo.

Aquí realizamos un Ejercicio nº11 de Ejemplo.


  • Insertar un Calendario:

Puede servir para realizar anotaciones de fechas de evaluación o ejercicios y/o trabajo de clase. Si tenemos una cuenta gmail de Google aparece este servicio en mi cuenta, pero en caso de queramos utilizarlo, accederemos a calendar .La forma de incrustarlo en el blog se explica en esta demostración. El resultado final lo podemos ver en este blog

  • Adornando el Blog:

Los Gadgest son miniaplicaciones diseñadas para proveer de información, mejorar una aplicación o servicios de un ordenador. Hay muchos en Internet que podemos poner en el blog, aquí tenemos una colección de google y un buscador de ellos. Se tratará de colocar el código que nos faciliten, en la columna lateral y desde plantilla en el apartado de HTML/Javascript. Un reloj con fecha, por ejemplo

¿Dónde alojar nuestros archivos?

No obstante, también podemos tener alojado algún documento, vídeo, web, etc, en un servicio de alojamiento gratuito como por ejemplo:

- http://www.adrive.com/ que facilita 50 Gb de almacenamiento de ficheros por cuenta y backup
- http://www.dropboks.com/ , es un sistema sencillo de almacenaje de 1Gb.
- http://www.esnips.com/
- http://www.divshare.com/ , permite subir videos, fotos, música y documentos y compartirlos desde Internet. 1Gb de almacenaje y 10 Gb de transferencia como máximo.
- http://www.box.net/ y muchos más.

Yo aconsejo divshare.com donde podéis subir algún fichero y compartirlo en Internet.