Professional Documents
Culture Documents
Multimedia y
Web 2.0
Manual del curso
Edición 2010
Autor:
Fernando Posada Prieto
Índice Temático 2
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Presentación ......................................................................... 11
Anexos
A1. Canales de suscripción .......................................................................... 580
1.1 ¿Qué es un canal de suscripción? ........................................................ 581
1.2 Suscripción con el navegador Firefox 3+ ............................................... 581
1.3 Suscripción con el navegador IExplorer 7+ ........................................... 584
1.4 Enlaces de suscripción a tu blog Blogger .............................................. 587
1.5 Enlaces de suscripción a tu blog Wordpress ........................................... 588
1.6 Añadir un feed externo a tu blog ....................................................... 589
1.6.1 Buscar un canal de feeds ...................................................... 589
1.6.2 Añadir un canal feed externo a Blogger ..................................... 589
1.6.3 Añadir un canal feed externo a Wordpress ................................. 591
Presentación
En los últimos años hemos asistido a un considerable auge de los espacios web en el entorno
educativo. Hasta tal punto que hay quienes manifiestan que un centro educativo o persona no
existe si no es visible en Internet. Los sitios web no sólo se corresponden con entidades
dpúblicas o privadas sino también con páginas personales de carácter profesional y otras
centradas en el ocio y tiempo libre. Por otra parte la producción de recursos multimedia se ha
ido orientando cada vez más hacia la web en detrimento del soporte CD-ROM o DVD por
razones obvias: coste, inmediatez, facilidad de actualización, difusión, etc.
La idea original en que se basa este curso es aportar pistas para afrontar un proceso creativo
completo. En primer lugar se plantea la obtención de los recursos multimedia originales
(léase fotos o vídeos de la cámara digital, pistas de audio de un CD o grabación de una
locución, etc). A continuación se propone el tratamiento para darles un formato más
adecuado. Estos materiales se pueden publicar en un servicio Web 2.0 para finalmente
integrarlos en una entrada o gadget del blog.
No es propósito del curso alcanzar un dominio muy elevado de todos y cada uno de los
programas que se proponen. Sería necesario un curso específico para cada uno. En su defecto,
siguiendo un enfoque práctico, se plantea una necesidad y a continuación se proporcionarán
unos recursos de partida, una o varias aplicaciones de software y una secuencia detallada de
pasos para obtener el contenido multimedia final. Por otra parte se ha pretendido que cada
apartado sea independiente del resto para conseguir cierta modularidad.
Blogs
Imagen
Audio
Video
protagonista principal de este curso. Por este motivo toda la producción se orienta a la
publicación final en este medio.
En el módulo sobre Vídeo se plantean los principales conceptos relacionados con el vídeo
digital para luego proponer la visualización de vídeos con el reproductor universal: VLC Media
Player. Se proporciona información de cómo utilizar extensiones de Mozilla Firefox (Video
DownloadHelper) para descargar al disco duro del equipo archivos de vídeo desde Internet.
También el procedimiento para conocer los detalles técnicos de un archivo multimedia con
Media Info y convertir a otros formatos con WinFF. Otra opción es extraer el vídeo de un DVD
con soluciones como AutoGordian. Se ejemplifica cómo mostrar vídeos dentro del artículo de
un blog. Los repositorios de vídeos Web 2.0 como Youtube, Revver, Metacafé, Vimeo, etc
ofrecen una excelente alternativa para el alojamiento y difusión en streaming de vídeos que
posteriormente se pueden integrar en Blogger.
Todas las aplicaciones de software que se proponen son de uso gratuito y de libre
distribución. En muchos casos se ofrecen versiones portables de los programas para facilitar
su uso en una memoria USB sin necesidad de instalación previa en el ordenador. El curso se
puede seguir con un equipo Windows XP/Vista/7 o bien Ubuntu Linux 10.
El alumno/a de este curso con interés en el diseño de materiales digitales multimedia puede
encontrar aquí recetas útiles para resolver las necesidades más básicas relacionadas con la
elaboración y adaptación al medio web de recursos de texto, imagen, audio y vídeo.
Módulo 1. Blogs
Blogs ::: ¿Qué es la Web 2.0? 14
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
El término Web 2.0 fue acuñado por el americano Dale Dougherty de la editorial O'Reilly
Media durante el desarrollo de una conferencia en el año 2004. El término surgió para
referirse a nuevos sitios web que se diferenciaban de los sitios web más tradicionales
englobados bajo la denominación Web 1.0. La característica diferencial es la participación
colaborativa de los usuarios. Un ejemplo de sitio web 1.0 sería la Enciclopedia Británica
donde los usuarios pueden consultar en línea los contenidos elaborados por un equipo de
expertos. Como alternativa web 2.0 se encuentra la Wikipedia en la cual los usuarios que lo
deseen pueden participar en la construcción de sus artículos. Poco tiempo después, en el año
2005, Tim O'Reilly definió y ejemplificó el concepto de Web 2.0 utilizando el mapa
conceptual elaborado por Markus Angermeier.
La Web 2.0 o Web social es una “denominación de origen” que se refiere a una segunda
generación en la historia de los sitios web. Su denominador común es que están basados en el
modelo de una comunidad de usuarios. Abarca una amplia variedad de redes sociales, blogs,
wikis y servicios multimedia interconectados cuyo propósito es el intercambio ágil de
información entre los usuarios y la colaboración en la producción de contenidos. Todos estos
sitios utilizan la inteligencia colectiva para proporcionar servicios interactivos en la red donde
el usuario tiene control para publicar sus datos y compartirlos con los demás.
Se puede entender como 2.0 "todas aquellas utilidades y servicios de Internet que se
sustentan en una base de datos, la cual puede ser modificada por los usuarios del servicio, ya
sea en su contenido (añadiendo, cambiando o borrando información o asociando datos a la
información existente), pues bien en la forma de presentarlos, o en contenido y forma
simultáneamente."- (Ribes, 2007)
Blogs ::: ¿Qué es la Web 2.0? 16
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
En el sitio web oficial del proyecto Mozilla Firefox podrás encontrar la versión más reciente o
que se adapta a tu sistema: http://www.mozilla-europe.org/es/firefox/. Descarga e instala
este programa en tu equipo. Otra posibilidad es utilizar la versión portable para Windows que
puedes conseguir en: http://portableapps.com/apps/internet/firefox_portable
Blogs ::: Iniciación a los blogs 20
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En cada artículo los lectores pueden escribir sus comentarios y el autor darles respuesta. De
esta forma se fomenta un diálogo que autores y lectores pueden compartir. Sin embargo esta
opción depende de la moderación del autor o autores del blog y por supuesto de que los
lectores decidan intervenir libremente con sus aportaciones.
FrontEnd. Es el “escaparate” o área pública del blog. Muestra los artículos publicados
que pueden ser leídos por cualquier usuario que accede al mismo.
BackEnd. Es el “taller” o área de acceso restringido del blog. En este espacio entra el
autor/autores del blog para gestionar su contenido.
Frontend Backend
Cabecera. Muestra el título del blog y en algunos casos una imagen de fondo. Cuando
el lector hace clic en el enlace que proporciona se sitúa en la portada o página
principal del blog.
Entradas del blog. Contiene los artículos o entradas publicadas. Aparecen ordenados
cronológicamente situándose arriba el más reciente. En la página principal solo se
pueden leer un número concreto de artículos. Para acceder a los anteriores se
proporciona un sistema de paginación con un enlace a “Entradas anteriores”.
Barra lateral. Contiene los gadgets o módulos que incorporan prestaciones adicionales
al blog: búsqueda, artículos por meses, artículos por etiquetas, lista de enlaces,
suscripción RSS, etc.
Blogs ::: Iniciación a los blogs 23
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Cuando el artículo se muestra de forma individual en una página, se accede a los comentarios
asociados que se sitúan al final de su contenido. El administrador del blog puede permitir o
denegar el envío de comentarios a un artículo en concreto o a todos los artículos del blog. En
caso favorable es muy recomendable activar la moderación de comentarios para que el
administrador los supervise antes de que aparezcan publicados. Cada artículo de un blog
dispone de una dirección individual y única (permalink o enlace permanente) que se puede
utilizar para situarse en él directamente.
Blogs ::: Iniciación a los blogs 24
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Hipermedia. Los artículos pueden contener texto, enlaces, imágenes, audios, vídeos,
animaciones flash, etc.
Facilidad. El blog proporciona un interfaz para administrar sus contenidos, coordinar,
borrar o reescribir los artículos, moderar los comentarios de los lectores, etc. de una
forma casi tan sencilla como administrar el correo electrónico.
Organización cronológica. Los artículos se ordenan de forma cronológica mostrando
primero los artículos más recientes.
Búsquedas. Los blogs proporcionan herramientas que facilitan la búsqueda de
entradas a partir de un término, fecha, autor, etc.
Metadatos. Las etiquetas o palabras clave asignadas a un artículo contribuyen a la
organización temática de la información facilitando su posterior búsqueda.
Comentarios. La posibilidad de que los lectores envíen sus comentarios permite
establecer un interesante flujo de debate en torno a los artículos publicados.
Suscripción. La suscripción RSS o Atom a los artículos y comentarios de un blog
permiten disponer de las últimas novedades publicadas en el navegador web o lector
de noticias sin necesidad de acceder directamente a ese sitio web.
Enlaces inversos. También llamados trackbacks permiten conocer si alguien desde su
blog ha enlazado a una entrada publicada en nuestro blog o viceversa. Si así se
configura los trackback pueden aparecer junto a los comentarios de un artículo.
Integración. Los blogs permiten mostrar incrustados en sus páginas recursos
multimedia alojados en servicios web 2.0: imágenes, audios, vídeos, etc.
Servicio de blogs. El usuario crea una cuenta en ese servicio para disponer de un
blog. Ejemplo: Blogger (http://www.blogger.com), Wordpress
(http://www.wordpress.com) o Live Journal (http://www.livejournal.com/). Tras el
registro el usuario recibe una dirección web para el acceso individual a su blog que ya
está instalado y completamente operativo. Ejemplo: http://<miblog>.blogspot.com
para un blog alojado en Blogger. La bitácora se integra en la comunidad de blogs que
ofrece ese servicio. Su principal inconveniente es que su funcionamiento está
condicionado parcialmente por las decisiones de los superadministradores del
servicio.
CMS instalado en servidor web. El usuario puede instalar en un servidor web privado
una solución CMS gratuita que se descarga de Internet. Esta instalación requiere
disponer de cuenta en un servidor web con Apache, PHP y MySQL. Los dos CMS más
populares para blogs son: Wordpress (http://es.wordpress.org/) y Movable Type
(http://www.movabletype.org/). Su principal inconveniente es que el
mantenimiento y actualización debe realizarlo el propio usuario pero como
contrapartida admite modificar su código abierto para adaptarlo totalmente a las
necesidades individuales.
En la actualidad, al crear una bitácora en una comunidad de blogs, se suscitan dudas sobre
cuál elegir entre los dos líderes del sector: Blogger o Wordpress. Ambos tienen ventajas e
inconvenientes resultando Wordpress una opción algo más compleja.
Existen también medios de comunicación, como por ejemplo el diario “El País”, que ofrecen
un servicio gratuito de Blogs: http://blogs.elpais.com/
Nota importante:
A partir de este momento el alumno/a del curso podrá elegir entre seguir el curso con un blog
de Blogger o bien con un blog de Wordpress
Blogs ::: Mi primer artículo 26
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Mi primer artículo
Blogs ::: Mi primer artículo 27
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Si ya dispones de una cuenta Google (en caso contrario pasa a la siguiente página):
4. Anota el usuario y contraseña de esta cuenta para no olvidarla. Con la cuenta Google
podrás acceder a Blogger, GMail, Google Docs, Picasa Web, etc.
Una vez que ya disponemos de cuenta Google y nos hemos autentificado con ella contra
Blogger nos encontraremos en el paso 2 de creación de nuestro blog.
Blogs ::: Mi primer artículo 30
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. En el paso 2 “Asignar un nombre al blog” introduce los siguientes datos del nuevo
blog:
Título del blog. Ejemplo: El blog de …
Dirección del blog (URL). Será la dirección que tendrá nuestro blog en
Blogger. Esta URL es del tipo: http://<miblog>.blogspot.com Conviene elegir
una dirección fácil de recordar. Antes de continuar conviene pulsar en el
enlace Comprobar disponibilidad para verificar si esa dirección está libre. Si
no se te ocurre una dirección puedes utilizar tu nombre de usuario en Google:
http://<TuUsuarioGoogle>.blogspot.com
2. Utiliza el explorador de archivos para abrir (doble clic) el archivo de texto lorca.txt.
Se abrirá el Bloc de Notas mostrando su contenido.
3. Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
4. Regresa al navegador web que muestra el editor de Nueva entrada de Blogger. Teclea
el título: Federico García Lorca.
5. Haz clic dentro del editor de artículos y a continuación haz clic derecho para elegir la
opción Pegar. Esta acción pegará el texto copiado del archivo de texto anterior
evitando tener que teclearlo.
Blogs ::: Mi primer artículo 33
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón GUARDAR
AHORA que aparece por debajo del editor de artículos. Esta acción almacenará los
cambios introducidos en el servidor remoto.
2. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el
botón Examinar para localizar y señalar el archivo lorca.jpg que hemos obtenido en
un paso anterior. Observa que sólo se admiten los formatos de imagen: gif, jpg y png.
Nota:
7. Para guardar los cambios realizados en el artículo haz clic en el botón GUARDAR
AHORA.
8. Para ver la apariencia que tiene el artículo haz clic en el enlace Vista previa. En la
parte inferior se muestra la entrada tal y como será visualizada por el lector. Para
regresar al editor haz clic en el enlace Ocultar vista previa.
1. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
última línea del documento para seleccionarlo. Es un enlace a Google que ya incluye
los términos de búsqueda relativos al autor que nos ocupa:
http://www.google.es/search?q=Federico+García+Lorca
Blogs ::: Mi primer artículo 35
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar.
http://<tituloblog>.blogspot.com/<añopub>/<mespub>/<titulo-entrada>.html
Blogs ::: Mi primer artículo en Wordpress 37
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Clic en el botón Crear Blog. Si el proceso de creación del nuevo blog ha tenido éxito
se mostrará un mensaje de que ese blog ya es tuyo. Te pedirá el usuario y
contraseñas para acceder directamente a su backend de administración.
(Versión en español)
(Versión en inglés)
Blogs ::: Mi primer artículo en Wordpress 40
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Haz clic sobre el blog en el listado de Tus Blogs donde deseas publicar tu entrada.
Con esta acción se accede al Tablero/Dashboard de trabajo en ese blog. Es el
interfaz de gestión o backend del blog.
4. En el cuadro Entradas que se muestra en la columna izquierda del Tablero haz clic en
el enlace Añadir.
Otra posibilidad es seleccionar Nueva entrada > Nombre del blog en la barra de
menú horizontal que se ofrece en la parte más superior del backend de gestión del
blog.
2. Utiliza el explorador de archivos para abrir (doble clic) el archivo de texto lorca.txt.
Se abrirá el Bloc de Notas mostrando su contenido.
3. Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
Blogs ::: Mi primer artículo en Wordpress 41
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Regresa al navegador web que muestra el editor de Agregar una nueva entrada de
Wordpress. Teclea el título: Federico García Lorca.
5. Haz clic dentro del editor de artículos y a continuación haz clic derecho para elegir la
opción Pegar. Esta acción pegará el texto copiado del archivo de texto anterior
evitando tener que teclearlo.
6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón Guardar
borrador. Esta acción almacenará los cambios introducidos en el servidor remoto.
Blogs ::: Mi primer artículo en Wordpress 42
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. En la
pestaña Desde el ordenador haz clic en el botón Elegir archivos.
5. En la parte más inferior de la página que muestra la imagen se muestra la URL del
enlace. Es la dirección en internet donde se ha alojado y está disponible la imagen
subida original. En este caso no deseamos crear un enlace a la imagen original por lo
que hacemos clic en el botón Ninguna para vaciar esta casilla.
Nota:
10. Para guardar los cambios realizados en el artículo haz clic en el botón Guardar
borrador. Para ver la apariencia que tiene el artículo haz clic en el enlace Vista
previa.
1. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
última línea del documento para seleccionarlo. Es un enlace a Google que ya incluye
Blogs ::: Mi primer artículo en Wordpress 45
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. En el cuadro de diálogo URL del enlace: haz clic derecho y elige Pegar. En la lista
desplegable Destino selecciona la opción Abrir el enlace en una nueva entrada.
5. Clic en el botón Insertar para guardar la dirección pegada.
6. Para terminar haz clic en el botón Guardar borrador.
Etiquetas de la entrada. Introduce las etiquetas o palabras clave que deseas asociar
al artículo pero separadas por comas. Ejemplo: poesía, generación 27. Clic en el
botón Añadir.
Categorías. Permiten clasificar las entradas. Una entrada puede clasificarse en una o
más categorías. Esto puede permitir por ejemplo el filtrado de todas las entradas del
blog que se hayan clasificado en la misma categoría. Para ello basta marcar la casilla
de verificación de la categoría o categorías elegidas. Para añadir una categoría haz
clic en el enlace Añadir nueva categoría, introduce el identificador de esa nueva
categoría y pulsa en el botón Añadir.
2. Para ver el resultado final haz clic en el enlace Visitar sitio o bien en el enlace Vista
previa que se ofrece en el cuadro de Publicación de esa entrada.
http://<identificador_de_blog>.wordpress.com/<añopub>/<mespub>/diapub>/<titulo-
entrada>/
Cuando se está editando una entrada, en la parte superior del editor, se muestra este enlace
permanente. Si pulsas en el botón Editar puedes cambiar la última parte de esta dirección.
Otra posibilidad es pulsar en el botón conseguir URL corta que proporciona una dirección más
corta de acceso directo a este artículo.
Blogs ::: Gestión de artículos en Blogger 49
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Gestión de artículos
Blogs ::: Gestión de artículos en Blogger 50
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Si has seguido los dos primeros métodos accederás al listado de artículos del blog. Haz
clic en el enlace Editar de la entrada correspondiente para acceder a su edición.
Blogs ::: Gestión de artículos en Blogger 52
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Se muestra una pregunta de confirmación: ¿Está seguro de que desea eliminar esta
entrada?. Si estás seguro del borrado pulsa en el botón SUPRIMIRLO. En caso
contrario haz clic en el botón CANCELAR. Conviene manejar esta opción con
precaución porque el borrado es irreversible.
Blogs ::: Gestión de artículos en Blogger 53
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
Si el artículo contiene alguna imagen también se solicita confirmación para eliminarla
o bien conservarla. Recuerda que las imágenes subidas se guardan en la cuenta de
Picasa asociada al usuario Google con que se ha creado el blog.
1. Cuando se edita una entrada, en la parte inferior del editor se muestra un espacio con
el título Etiquetas de esta entrada donde se pueden introducir las etiquetas que
desees separadas por comas.
2. También se puede hacer clic en el enlace Mostrar todo para ver la lista de etiquetas
ya creadas previamente. Para añadir una simplemente hacer clic en ella.
4. Se puede modificar fácilmente el diseño del blog añadiendo un gadget con la lista de
todas las etiquetas utilizadas en tu blog. Este gadget se mostrará en la columna
lateral de tu blog y mostrará las etiquetas ordenadas alfabéticamente o por
frecuencia de uso.
Blogs ::: Gestión de artículos en Blogger 55
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
11. Minimiza la ventana del navegador web para utilizar el explorador de archivos de
Windows y hacer doble clic para abrir la página HTML: agala.html que has obtenido
antes. Esta acción mostrará esta página en una nueva ventana del navegador web.
12. Esta página HTML muestra información sobre la vida y obras del escritor Antonio Gala.
Haz clic derecho sobre ella y elige Seleccionar todo en el menú contextual que se
muestra. Vuelve a hacer clic derecho y selecciona Copiar.
13. Regresa a la ventana de GMail. Completa el nuevo mensaje con los siguientes datos:
Para: escribe la dirección de correo electrónico secreta que has configurado
en tu blog.
Asunto: será el título de la entrada en el blog. Ejemplo: Antonio Gala.
Texto: Haz clic derecho sobre este cuadro y elige la opción Pegar. Esta acción
pegará el código copiado anteriormente de la página agala.html. Observa que
se trata de un texto con formato y enlaces que también puede crearse o
modificar utilizando las propias herramientas del editor de mensaje de Gmail.
También podría ser un mensaje de texto plano.
14. Para insertar una imagen en el artículo final es necesario enviarla como adjunto del
mensaje de correo electrónico. Clic en el enlace Adjuntar un archivo para localizar y
abrir el archivo de imagen lorca.jpg.
16. Si has configurado tu blog para que el mensaje se publique directamente entonces se
mostrará directamente para tus lectores.
Notas:
Pies de mensajes. Si deseas evitar que se publiquen en el blog los pies de mensajes
que algunos servidores de correo insertan de forma automática puedes utilizar la
etiqueta #end al final del cuerpo del mensaje.
Colaboración. La publicación por email puede resultar interesante para colaboradores
del blog que no tengan credenciales de acceso al backend del mismo. En este caso el
administrador o administradores principales podrían configurar el blog para que los
artículos así enviados se guarden como borradores pendientes de publicación en lugar
de que se publiquen directamente.
Etiquetas. En la actualidad no es posible asignar etiquetas a un artículo cuando se
envía por email. Sin embargo posteriormente se puede acceder a la gestión del blog
para asignárselas.
Blogs ::: Gestión de artículos en Blogger 60
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Exportación
1. Desde el interfaz de gestión de contenidos del blog cuyos artículos deseamos
exportar, selecciona la pestaña Configuración > Básico. Clic en el enlace Exportar
blog.
4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML
guardado en el equipo.
Importación
1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados,
haz clic en la pestaña Configuración > Básico. Clic en el enlace Importar blog.
2. Desde la página Importar un blog haz clic en el botón Examinar para localizar el
archivo blog-dd-mm-aaaa-xml que hemos guardado en nuestro equipo como resultado
de un proceso de exportación anterior.
Blogs ::: Gestión de artículos en Blogger 62
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Gestión de artículos
en Wordpress
Blogs ::: Gestión de artículos en Wordpress 64
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Si has seguido los dos primeros métodos accederás al listado de artículos del blog. Haz
clic en el enlace Editar de la entrada correspondiente para acceder a su edición.
También puedes hacer un simple clic sobre el enlace situado en el titulo de la
Entrada.
2. También se puede hacer clic en el enlace Elige entre las etiquetas más utilizadas …
para ver la lista de etiquetas ya creadas previamente. Para añadir una etiqueta
simplemente haz clic en ella. Para eliminar una etiqueta del artículo haz clic en el
botón cerrar que acompaña a esa etiqueta en el listado asignado.
4. Se puede modificar fácilmente el diseño del blog añadiendo un widget con la lista de
todas las etiquetas utilizadas en tu blog en forma de nube.
5. Durante la edición de entradas se puede filtrar el listado de artículos para que se
muestren solamente las entradas asociadas a un etiqueta concreta, haciendo clic en
la etiqueta correspondiente en cualquiera de las entradas que la contienen.
Nota:
3. Se muestra el listado de blogs que administramos en Wordpress. Para el blog que nos
ocupa haz clic en el botón Activado en la columna Publicar por email.
A continuación ya puedes enviar el mensaje de correo electrónico con la entrada. Para ello se
propone utilizar el webmail de GMail (http://www.gmail.com) y esto supone que debes tener
cuenta en GMail. No obstante se puede hacer desde cualquier cuenta de correo electrónico
tanto utilizando webmail como un programa cliente de correo como Outlook o similar.
10. Minimiza la ventana del navegador web para utilizar el explorador de archivos de
Windows y hacer doble clic para abrir la página HTML: agala.html que has obtenido
antes. Esta acción mostrará esta página en una nueva ventana del navegador web.
11. Esta página HTML muestra información sobre la vida y obras del escritor Antonio Gala.
Haz clic derecho sobre ella y elige Seleccionar todo en el menú contextual que se
muestra. Vuelve a hacer clic derecho y selecciona Copiar.
12. Regresa a la ventana de GMail. Completa el nuevo mensaje con los siguientes datos:
Para: escribe la dirección de correo electrónico secreta que has configurado
en tu blog.
Asunto: será el título de la entrada en el blog. Ejemplo: Antonio Gala.
Texto: Haz clic derecho sobre este cuadro y elige la opción Pegar. Esta acción
pegará el código copiado anteriormente de la página agala.html. Observa que
se trata de un texto con formato y enlaces que también puede crearse o
modificar utilizando las propias herramientas del editor de mensaje de Gmail.
También podría ser un mensaje de texto plano.
Blogs ::: Gestión de artículos en Wordpress 72
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
13. Para insertar una imagen en el artículo final es necesario enviarla como adjunto del
mensaje de correo electrónico. Clic en el enlace Adjuntar un archivo para localizar y
abrir el archivo de imagen lorca.jpg.
Adjuntos. Si se envía una sola imagen adjunta, ésta se mostrará al final del artículo y
separada del texto. Si se envían varias imágenes adjuntas, éstas se mostrarán como una
galería. Si envías como adjunto un archivo de audio MP3, éste se mostrará usando el
reproductor de audio de Wordpress. Si envías otros archivos de documentos como PDF, DOC,
etc entonces se mostrarán como enlaces en el artículo.
Exportación
1. Desde el interfaz de gestión de contenidos del blog cuyos artículos deseamos
exportar, selecciona la opción Herramientas > Exportar.
Blogs ::: Gestión de artículos en Wordpress 74
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML
guardado en el equipo.
Importación
1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados,
haz clic en la pestaña Herramientas > Importar.
2. Desde la página Importar haz clic en el sistema desde el que importarás. Es posible
importar las entradas a partir de un XML de Blogger o de Wordpress. En este caso haz
clic en Wordpress.
3. Desde la página Importar desde Wordpress haz clic en el botón Examinar para
localizar el archivo wordpress.aaaa-mm-dd.xml que hemos guardado en nuestro
equipo como resultado de un proceso de exportación anterior.
Blogs ::: Gestión de artículos en Wordpress 76
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. El editor de entradas
Blogs ::: El editor de entradas en Blogger 78
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5.1 El editor de
entradas en Blogger
Blogs ::: El editor de entradas en Blogger 79
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Una práctica habitual de la edición en línea de contenidos es la preparación previa del texto
con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el
artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma
durante la edición en línea siempre se dispondrá de una copia de seguridad en local.
2. Haz doble clic sobre el archivo einstein.txt para abrirlo con el Bloc de Notas.
Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
Blogs ::: El editor de entradas en Blogger 80
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Notas:
Como ocurre en la mayoría de editores visuales en línea es recomendable copiar y
pegar a partir de texto plano creado con el Bloc de Notas. Otra posibilidad, para
diseños más elaborados, es editar previamente la página con un editor visual HTML
como Kompozer (http://kompozer.net/). Lo que NO se recomienda es pegar a partir
de un documento Word porque se introduce código oculto innecesario y en ocasiones
produce que no se vea adecuadamente. En este caso es preferible utilizar el Bloc de
Notas como paso intermedio para pegar el contenido Word y luego volver a
seleccionar y copiar para pegarlo sobre el editor final.
El texto pegado es un guión del artículo a realizar. Incluye anotaciones entre
corchetes que referencian la posición de la imagen y el formato de los distintos
fragmentos del texto. Es necesario borrar estas anotaciones entre corchetes y aplicar
los cambios apuntados.
Blogs ::: El editor de entradas en Blogger 81
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el
botón Examinar para localizar y señalar el archivo einstein.jpg que hemos obtenido
en un paso anterior. Observa que sólo se admiten los formatos de imagen: gif, jpg y
png.
15. Al finalizar esta tarea la imagen se habrá insertado dentro del artículo utilizando la
alineación definida.
16. Selecciona la línea que contiene las fechas de nacimiento y fallecimiento y pulsa en el
botón Negrita de la barra de herramientas del editor.
18. Selecciona el texto “Su fórmula E=mc2 es la más popular de la física” y aplícale la
Alineación al centro.
19. A este mismo fragmento aplícale el efecto Cursiva y luego despliega la paleta de
Color de Texto y elige el color rojo.
Blogs ::: El editor de entradas en Blogger 83
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
21. Selecciona todos los ítems de la lista numerada de la biografía de Einstein y pulsa en
el botón Lista Numerada de la barra de herramientas del editor. Tendrás que borrar
en cada elemento el número que venía escrito.
22. Repite los pasos anteriores para el subtítulo “Teorías de Einstein” y para la lista
numerada de elementos que se citan.
23. Asigna como tamaño de fuente Large al siguiente subtítulo “Para saber más”.
24. A continuación selecciona las dos referencias y pulsa en el botón Lista de viñetas.
Blogs ::: El editor de entradas en Blogger 84
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
25. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
primera referencia: Es un enlace a Google que ya incluye el término de búsqueda:
http://es.wikipedia.org/wiki/Einstein
26. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
27. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
A continuación en la barra del editor pulsa en el botón Enlace.
28. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar.
2. El editor destaca sobre fondo amarillo las palabras escritas que no contiene en su
diccionario. Aunque en ocasiones son “falsos positivos” (es decir, son palabras que no
tiene incluidas en su diccionario) en otras muchas nos puede ayudar a localizar
algunas letras bailadas o faltas de ortografía.
3. Si haces clic sobre una de estas palabras destacadas, se mostrará un menú de palabras
alternativas. Si seleccionas una de ellas el editor sustituirá esa palabra por la elegida.
Nota:
Más adelante se explicará cómo utilizar la edición HTML para insertar en una entrada
el código embed que integra recursos multimedia alojados en otros servicios.
Blogs ::: El editor de entradas en Wordpress 87
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Una práctica habitual de la edición en línea de contenidos es la preparación previa del texto
con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el
artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma
durante la edición en línea siempre se dispondrá de una copia de seguridad en local.
2. Haz doble clic sobre el archivo einstein.txt para abrirlo con el Bloc de Notas.
Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
Blogs ::: El editor de entradas en Wordpress 89
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Teclea el título de la entrada: Albert Einstein. Haz clic dentro del editor de artículos
y a continuación haz clic derecho para elegir la opción Pegar. Esta acción pegará el
texto copiado del archivo de texto anterior evitando tener que teclearlo.
Notas:
Como ocurre en la mayoría de editores visuales en línea es recomendable copiar y
pegar a partir de texto plano creado con el Bloc de Notas. Otra posibilidad, para
diseños más elaborados, es editar previamente la página con un editor visual HTML
como Kompozer (http://kompozer.net/). Lo que NO se recomienda es pegar a partir
de un documento Word porque se introduce código oculto innecesario y en ocasiones
produce que no se vea adecuadamente. En este caso es preferible utilizar el Bloc de
Notas como paso intermedio para pegar el contenido Word y luego volver a
seleccionar y copiar para pegarlo sobre el editor final.
El texto pegado es un guión del artículo a realizar. Incluye anotaciones entre
corchetes que referencian la posición de la imagen y el formato de los distintos
fragmentos del texto. Es necesario borrar estas anotaciones entre corchetes y aplicar
los cambios apuntados.
Blogs ::: El editor de entradas en Wordpress 90
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Se mostrará una nueva ventana Añadir una imagen para subir la imagen desde
nuestro equipo. Clic en el botón Elegir archivos para localizar y señalar el archivo
einstein.jpg que hemos obtenido en un paso anterior. Observa que sólo se admiten
los formatos de imagen: gif, jpg y png.
8. Para no añadir un enlace a la imagen pulsa en el botón Ninguna en la casilla URL del
enlace. De esta forma se elimina la dirección de la imagen original.
9. En la sección Alineación selecciona la opción Izquierda y en Tamaño elige la opción
Tamaño completo.
10. Pulsa en el botón Insertar en la entrada para que la imagen se inserte en el artículo.
Al finalizar esta tarea la imagen se habrá insertado dentro del artículo utilizando la
alineación definida.
11. Selecciona la línea que contiene las fechas de nacimiento y fallecimiento y pulsa en el
botón Negrita de la barra de herramientas del editor.
Blogs ::: El editor de entradas en Wordpress 92
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
13. Selecciona el texto “Su fórmula E=mc2 es la más popular de la física” y aplícale la
Alineación al centro.
14. A este mismo fragmento aplícale el efecto Cursiva y luego despliega la paleta de
Color de Texto y elige el color rojo.
Blogs ::: El editor de entradas en Wordpress 93
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Selecciona todos los ítems de la lista numerada de la biografía de Einstein y pulsa en
el botón Lista Numerada de la barra de herramientas del editor. Tendrás que borrar
en cada elemento el número que venía escrito.
17. Repite los pasos anteriores para el subtítulo “Teorías de Einstein” y para la lista
numerada de elementos que se citan.
18. Asigna como tamaño de fuente Titulo 2 al siguiente subtítulo “Para saber más”.
19. A continuación selecciona las dos referencias y pulsa en el botón Lista de viñetas.
Blogs ::: El editor de entradas en Wordpress 94
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
20. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
primera referencia: Es un enlace a Google que ya incluye el término de búsqueda:
http://es.wikipedia.org/wiki/Einstein
21. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
22. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
A continuación en la barra del editor pulsa en el botón Enlace.
23. En el cuadro de diálogo Insertar/Editar enlace: haz clic derecho en la casilla URL del
enlace y elige Pegar. En el Destino selecciona la opción Abrir el enlace en una
nueva ventana.
2. El editor destaca sobre fondo amarillo las palabras escritas que no contiene en su
diccionario. Aunque en ocasiones son “falsos positivos” (es decir, son palabras que no
tiene incluidas en su diccionario) en otras muchas nos puede ayudar a localizar
algunas letras bailadas o faltas de ortografía.
3. Si haces clic sobre una de estas palabras destacadas, se mostrará un menú de palabras
alternativas. Si seleccionas una de ellas el editor sustituirá esa palabra por la elegida.
Nota:
Más adelante se explicará cómo utilizar la edición HTML para insertar en una entrada
el código embed que integra recursos multimedia alojados en otros servicios.
Blogs ::: Diseño del blog en Blogger 97
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
7. Para contemplar la nueva apariencia del blog haz clic en el enlace Ver blog.
Nota:
Si en la plantilla anterior habías realizado modificaciones en las fuentes y colores, estos
cambios se perderán al cambiar a una nueva plantilla. Si deseas evitar esta pérdida
puedes acceder a Diseño > Edición de HTML y guardar en tu equipo esa plantilla antes de
cambiar a otra.
2. Para modificar el color de un elemento HTML (fondo principal, texto, enlaces, enlaces
visitados, …), selecciónalo en la lista haciendo clic sobre él y a continuación elige el
color en una de las paletas de colores que se ofrecen. El color actual de cada
elemento siempre acompaña al nombre del mismo en este listado. Observa que cada
vez que realizas un cambio de configuración en la parte inferior de la página se
muestra una vista previa de tu blog.
Cabecera. Muestra el título del blog y en algunos casos una imagen de fondo. Cuando
el lector hace clic en el enlace que proporciona se sitúa en la portada o página
principal del blog.
Entradas del blog. Contiene los artículos o entradas publicadas. Aparecen ordenados
cronológicamente situándose arriba el más reciente. En la página principal solo se
pueden leer un número concreto de artículos. Para acceder a los anteriores se
proporciona un sistema de paginación con un enlace a “Entradas anteriores”.
Barra lateral. Contiene los gadgets o módulos que incorporan prestaciones
adicionales al blog: búsqueda, artículos por meses, artículos por etiquetas, lista de
enlaces, suscripción RSS, etc.
Blogs ::: Diseño del blog en Blogger 102
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Nota:
Un blog de Blogger dispone por defecto de una barra de navegación superior. Como
veremos más adelante se puede configurar la gama de colores de esta barra y
también ocultarla.
6.1.5 Cabecera
1. Descarga y descomprime el archivo encabezados.zip. Como consecuencia obtendrás
una carpeta del mismo nombre y en cuyo interior se proporcionan distintas imágenes
en formato JPG. Se trata de imágenes de tamaño 724 x 190 píxeles. En este
apartado se propone utilizar alguno de ellos para personalizar el encabezado. El
tamaño de imagen proporcionado se ajusta perfectamente a la plantilla No.897 o
similar. Si has optado por otra plantilla habría que buscar o elaborar imágenes de
otras dimensiones que se ajustasen a ella.
Ordenar elementos
En esta sección se muestra el aspecto que tendrá cada entrada con los elementos
seleccionados pero también permite arrastrar y reordenador los elementos situados
después del cuerpo de la entrada.
Guardar configuración
Para guardar los cambios definidos en esta configuración haz clic en el botón
GUARDAR.
El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en
una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente
diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden
mostrar datos adicionales en la misma página sin tener que abandonar esta página.
2. Se abre una nueva ventana Añadir un gadget. Blogger proporciona un amplio catálogo
de gadgets. En este listado se indica la funcionalidad de cada uno.
Blogs ::: Diseño del blog en Blogger 108
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
3. Para añadir un gadget a la barra lateral haz clic en su botón “+”. Por ejemplo:
Cuadro de búsqueda (Nuevo). Si ya has añadido ese gadget en lugar de este botón
aparecerá el texto: “Ya se ha añadido”.
4. Se muestra un panel donde puedes introducir el título del gadget y configurar sus
parámetros. Estos dependerán del tipo de gadget.
5. Para terminar pulsa en el botón GUARDAR. El nuevo widget se habrá añadido a la
barra lateral.
Lista de enlaces
Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la
forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a
blogs).
Al añadir o editar un gadget de lista de enlaces se abre una nueva ventana donde se puede
configurar las propiedades de este listado:
En este cuadro además se proporciona un sencillo interfaz para añadir, editar o suprimir cada
uno de estos enlaces.
Para terminar pulsa en el botón GUARDAR.
Blogs ::: Diseño del blog en Blogger 110
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
En el blog esta gadget se mostrará en la barra lateral proporcionando los enlaces definidos.
Al añadir o editar el gadget de Archivo del blog se pueden configurar sus distintos
parámetros:
Título: es el título que encabezará ese gadget. Este parámetro es común al resto de
gadget y permite personalizar el contenido del mismo.
Estilo. Se pueden elegir tres modelos: Jerarquía (por meses y años), Lista (por
meses) y Menú desplegable (combo).
Opciones. Activar o desactivar opciones como Mostrar títulos de las entradas o
Mostrar primero las entradas más antiguas.
Frecuencia de archivo. Permite definir el intervalo temporal en que se mostrarán
organizados los enlaces a las entradas.
Formato de fecha y Vista previa.
Blogs ::: Diseño del blog en Blogger 111
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Para terminar pulsa en el botón GUARDAR. En la barra lateral del blog se mostrarán unos
enlaces clasificados de acuerdo con los criterios de configuración definidos.
Etiquetas
Muestra un listado de todas las etiquetas o categorías definidas en el blog. Cuando el lector
hace clic en una etiqueta se mostrará una página con todos los artículos que contienen esas
etiquetas.
Enlaces de suscripción
Ofrece a los lectores la posibilidad de suscribirse a los artículos y comentarios de tu blog
utilizando los lectores de feed más conocidos.
En la edición de la configuración de este gadget sólo es necesario definir el título con que se
mostrará.
Blogs ::: Diseño del blog en Blogger 113
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
El lector utilizará la opción Entradas > Atom para suscribirse a tu blog utilizando el
navegador web por defecto o bien un programa específico para leer feed.
Cuadro de búsqueda
Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para
buscar en las entradas o enlaces del blog.
Al configurar este gadget se puede definir su Título y también sus pestañas para definir los
ámbitos de búsqueda: en las entradas de tu blog, en las páginas enlazadas desde cualquier
entrada de tu blog, en internet en general, en los gadgets que contengan enlaces, etc.
Blogs ::: Diseño del blog en Blogger 114
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Al activar este tipo de gadget en la barra lateral se mostrará un cuadro de búsqueda que
permitirá buscar en estos ámbitos utilizando el motor de Google.
Otros gadgets
Blogs ::: Diseño del blog en Blogger 115
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
5. La edición avanzada de este código excede el propósito del curso. En la ayuda general
de Blogger se proporciona información al respecto para quien decida seguir
investigando en este línea. A modo de ejemplo de propone añadir el siguiente código
para eliminar la barra de navegación Blogger de nuestro blog.
Nota:
Si has creado tu blog con el sistema nuevo de Blogger NO se recomienda utilizar los
enlaces Recuperar la plantilla clásica o bien Ver la plantilla clásica. Las pantallas no
se corresponderán con las capturas contenidas en este manual.
Blogs ::: Diseño del blog en Blogger 117
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
#navbar-iframe {
display: none;
}
2. Este código CSS define la propiedad display del elemento CSS navbar-iframe como
none (ninguno) para que no se visualice.
3. Para guardar los cambios realizados haz clic en el botón GUARDAR PLANTILLA.
En ocasiones resulta interesante crear una entrada que muestre un texto de introducción y
oculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa en
este enlace o bien en el título del artículo, entonces la entrada se muestra completa y de
forma individual en la página. Este enlace “Leer más” no se contempla por defecto en Blogger
pero se puede conseguir utilizando la siguiente receta.
<div class='post-header-line-1'/>
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<data:post.body/>
<a expr:href='data:post.url'>Leer Mas...</a>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
2. Haz doble clic sobre el archivo mariecurie.txt para abrirlo con el Bloc de Notas.
Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
3. Abre el navegador web y accede a la URL de inicio de Blogger:
https://www.blogger.com/start?hl=es
4. Introduce sus credenciales (usuario y contraseña) en el apartado Accede a través de
tu cuenta de Google y pulsa en el botón Acceder
5. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio.
6. En este panel aparecerán los distintos blogs que gestionas en Blogger.
7. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición
del blog donde deseas publicar el artículo.
8. Teclea el título: Marie Curie. Haz clic dentro del editor de artículos y a continuación
haz clic derecho para elegir la opción Pegar. Esta acción pegará el texto copiado del
archivo de texto anterior evitando tener que teclearlo.
Blogs ::: Diseño del blog en Blogger 120
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
9. En la barra de herramientas del editor haz clic en el botón Añadir Imagen para añadir
la imagen mariecurie.jpg que se ha descargado en un paso anterior. Reduce el
tamaño de visualización y ajusta la imagen a la izquierda del primer párrafo.
10. Selecciona la lista de elementos de su Biografía y de su Obra para pulsar a
continuación el botón Lista de viñetas para asignarles este formato.
11. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece. Es un
enlace a Google que ya incluye el término de búsqueda:
http://es.wikipedia.org/wiki/Marie_Curie
12. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
13. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
14. A continuación en la barra del editor pulsa en el botón Enlace.
15. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar.
16. Clic en el botón Aceptar para guardar la dirección pegada.
17. Hasta aquí el artículo se ha editado como cualquier otro. A continuación vamos a
situar dentro de la etiqueta span class="fullpost"> </span> el texto que se ocultará
inicialmente. Clic en la pestaña Edición HTML.
18. En el código HTML del artículo añade la etiqueta <span class="fullpost"> antes de la
línea Su biografía. Y luego el cierre de esta etiqueta al final del texto: </span>.
19. Clic en el botón PUBLICAR ENTRADA. Si accedes a la lectura del artículo verás que se
muestra el primer párrafo y el enlace Leer más.
Blogs ::: Diseño del blog en Blogger 121
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Blogs ::: Diseño del blog en Wordpress 122
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Localiza y haz clic, por ejemplo, en la imagen del tema Freshy o bien en el enlace
Vista previa. Se mostrará una vista previa del blog con ese nuevo tema.
3. Desde esta página se puede modificar el color de la fuente del texto que aparece en
el encabezado. Para ello haz clic en el botón Color de fuente y en la paleta de
colores que se despliega elige un color. Para recuperar cualquier cambio pulsa en el
botón Revertir.
4. Color superior/inferior. Haz clic en estos botones para definir el degradado de color
lineal de fondo que se mostrará en el encabezado.
5. Para definir numéricamente el color de los parámetros anteriores pulsa en el botón
Avanzado. Esto mostrará un cuadro donde es posible introducir los códigos
hexadecimales de los colores de texto, superior e inferior.
6. Para guardar los cambios haz clic en el botón Save (Guardar). Si deseas recuperar los
colores originales del encabezado del tema pulsa en el botón Revertir.
Blogs ::: Diseño del blog en Wordpress 126
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6.2.3 Cabecera
La estructura del Frontend de un blog suele tener los siguientes elementos:
Cabecera. Muestra el título del blog y en algunos casos una imagen de fondo. Cuando
el lector hace clic en el enlace que proporciona se sitúa en la portada o página
principal del blog.
Entradas del blog. Contiene los artículos o entradas publicadas. Aparecen ordenados
cronológicamente situándose arriba el más reciente. En la página principal solo se
pueden leer un número concreto de artículos. Para acceder a los anteriores se
proporciona un sistema de paginación con un enlace a “Entradas anteriores”.
Barra lateral. Contiene los widgets o módulos que incorporan prestaciones
adicionales al blog: búsqueda, artículos por meses, artículos por etiquetas, lista de
enlaces, suscripción RSS, etc.
4. En la página “Subir una nueva imagen de cabecera” haz clic en el botón Examinar…
para localizar una imagen JPG en la carpeta encabezados que has obtenido en el
paso anterior. Clic en el botón Subir.
El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en
una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente
diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden
mostrar datos adicionales en la misma página sin tener que abandonar esta página.
El tema elegido para nuestro blog ya muestra por defecto una serie de widgets en la barra
lateral. Sin embargo es posible personalizar los que se mostrarán y el orden en que
aparecerán de arriba hacia abajo.
1. Desde el interfaz de administración del blog haz clic en el enlace Apariencia >
Widgets.
Blogs ::: Diseño del blog en Wordpress 129
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Para añadir un widget a la barra lateral basta con arrastrar y soltar el widget en el
interior de la Barra lateral.
4. En función del tipo de widget se puede definir el título con que se mostrará así como
sus propiedades. Para terminar pulsa en el botón Guardar que acompaña a ese
widget.
Blogs ::: Diseño del blog en Wordpress 130
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. Clic en el botón de cabeza de flecha hacia abajo que se muestra en la parte derecha
de la barra de título del widget. Esta acción mostrará las propiedades que se pueden
editar del widget: título y parámetros.
2. Realiza las modificaciones oportunas de sus parámetros y para terminar pulsa en el
botón Guardar.
Enlaces
Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la
forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a
blogs).
Al añadir o editar un widget de Enlaces se pueden configurar las propiedades de este listado:
Categoría de enlaces. Despliega esta lista para seleccionar Todos los enlaces o bien
sólo los enlaces pertenecientes a una categoría.
Ordenar por: permite definir el tipo de ordenación que se utilizará para mostrar el
listado de enlaces: Link title (título del enlace), Link rating (valoración del enlace),
Link ID (Identificador del enlace) y Aleatorio.
Mostrar la imagen, nombre, descripción y clasificación del enlace. Si se activa
alguna de estas opciones se mostrará ese parámetro del enlace.
Links to show (Enlaces a mostrar). Permite especificar el número máximo de enlaces
que se mostrará en el listado. Si se deja en blanco se mostrarán todos los enlaces.
Archivos
Título: es el título que encabezará ese widget. Este parámetro permite personalizar
el contenido del mismo.
Mostrar la cantidad de entradas. Si se activa esta opción se mostrará el número de
entradas correspondientes a ese mes.
Mostrar como un desplegable. Muestra el listado de meses como una lista
desplegable.
Para terminar pulsa en el botón Guardar. En la barra lateral del blog se mostrarán unos
enlaces clasificados de acuerdo con los criterios de configuración definidos.
Nube de etiquetas
Muestra un listado de todas las etiquetas definidas en el blog. Cuando el lector hace clic en
una etiqueta se mostrará una página con todos los artículos que contienen esas etiquetas.
Enlaces de suscripción
Ofrece a los lectores la posibilidad de suscribirse a las entradas/artículos y comentarios de tu
blog utilizando los lectores de feed más conocidos.
En la edición de este widget es posible configurar:
Para terminar pulsa en el botón Guardar. Para minimizar este widget pulsa en el enlace
Cerrar. El lector utilizará estos enlaces para suscribirse a tu blog utilizando el navegador web
por defecto o bien un programa específico para leer feed.
Buscar
Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para
buscar en las entradas del blog.
Blogs ::: Diseño del blog en Wordpress 134
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Al configurar este widget se puede definir su Título. Clic en el botón Guardar. Al activar este
tipo de widget en la barra lateral se mostrará un cuadro de búsqueda que permitirá buscar en
las entradas del blog.
Otros widgets
Texto. Es un cuadro con texto plano o código HTML que permite añadir un servicio externo.
Entradas recientes. Proporciona acceso a las entradas más recientes del blog.
Posts más vistos. Muestra enlaces a las entradas más visitadas del blog.
Páginas. Proporciona enlace a las páginas del blog. En Wordpress las páginas son entradas o
artículos independientes que no se someten a la cronología de las entradas o posts. Se
utilizan para situar información más o menos permanente en tu sitio web.
Blogs ::: Diseño del blog en Wordpress 135
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
RSS. Permite insertar un cuadro en la barra lateral con las noticias de un feed RSS o Atom
externo o de terceros.
1. Desde el interfaz de administración del blog selecciona Apariencia > Editar CSS
Nota importante:
2. Haz doble clic sobre el archivo mariecurie.txt para abrirlo con el Bloc de Notas.
Selecciona Edición > Seleccionar todo para seleccionar el texto completo que
contiene este archivo y a continuación elige Edición > Copiar para copiarlo al
portapapeles de Windows. Cierra la ventana del Bloc de Notas.
3. Desde el interfaz de gestión de contenidos del blog selecciona Entradas > Añadir.
4. Teclea el título: Marie Curie. Haz clic dentro del editor de artículos y a continuación
haz clic derecho para elegir la opción Pegar. Esta acción pegará el texto copiado del
archivo de texto anterior evitando tener que teclearlo.
5. Haz clic en el botón Añadir Imagen para añadir la imagen mariecurie.jpg que se ha
descargado en un paso anterior. Reduce el tamaño de visualización y ajusta la imagen
a la izquierda del párrafo de la biografía.
6. Selecciona la lista de elementos de su Biografía y de su Obra para pulsar a
continuación el botón Lista de viñetas para asignarles este formato.
7. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece. Es un
enlace a Google que ya incluye el término de búsqueda:
http://es.wikipedia.org/wiki/Marie_Curie
8. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
9. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
10. A continuación en la barra del editor pulsa en el botón Insertar/Añadir Enlace.
11. En el cuadro de diálogo Insertar/Añadir Enlace: haz clic derecho sobre el cuadro de
texto que debe contener la dirección y elige Pegar.
12. Clic en el botón Aceptar para guardar la dirección pegada.
13. Hasta aquí el artículo se ha editado como cualquier otro. A continuación vamos a
situar por delante del texto que se ocultará inicialmente una marca de “Leer más”.
Sitúa el cursor del ratón antes del párrafo de la biografía y pulsa en el botón Insertar
Etiqueta Más.
Blogs ::: Diseño del blog en Wordpress 137
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
14. Clic en el botón Publicar. Si accedes a la lectura del artículo verás que se muestra el
primer párrafo y el enlace Leer el resto de esta entrada.
Blogs ::: Moderación de comentarios en Blogger 138
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
7. Moderación de
comentarios
Blogs ::: Moderación de comentarios en Blogger 139
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
7.1 Moderación de
comentarios en Blogger
Blogs ::: Moderación de comentarios en Blogger 140
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
2. Desde esta página se pueden tomar decisiones sobre el comportamiento del blog en
relación con la gestión de los comentarios de los lectores:
Comentarios. Permite mostrar y ocultar los comentarios del blog. Si se deciden ocultar no se
mostrará formulario para su envío. Si se selecciona ocultar NO se suprimen los comentarios
existentes ya que podrán volver a visualizarse en cualquier momento si se elige de nuevo
mostrar. Se pueden mostrar los comentarios con carácter general y luego no permitir
comentarios a un artículo en concreto.
Persona que puede realizar los comentarios. En este caso se proporcionan 4 opciones:
Cualquiera. Si se elige esta opción cualquier usuario anónimo podrá enviar
comentarios.
Usuarios registrados. Sólo podrán enviar comentarios los usuarios registrados con
cuenta Google o bien con identidad OpenID. Es necesario introducir estas credenciales
para completar el envío.
Usuarios con cuentas Google. Sólo podrán enviar comentarios los usuarios que
dispongan de cuenta Google.
Sólo los miembros de este blog. Para enviar un comentario es necesario estar
registrado como usuario en el blog.
Enlaces de retroceso. Se pueden mostrar u ocultar los trackbacks que permiten realizar el
seguimiento de otros blogs que han enlazado a este artículo.
Blogs ::: Moderación de comentarios en Blogger 141
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Moderación de comentarios.
Siempre. Si marcas esta opción todos los comentarios se guardarán como pendientes
de revisión. Serán visibles cuando se aprueben desde la administración.
Sólo en entradas posteriores a X días. Permite especificar el número de días que
deben transcurrir para que un comentario enviado se publique directamente en el
blog.
Nunca. Si marcas esta opción los comentarios se publicarán directamente sin la
moderación de ningún administrador del blog.
Cuando se registra un comentario, en la correspondiente entrada a ese blog en el Escritorio
se mostrará un icono de aviso de que existen comentarios por revisar.
Se envía una notificación a la dirección de correo electrónico que se especifique cuando un
lector no registrado en el blog envíe un comentario. Si esta casilla está vacía no se enviará
notificación.
Mostrar imágenes de perfil en los comentarios. Se puede elegir entre mostrar u ocultar el
perfil de los usuarios en los comentarios publicados.
Aprobar un comentario
1. En el panel de administración del blog elige las pestañas: Creación de entradas >
Moderación de comentarios.
Blogs ::: Moderación de comentarios en Blogger 143
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Nota:
Blogger no proporciona herramientas para modificar el contenido de los comentarios.
Sólo es posible publicarlos o suprimirlos.
Suprimir un comentario
Para eliminar un comentario publicado:
1. Desde el interfaz de gestión del blog elige Creación de entradas > Editar entradas.
2. En la columna Comentarios del listado de artículos se muestra un enlace a los
comentarios publicados de cada artículo. Clic en este enlace. Esta acción te enviará
al frontend del blog mostrando los comentarios publicados.
Notas:
7.2 Moderación de
comentarios en
Wordpress
Blogs ::: Moderación de comentarios en Wordpress 146
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado
Moderación de comentarios
No descartar spam en mensajes antiguos
Mantener un comentario en espera si contiene más de 2 enlaces (una característica
común del spam en comentarios es el gran número de enlaces).
Mantener en la cola de moderación todo comentario que incluya cualquiera de las
siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples
palabras o IP con saltos de línea. Atención a las coincidencias en el interior de
palabras: "press" se encontrará en "WordPress".
Suscribirse al blog
Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios
Avatares
Un avatar es una imagen para identificar a un usuario y normalmente sale al lado de su
nombre en los comentarios o referencias. Desde aquí puedes permitir la visualización de los
avatares de los usuarios que dejen comentarios en tu blog.
Visibilidad
No mostrar avatares
Mostrar avatares
Puntuación máxima
G - Para todos los públicos
PG - Para mayores de 13 años
R - Para mayores de 17 años
X - Contenido adulto
3. Tras definir los valores de estos parámetros haz clic en el botón Guardar cambios.
En este formulario el lector o visitante anónimo debe indicar los siguientes datos:
Nombre. Es el nombre del usuario. Es obligatorio.
Email. El usuario debe indicar una dirección de correo electrónico aunque no se hará
pública. Es obligatorio.
Web. Se puede indicar la dirección de una página web. Es opcional.
Comentario. Contiene el texto del comentario.
Recibir siguientes comentarios por correo. Si el lector ha introducido una dirección
de correo electrónico válida, en ella recibirá notificación si se producen nuevos
comentarios.
Recibir nuevas entradas por email. Se recibe notificación de nuevos artículos
publicados en el blog.
Aprobar un comentario
Suprimir un comentario
Para eliminar un comentario:
1. Desde el interfaz de gestión del blog elige Comentarios. Esta acción muestra todos
los comentarios. Localiza el comentario que deseas eliminar y al situar el puntero del
ratón sobre él se muestran las distintas opciones de procesamiento individual. Haz
clic sobre la opción Papelera. Esta acción mueve ese comentario a la papelera pero
no lo elimina definitivamente.
2. Otra forma de enviar a la papelera varios comentarios a la vez consiste en marcar sus
casillas y a continuación elegir la opción Mover a la papelera en la lista desplegable
Acciones en lote.
3. En la parte superior del listado se ofrecen enlaces para filtrar el listado de
comentarios por Todos, Pendiente, Aprobados, Spam o Papelera.
4. Para eliminar definitivamente un comentario haz clic en el enlace Papelera y una vez
dentro de la papelera puedes seleccionar entre Restaurar el comentario o bien
Borrar permanentemente. Otra opción es pulsar el botón Vaciar papelera.
Blogs ::: Moderación de comentarios en Wordpress 151
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado
Editar un comentario
Wordpress permite editar el contenido de un comentario. Para ello basta con elegir la opción
Editar o bien Edición rápida para acceder a una página donde es posible modificarlo.
Si marcas un comentario como spam éste se guarda en la carpeta Spam de los comentarios y
cualquier otro comentario enviado posteriormente desde la misma IP será destinado
automáticamente a esta carpeta.
Blogs ::: Usuarios y permisos en Blogger 152
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8. Usuarios y permisos
Blogs ::: Usuarios y permisos en Blogger 153
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Nota:
4. Clic en el botón INVITAR. Esta acción enviará un mensaje de correo electrónico a las
direcciones indicadas. En él se informa al destinatario que ha sido invitado a
participar como autor en el blog del usuario principal. El destinatario necesita
disponer de cuenta de usuario Google y confirmar la invitación pulsando en el enlace
que acompaña a este mensaje. A partir de ese momento podrá escribir entradas en tu
blog.
Notas:
Máximo número de autores. Tu blog puede disponer de 100 autores como máximo.
Eliminar un autor. Cada usuario autor se puede eliminar haciendo clic en el enlace
eliminar del listado.
De autor a administrador. Un usuario autor se puede promocionar a administrador
haciendo clic en el enlace otortar privilegios de administrador que acompaña a ese
usuario en el listado de autores. Hay que tener en cuenta que el nuevo administrador
dispondrá de acceso a la configuración del blog y también a la gestión de usuarios. La
asignación de este rol es reversible en cualquier momento.
Sólo a los usuarios que yo elija. Esto permite introducir las direcciones de
correo electrónico de los usuarios Google que pueden acceder a la lectura de
los artículos. Si se configura esta opción será necesario introducir las
credenciales como paso previo para la lectura. En este caso se pueden
restringir la lectura a una lista como máximo de 100 usuarios. Los autores del
blog ya disponen de acceso a estos artículos.
Blogs ::: Usuarios y permisos en Blogger 156
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Únicamente autores del blog. Si activas esta opción sólo podrán leer los
artículos los usuarios registrados como usuarios
Título
El título del blog se muestra en el encabezado de portada, en el escritorio, en tu perfil,
etc. Se recomienda ser los más creativo posible en este título.
Descripción
Es una breve descripción del blog que se puede mostrar a los lectores en el encabezado
acompañando al título. Tiene una extensión no superior a 500 caracteres.
9.1.2 Publicación
9.1.3 Formato
1. Desde el interfaz de gestión de tu blog elige Configuración > Formato.
2. En esta página se definen los siguientes parámetros:
Formato de fecha del índice de archivos. Establece el formato de la fecha en los enlaces
de archivo que se muestran en el correspondiente gadget de la columna lateral.
Zona horaria. Es conveniente establecer esta zona horaria para ajustar la publicación
programada de artículos.
Convertir saltos de línea. Si activas esta opción como Sí, los retornos de carro insertados
en el editor de artículos utilizando la tecla Enter serán sustituidos por la etiqueta <br/> y
los dobles retornos de carro por dos etiquetas <br/><br/>. Esto evitará una separación
excesiva entre párrafos.
Mostrar campo de enlace. Al crear una entrada permite introducir una URL adicional a
un archivo de audio o URL relacionada.
9.1.4 Comentarios
Ver el apartado anterior sobre Moderación de comentarios.
9.1.5 Archivo
1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Configuración >
Archivo.
2. En la página de Archivo se pueden configurar los siguientes datos:
Frecuencia de archivo. Permite definir el intervalo con que se mostrarán los enlaces a las
entrada en el gadget Archivo de la barra lateral: Diaria, Semanal o Mensualmente.
¿Habilitar páginas de entrada?. Es una opción activada por defecto. Las páginas de entrada
permiten que cada artículo disponga de su página web con una URL significativa. Ejemplo:
http://multimediaweb20.blogspot.com/2009/08/albert-einstein.html. En esta dirección de
página se incluye información extraída del título de la entrada. Si no se activa esta opción
entonces las URLs individuales de las entradas no serán amigables. Ejemplo:
http://multimediaweb20.blogspot.com/2009_08_07_archive.html#1305293459555266304
9.2.2 Escritura
Tamaño de la caja de texto. Permite definir el número de líneas que tendrá el editor
de entradas por defecto. Este editor se puede expandir mediante la acción de
arrastrar la esquina inferior derecha del mismo.
Formato. Convertir emoticones a gráficos en pantalla.
Formato. Wordpress corregirá de forma automática el HTML incorrectamente
anidado.
Categoría predeterminada para las entradas. Indica la categoría en que se
clasificará por defecto una entrada cuando no se especifique ninguna.
Categoría predeterminada para los enlaces.
Blogs ::: Configuración del blog en Wordpress 167
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9.2.3 Lectura
1. Desde el interfaz de gestión de tu blog elige Opciones > Lectura.
2. En esta página se definen los siguientes parámetros:
9.2.4 Comentarios
1. Desde el interfaz de gestión de tu blog elige Opciones > Comentarios.
2. En esta página se definen los siguientes parámetros:
Moderación de comentarios
No descartar spam en mensajes antiguos
Mantener un comentario en espera si contiene más de XX enlaces (una
característica común del spam en comentarios es el gran número de enlaces).
Mantener en la cola de moderación todo comentario que incluya cualquiera de las
siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples
palabras o IP con saltos de línea. Atención a las coincidencias en el interior de
palabras: "press" se encontrará en "WordPress".
Suscribirse al blog
Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios
Avatares
Un avatar es una imagen que representa al usuario acompañando a su nombre en un
comentario. Esta imagen es visible en aquellos blogs que lo permiten. En este apartado de la
configuración del blog se puede activar que se muestren los avatares de aquellos usuarios que
envien comentarios al blog.
Visibilidad
No mostrar avatares
Mostrar avatares
Puntuación máxima
Puntuación máxima G - Para todos los públicos
PG - Para mayores de 13 años
R - Para mayores de 17 años
X - Contenido adulto
9.2.5 Privacidad
1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Configuración >
Privacidad.
2. En la página de Opciones de privacidad se puede optar por una de las siguientes
alternativas:
Me gustaría que mi sitio fuera visible por cualquier usuario incluidos los motores
de búsqueda como Google, Bing, etc.
Quiero bloquear los motores de búsqueda pero permitir visitantes normales.
Quiero que mi blog sea privado, visible solo a los usuarios que yo seleccione.
Blogs ::: Documentos PDF 169
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
10.1 Introducción
En un sitio web es frecuente poner a disposición de los usuarios documentos en formato PDF
para la consulta de información. Ejemplo: los boletines oficiales. Las ventajas que ofrece este
tipo de archivo son:
Se puede abrir con distintas aplicaciones de software gratuito.
Es accesible desde cualquier plataforma: Windows, Linux, Mac, etc.
El documento PDF tiene un tamaño más reducido que el original.
Admite la búsqueda fácil de información entre sus páginas.
Tiene una presentación idéntica e independiente del dispositivo de visualización
(pantalla) y de impresión (impresora).
Permite proteger el contenido del documento frente a terceros.
1. Lectura y creación de archivos PDF desde Windows: Adobe Reader y PDF Creator.
2. Lectura y creación de archivos PDF desde Ubuntu: Evince Visor de documentos.
3. Exportar a PDF desde OpenOffice.
4. Vinculación de un archivo PDF en una página del blog.
Si deseas consultar la web de Adobe para comprobar si existe una nueva versión del
programa: http://www.adobe.es
Otra alternativa al uso de Adobe Reader es disponer de un programa portable para leer
documentos PDF. Es el caso del programa Sumatra PDF. Descarga y descomprime el archivo
SumatraPDFPortable_1.0.1.paf.exe en una carpeta de tu disco duro o bien en tu pendrive.
2. Haz doble clic en el archivo plantas.html para abrirlo con el navegador web Firefox.
3. Antes de imprimir vamos a configurar la página para eliminar los encabezados y pie
de página. Para ello selecciona Archivo > Configurar página … En la pestaña
Márgenes y encabezado/pie de página elige Nada en los encabezados y pies. Clic en
el botón Aceptar.
Blogs ::: Documentos PDF 172
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
6. Antes de iniciar la impresión con PDFCreator se solicitan los metadatos del nuevo
archivo: título, fecha de creación, fecha de modificación, autor, asunto, palabras
clave, etc. Es importante completar adecuadamente estos datos. Asegúrate de que la
casilla Al terminar, abrir el documento con el programa predeterminado esta
activada para ver el aspecto final del documento.
Nota:
Una vez que has instalado Adobe Reader y PDF Creator se puede crear un PDF desde
cualquier programa que permita la impresión: Microsoft Office, Internet Explorer, Mozilla
Firefox, etc. Si se utiliza con un navegador web permite realizar copias de seguridad en
formato PDF de las páginas web que se visitan. El proceso se iniciará de forma similar a como
se describe en este apartado a partir del comando Archivo > Imprimir.
Blogs ::: Documentos PDF 174
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Si tratamos de abrir un archivo PDF descargado de Internet a través del navegador o bien un
fichero PDF del equipo se abrirá esta aplicación mostrando su contenido. De esta forma
podremos leerlos.
Blogs ::: Documentos PDF 175
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Windows
Ubuntu
Ambos
1. Abre OpenOffice.
4. Una vez terminado el documento selecciona la opción Archivo > Exportar en formato
PDF …
Blogs ::: Documentos PDF 177
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
4. Clic en el enlace Sitios para acceder al servicio Google Sites asociado a la cuenta
Google.
5. En el listado de Mis sitios haz clic en el enlace Mi Sitio para acceder al sitio por
defecto asociado a la cuenta. Su URL de acceso público es
http://sites.google.com/site/<nombre_usuario> y el interfaz de gestión de Google
Sites permitiría crear un espacio web alternativo al blog. En este caso vamos a
guardar el archivo PDF en este sitio para luego enlazarlo desde el blog.
6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los
archivos se propone crear una carpeta de nombre pdf donde guardar los archivos pdf.
Clic en el botón Crear página.
9. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir
archivo.
10. En el cuadro de diálogo Añadir archivo pulsa en el botón Examinar para localizar el
archivo PDF que has creado en el apartado anterior: plantas.pdf. Puedes introducir
opcionalmente una descripción del archivo. Clic en el botón Subir.
Blogs ::: Documentos PDF 180
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
11. Utilizando el navegador web Mozilla Firefox haz clic derecho sobre el enlace
correspondiente al archivo subido y elige la opción Copiar la ruta del enlace
19. Pulsa en el botón PUBLICAR ENTRADA. A continuación haz clic en Ver blog para ver
la apariencia del artículo.
9. Para cerrar este panel haz clic el botón Guardar cambios que se ofrece en la parte
inferior y haz clic fuera de este panel.
10. De regreso al editor de la entrada selecciona el texto PDF sobre Anatomía de las
plantas y pulsa en el botón Insertar/Editar enlace.
11. Se muestra el cuadro de diálogo Insertar/Editar enlace. Clic derecho sobre el cuadro
de texto URL del enlace y elige Pegar.
ç
Blogs ::: Documentos PDF 184
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
12. Despliega el combo Destino y elige la opción Abrir el enlace en una nueva ventana.
13. Clic en el botón Insertar del cuadro de diálogo Insertar/Editar enlace.
14. Observa que se crea un enlace a este documento en el artículo.
16. Para visualizar el aspecto del artículo haz clic en el botón Ver entrada.
Blogs ::: Google Docs 185
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11.1.1 Introducción
Google Apps es un servicio web 2.0 ofrecido por Google a los usuarios registrados con cuenta
de Gmail (http://www.gmail.com). Se puede utilizar para desarrollar una comunidad de
usuarios que utilizan de forma colaborativa sus distintas aplicaciones web ofimáticas: Gmail,
Google Calendar, Talk, Docs, Sites, etc.
Las aplicaciones que proporciona Google Apps son de dos tipos: comunicación (Gmail, Talk,
Reader y Calendar) y de colaboración/publicación (Docs y Sites)
1. Sin guardar nada en el ordenador propio. El usuario puede acceder desde cualquier
equipo y no necesita guardar nada en su ordenador. Si éste se estropea no pasa nada
aunque no haya realizado copias de seguridad.
2. Sistema de versiones de los documentos. Si algún día se elimina un documento de
forma accidental, la plataforma siempre guardar todas las versiones anteriores.
3. Compartir documentos por URL. No se requiere enviar un pesado email a nadie con
el documento. Basta un email con la URL al mismo.
4. Actualización de software. No es necesario actualizar el software de creación de
documentos cada dos o tres años.
5. Reinstalación del ordenador. No se precisa la reinstalación de software porque basta
con un navegador web.
6. Gratuito. En el entorno educativo es gratuito.
7. Exportación. Permite la exportación de los documentos a formatos multiplataforma
como PDF que pueden ser guardados en local y enviados a otros usuarios.
8. Fácil. Los documentos elaborados tienen una estructura sencilla.
9. Distintos idiomas. No se producen problemas con los idiomas ni con símbolos extraños
ni con la importación de documentos de Internet u otros programas.
10. Descarga en local. Es posible guardar el documento en el ordenador para su posterior
consulta si algún día está previsto no conectarse en Internet.
Blogs ::: Google Docs 187
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Google Docs permite crear documentos de texto, presentaciones y hojas de cálculo mediante
un editor que se utiliza a través del navegador web. Esto facilita la edición de un documento
online entre varias personas simultáneamente desde sus respectivos navegadores.
Es posible importar y exportar archivos en Google Docs de una forma muy sencilla. Para
utilizar un archivo guardado en el equipo basta con subirlo (importarlo) y continuar allí donde
se había dejado. Para trabajar con documentos sin conexión o distribuirlos como adjuntos, se
puede exportar una copia al equipo en el formato que más se adapte a tus necesidades.
Para utilizar Google Docs SÓLO SE NECESITA una conexión a Internet y un navegador estándar.
Esta suite se complementa con otras interesantes aplicaciones como Google Reader (organiza
las suscripciones RSS), Google Photos (albumes web con Picassa), Google Maps (Mapas para
geolocalización de fotos), Google Grupos (foros de debate e intercambio de archivos), etc.
Blogs ::: Google Docs 190
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Si el interfaz se muestra en inglés haz clic en el enlace Settings que aparece en la esquina
superior derecha y elige Settings Docs. A continuación define Español como idioma y Madrid
como franja horaria. Clic en Save (Guardar).
2. Haz clic sobre el título del documento Documento sin título y en el cuadro de diálogo
Cambiar el nombre del documento teclea, por ejemplo, Federico García Lorca. Clic
en el botón Aceptar.
Blogs ::: Google Docs 191
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Dentro del documento teclea el título del documento: Federico García Lorca.
4. A continuación selecciona este fragmento de texto y en la barra de menús selecciona
Formato > Estilo de párrafo > Título 1. El título introducido adquiere el estilo
definido.
11. Para eliminar el formato del texto selecciónalo y a continuación elige Formato >
Borrar formato.
12. El texto se ha copiado incluyendo los hipervínculos. Puede ser interesante
conservarlos. Si deseabas copiar sólo el texto plano (sin los enlaces) podías haberlo
hecho abriendo el Bloc de Notas y pegando el texto copiado de Wikipedia sobre un
documento en blanco del Bloc de Notas mediante Editar > Pegar. A continuación
selecciona el texto en el Bloc de Notas y elige Editar > Copiar. De esta forma se
eliminarán los enlaces antes de pegarlos en el editor de Google Docs.
13. Para terminar con el texto elabora o adapta la información copiada para que resulte
original.
15. Regresa a la pestaña del documento. Haz clic en el espacio del documento situado
entre el título y el texto para indicar el punto de inserción de la imagen. A
continuación en la barra de menús selecciona Insertar > Imagen o bien pulsa en el
botón Insertar imagen que se ofrece en la barra de herramientas.
16. En el cuadro de diálogo Insertar imagen activa la opción URL que se ofrece en la
columna izquierda. Clic derecho en el cuadro de texto Pega la URL de la imagen aquí
y selecciona Pegar para pegar la dirección de la imagen capturada en el paso
anterior.
Nota: Si eliges la opción Desde este equipo podrías subir una imagen propia desde el
disco duro del ordenador pulsando en el botón Examinar…
18. Regresa a la pestaña donde se muestra el artículo de Wikipedia. Clic derecho sobre la
dirección que se muestra en el navegador web y elige Copiar.
19. Regresa a la pestaña del editor y debajo del texto escribe en una línea: “Para saber
más: Federico García Lorca en Wikipedia”.
20. Selecciona el texto y desde la barra de menús elige Insertar > Enlazar o bien pulsa
sobre el botón Inserta enlace que aparece en la barra de herramientas.
21. En el cuadro de diálogo Modificar enlace haz clic derecho sobre la casilla ¿A qué URL
debe enlazar este enlace? y elige la opción Pegar para insertar la URL copiada al
artículo de Wikipedia.
Blogs ::: Google Docs 196
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
25. Pulsa en la pestaña Compartir que aparece en la parte superior derecha del editor de
documentos. Elige la opción Invitar a usuarios …. Se muestra la ventana Compartir
con otros usuarios donde se definen las condiciones en que se comparte el
documento creado.
28. Para el usuario o usuarios cuyas direcciones de correo electrónico has introducido,
puedes elegir entre dos opciones:
Para editar. Los usuarios elegidos podrán modificar el documento.
Para leer. Los usuarios elegidos sólo podrán leer el documento. En este caso
elegiremos esta opción.
30. En este caso vamos a elegir la opción de añadir sin enviar invitación. Al hacerlo se
mostrará un mensaje de advertencia Omisión de invitaciones donde se indica que los
usuarios al no recibir invitación por email tendrán que acceder a Google Docs para ver
lo que han compartido. Clic en el botón Aceptar.
31. Ahora se mostrará el cuadro de diálogo Compartir con otros usuarios pero con la
pestaña Usuarios con acceso activada. En ella se mostrará el listado de usuarios con
que hemos compartido ese documento.
Blogs ::: Google Docs 199
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
32. Para cada usuario se indica si es propietario, puede editar o sólo ver. Para modificar
el tipo de permiso sobre el documento o eliminar el usuario despliega el combo que
acompaña a la línea correspondiente al email de ese usuario. Si deseas eliminar el
usuario elige la opción Ninguno.
Permitir que los editores inviten a otros usuarios para editar o ver.
Permitir el reenvío de invitaciones.
34. Para guardar todos los cambios pulsa en el botón Guardar y cerrar.
35. Para abandonar el panel de Compartir con otros usuarios haz clic en el botón
Guardar y cerrar que se ofrece en la esquina inferior izquierda de este panel.
Blogs ::: Google Docs 200
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
36. Para cerrar el editor del documento y volver al gestor de archivos de GDocs basta con
cerrar la pestaña que contiene el editor pero asegurándose de que el botón Guardado
aparece deshabilitado en la esquina superior de la ventana del navegador. De esta
forma nos cercioraremos de que se han guardado todos los cambios en el servidor.
37. De regreso al administrador de archivos de Google Docs verás que se ha creado una
entrada del documento creado.
8. Tras concluir la subida haz clic en el enlace Volver a Google Docs para regresar al
gestor de archivos.
9. Desde el administrador de archivos de Google si haces clic en el título de una
presentación se abrirá el editor de presentaciones de GDocs con ese archivo.
Blogs ::: Google Docs 202
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Desde la barra de menús (Archivo, Editar, Diapositiva, Insertar, etc) se pueden
realizar todas las operaciones de edición sobre la presentación abierta.
11. En la barra de herramientas encontrarás acceso a las operaciones más utilizadas:
añadir, duplicar o eliminar diapositiva; insertar imagen o texto, etc.
12. Si deseas ver la presentación pulsa en el botón Iniciar presentación.
13. No olvides pulsar en el botón Guardar para salvar los cambios introducidos si el
sistema no lo ha hecho ya.
14. Para compartir un documento haz clic en el botón Compartir y luego selecciona
Invitar a usuarios. El procedimiento es similar al explicado en el apartado anterior.
15. Para regresar al gestor de documentos cierra la pestaña que contiene el editor.
16.
Otra posibilidad es activar la opción de que cualquier usuario anónimo (sin disponer de cuenta
en Google) pueda acceder directamente a nuestro documento con solo disponer de su URL o
dirección en internet. Le enviaríamos esta URL pegada en un mensaje de correo electrónico y
Blogs ::: Google Docs 203
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Basta hacer clic sobre una categoría o carpeta en la columna izquierda, para que se muestre
detalle de los archivos que contiene en el panel derecho.
Todos los elementos: los archivos se clasifican en las siguientes secciones Soy el
propietario, Abierto por mí, Destacados (contiene los archivos marcados sobre la
estrella por parte del usuario), Oculto (archivos ocultados por el usuario) y Papelera
(Suprimidos).
Mis carpetas: contiene las carpetas temáticas que el usuario puede crear para
guardar de una forma organizada los archivos.
Elementos por tipo: muestra los archivos clasificados por tipo: documento,
presentación, hoja de cálculo y PDF.
Utilizando cualquiera de estos dos procedimientos se puede navegar por las distintas
versiones históricas del documento utilizando los botones Más antigua y Más reciente.
Observa que al visualizar una versión se muestra la hora en que se guardó y el usuario que lo
hizo. Para sustituir una versión por la actual o más reciente se pulsa en el enlace Recuperar
ésta.
Al hacer clic derecho sobre un archivo en el gestor de archivos se muestran las principales
opciones de procesamiento.
Documento: Guardar como HTML, como OpenDocument, como PDF, como RTF
(Formato de texto enriquecido), como texto normal (texto plano) y como
Microsoft Word
Presentación: Guardar como PDF, como PPT (Powerpoint) y como texto.
Hoja de cálculo: Guardar como Excel, como OpenOffice Calc y como texto.
Nota:
En ocasiones cuando se utiliza Mozilla Firefox puede ocurrir que se conozca la carpeta
destino donde se guardan los archivos descargados. Para saber dónde lo hace o bien forzar a
que pregunte siempre la carpeta destino al descargar el archivo selecciona Herramientas >
Opciones. En la pestaña Principal y en la sección Descargas marca opción Guardar archivos
en para elegir la carpeta destino donde se guardarán todas las descargas o bien marca la
opción Preguntarme siempre dónde guardar los archivos.
Blogs ::: Google Docs 208
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. Desde el gestor de archivos de Google Docs elige Nuevo > Desde la plantilla.
2. En la columna izquierda busca la sección Reducir por tipo para elegir el tipo de
documento que te interesa (Documento de texto, Presentación, Hoja de cálculo o
Formulario) o bien Reducir por categorías para diseñar el documento en función de
un evento o necesidad concreta (Albumes, Etiquetas, Tarjetas de presentación, etc).
Esta acción crea un listado filtrado de las plantillas. En este caso podemos elegir el
tipo Documentos (texto) o bien Presentaciones.
3. Para observar el aspecto de una plantilla elige una entrada del listado de plantillas
disponibles y haz clic en el enlace Vista previa.
4. Para elegir definitivamente una plantilla haz clic en el botón Utilizar esta plantilla.
5. Se iniciará el editor de documentos o presentaciones ofreciendo la oportunidad de
modificar el contenido textual para introducir nuestro propio texto.
Blogs ::: Google Docs 209
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11.5 Formularios
11.5.1 ¿Qué son los formularios?
Google Docs ofrece la posibilidad de diseñar un formulario de preguntas, enviar la URL de
acceso a los usuarios que deseemos para que lo rellenen y luego recoger sus respuestas en
forma de tabla y gráficos de datos.
2. Se accede a la página de edición del nuevo formulario. Introduce como título, por
ejemplo: Gustos y colores. Y como descripción: Cuestionario de gustos y colores.
Pregunta 1:
Blogs ::: Google Docs 210
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Pregunta 2:
Pregunta 3:
Pregunta 4:
Blogs ::: Google Docs 211
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Si al editar una pregunta marcas la casilla Hacer esta pregunta obligatoria entonces
el usuario será advertido de esta circunstancia si deja en blanco esta pregunta.
8. Tras editar cualquier pregunta haz clic en el botón Finalizado para cerrar su edición.
9. Para modificar el aspecto gráfico del formulario haz clic en el botón superior Tema:
tema elegido. Clic en el tema que desees para ver el aspecto final y luego pulsa en el
botón Aplicar.
12. Esta URL se puede enviar en un mensaje de correo electrónico a los usuarios para que
accedan al formulario y lo completen.
13. Cierra la ventana de edición del formulario.
2. En GDocs se asocia una hoja de cálculo a un formulario de tal forma que la hoja de
cálculo recoge los datos enviados por los usuarios que acceden al formulario. Por
este motivo al acceder al formulario entraremos en su hoja de cálculo. Puedes hacer
clic en su título Formulario sin título para definir el mismo título que el introducido
en el formulario: Gustos y colores.
3. Para volver a editar el formulario en su hoja de cálculo elige Formulario > Editar
formulario.
Nota:
NO se propone utilizar la opción Obtén el enlace para compartir porque esto se reserva
para enviar el enlace del documento a otros usuarios para que lo lean o bien puedan
editarlo directamente mientras el documento se encuentre en estado de borrador o
pendiente. Cuando se considere que el documento ya es definitivo y está listo para
publicar se busca el enlace en la opción Publicar en la web.
Enlace a su URL:
6. Ya hemos copiado el enlace directo al documento. Si nos situamos en el editor de
artículos de Blogger se puede insertar mediante un texto al que luego asociamos un
enlace.
8. En el editor de entradas de Blogger haz clic en la pestaña Edición HTML para luego
copiar y pegar este código HTML.
1. Desde el gestor de archivos de GDocs haz clic sobre el título de una presentación para
acceder al editor de la misma.
2. Una vez situado en el editor de la presentación, elige Compartir > Publicar/Insertar
4. En la sección Obtener un enlace a los datos publicados elige una de las siguientes
opciones:
Blogs ::: Google Docs 218
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Página web. Proporciona la URL de una página HTML que muestra el contenido de
la hoja de cálculo. Se podría utilizar para crear un enlace en una entrada de
nuestro blog.
Código HTML para incrustar en una página. Proporciona el código HTML que
insertar en el artículo de tu blog.
CSV, TXT, PDF, … Proporciona un enlace para la descarga de la hoja de cálculo
en uno de los formatos elegido. Este enlace se podría utilizar para crear un enlace
en un artículo del blog.
5. En este caso elige Código HTML para incrustar en una página. Selecciona el código
que ofrece debajo, clic derecho y elige Copiar.
6. Crea una nueva entrada en tu blog para pegar este código en el código HTML de la
misma. Clic en el botón Publicar entrada y accede al blog para ver su aspecto.
1. Desde el gestor de archivos de GDocs haz clic sobre el título de un formulario para
acceder a la hoja de cálculo asociada.
2. Desde el editor de la hoja de cálculo asociada al formulario elige Formulario > Editar
Formulario.
Blogs ::: Google Docs 219
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Se muestra el cuadro de diálogo Incrustar. Haz clic derecho sobre el código y elige
Copiar.
Por este motivo para integrar un documento de GDocs en un blog de Wordpress se utiliza el
enlace a su URL. Esto se puede aplicar a documentos de texto, presentaciones, hojas de
cálculo, formularios, etc. Se escribe un texto y en él se define un enlace de tal forma que
cuando el usuario hace clic en él es redirigido a esa dirección del documento alojado en
Google Docs.
Nota:
NO se propone utilizar la opción Obtén el enlace para compartir porque esto se reserva
para enviar el enlace del documento a otros usuarios para que lo lean o bien puedan
editarlo directamente mientras el documento se encuentre en estado de borrador o
pendiente. Cuando se considere que el documento ya es definitivo y está listo para
publicar se busca el enlace en la opción Publicar como página web.
12.1 Introducción
En la elaboración de artículos en nuestro blog podemos partir de activos (textos, imágenes,
audios y vídeos) propios o bien utilizar aquellos procedentes de otras personas o entidades.
Por otra parte cuando se publica un material en internet puede resultar interesante
establecer las condiciones de uso.
Sin embargo cuando esto no se indica o bien se muestra una licencia de copyright (derechos
reservados) conviene ser cauteloso. La apropiación indiscriminada de materiales ajenos para
elaborar un material propio no se puede justificar desde la ausencia de ánimo de lucro que
caracteriza las iniciativas donde participemos. Esta justificación no es suficiente y se hace
necesario en estos casos contactar con el autor o autores para obtener su permiso y en caso
favorable citar siempre la fuente de procedencia.
Sin Obra Derivada (No Derivate Works): El material puede ser distribuido, copiado y
exhibido pero no se puede utilizar para crear un trabajo derivado del original.
Compartir Igual (Share alike): El material puede ser modificado y distribuido pero
bajo la misma licencia que el material original.
9. Clic derecho sobre el cuadro que muestra el código HTML y elige Seleccionar todo. A
continuación vuelve a hacer clic derecho y selecciona Copiar.
10. Ahora vamos a crear en el blog un gadget en la barra lateral que muestre la licencia
elegida a los lectores.
11. Accede a la dirección de Blogger: http://www.blogger.com e introduce las
credenciales de tu cuenta Google. Clic en el botón ACCEDER.
12. En el Escritorio pulsa en el enlace Diseño correspondiente a tu blog.
14. Clic en el botón Añadir (+) para incorporar a la barra lateral un gadget del tipo
HTML/Javascript.
17. Si deseas modificar de posición arriba/abajo del gadget basta con pulsar y arrastrar
uno respecto al otro sobre la edición de la barra lateral.
19. Para ver el resultado final haz clic en el enlace Ver blog. En la barra lateral se
mostrará un gadget con el icono del tipo de licencia elegido.
20. Cuando el lector hace clic en el icono o en el enlace textual se mostrará la página de
Creative Commons con las condiciones de la licencia elegida.
Blogs ::: Derechos de autor 228
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
9. Clic derecho sobre el cuadro que muestra el código HTML y elige Seleccionar todo. A
continuación vuelve a hacer clic derecho y selecciona Copiar.
10. Ahora vamos a crear en el blog un widget en la barra lateral que muestre la licencia
elegida a los lectores.
11. Desde el interfaz de administración del blog elige la opción Apariencia > Widgets
Blogs ::: Derechos de autor 230
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
14. Clic en el botón Guardar. Para cerrar la edición de este widget pulsa en el enlace
Cerrar. Para eliminar este widget haz clic en el enlace Borrar.
Blogs ::: Derechos de autor 231
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
15. Si deseas modificar de posición arriba/abajo del gadget basta con pulsar y arrastrar
uno respecto al otro sobre la edición de la barra lateral.
16. Para editar de nuevo el contenido de este cuadro haz clic en el botón Abrir que se
muestra en la esquina superior derecha del widget.
17. Para ver el resultado final haz clic en el enlace disponible en el título del blog. En la
barra lateral se mostrará un gadget con el icono del tipo de licencia elegido.
18. Cuando el lector hace clic en el icono o en el enlace textual se mostrará la página de
Creative Commons con las condiciones de la licencia elegida.
Blogs ::: Derechos de autor 232
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Módulo 2. Imagen
Imagen ::: Conceptos básicos de imagen digital 234
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
1. Conceptos básicos
de imagen digital
Imagen ::: Conceptos básicos de imagen digital 235
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
1.1 El píxel
El píxel es la unidad mínima de visualización de una imagen digital. Si aplicamos el zoom
sobre ella observaremos que está formada por una parrilla de puntos o píxeles. Las cámaras
digitales y los escáneres capturan las imágenes en forma de cuadrícula de píxeles.
En una impresora se habla del número de puntos por pulgada que puede imprimir: 600, 1200,
etc.
Algunos escáneres suelen producir imágenes con una resolución por defecto de 200 ppp.
Las cámaras digitales prestan una calidad que se expresa en MegaPíxels. Así por ejemplo una
cámara de 8 MP es aquella capaz de tomar una fotografía con 8 millones de píxeles.
01=color X, 10=color Y, 11=color blanco), 3-bits = 8 colores, ..., 8-bits = 256 colores, ..., 24-
bits = 16.7 millones de colores.
Modo Escala de Grises. Maneja el canal negro y permite 256 tonos de gris entre el
blanco y negro puros.
Modo Color indexado. Utiliza un canal de color indexado de 8 bits pudiendo obtener
con ello hasta un máximo de 256 colores (28)
Modo RGB. Cada color se forma por combinación de tres canales. Cada canal se
corresponde con un color primario: Red (rojo), Green (verde), y Blue (azul). Asigna un
valor de intensidad a cada color que oscila entre 0 y 255. De la combinación surgen
Imagen ::: Conceptos básicos de imagen digital 237
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
hasta 16,7 millones de colores. Ejemplo: El valor R:255, G:0, B:0 representa al color
rojo puro.
Modo HSB. Cada color surge de los valores de estos tres parámetros: Hue (Tono) que
es el valor del color: rojo, azul, verde, etc. En GIMP se expresa en grados y oscila
entre 0 y 360. Saturation (Saturación) que se refiere a la pureza del color y va del 0%
al 100%. Brightness (Brillo) referencia la intensidad de luz del color, es decir, la
cantidad de negro o blanco que contiene estando su valor entre 0 (negro) y 100
(blanco). Ejemplo: El color rojo puro tiene un código RGB como (255,0,0) y también
un código HSB (0,100,100). En la mayoría de programas de tratamiento de imágenes
se puede elegir un color introduciendo su código RGB –es la opción más frecuente- o
alternativamente su código HSB. En ambos casos la imagen maneja una paleta de
colores de 24 bits.
Modo CMYK. Cada color se forma por combinación de cuatro canales. Cada canal se
corresponde con un color primario de impresión: Cyan (Ciano), Magent (Magenta),
Yellow (Amarillo) y BlacK (Negro). Cada canal puede tener como valor entre 0 y 255.
Se trata de imágenes con una profundidad de color de 32 bits.
Imagen ::: Conceptos básicos de imagen digital 238
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Nota:
Para visualizar la extensión de los archivos desde el explorador de Windows sigue los
siguientes pasos:
1. Desde el escritorio elige Inicio > Mi PC
2. En la barra de menús selecciona Herramientas > Opciones de carpeta
3. Pulsa en la pestaña Ver.
4. En la lista Configuración avanzada localiza en la parte más inferior de la lista el
elemento: “Ocultar las extensiones de archivo para tipos de archivo
conocidos”.
5. Asegúrate de que la casilla del item mencionado NO está activada.
6. Pulsa en Aceptar para guardar los cambios.
En la siguiente tabla se recogen las características diferenciales más significativas de los tres
formatos de imagen recomendados para publicar una imagen en la web.
1. Al crear una página web interesa que los archivos que contienen las imágenes sean lo
menos pesados posibles para agilizar su descarga y visualización por Internet.
2. El tamaño de un archivo gráfico viene determinado por las dimensiones de la imagen,
su resolución, el número de colores y el formato (JPG, GIF, PNG).
3. Crea y guarda imágenes en resolución no superior a 72 ppp. Es la resolución que se
suele usar en las pantallas de ordenador. No merece la pena optar por valores
mayores ya que aumenta considerablemente el peso del archivo a descargar y el
usuario no lo aprecia. Si la imagen se diseña para imprimir entonces debemos optar
por una resolución entre 200-300 ppp.
4. En ocasiones puede interesar reducir el número de colores de la paleta porque ello
supone reducir el tamaño del archivo.
5. Conviene utilizar un programa de edición gráfica para definir las dimensiones
concretas de la imagen antes de insertarla en la página web.
Imagen ::: Conceptos básicos de imagen digital 240
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Para reducir el peso de un archivo gráfico se pueden modificar algunos de sus parámetros
utilizando un editor de imágenes como por ejemplo GIMP:
Para instalar GIMP sobre Windows puedes descargar y ejecutar el archivo instalador gimp-
2.6.8-i686-setup.exe.
En el sitio web oficial del proyecto GIMP podrás encontrar la versión más reciente o que se
adapta a tu sistema: http://www.gimp.org/
Ubuntu
1. Doble clic sobre el icono de GIMP que se ha creado en el escritorio una vez finalizado
el proceso de instalación. En la versión portable se iniciaría el programa haciendo
doble clic en el icono del programa ejecutable que aparece en la carpeta donde se ha
instalado.
Ubuntu
1. Para iniciar este programa desde el escritorio de Ubuntu selecciona Aplicaciones >
Gráficos > Editor de imágenes GIMP.
4. Al abrir una imagen con GIMP se muestran las siguientes ventanas independientes:
Imagen ::: Empezar con GIMP 244
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Esta configuración inicial de GIMP puede simplificarse cerrando la ventana Capas, Canales,
Rutas y Deshacer. Para recuperar la visualización de una ventana no principal selecciona
Ventanas > Diálogos empotrables > …
Para restaurar estos paneles a la disposición inicial selecciona Editar > Preferencias >
Gestión de la ventana y pulsar en el botón Restaurar las posiciones de ventana guardadas a
los valores predeterminados. Clic en Aceptar y luego en Reiniciar. Si se cierra GIMP y se
vuelve a abrir se mostrarán los paneles por defecto.
2. Se muestra el cuadro de diálogo Crear una imagen nueva. GIMP te propone unas
dimensiones de la nueva imagen pero se pueden modificar estos valores o bien elegir
unas dimensiones predefinidas en la lista desplegable Plantilla. A continuación pulsa
en Aceptar.
3. Para situar el archivo de imagen en otra carpeta distinta de las que aparecen en
listado Guardar en la carpeta pulsa sobre el botón “+” situado al lado de la etiqueta
Buscar otras carpetas. Se expanden las opciones de este cuadro de diálogo
facilitando la elección de otra carpeta donde guardarlo. Incluso pulsando en Crear
carpeta se puede crear una nueva dentro de la carpeta actual.
4. Una vez elegida la carpeta destino, clic en el botón “-“ situado al lado de la etiqueta
Buscar otras carpetas para contraer este panel. Observa que en la casilla Guardar en
una carpeta permanece el nombre de la carpeta destino elegida.
Imagen ::: Empezar con GIMP 248
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
5. Pulsa sobre el botón “+” situado al lado de la etiqueta Seleccione el tipo de archivo
(Por extensión). El formato de archivo GIMP XCF image (xcf) es un formato
específico de GIMP. Como veremos más adelante también es posible guardar la
imagen en formatos GIF, PNG o JPG.
6. Clic en el botón “-“ Seleccione el tipo de archivo para contraer el panel de elección
de formato. Observa que ahora el formato elegido aparece a continuación de esta
etiqueta.
7. Para terminar pulsa en el botón Guardar.
Imagen ::: Optimización de imágenes 249
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
3. Optimización de
imágenes
Imagen ::: Optimización de imágenes 250
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
1. Extrae a una carpeta de tu disco duro el archivo paint.bmp contenido en el ZIP que se
adjunta a continuación. Se trata de una imagen cuyos datos son: 300x225 píxeles de
tamaño, profundidad de color 24 bits (16,7 millones de colores), resolución 72 ppp,
formato BMP y tamaño del archivo 198 Kb.
2. Haz doble clic sobre el acceso directo de GIMP situado en el escritorio:
3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir
imagen. Navega para situarte en la carpeta destino. En la lista de archivos situada en
el centro desplázate con la barra de desplazamiento vertical hasta localizar el archivo
paint.bmp. Clic sobre este archivo. Observa que en el recuadro Vista previa se
muestra la imagen y sus propiedades.
2. Clic en el botón “+” situado junto a la etiqueta Seleccione el tipo de archivo (Por
extensión).
3. En la lista de tipos de archivos elige Imagen GIF-gif. Observa que al seleccionar este
tipo, el nombre del archivo adquiere la extensión .gif. Pulsa en el botón Guardar.
6. Clic en el botón Guardar. Observa que la ventana de imagen ahora está abierto el
archivo paint.gif.
Imagen ::: Optimización de imágenes 253
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
3. Clic en el botón “+” situado junto a la etiqueta Seleccione el tipo de archivo (Por
extensión).
4. En la lista de tipos de archivos elige Imagen JPEG-jpg,jpeg,jpe. Observa que al
seleccionar este tipo, el nombre del archivo adquiere la extensión .jpg. Pulsa en el
botón Guardar.
Imagen ::: Optimización de imágenes 254
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
3. Clic en el botón “+” situado junto a la etiqueta Seleccione el tipo de archivo (Por
extensión).
4. En la lista de tipos de archivos elige Imagen PNG - png. Al seleccionar este tipo, el
nombre del archivo adquiere la extensión .png. Pulsa en el botón Guardar.
Imagen ::: Optimización de imágenes 255
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
5. En el cuadro de diálogo Guardar como PNG puedes definir algunos de los siguientes
parámetros:
Entrelazado (Adam7). Incluye una copia tosca de la imagen al comienzo de la
cadena de datos de tal forma que cuando el usuario la descarga desde
Internet accede rápidamente a su contenido y conforme se va descargando va
ganando calidad.
Nivel de compresión: arrastra el deslizador al extremo derecho para definir
una compresión de valor 9.
Imagen ::: Optimización de imágenes 256
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
Para averiguar el peso de un archivo desde el explorador de archivos, selecciona Ver >
Detalles. Otra posibilidad es hacer clic derecho sobre el archivo y elegir la opción
Propiedades.
Imagen ::: Optimización de imágenes 257
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
1. Desde GIMP elige Archivo > Abrir para abrir el archivo paint.jpg situado en la carpeta
donde se encuentra a partir de la práctica descrita en el apartado anterior.
7. Selecciona Archivo > Guardar como para guardar la nueva imagen en formato GIF
con otro nombre. Por ejemplo: paint_256.gif.
8. Cierra la ventana que contiene esta imagen.
9. Repite la secuencia de pasos anteriores para crear archivos con esta imagen con una
paleta de 128, 64, 32 y 16 colores.
64 colores 32 colores
Imagen ::: Dimensiones de una imagen 259
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Dimensiones
de una imagen
Imagen ::: Dimensiones de una imagen 260
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Se puede insertar una imagen en una página HTML y luego reducir su tamaño de visualización.
Sin embargo esta operación no reduce el peso final resultante del archivo gráfico. Es
aconsejable reducir las dimensiones de la imagen previamente con GIMP u otro editor de
imágenes, crear un nuevo archivo gráfico más ligero y luego integrarlo en la página.
1. Extrae a una carpeta de tu disco duro el archivo tranvia.jpg contenido en el ZIP que
se adjunta a continuación: tranvia.zip. Sus características técnicas son: 800x600
píxeles de tamaño, profundidad de color 24 bits (16,7 millones de colores), resolución
72 ppp, formato JPG y tamaño del archivo 516 Kb.
2. Haz doble clic sobre el acceso directo de GIMP situado en el escritorio:
3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir
imagen. Navega para situarte en la carpeta que contiene ese archivo. En la lista de
archivos situada en el centro desplázate con la barra de desplazamiento vertical
hasta localizar el archivo tranvia.jpg .Clic sobre este archivo. Observa que en el
recuadro Vista previa se muestra la imagen y sus propiedades.
Imagen ::: Dimensiones de una imagen 261
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
17. Cierra esta imagen y repite los pasos 3-16 crear otras dos imágenes que sean
respectivamente el 30% y 10% de la imagen original partiendo siempre del archivo
inicial: tranvia.jpg
18. Abre la carpeta destino y encontrarás en ella los archivos JPG: tranvia.jpg,
tranvia50.jpg, tranvia30.jpg y tranvia10.jpg que has creado. Si el tamaño de la
imagen es menor, el archivo que la contiene tendrá menor peso. Como puedes
comprobar en el ejemplo no es necesario utilizar imágenes de gran tamaño en las
páginas web. Eso no sólo redundará en una mayor calidad estética sino que hará más
rápida la navegación facilitando la descarga de archivos gráficos más ligeros.
100% 50 % 30 % 10 %
800x600 píx. 400x300 píx. 240x180 píx. 80x60 píx.
3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir
imagen. Navega para situarte en la carpeta que contiene ese archivo. En la lista de
archivos situada en el centro desplázate con la barra de desplazamiento vertical
hasta localizar el archivo cisne.jpg .Clic sobre este archivo. Observa que en el
recuadro Vista previa se muestra la imagen y sus propiedades.
4. Pulsa sobre el botón Abrir. En esta práctica vamos a ejemplificar cómo redimensionar
el tamaño del lienzo de una imagen para añadirle un texto en su base.
5. En la ventana de imagen elige Imagen > Tamaño del lienzo …
7. En la casilla Altura introduce el valor 330 para aumentarla y pulsa la tecla enter.
Observa que en la vista previa de la imagen aparece un espacio en blanco por debajo
de la imagen que se corresponde con el lienzo aumentado. Si pulsas el botón Centrar
la imagen se centraría horizontal y verticalmente sobre el lienzo. Otra posibilidad es
introducir manualmente en las casillas X e Y la posición en píxeles en que se situará
la esquina superior izquierda de la imagen en relación con el nuevo lienzo. En el caso
que nos ocupa no utilizaremos esta opción ni el botón de centrado porque GIMP crea
automáticamente el espacio que necesitamos en la base de la imagen para añadir
luego el texto.
8. Para terminar pulsa en el botón Redimensionar.
9. Desde la barra de menús de la ventana de imagen elige Imagen > Aplanar imagen.
Con esta operación se fusionan las capas y la banda inferior toma el color blanco de
fondo.
10. Para acceder al cuadro de herramientas de GIMP utiliza la barra de tareas situada en
la parte inferior del escritorio de Windows. Basta hacer clic sobre el botón de la barra
de tareas con el título Gimp. En el cuadro de herramientas de GIMP selecciona la
herramienta Texto y a continuación haz clic sobre la banda blanca inferior.
Imagen ::: Dimensiones de una imagen 266
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
15. Para guardar la imagen elige Archivo > Guardar como … En el cuadro de diálogo
Guardar imagen define un nombre distinto para la nueva imagen. De esta forma no se
sobrescribirá la original. Pulsa en el botón Guardar.
Imagen ::: Dimensiones de una imagen 267
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Se muestra el cuadro de título Exportar archivo donde se informa de que el formato
JPG no conserva las capas por lo que aplanará la imagen para guardarla a
continuación. Pulsa en el botón Exportar.
17. En la ventana siguiente: Guardar como JPEG define una calidad del 100% y pulsa en
el botón Guardar.
Imagen ::: Dimensiones de una imagen 268
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Sobre la ventana de imagen, pulsa y arrastra sobre la fotografía para definir un área
rectangular alargada que contenga el monumento central.
7. Para guardar la imagen elige Archivo > Guardar como … En el cuadro de diálogo
Guardar imagen define un nombre distinto para la nueva imagen. Ejemplo:
banner.jpg De esta forma no se sobrescribirá la original. Pulsa en el botón Guardar.
8. Se muestra el cuadro de título Exportar archivo. Pulsa en el botón Exportar.
9. En la ventana siguiente: Guardar como JPEG define una calidad del 100% y pulsa en
el botón Aceptar.
Imagen ::: Montaje de imágenes 270
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Montaje de imágenes
Imagen ::: Montaje de imágenes 271
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Las herramientas para seleccionar, copiar y pegar facilitan el montaje de imágenes. En esta
práctica se ejemplifican las posibilidades de las distintas herramientas de selección. Estas se
aplican para eliminar ciertas partes de una imagen combinando seleccionar y cortar.
3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir
imagen. Localiza el archivo paisaje.jpg. Clic sobre este archivo y pulsa en el botón
Abrir. Repite este paso para abrir el archivo vaca.gif. Observa que cada imagen se
sitúa en una ventana propia.
5. Sobre la imagen de la vaca, pulsa y arrastra para definir un área rectangular que
abarque las flores. En la ventana de imagen selecciona Editar > Cortar o bien Editar
> Limpiar.
Imagen ::: Montaje de imágenes 272
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Sobre la imagen de la vaca, pulsa y arrastra para definir un área circular que abarque
a la mosca situada en la esquina superior izquierda. En la ventana de imagen
selecciona Editar > Cortar o bien Editar > Limpiar.
9. En la ventana principal de GIMP elige Archivo > Diálogos > Opciones de herramienta.
En este panel de opciones de la varita mágica arrastra el deslizador Umbral hasta el
valor 50. Esto aumentará el umbral de colores que se seleccionará cuando se utilice
esta varita.
Imagen ::: Montaje de imágenes 273
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Con la varita seleccionada, haz clic sobre un punto del área azul de cielo en la imagen
de la vaca. A continuación selecciona Editar > Limpiar. No olvides realizar esta
operación también sobre la zona azul que aparece debajo del personaje.
12. En la imagen de la vaca haz clic sobre el color verde y elige Editar > Limpiar. Idem
sobre el resto de color azul.
13. En la ventana de imagen de la vaca elige Selecciona > Todos. Observa que se ha
seleccionado la imagen completa.
14. Elige Editar > Copiar. Con esta acción se copia la vaca al portapapeles de Windows.
Imagen ::: Montaje de imágenes 274
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
17. Para guardar la imagen elige Archivo > Guardar como … En el cuadro de diálogo
Guardar imagen define un nombre distinto para la nueva imagen. Ejemplo:
montaje.jpg De esta forma no se sobrescribirá la original. Pulsa en el botón Guardar.
18. Se muestra el cuadro de título Exportar archivo. Pulsa en el botón Exportar.
19. En la ventana siguiente: Guardar como JPEG define una calidad del 100% y pulsa en
el botón Aceptar.
Imagen ::: Efectos especiales 275
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
6. Efectos especiales
Imagen ::: Efectos especiales 276
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
6.1 Filtros
El término “Filtro” proviene de la fotografía tradicional y aludía a una serie de cristales que
se situaban delante del objetivo de la cámara para conseguir efectos especiales. Los filtros
que proporciona GIMP permiten aplicar a una imagen original un sinfín de efectos de retoque
y modificaciones. En esta práctica se explica cómo aplicar un filtro y algunos ejemplos.
6. Una vez realizados los convenientes ajustes en los distintos parámetros del efecto
pulsa en el botón Aceptar para aplicar los cambios. Para deshacer la aplicación de un
filtro selecciona Editar > Deshacer … o bien la combinación de teclas: <Ctrl>+<Z>.
En ocasiones será necesario pulsar reiteradamente esta combinación para restaurar la
imagen original.
7. Siguiente los pasos 4-6 explora las distintas posibilidades de efectos que puedes
conseguir con GIMP. En las imágenes siguientes se recogen algunos ejemplos:
Distorsiones > Página doblada Artísticos > Aplicar lienzo Decorativos > Diapositiva
Decorativos > Esquinas Decorativos > Foto antigua Luces y sombras > Sombra
redondeadas base
8. Para guardar la nueva imagen creada, en la barra de menú de esa imagen selecciona
Archivo > Guardar como …
Imagen ::: Efectos especiales 278
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
10. Se muestra el panel Guardar como JPEG. Ajusta la calidad en un valor 80-100 % y
confirma pulsando en el botón Aceptar.
6. En el panel de Opciones de herramienta elige como tipo de fuente Arial Black o bien
Arial Heavy y como tamaño 72 puntos.
11. Sitúa el puntero del ratón sobre el cuadro de texto y cuando el puntero adquiera la
apariencia de una cabeza de flecha negra, arrastra y coloca para centrar el texto.
12. Para aplicar un efecto especial al texto selecciona por ejemplo: Filtros > Alfa a
logotipo > Bovinación.
Imagen ::: Efectos especiales 281
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor
13. En el cuadro de diálogo de Opciones admite los parámetros por defecto y pulsa en el
botón Aceptar.
14. Al cabo de unos instantes se ha creado un atractivo rótulo.
15. Para deshacer la aplicación de este efecto, en la ventana de la imagen elige Editar >
Deshacer.
16. Repite los pasos 12-15 para probar otros efectos especiales sobre el texto. A
continuación se proponen algunos.
7.Tratamiento de
imágenes por lotes
Imagen ::: Tratamiento de imágenes por lotes 284
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7.1 Introducción
A menudo es necesario optimizar una colección de fotografías extraídas de la cámara digital
con intención de ajustar sus dimensiones, resolución, formato, etc. para publicarlas en la web
o compartirlas en la red local del centro.
Esto se puede realizar con GIMP, imagen a imagen, aplicando los procedimientos descritos con
anterioridad. Sin embargo cuando se trata de un número elevado de fotos es necesario
realizar un procesamiento por lotes que realice la conversión de forma automática y rápida.
GIMP dispone de un lenguaje de scripts donde es posible automatizar estas tareas. Sin
embargo el diseño y manejo de scripts no resulta intuitivo ni fácil.
En su lugar se propone utilizar el plugin DBP (David's Batch Processor) para GIMP. Este
complemento permite ejecutar de forma automática operaciones en una lista de archivos de
imagen, como por ejemplo, el redimensionamiento. DBP proporciona un entorno gráfico para
crear una lista de imágenes con intención de definir y aplicar operaciones como la corrección
del color, redimensionamiento, recorte, suavizado, cambio de nombre o guardar en otros
formatos. DBP sólo procesa imágenes en modo color RGB mostrando un error cuando se trata
de procesar imágenes en modo color indexado. Por otra parte DBP nunca sobreescribe la
imagen original por lo que es necesario definir la tarea de renombrar o mover a otra carpeta
cada archivo resultante.
Nota:
En la versión portable de GIMP que se proporciona en este curso no es necesario
incluir este plugin porque ya se ha incorporado. No obstante si se desea instalar en
una versión portable más actual el procedimiento es similar al descrito en este
apartado: se localiza la carpeta de plugins que utiliza el programa, se copia a ella el
archivo dpb.exe y se reinicia el programa.
2. Para compilar este código fuente es necesario disponer del compilador GNU de C++.
Desde el escritorio selecciona Sistema > Administración > Gestor de paquetes
Synaptic. Pulsa en el botón Buscar, introduce el término g++ y pulsa en Buscar. Si no
está activada, marca la casilla izquierda correspondiente al paquete g++ y pulsa en el
botón Aplicar. Al cabo de unos segundos ya dispondremos del compilador instalado.
Cierra el gestor de paquetes Synaptic.
6. En la pestaña Input de David's Batch Processor se habrán añadido las imágenes. Para
eliminar alguna entrada basta con seleccionarla y pulsar en el botón Remove files
(Eliminar archivos). Para eliminar la lista completa pulsa en el botón Clear List
(Borrar lista).
8. Clic en la pestaña Rename (Renombrar) para definir el nombre que tendrán los
nuevos archivos con las imágenes.
Imagen ::: Tratamiento de imágenes por lotes 289
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
15. Si deseas ver el aspecto que tendrá la conversión definida sobre una imagen pulsa en
el botón Test (Probar).
16. Para efectuar el procesamiento pulsa en el botón Start (Comenzar).
17. Transcurridos unos segundos observaremos que la carpeta destino se han creado
nuevas imágenes con las propiedades definidas.
Imagen ::: Flickr: galería de fotos 291
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8. Flickr:
galería de fotos
Imagen ::: Flickr: galería de fotos 292
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8.1 Introducción
Flickr (http://www.flickr.com) es un servicio Web 2.0 donde 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.
Para utilizar 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.
6. En el cuadro de diálogo Seleccione los archivos … despliega la lista Buscar en: para
situarte en la carpeta galería anteriormente descargada y descomprimida. Clic en la
primera imagen, mantén pulsada la tecla Mayus y sin soltar haz clic en la última
imagen. De esta forma seleccionarás todas las imágenes. Clic en el botón Abrir.
Imagen ::: Flickr: galería de fotos 294
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8. Puedes decidir si las fotos serán Públicas (opción recomendada y por defecto) o bien
Privadas.
Imagen ::: Flickr: galería de fotos 295
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
11. 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 página es posible
modificarlos. Para terminar no olvides pulsar en el botón Guardar situado en la parte
más inferior de la página.
12. Las fotos estarán disponibles en la opción de menú: Tu > Tu galería.
Nota:
Otra opción para subir fotos es utilizar el Uploader básico cuyo enlace de acceso se
ofrece desde la página Cargar fotos y vídeos
Imagen ::: Flickr: galería de fotos 296
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
7. Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente
texto descriptivo:
Conocido como "El guardián del vértigo", el faro de Cudillero se asienta en la Punta
Roballera sobre un acantilado a más de 75 m. sobre el nivel del mar. Situado al este
del puerto pesquero se accede a él gracias a un camino peatonal. Con más de un siglo
de existencia ha experimentado distintas reformas algunas de las cuales fueron en su
momento reivindicadas por los lugareños en el cancionero popular: ""El faro de
Cudillero lo van a poner más alto, pa que alumbre a los marinos y no se pierdan los
barcos".
Nota:
El procedimiento descrito se puede utilizar para mostrar en un artículo del blog
cualquier imagen que encontremos en Internet. Basta con hacer clic derecho sobre
ella en el navegador web para elegir la opción Copiar la ruta de la imagen. De esta
forma dispondremos de su URL absoluta para luego añadirla en nuestro artículo del
blog siguiendo los pasos explicados.
Imagen ::: Flickr: galería de fotos 299
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
5. En el cuadro de diálogo haz clic en la pestaña Desde una URL. Clic derecho sobre el
cuadro URL de la imagen y selecciona Pegar.
8. Pulsa la tecla Enter para situarte debajo de la imagen y copia y pega el siguiente
texto descriptivo:
Conocido como "El guardián del vértigo", el faro de Cudillero se asienta en la Punta
Roballera sobre un acantilado a más de 75 m. sobre el nivel del mar. Situado al este
del puerto pesquero se accede a él gracias a un camino peatonal. Con más de un siglo
de existencia ha experimentado distintas reformas algunas de las cuales fueron en su
momento reivindicadas por los lugareños en el cancionero popular: ""El faro de
Cudillero lo van a poner más alto, pa que alumbre a los marinos y no se pierdan los
barcos".
Nota:
El procedimiento descrito se puede utilizar para mostrar en un artículo del blog
cualquier imagen que encontremos en Internet. Basta con hacer clic derecho sobre
ella en el navegador web para elegir la opción Copiar la ruta de la imagen. De esta
forma dispondremos de su URL absoluta para luego añadirla en nuestro artículo del
blog siguiendo los pasos explicados.
3. A continuación haz clic sobre el album creado anteriormente. Una vez dentro del
álbum observa que existe un enlace con el texto 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.
5. Existen dos formas de integrar una presentación de fotos de Flickr en una página de
tu blog:
Opcion A Marco interno: Utilizando una etiqueta iframe (marco interno) que
apunte a la dirección URL de esa presentación.
Opción B Visor de Flash. Utilizando el objeto de Flash con el visor que ofrece
el propio servidor Flickr.
10. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
11. Si has optado por la opción A Marco interno en el cuadro de diálogo Insertar HTML
debes crear un marco interno (IFRAME) que apunte a esta URL absoluta que hemos
pegado. Para ello escribe:
donde <url> es la dirección entre comillas que hemos copiado. Los atributos width y
height definen el tamaño del marco interno.
Si has optado por la opción B Visor de Flash y ya has pegado el código <object …> no
será necesario hacer nada más.
13. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.
Imagen ::: Flickr: galería de fotos 303
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
3. A continuación haz clic sobre el album creado anteriormente. Una vez dentro del
álbum observa que existe un enlace con el texto 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.
9. Haz clic derecho sobre el cuadro de texto URL del enlace y elige Pegar. Introduce
como Título, por ejemplo, Mis viajes por Asturias.
9. Picasa Web,
álbums de fotos
Imagen ::: Picasa Web, álbums de fotos 306
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Subir fotos en línea. Puedes hacerlo desde tu equipo utilizando el programa instalado
Picasa o bien desde el navegador web o incluso enviándolas por correo electrónico.
Organizar. Clasifica las fotos en álbumes. A cada imagen se le pueden asignar
etiquetas para facilitar su búsqueda.
Compartir. Es posible compartir tus fotos con todo el mundo, sólo 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 integración con Google Maps y Google Earth facilitan añadir a tus fotos
información de su ubicación geográfica y verlas en el mapa.
Sincronización. Picasa y Albumes web de Picasa pueden trabajar de forma
sincronizada para garantizar que los cambios realizados en tu equipo se reflejan
también 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 aplicación web que nos permite almacenarlas en un servidor remoto para
compartirlas con los demás. La exploración de todas las posibilidades de ambas aplicaciones
excede el propósito de este curso. Por ello se propone incidir especialmente en la integración
de estas imágenes en línea en los artículos 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:
Al entrar por primera vez a Picasa Web y haber realizado los ejercicios del módulo de Blogs
con Blogger verás que ya dispones de algunas fotos subidas en tu cuenta. Esto es debido a que
cuando subes imágenes en los artículos de tu blog en Blogger, éstas se guardan
automáticamente 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 fotografía
desde aquí puede ocurrir que ésta no se vea luego en el correspondiente artículo de tu blog.
Imagen ::: Picasa Web, álbums de fotos 307
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8. Observa que en la columna derecha se muestran los límites de subida: 500 fotos por
álbum y un espacio máximo total de 1 GB (1024 MB) para todos los álbumes subidos.
11. Dentro del álbum se pueden editar algunos de sus parámetros en el menú Editar:
Imagen ::: Picasa Web, álbums de fotos 309
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
12. Clic en el botón Presentación de diapositivas para ver una proyección que muestra la
secuencia de fotos contenidas en el álbum.
13. Los álbumes guardados se encuentran haciendo clic en la pestaña Mis fotos.
Imagen ::: Picasa Web, álbums de fotos 310
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
6. En la sección Carpetas se mostrará una nueva carpeta con el nombre fauna y al hacer
clic sobre ella, en el panel derecho se mostrarán las imágenes que contiene.
7. En la columna de Carpetas haz clic derecho sobre el nombre de esta carpeta y elige
la opción Seleccionar todas las imágenes.
Imagen ::: Picasa Web, álbums de fotos 312
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
9. En el cuadro del diálogo Propiedades del álbum introduce como Nombre el siguiente:
Fauna africana y haz clic en el botón Aceptar.
10. Tras esta acción se habrá creado una entrada en la columna de álbumes disponibles.
Imagen ::: Picasa Web, álbums de fotos 313
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
11. Para subir este álbum haz clic derecho sobre él y elige la opción Subir a los Álbumes
web …
12. Introduce las credenciales de acceso a tu cuenta en Picasa Web y pulsa en el botón
Acceder.
Imagen ::: Picasa Web, álbums de fotos 314
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
13. Se crea el nuevo álbum en Picasa Web y se ofrecen, entre otros, los siguientes
parámetros de configuración:
a. Tamaño para subir. En este caso vamos a elegir Pequeño: 640 píxeles (blogs
y páginas web) porque será el destino final de publicación de algunas de
estas imágenes.
b. Visibilidad para este álbum. En este caso elegiremos Público.
Imagen ::: Picasa Web, álbums de fotos 315
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
14. Clic en el botón Subir. Se inicia un proceso de subida progresiva de las distintas
imágenes que se muestra en el Administrador de subidas.
15. Al finalizar el proceso con éxito se mostrará un mensaje de proceso finalizado. Clic en
el botón Ver online y cierra la ventana del Administrador de subidas.
Imagen ::: Picasa Web, álbums de fotos 316
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
16. Se abrirá el navegador web configurado por defecto en el equipo mostrando esta
galería subida a Picasa Web.
17. 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.
3. Selecciona una imagen del álbum haciendo clic sobre ella para visualizarla en
solitario. Por ejemplo, sobre la foto del buitre.
4. Se puede obtener la URL absoluta de la fotografía mediante clic derecho sobre la
fotografía y seleccionando la opción Copiar la ruta de la imagen. Esta acción copiará
al portapapeles la URL absoluta a la imagen almacenada en tu cuenta de Flickr. El
principal inconveniente es que quizás esta imagen sea muy grande para incrustar en
un artículo de tu blog.
6. Clic sobre el cuadro de texto Incrustar imagen para seleccionar todo el código HTML
que se ofrece. A continuación haz clic derecho y elige Copiar.
7. Abre el Bloc de Notas y elige Edición > Pegar. Esta acción pegará el código completo
en un documento para su posterior manipulación. Aunque se podría pegar completo
en el código HTML de un artículo, en este caso nos vamos a quedar únicamente con la
URL absoluta a la imagen en el tamaño seleccionado.
Imagen ::: Picasa Web, álbums de fotos 318
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
12. En el cuadro de diálogo Blogger: Subir imágenes, en el apartado Añadir una imagen
de la web, haz clic derecho sobre el cuadro de texto URL y selecciona Pegar.
13. Esta tarea pegará la URL absoluta de la imagen. Elige un diseño de alineación
(Ninguno) y un tamaño de imagen (Grande) y haz clic en el botón SUBIR IMAGEN.
14. Al cabo de unos segundos se mostrará en la Vista preliminar y un mensaje de que se
ha añadido su imagen. Clic en el botón FINALIZADO.
15. 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 Antártida y Oceanía.
Son de gran tamaño y están adaptados para volar a gran altura.
Imagen ::: Picasa Web, álbums de fotos 319
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
4. En el cuadro de diálogo Añadir una imagen, haz clic en la pestaña Desde una URL.
Haz clic derecho sobre el cuadro de texto URL de la imagen y selecciona Pegar.
6. 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 Antártida y Oceanía.
Son de gran tamaño y están adaptados para volar a gran altura.
3. Una vez dentro del álbum haz clic en Enlazar a este álbum. Se mostrará los enlaces
para enviar por correo electrónico o para embeber en tu blog una imagen con un
enlace al álbum en Picasa Web.
6. Elige como tamaño de la presentación Grande 400 px. y marca las opciones Mostrar
títulos y Reproducir automáticamente.
7. Selecciona el código HTML mediante clic derecho y elegir Seleccionar todo. De nuevo
haz clic derecho para elegir Copiar.
8. Accede a Blogger (http://www.blogger.com) e introduce tus credenciales de la
cuenta Google. Desde el Escritorio haz clic en el botón Nueva entrada.
9. Añade como título: Fauna africana
10. En el editor haz clic en el enlace Edición de HTML para mostrar el código HTML del
artículo.
11. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
13. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.
Imagen ::: Picasa Web, álbums de fotos 322
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
3. Una vez dentro del álbum haz clic en Enlazar a este álbum. Se mostrará los enlaces
para enviar por correo electrónico o para embeber en tu blog una imagen con un
enlace al álbum en Picasa Web.
Imagen ::: Picasa Web, álbums de fotos 323
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
8. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
10. Pulsa en el enlace Ver entrada para comprobar cómo se visualiza la presentación.
Imagen ::: Slide.com : presentaciones de fotos 325
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
10. Slide.com:
presentaciones
de fotos
Imagen ::: Slide.com : presentaciones de fotos 326
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
5. En la pestaña Mis archivos haz clic en el botón Busca para subir las imágenes desde el
equipo.
1. En la página Compartir Slide Show que aparece una vez has creado la presentación
de fotos en Slide.com se muestra el código de integración HTML de la presentación
para los distintos formatos de blog.
2. Clic en la pestaña Blogger.
3. Haz clic en el contenido del cuadro Copia este código. Observa que se selecciona el
código completo. 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
7. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
2. Haz clic en el contenido del cuadro Copia este código. Observa que se selecciona el
código completo. 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
3. Abre el Bloc de Notas y sobre él elige Edición > Pegar.
Imagen ::: Slide.com : presentaciones de fotos 332
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
[slideshow id=&w=426&h=320]
[slideshow id=144115188096768696&w=426&h=320]
7. Selecciona esta etiqueta [slideshow …] y en el bloc de notas elige Edición > Copiar.
8. En el interfaz de gestión de Wordpress elige Entradas > Añadir para crear un nuevo
artículo.
9. Añade como título: Mi presentación Slide
10. Con la pestaña Visual seleccionada, haz clic derecho sobre el cuadro de texto del
editor y elige Pegar.
Imagen ::: Slide.com : presentaciones de fotos 333
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
11. Slideshare:
presentaciones
en línea
Imagen ::: Slideshare, presentaciones en línea 335
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
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.
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.
Imagen ::: Slideshare, presentaciones en línea 336
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
14. Clic 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.
Notas:
6. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
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.
Imagen ::: Slideshare, presentaciones en línea 340
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
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 para copiar y
pegar en las entradas de nuestro blog.
Imagen ::: Google Maps 342
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Utiliza el buscador y las opciones de zoom y navegación del mapa para situarte en el
mapa de la zona que deseas mostrar. Por ejemplo: la península ibérica. Elige como
vista el modo Satélite.
7. En la columna izquierda del nuevo mapa introduce el Título y la Descripción.
Asegúrate de que está marcada la opción Público para que el recurso sea accesible
por cualquier usuario.
10. Se mostrará un recuadro para introducir los datos del marcador. Activa el modo Texto
enriquecido para facilitar la inserción de imágenes.
11. En la casilla Título introduce el título del marcador, p.e. Sagrada Familia y en
Descripción copia y pega el texto descriptivo de este monumento contenido en el
archivo de texto descargado.
12. Clic en el botón Añadir 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.
13. Para terminar la edición de las propiedades de este marcador pulsa en el botón
Aceptar.
14. 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 añadiendo aparecen en la parte inferior de la columna izquierda del mapa.
15. Una vez que hayas terminado el mapa haz clic en el enlace Guardar y luego en el
enlace Listo.
Imagen ::: Google Maps 346
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Tras pulsar en Listo se visualizará el mapa tal y como lo verá un visitante. Puedes
navegar por él y comprobar si la información que se muestra en los distintos
marcadores es correcta y se visualiza adecuadamente al pulsar sobre cada uno de los
marcadores. Para cambiar algún dato sería necesario pulsar en el botón Editar.
6. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
Imagen ::: Google Maps 347
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
8. Pulsa en el enlace Ver blog para comprobar cómo se visualiza el mapa Google.
Imagen ::: Google Maps 348
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. Observa que se
pega una etiqueta de código HTML iframe. Wordpress no admite esta etiqueta al
guardar el artículo por motivos de seguridad. Sin embargo cuando se guarda el
artículo y se publica, el sistema transformará esta etiqueta en otra del tipo
[googlemaps …] que insertará el mapa deseado en la entrada actual.
Imagen ::: Google Maps 349
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. Introducción
Audio ::: Introducción 352
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
CBR/VBR
Constant/Variable Bitrate. CBR indica que el audio ha sido codificado manteniendo el bitrate
constante a lo largo del clip de audio mientras que VBR varía entre un rango máximo y
mínimo en función de la tasa de transferencia.
Códec.
Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el
número de bytes que ocupa un archivo de audio. Los archivos codificados con un codec
específico requieren el mismo códec para ser decodificados y reproducidos. El códec más
utilizado en audio es el MP3.
Decibelio.
Unidad de medida del volumen o intensidad de un sonido. El silencio o ausencia de sonido se
cuantifica como 0 dB y el umbral del dolor para el oído humano se sitúa en torno a los 130-
140 dB.
Audio ::: Introducción 353
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Formato WAV
Formato MP3
El formato MP3 (MPEG 1 Layer 3) fue creado por el Instituto Fraunhofer y por su
extraordinario grado de compresión y alta calidad está prácticamente monopolizando
el mundo del audio digital.
Es ideal para publicar audios en la web. Se puede escuchar desde la mayoría de
reproductores.
La transformación de WAV a MP3 o la publicación directa de una grabación en formato
MP3 es un proceso fácil y al alcance de los principales editores de audio.
Tiene un enorme nivel de compresión respecto al WAV. En igualdad del resto de
condiciones reduciría el tamaño del archivo de un fragmento musical con un factor
entre 1/10 y 1/12.
Presentan una mínima pérdida de calidad.
Formato OGG
Mención especial merece el formato MIDI. No es un formato de audio propiamente dicho por
lo que se comentan aparte sus características.
Audio ::: Introducción 354
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Formato MIDI
1) Tasa de muestreo. Definir valores inferiores: 44100 Hz., 22050 Hz., 11025 Hz, etc.
2) Resolución. Establecer resoluciones más pequeñas: 32-bits, 16-bits, 8-bits, 4-bits, etc.
3) Duración. En ocasiones se puede utilizar un fragmento más corto que reproducido en
bucle cubre el tiempo suficiente de acompañamiento musical. A éstos se les llama
loops.
4) Calidad estéreo/mono. La reducción a calidad “mono” reduce considerablemente el
peso del archivo. Por otra lado la calidad de reproducción “mono” para la mayoría de
audios y de público es apenas perceptible.
5) Formato. Es preferible utilizar el formato MP3 en lugar del WAV por su potente factor
de compresión y su aceptable calidad de audio.
6) Factor de compresión. El formato WAV admite distintos factores de compresión: PCM
y ADPCM.
2. Primeros pasos
con Audacity
Audio ::: Primeros pasos con Audacity 356
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Para poder realizar con Audacity la importación y exportación de audio a distintos formatos,
por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser
interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo.
No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de
licencias de uso.
4. Para iniciar la aplicación selecciona: Aplicaciones > Sonido y vídeo > Audacity. Se
puede arrastrar el icono de Audacity al escritorio para un acceso más directo.
Para poder realizar con Audacity la importación y exportación de audio a distintos formatos,
por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser
interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo.
No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de
licencias de uso.
3. Haz doble clic sobre la casilla de verificación del paquete de libmp3lame0 para
seleccionarlo y a continuación haz clic en el botón Aplicar.
4. En el Gestor de paquetes de Synaptic teclea en el buscador de paquetes el término
ffmpeg y pulsa en el botón Buscar.
5. Haz doble clic sobre la casilla de verificación del paquete de ffmpeg para
seleccionarlo. Aceptar la instalación de dependencias y a continuación pulsa en el
botón Aplicar para iniciar la descarga e instalación de este paquete.
6. Abre Audacity para configurar el programa indicándole la ubicación de estos códecs.
7. En la barra de menús selecciona Edición > Preferencias.
8. En el cuadro de diálogo Preferencias de Audacity haz clic en Bibliotecas. Clic en el
botón Ubicar para localizar la Biblioteca MP3 y la Biblioteca FFmpeg aceptando las
opciones por defecto.
6. Aunque algunos se verán con más detalle más adelante, ahora se describen
brevemente los principales elementos del interfaz de Audacity:
5. Barra de Mezclador
Nota:
Si seleccionas Ver > Barras de herramientas > Barra de herramientas de
dispositivos entonces se visualizará otra barra más que no viene configurada como
visible por defecto que permitirá elegir el dispositivo fuente del que se grabará
Micrófono.
7. Barra de Edición.
Zoom Acercar/Alejar.
8. Pista de audio.
Audacity permite trabajar con distintas pista de audio. Cada una se sitúa en una
ventana propia. Desde el cuadro de control situado a la izquierda se pueden realizar
distintas operaciones.
Boton X : sirve para cerrar esta pista. Se recupera de nuevo seleccionando
Editar > Deshacer Eliminación de pista
Menú emergente: si pulsamos sobre la cabeza de flecha negra que aparece
en la esquina superior derecha se muestra un menú con las opciones de uso
más frecuente que se pueden realizar sobre la pista de audio: modificar el
nombre, cambiar el modo de visualización (forma de onda, espectro, tono,
etc), cambiar su orden sobre el resto de pistas, modificar el valor de la
frecuencia y del formato de muestreo
Audio ::: Primeros pasos con Audacity 362
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Reproducción de
audio con Audacity
Audio ::: Reproducción de audio con Audacity 364
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Como resultado de estas dos tareas en la pestaña Otro software se añadirán dos
líneas más con la URL del código. Cierra la ventana Orígenes del software. Tras unos
instantes se actualizarán las fuentes de software de tu Ubuntu.
9. Para iniciar el programa selecciona Aplicaciones > Sonido y vídeo > MediaInfo
Audio ::: Reproducción de audio con Audacity 367
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Desde MediaInfo elige Archivo > Abrir para localizar el archivo de audio
amanecer.wav resultado de la descarga y extracción realizada en un apartado
anterior.
3. Tras abrir este archivo en la ventana de MediaInfo se mostrará toda la información
técnica del audio.
Nota:
Nota:
Mediante Archivo > Abrir puedes acceder a la edición de un archivo WAV, MP3, OGG,
etc. Sin embargo cuando trates de guardar las modificaciones realizadas en el mismo
formato de archivo deberás seleccionar Archivo > Exportar … En este caso es
conveniente definir un nombre distinto para el nuevo archivo. Con ello se conservará
el original evitando su sobrescritura.
Audio ::: Optimización de audios 369
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4.Optimización
de audios
Audio ::: Optimización de audios 370
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Otra posibilidad es pulsar en el botón Descargar … que aparece en este cuadro para
navegar hasta una página del proyecto Audacity donde es posible descargar y situar
este archivo en una subcarpeta Lame dentro de la carpeta de instalación de Audacity
en el equipo.
Audio ::: Optimización de audios 372
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Clic en el botón Aceptar para guardar los cambios. Si no vuelves a modificar este
valor, todos los audios que se originen a partir de ahora mediante el proceso
Exportación como MP3 … tendrán este bitrate.
10. De regreso al cuadro de diálogo Exportar archivo introduce un nuevo nombre de
archivo. Por ejemplo: amanecer_96. No es necesario teclear la extensión porque
Audacity la incorpora automáticamente.
11. Repite los pasos 4-9 para crear otros archivos MP3 con bitrates inferiores:
amanecer_64.mp3 y amanecer_32.mp3
12. Desde el explorador de archivos, sitúate en la carpeta donde has exportado los
archivos para acceder a la lista de archivos. Comprueba que conforme vamos
reduciendo el bitrate, el peso disminuye. Podrás comprobar que la calidad no ha
disminuido excesivamente. Para ello efectúa doble clic sobre cada archivo. Se iniciará
el reproductor instalado por defecto en tu equipo (Windows Media, QuickTime, Totem,
etc).
6. Tras esta elección observa que ahora el canal izquierdo y derecho se muestran en
ventanas separadas.
Audio ::: Optimización de audios 375
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Haz clic sobre el botón “X” cerrar situado en el encabezado de la onda del canal
Derecho. (También se podría hacer eliminando el canal Izquierdo) . De los dos
cuadros que muestran la onda sonora será el situado más abajo. Con esta operación se
elimina la onda sonora del canal derecho.
14. En el cuadro de diálogo Exportar archivo pulsa en el botón Guardar. En este caso se
mostrará un mensaje de advertencia donde se indica que el audio será remuestreado
a la nueva frecuencia definida: 24.000. Clic en el botón Aceptar.
15. Al cabo de unos instantes en la carpeta destino se habrá creado al archivo de audio en
monocanal.
9. En el cuadro de diálogo Exportar archivo teclea el nombre del nuevo archivo. Por
ejemplo: ladrido_16_pcm.wav . No es necesario introducir la extensión .WAV porque
Audacity la incorpora automáticamente.
10. Clic en el botón Guardar.
11. Repite la secuencia de pasos anterior para crear otros archivos de tipo WAV
(Microsoft) pero con distintos formatos de codificación:
WAV (Microsoft) – Signed 24 bit PCM: ladrido_24_pcm.wav
WAV (Microsoft) – Signed 32 bit PCM: ladrido_32_pcm.wav
WAV (Microsoft) – 32 bit float: ladrido_32_float.wav
WAV (Microsoft) – IMA ADPCM: ladrido_ima_adpcm.wav
Audio ::: Optimización de audios 379
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
12. Desde el explorador de archivos visualiza el detalle de la lista de archivos que has
creado. Comprueba la reducción de peso que tienen los distintos formatos de
compresión WAV.
Audio ::: La grabación de audio 380
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. La grabación
de audio
Audio ::: La grabación de audio 381
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Clic en Aceptar.
6. A continuación selecciona Archivo > Nuevo. Se abre una nueva ventana de Audacity
adoptando los nuevos valores de muestreo definidos. En la barra de estado de esta
nueva ventana aparecerá la tasa de muestreo elegida.
Nota:
El listado de dispositivos que se mostrarán en este panel dependerá del hardware del
ordenador, de los drivers instalados para la tarjeta de audio y de la versión de Windows
utilizada.
9. En el panel de Medidores, haz clic en el botón con la cabeza de flecha mirando hacia
abajo que aparece situado al lado del icono del micrófono.
Audio ::: La grabación de audio 382
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11. Con ello Audacity comienza a monitorizar la señal de entrada. Observa que a partir de
este momento en el panel de mezclas oscilan los indicadores de señal en color rojo
recogiendo la entrada del micrófono. Si al hablar en el micro no se observan estas
oscilaciones en el nivel de entrada, es necesario revisar la conexión del micrófono con
el equipo. Asegúrate de que está conectado en la entrada adecuada de la tarjeta de
sonido.
12. Realiza una prueba leyendo este texto: “La televisión puede darnos muchas cosas,
salvo tiempo para pensar. Bernice Buresh”. Durante su lectura observa las
oscilaciones del nivel de entrada en el panel de Medidores.
13. También resulta conveniente ajustar el volumen del micrófono. Durante la lectura, en
los puntos de máximo volumen, el nivel debería haber superado la marca de -6
decibelios. En el panel de mezclas arrastra el deslizador de volumen del micrófono
aumentando o disminuyendo para conseguir que el máximo volumen alcance esta
marca pero sin que ello produzca la saturación.
14. A continuación, pulsa en el botón Grabar.
15. Lee despacio sobre el micrófono. Para detener la grabación pulsa en el botón Parar.
16. Para iniciar de nuevo la grabación elige Editar > Deshacer Grabar.
17. Una vez realizada la grabación con éxito vamos a guardarla. Para ello selecciona
Archivo > Exportar.
18. En el cuadro de diálogo Editar metadatos pulsa en el botón Aceptar.
19. En el cuadro de diálogo Exportar selecciona como Tipo de archivo MP3.
20. Pulsa en el botón Opciones para definir una calidad de 32 kbps. Clic en el botón
Aceptar.
Audio ::: La grabación de audio 383
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
21. Introduce como nombre de archivo, por ejemplo, locución_32 y pulsa en el botón
Guardar.
1. Sitúate en una nueva ventana de Audacity mediante Archivo > Nuevo o bien abriendo
el programa si éste no está ejecutándose.
2. Marca la opción de visualización: Ver > Barra de herramientas > Barra de
herramientas de dispositivos.
3. En el panel de Dispositivos de entrada (icono de micrófono) selecciona el dispositivo
MME: Mezcla estéreo … Una vez seleccionado el dispositivo de entrada puedes
ocultar este panel mediante Ver > Barra de herramientas > Barra de herramientas
de dispositivos.
11. Una vez realizada la grabación con éxito vamos a guardarla. Para ello selecciona
Archivo > Exportar para obtener el archivo correspondiente. Conviene guardar el
audio extraído de un CD en formato MP3 si su duración va a superar los 4-5 segundos.
Al exportar a MP3 no olvides en el cuadro de diálogo Exportar archivo pulsa en el
botón Opciones para definir la calidad de audio.
Notas:
Calidad de grabación
Como se indica en el primer apartado de este capítulo, recuerda que la tasa y
resolución de muestreo se definen en Archivo > Preferencias > Calidad. Esto se hace
previamente a la grabación.
12. Una vez realizada la grabación con éxito vamos a guardarla. Para ello selecciona
Archivo > Exportar para obtener el archivo correspondiente. Conviene guardar el
audio extraído en formato MP3 si su duración va a superar los 4-5 segundos. Al
exportar a MP3 no olvides en el cuadro de diálogo Exportar archivo pulsa en el botón
Opciones para definir la calidad de audio.
Nota:
Se puede aplicar el mismo procedimiento para extraer la banda sonora a un vídeo de
Youtube (http://www.youtube.com) que se esté reproduciendo a través del
navegador web. Conviene al principio pausar unos segundos la reproducción para
asegurar una descarga previa suficiente que evite las paradas en la emisión.
4. Desde Audacity selecciona Archivo > Nuevo para comenzar en un proyecto nuevo.
5. Marca la opción de visualización: Ver > Barra de herramientas > Barra de
herramientas de dispositivos.
6. En el panel de Dispositivos de entrada (icono de micrófono) selecciona el dispositivo
MME: Mezcla estéreo … (*)
12. Una vez realizada la grabación con éxito vamos a guardarla. Para ello selecciona
Archivo > Exportar para obtener el archivo correspondiente. Conviene guardar el
audio extraído en formato MP3 si su duración va a superar los 4-5 segundos. Al
exportar a MP3 no olvides en el cuadro de diálogo Exportar archivo pulsa en el botón
Opciones para definir la calidad de audio.
Audio ::: La grabación de audio 389
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Notas:
Como se indica en el primer apartado de este capítulo, recuerda que la tasa y
resolución de muestreo se definen en Archivo > Preferencias > Calidad. Esto se hace
previamente a la grabación.
Recuerda que Audacity no permite importar ni editar archivos MIDI.
Audio ::: Montajes de audio 390
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Montajes de audio
Audio ::: Montajes de audio 391
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Para seleccionar un fragmento de onda haz clic en el punto inicial estimado y sin
soltar arrastra hasta el punto final para luego soltar. Debes efectuar clic sobre la
onda sonora de uno de los canales evitando realizarlo en el espacio intermedio.
Observa que el fragmento seleccionado queda remarcado sobre fondo gris oscuro.
Para realizar selecciones más finas es conveniente utilizar la herramienta zoom. Con ella
se puede ampliar la representación de la onda.
Audio ::: Montajes de audio 392
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Editar > Seleccionar > Todo: Con esta opción se selecciona toda la onda de audio.
Esta opción es especialmente útil para aplicar un efecto a la grabación completa.
Audio ::: Montajes de audio 393
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Editar > Seleccionar > Desde el principio hasta el cursor: Al hacer un clic sobre la
onda para fijar la posición de la línea de cursor y luego utilizar esta opción, se
selecciona la porción comprendida entre el principio de la grabación y la posición de
la línea de cursor.
Editar > Seleccionar > Desde el cursor hasta el final: Al hacer clic sobre la onda
para fijar la posición de la línea de cursor y luego aplicar este comando, se selecciona
el tramo comprendido entre la línea de cursor y el final de la grabación.
Otra posibilidad es realizar una selección aproximada sobre la onda utilizando la herramienta
Selección y luego hacer clic sobre los valores numéricos hhmmss (h=horas, m=minutos,
s=segundos) de INICIO y FIN que aparecen en la barra de selección inferior. De esta forma se
introducen por teclado estos valores permitiendo un ajuste con una precisión de milésimas de
segundo.
7. Pulsa y arrastra sobre la onda para seleccionar una porción. Por ejemplo de 0,0 a 4,7
segundos.
8. Copia este fragmento de onda al portapapeles haciendo clic en el botón Copiar
6. Realiza varios clics sucesivos sobre la onda hasta conseguir que la línea de tiempo
discrimine 0,00-0,10-0,20-0,30 con una apreciación de media décima (0,05)
9. Haz clic sobre la onda en el punto 3,75 segundos. A continuación elige Editar >
Seleccionar > Desde el principio hasta el cursor. Con esta acción se selecciona la
onda comprendida entre el inicio y la situación actual de la línea cursor.
10. Para oír si el final coincide adecuadamente con el principio, activa el modo de
reproducción en loop: pulsa la tecla <Mayús> y sin soltarla haz clic en el botón
Reproducir de la consola. Observa que al pulsar la tecla <Mayús> este botón toma
un aspecto distinto:
Audio ::: Montajes de audio 396
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Mantén la tecla <Mayús> pulsada y sin soltarla haz clic en el botón Reproducir para
comprobar que el loop se mantiene sin cortes.
17. Elige Archivo > Exportar
18. Se muestra el cuadro de diálogo Editar metadatos … Clic en Aceptar.
19. En el cuadro de diálogo Exportar archivo elige la carpeta destino en la lista
desplegable Guardar en. Introduce el nombre del nuevo archivo de audio. Por
ejemplo: audio_loop. No es necesario añadir la extensión *.mp3 porque Audacity lo
hace de forma automática.
20. En la lista desplegable Tipo selecciona la entrada Archivos MP3.
21. Si deseas configurar la calidad del archivo mp3 resultante pulsa en el botón Opciones
y defínela en la lista Calidad. En este caso dejaremos la opción por defecto. Pulsa en
el botón Aceptar.
Nota:
El formato *.OGG es un formato de compresión de audio que surgió como alternativa libre
y gratuita al MP3. Los archivos Ogg Vorbis no tienen un uso tan extendido como los MP3 y
algunos reproductores no los pueden reproducir. Sin embargo ofrecen una compresión
parecida a los MP3 con una calidad muy similar. Audacity puede importar y exportar audio
en este formato.
2. Abre Audacity.
3. Selecciona Archivo > Importar
4. En el cuadro de diálogo Seleccione uno o más archivos … selecciona el archivo
fondo_clasico.ogg . Pulsa en el botón Abrir.
5. Repite los pasos 3-4 para importar el audio poema.ogg. Fíjate que cada audio original
se sitúa en una pista independiente.
6. Selecciona la herramienta Seleccionar para pulsar+arrastrar+soltar la onda completa
de la pista poema.
Audio ::: Montajes de audio 397
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Aplicar efectos
Audio ::: Aplicar efectos 400
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Pulsa y arrastra para seleccionar una porción de audio sobre la que se aplicará el
efecto. Puede ser un tramo inicial o final. Si deseas que la selección abarque toda la
pista elige Editar > Seleccionar > Todo o bien pulsa la combinación de teclas
<Ctrl>+<A>
8. Aplica el efecto seleccionando en la barra de menú Efecto > … En el cuadro de
configuración de los parámetros de un efecto suele encontrarse un botón
Previsualización para escuchar los primeros segundos del audio seleccionado tras
haberle aplicado ese efecto.
9. A continuación se exponen algunos de los efectos más habituales:
Revertir. Este efecto voltea la pista de audio creando otra donde el comienzo
es el final de la original y viceversa. Al reproducir esta nueva pista suena
como si se hubiese reproducido hacia atrás la pista original.
Wahwah. Incorpora un efecto de filtro especial.
8. Extracción de
audio de un CD
Audio ::: Extracción de audio de un CD 407
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En el sitio web oficial del proyecto CDex podrás encontrar la versión más reciente o que se
adapta a tu sistema: http://cdexos.sourceforge.net/
4. En la lista inferior se muestran las pistas de audio que contiene el CD. Haz clic sobre
una para seleccionarla. Por ejemplo: Pista de audio 02.
5. Si deseas elegir alguna más pulsa la tecla <Ctrl> y sin soltarla haz clic sobre ella para
añadirla a la selección. Para seleccionarlas todas, clic sobre la primera, pulsa
<Mayus> y sin soltarla clic sobre la última.
Audio ::: Extracción de audio de un CD 408
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Para iniciar la captura de la pista/s elegida/s pulsa en alguno de los botones que
aparecen en la barra derecha.
4. Para ejecutar Sound Juicer elige Aplicaciones > Sonido y vídeo > Extractor de
sonido de CD.
Sound Juicer convierte por defecto al formato OGG. Para activar la conversión a MP3 es
necesario instalar previamente el paquete gstreamer0.10-plugins-ugly-multiverse. Para ello
sigue estos pasos:
4. La carpeta personal del usuario donde se guardará el archivo MP3 final es Música. Se
puede acceder a ella desde el escritorio mediante Lugares > Música. Desde el cuadro
de diálogo Preferencias se puede modificar la carpeta destino desplegando la lista
Carpeta y seleccionando otra.
5. En el cuadro de diálogo Preferencias despliega la lista Formato de salida y elige la
opción Calidad de CD, MP3 (audio MP3). Clic en el botón Cerrar.
6. Al regresar a la ventana principal de Sound juicer marca solamente las pistas que
deseas capturar.
7. Para iniciar el proceso pulsa en el botón Extraer.
9. Para reproducir el archivo MP3 final resultante puedes utilizar Audacity o cualquier
otro programa: VLC Media Player
Audio ::: Integración de audio en Blogger 413
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Integración de
audio en el blog
Audio ::: Integración de audio en Blogger 414
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9.1 Integración de
audio en Blogger
Audio ::: Integración de audio en Blogger 415
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Clic en el enlace Sitios para acceder al servicio Google Sites asociado a la cuenta
Google.
6. En el listado de Mis sitios haz clic en el enlace Mi Sitio para acceder al sitio por
defecto asociado a la cuenta. Su URL de acceso público es
http://sites.google.com/site/<nombre_usuario>. En este caso vamos a guardar en
este espacio los archivos que vamos necesitar para luego enlazarlos desde el blog.
7. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los
archivos se propone crear una carpeta de nombre audio donde guardar los archivos
pdf. Clic en el botón Crear página.
10. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir
archivo.
11. En el cuadro de diálogo Añadir archivo pulsa en el botón Examinar para localizar y
subir el archivo del audio MP3 danzahungara.mp3. Puedes introducir opcionalmente
una descripción del archivo. Clic en el botón Subir.
Audio ::: Integración de audio en Blogger 417
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
12. Repite el paso anterior para subir el archivo del reproductor player.swf. El archivo de
texto brahms.txt y la imagen brahms.jpg no se subirán porque se utilizarán para
elaborar la entrada en el blog.
13. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a
ella.
2. Se abrirá el navegador web mostrando esta página web. Lo más importante en este
interfaz es introducir la URL del reproductor player.swf y la URL del audio MP3 que
se pretende reproducir con él.
4. Sitúate en el Generador de código para PixelOut y haz clic derecho sobre el cuadro
de texto URL del reproductor y elige la opción Pegar. Esta acción pegará la ruta
absoluta al reproductor player.swf que hemos alojado en nuestra cuenta de Google
Sites.
5. Regresa a la página de Google Sites y haz clic derecho sobre el enlace
correspondiente al audio danzahungara.mp3 y elige la opción Copiar la ruta del
enlace.
Audio ::: Integración de audio en Blogger 419
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Conserva abierta esta página para regresar a ella y copiar/pegar el código HTML
creado sobre un artículo de tu blog.
10. En la barra de herramientas del editor haz clic en el botón Añadir Imagen.
11. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el
botón Examinar para localizar y señalar el archivo brahms.jpg que hemos obtenido
en un paso anterior.
12. En el área Elige un diseño selecciona un tipo de alineamiento. Por ejemplo: Ninguno.
13. En la parte inferior activa la casilla de aceptación de condiciones y pulsa en el botón
SUBIR IMAGEN.
14. Si el proceso de subida se realiza con éxito se mostrará la imagen y el mensaje Se ha
añadido su imagen. Clic en el botón FINALIZADO.
15. De regreso al editor elimina las etiquetas [imagen] y [audio]. Se utilizan para indicar
la posición de estos elementos en el artículo pero carecen de utilidad cuando se
añadan estos elementos al artículo.
Audio ::: Integración de audio en Blogger 421
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
17. Regresa a la página de Generador de código de Pixelout y en el cuadro del código
haz clic derecho para elegir Seleccionar todo. Repite clic derecho sobre la selección
para hacer clic en Copiar.
18. Sitúate en la edición HTML del artículo del blog al final del mismo. Clic derecho y
selecciona Pegar. Esta acción pegará el código HTML generado anteriormente.
20. A continuación haz clic en el enlace Ver blog para ver el resultado final
Audio ::: Integración de audio en Blogger 422
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
righticonhover=0xHHHHHH Right icon color (hover). Color del icono derecho al situar
el ratón sobre él.
text=0xHHHHHH Text color . Color del texto.
slider=0xHHHHHH Slider color . Color del deslizador.
loader=0xHHHHHH Loader bar color . Color de la barra de carga.
track=0xHHHHHH Progress track color . Color de la barra de progreso de la pista.
border=0xHHHHHH Progress track border color. Color del borde de la barra de
progreso de pista.
Audio ::: Integración de audio en Wordpress 424
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9.2 Integración de
audio en Wordpress
Audio ::: Integración de audio en Wordpress 425
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. En el menú de opciones de la barra horizontal superior izquierda pulsa en Más > Sites.
Audio ::: Integración de audio en Wordpress 426
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. En el listado de Mis sitios haz clic en el enlace Mi Sitio para acceder al sitio por
defecto asociado a la cuenta. Su URL de acceso público es
http://sites.google.com/site/<nombre_usuario>. En este caso vamos a guardar en
este espacio el archivo de audio MP3 que vamos necesitar para luego enlazarlos desde
el blog.
6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los
archivos se propone crear una carpeta de nombre audio donde guardar los archivos
pdf. Clic en el botón Crear página.
9. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir
archivo.
10. En el cuadro de diálogo Añadir archivo pulsa en el botón Examinar para localizar y
subir el archivo del audio MP3 danzahungara.mp3. Puedes introducir opcionalmente
una descripción del archivo. Clic en el botón Subir.
11. Al cabo de unos instantes se mostrará una entrada al archivo de audio alojado en el
servidor.
Audio ::: Integración de audio en Wordpress 428
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
12. Sobre el enlace Descargar haz clic derecho y selecciona la opción Copiar la ruta del
enlace. De esta forma se copiará el enlace.
13. Abre el Bloc de Notas mediante Inicio > Todos los programas > Accesorios > Bloc de
Notas y dentro de este programa elige Edición > Pegar.
https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3?attredi
rects=0&d=1
https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3
Recuerda que esta dirección será utilizada más adelante para integrar este audio en las
entradas de tu blog en Wordpress.com
Audio ::: Integración de audio en Wordpress 429
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
8. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el
botón Elegir archivos para localizar y señalar el archivo brahms.jpg que hemos
obtenido en un paso anterior.
11. De regreso al editor elimina las etiquetas [imagen] y [audio]. Se utilizan para indicar
la posición de estos elementos en el artículo pero carecen de utilidad cuando se
añadan estos elementos al artículo.
2. Regresa al Bloc de Notas que tenías abierto del paso anterior para reescribir la
siguiente etiqueta:
[audio https://sites.google.com/site/<usuario>/audios/danzahungara.mp3]
Observa que esta etiqueta contiene la URL donde está archivado el audio MP3 en
Google Sites.
Audio ::: Integración de audio en Wordpress 432
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Propiedades de color:
Otros valores:
Para utilizar estos parámetros se añaden a la etiqueta [audio … utilizando el signo “|” sin
dejar espacios en blanco a partir de la extensión mp3 del nombre del archivo.
Ejemplo:
[https://sites.google.com/site/<usuario>/audios/danzahungara.mp3|width=260|loop=yes]
Audio ::: Repositorios Web 2.0 de audio 434
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Repositorios
Web 2.0 de audio
Audio ::: Repositorios Web 2.0 de audio 435
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En la Web 2.0 existen espacios que ofrecen la posibilidad a los usuarios de subir y compartir
audios en formato MP3 que luego podemos integrar en los artículos de nuestro blog. Hay
multitud de espacios que ofrecen un esquema parecido de funcionamiento: subir archivos de
audio, copiar el código y pegarlo en el código HTML del artículo. En este apartado se
describen a modo de ejemplo: Goear y SoundCloud pero se anima al lector a buscar otros por
Internet porque la oferta es amplia y variada.
10.1 Goear
5. Rellena los distintos datos del audio: Título, Autor, Género y Descripción.
6. Clic en el botón Examinar para localizar el audio MP3 guardado en tu equipo.
Audio ::: Repositorios Web 2.0 de audio 436
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada.
4. Clic derecho sobre el cuadro This song in your site (Esta canción en tu sitio) y elige la
opción Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.
2. Utiliza el buscador para situarte en la reproducción del audio que desees insertar en
tu página HTML
Audio ::: Repositorios Web 2.0 de audio 439
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada. Es
importante que la canción se descargue por completo para que se almacene en la
carpeta caché del navegador.
5. Desde la página que muestra los contenidos de la caché haz clic en el enlace List
Cache Entries (Listado de Entradas de la Caché) en el apartado Disk cache device
(caché de disco). Esta acción muestra la lista de archivos almacenados en la caché.
6. Elige Edición > Buscar. Introduce el término mp3 y pulsa en el botón Siguiente para
buscar en el listado el archivo MP3 cacheado.
Audio ::: Repositorios Web 2.0 de audio 440
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188.
mp3
8. Clic derecho sobre esta dirección para elegir la opción Copiar la ruta del enlace.
9. En el interfaz de gestión de contenidos de tu blog en Wordpress haz clic en Entrada >
Añadir. Introduce como título “Música africana” y en el editor del artículo haz clic
en la pestaña HTML
10. Sobre el editor haz clic derecho y selecciona Pegar. Completa la etiqueta para que
tenga la forma:
[audio http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188.mp3]
11. Clic en el botón Publicar. Al visualizar la entrada en el frontend del blog se mostrará
el reproductor de Wordpress mostrando el audio alojado en Goear.
10.2 SoundCloud
6. Clic en el botón Choose files (elegir archivos) para localizar el archivo dreadloc.mp3.
7. Una vez completa la subida del archivo se ofrece la oportunidad de incorporar los
metadatos asociados a ese audio. En el apartado Track info (Información de la pista
de audio) añade Ambiente Reggae al nombre (Track name) y descripción de ese
audio (Track description).
8. En el apartado Who is this track for? (¿Para quién es esta pista?) define la pista como
pública.
Audio ::: Repositorios Web 2.0 de audio 442
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. Introducción
Vídeo y animaciones ::: Introducción 448
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Codec.
Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el
número de bytes que ocupa un archivo de video. Los archivos codificados con un códec
específico requieren el mismo códec para ser decodificados y reproducidos. Algunos de los
códecs más utilizados para el formato AVI son: DivX, XviD, CinePak, Intel Indeo 5, DV, etc.
Fotogramas Clave.
Cuando se aplica un códec de compresión a un video, se suele producir cierta pérdida de la
información de sus fotogramas. Algunos fotogramas (los fotogramas clave) se almacenan
completamente en el archivo comprimido, mientras que el resto sólo se guardan parcialmente.
En la descompresión, estos fotogramas intermedios se reconstruyen a partir de los fotogramas
clave.
Sistemas de televisión.
NTSC (National Television Standards Comité = Comité Nacional de Estándares de
Televisión). Cada fotograma está formado por 525 líneas y reproduce 30 fotogramas
por segundo. Se utiliza en América del Norte, Centroamérica, Japón, etc.
PAL (Phase Alternation Line = Línea Alternada en Fase): El vídeo PAL tiene 625 líneas
por fotograma y 25 fotogramas por segundo. Es el sistema más extendido actualmente
en Europa.
SECAM (Séquentiel Couleur à Mémoire = Color secuencial con memoria). Muestra 625
líneas y 25 fotogramas por segundo. De origen francés, ha perdido mercado en Europa
a favor del sistema PAL.
MOV (http://www.apple.com/es/quicktime/)
Es el formato de video y audio clásico desarrollado por Apple.
Utiliza un códec propio que evoluciona en versiones con bastante rapidez.
Este tipo de archivos también pueden tener extensión *.QT
Se recomienda utilizar el reproductor de QuickTime. Existe una versión gratuita del
mismo que se puede descargar de Internet.
Es ideal para publicar videos en Internet por su razonable calidad/peso.
Admite streaming.
WMV (http://www.microsoft.com/windows/windowsmedia/es/)
Ha sido desarrollado por Microsoft.
Utiliza el códec MPEG-4 para la compresión de video.
También puede tener extensión *.ASF
Sólo se puede visualizar con una versión actualizada de Windows Media 7 o superior.
Esta aplicación viene integrada dentro de Windows.
Es ideal para publicar videos en Internet por razonable calidad/peso.
Admite streaming.
RM (http://spain.real.com/)
Es la propuesta de Real Networks para archivos de video.
Utiliza un códec propio para comprimir el audio.
Este tipo de archivos tiene extensión *.RM y *.RAM.
Se visualiza con un reproductor específico: Real Player. Existe una versión gratuita
del mismo que se puede descargar de Internet.
Vídeo y animaciones ::: Introducción 450
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
MP4 (http://www.apple.com/quicktime/technologies/mpeg4/)
Es un nuevo formato de vídeo desarrollado por Apple.
Se basa en el estándar MPEG-4 utilizando el códec H.264 AVC para vídeo y el códec
AAC o MP3 para audio.
Son archivos de extensión *.MP4.
Es un formato de vídeo de gran popularidad y expansión debido a que se utiliza en los
reproductores personales iPod y en el software de reproducción QuickTime+iTunes de
Apple.
En el ordenador se puede reproducir con VLC Media Player, QuickTime, etc.
El repositorio de vídeos Youtube utiliza el formato MP4 para la descarga de los vídeos
en alta calidad HQ.
El archivo *.MP4 es un contenedor dentro del cual además de audio y vídeo
sincronizados también se pueden almacenar imágenes fijas, subtítulos, información
de capítulos, etc.
Admite streaming.
FLV (http://www.adobe.com)
Es un formato que utiliza el reproductor Adobe Flash para visualizar vídeo en Internet.
Utiliza el códec Sorenson Spark y el códec On2 VP6. Ambos permiten una alta calidad
visual con bitrates reducidos.
Son archivos de extensión *.FLV.
Se pueden reproducir desde distintos reproductores locales: MPlayer, VLC media
player, Riva, Xine, et.
Opción recomendada para la web por su accesibilidad. Al visualizarse a través del
reproductor de Flash es accesible desde la mayoría de los sistemas operativos y
navegadores web.
Los repositorios de vídeo más conocidos en Internet utilizan este formato para la
difusión de vídeos: YouTube, Google Video, iFilm, etc.
Permite configurar distintos parámetros del vídeo para conseguir una aceptable
calidad/peso.
Admite streaming. Junto con el formato MP4 son las opciones más aconsejables para
la difusión de vídeos por Internet.
En el Audio:
1) El códec de compresión de audio utilizado: MPEG Layer 1, MPEG Layer 2, MP3, etc.
2) Resolución. Establecer resoluciones más pequeñas: 32-bits, 16-bits, 8-bits, 4-bits, etc.
3) Tasa de muestreo. Definir valores inferiores: 44100 Hz., 22050 Hz., 11025 Hz, etc.
4) Velocidad de transmisión (bitrate). Configurar bitrates más bajos: 128 Kbps, 96 Kbps,
64 Kbps, etc.
5) Calidad estéreo/mono. Reducir la calidad de “stereo” a “mono”
En el Video:
1) Duración. Cuanto más corto es un video, menos peso ocupa su archivo. En ocasiones
puede resultar interesante fraccionar un archivo de video en sus escenas para facilitar
su descarga.
2) Formato de archivo. Los archivos *.WMV, *.MOV, *.RM y *.FLV son los más adecuados
para publicar un video en Internet por su adecuada relación calidad/peso y porque
admiten streaming. Los archivos *.AVI con códecs de compresión baja son ideales para
guardar los videos originales. Los archivos *.AVI con códecs DiVX-XviD son apropiados
para videos de películas de cierta duración. Los archivos *.MPG con códec MPEG-1 se
utilizan para crear Video-CDs. Los archivos *.MPG con códec MPEG-2 se utilizan como
fuente para montar un DVD.
Para disponer de una información más completa de cómo conectar y configurar un dispositivo
de captura, consulta la documentación que acompaña a cada hardware.
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 454
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
2. Reproducción
de vídeos con
VLC Media Player
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 455
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Soporta un gran número de formatos de audio y vídeo sin necesidad de instalar códecs
adicionales: MPEG-1, MPEG-2, MPEG-4, DivX, MP3,OGG, MOV, RAM, AVI, FLV, etc.
Es una opción muy interesante frente a otros programas comerciales para reproducir
CDs de música, películas en soporte DVD o VídeoCD, etc.
Se puede utilizar como servidor de streaming en una red local o de banda ancha.
VLC Media Player es una aplicación local para reproducir archivos multimedia del disco duro o
en soporte CD/DVD. No se trata de un plugin para el navegador web. Se ha incluido en este
curso por su facilidad para visualizar todo tipo de formatos y en especial DivX, FLV y
películas en DVD.
Una vez instalado selecciona Aplicaciones > Sonido y vídeo > VLC media player y
arrastra este icono hasta el escritorio para disponer de un acceso directo.
4. Selecciona Medio > Abrir Archivo. En el cuadro de diálogo Elegir uno o más archivos
para abrir sitúate en la carpeta donde has descargado el vídeo.
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 457
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Medio > Abrir Archivo Avanzado para visualizar otros formatos de vídeo: .mov, .wmv,
… No admite el formato de RealPlayer.
Medio > Abrir disco permite reproducir una película en formato DVD o Video-CD.
Medio > Abrir Directorio para indicar una carpeta del equipo cuyos archivos serán
reproducidos de forma secuencial.
Nota:
En Windows el reproductor por defecto suele ser Windows Media Player mientras
que en Ubuntu suele ser Totem.
Vídeo y animaciones ::: Descarga de archivos de video 458
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Descarga de
archivos de vídeo
Vídeo y animaciones ::: Descarga de archivos de video 459
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En este tema se exponen distintos procedimientos para descargar archivos de vídeo que se
están visualizando dentro de una página web. De esta forma se pueden reutilizar en local o
bien en la intranet logrando una visualización más ágil sin las limitaciones del acceso a
Internet.
10. Para reproducirlo en local inicia VLC Media Player, selecciona Medio > Abrir archivo
… para navegar hasta la carpeta anterior y selecciona el archivo picasso.flv. Otra
posibilidad es utilizar el explorador de archivos y carpetas para arrastrar el icono del
vídeo sobre la ventana abierta de VLC Media Player.
Nota:
Para ver a pantalla completa o reducida haz doble clic sobre la ventana. También es
posible redimensionar la ventana pulsando y arrastrando en la esquina inferior
derecha de la ventana del reproductor.
Vídeo y animaciones ::: Descarga de archivos de video 463
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
A continuación se citan algunos de los servicios de vídeos más conocidos, el formato de vídeo
utilizado y el procedimiento sugerido para la descarga de activos:
1. YouTube
http://www.youtube.com
FLV
Firefox
2. Mediateca de EducaMadrid.
http://mediateca.educa.madrid.org/
FLV
Firefox
3. TeacherTube
http://www.teachertube.com/
FLV
Descarga directa a partir de la ruta ofrecida en la etiqueta para Wordpress.
4. Google Vídeo
http://video.google.es/
FLV y MP4
Firefox para FLV y Descarga directa para MP4-Ipod
5. Revver
http://revver.com/
MOV
Firefox
6. Metacafe
http://www.metacafe.com/
FLV
Firefox
7. MySpace
http://myspace.com/
FLV
Firefox
8. Dailymotion
http://www.dailymotion.com/
FLV
Firefox
9. Guba
http://www.guba.com/
FLV
Firefox
Vídeo y animaciones ::: Descarga de archivos de video 464
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Sharkle.com
http://www.sharkle.com/
FLV
Firefox
11. Lulu TV
http://www.lulu.tv
FLV
Firefox
12. Hiphopdeal
http://www.hiphopdeal.com/
FLV
Descarga directa
13. Vsocial
http://vsocial.com/
FLV
Firefox
14. Current TV
http://www.current.tv/
FLV
Firefox
15. Mobuzz TV
http://dosisdiaria.mobuzz.tv/
WMV-MOV-FLV-MP4 Ipod
Descarga directa
4. Captura de vídeo
Vídeo ::: Captura de vídeo 466
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En este apartado se explica el procedimiento para capturar vídeo de una cámara digital DV
utilizando Windows Movie Maker en equipos Windows o bien Kino en equipos Ubuntu.
1. Desde el escritorio de Windows elige: Inicio > Panel de Control > Sistema.
2. En la solapa General deberá aparecer la etiqueta: “Service Pack 2”.
3. Si este texto no aparece aquí deberás visitar la web de Microsoft para descargar el
SP2 e instalarlo a continuación: http://www.microsoft.com/spain/windowsxp/sp2/ .
1. Desde el escritorio de Windows, haz clic en Inicio, luego en Todos los programas.
2. Mantén pulsada la tecla Ctrl y sin soltarla pulsa y arrastra hasta el escritorio de
Windows el elemento Windows Movie Maker.
3. En el escritorio se ha creado el acceso directo a este programa. Para acceder a él en
sucesivas ocasiones haz doble clic sobre el icono que has creado.
Vídeo ::: Captura de vídeo 467
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
Para guardar el video con la máxima calidad posible debes elegir la opción Formato de
dispositivo digital (AVI DV). El archivo generado tendrá una calidad máxima aunque cada
minuto guardado ocupará entre 190 y 210 Mb. Este formato es más idóneo para guardarlo
en un dispositivo de cinta o para tomarlo como partida para luego obtener otros formatos
más ligeros e idóneos para la web.
Para probar otras calidades de captura, selecciona Otras opciones y en la lista
desplegable elige otras configuraciones.
8. En la ventana Capturar vídeo se muestra una Vista previa. Utiliza los controles de
reproducción situados debajo: Reproducir, Pausa, Stop, Ir al principio, Retroceso
rápido, Avance rápido e Ir al Final. Con ellos podrás situarte al inicio del fragmento
de video que deseas grabar.
Vídeo ::: Captura de vídeo 470
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Una vez situado en el inicio deseado, en la consola Controles de cámara DV, haz clic
en el botón Reproducir. Verás su contenido en la ventana Vista previa.
10. Asegúrate de que la casilla Crear clips cuando finalice el asistente está activado. Si
deseas detener la captura automáticamente después de transcurridos XX minutos
entonces debes activar la opción Capturar límite de tiempo (hh:mm) e introduce
este valor. Por ejemplo: 00:01, para capturar sólo un minuto. Si eliges Silenciar
altavoces no se reproducirá el audio por los altavoces durante la captura pero sí se
incluirá en la captura.
11. A continuación pulsa en el botón Iniciar captura. Observa que durante el proceso de
captura se muestra el tiempo de Video capturado y el Tamaño del archivo de vídeo
que se va formando.
12. Si no has elegido captura con límite de tiempo, para detener la captura elige Detener
captura.
13. Para terminar clic en el botón Finish (Terminar).
14. Tras unos segundos de espera se muestra el clip o clips de video que componen la
captura. Están situados dentro de una colección con el mismo nombre que el
proporcionado inicialmente. En este caso MiVideo001.
Vídeo ::: Captura de vídeo 471
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
15. El contenido de esta nueva colección se guardar en un único archivo *.AVI ó *.WMV
situado en la carpeta Mis Vídeos dentro de la carpeta Mis documentos.
16. Si deseas eliminar una colección, pulsa en el botón Colecciones de la barra de
herramientas; en el panel izquierdo selecciona la colección elegida y pulsa la tecla
Supr. También debes utilizar el Explorador de archivos de Windows para situarte en
la carpeta Mis documentos > Mís vídeos , elegir el archivo del mismo nombre que
contiene los recursos de video de esta colección y pulsar la tecla Supr.
21. Coloca sobre la línea de tiempo los clips de video uno detrás de otro para
confeccionar la película.
24. En la cuadro Configuración de película, haz clic en Mostrar más opciones para
visualizar las distintos configuraciones de publicación. Activa Otras opciones y en la
lista desplegable elige Vídeo para banda ancha (340 Kbps). Observa que en la
esquina inferior izquierda de este cuadro se muestran los Detalles de la
configuración elegida en cada caso: Tipo de archivo, velocidad de bits, tamaño de la
pantalla, relación de aspecto y fotogramas por segundo. Clic en Siguiente.
Vídeo ::: Captura de vídeo 473
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
25. Cuando se haya completado con éxito la publicación se mostrará un nuevo cuadro.
Marca la casilla Reproducir película al pulsar Finalizar para que ésta se muestre en
el reproductor de Windows Media inmediatamente después de haber pulsado el botón
Finalizar.
26. Recuerda que el archivo de video se ha guardado con el nombre que has definido
dentro de la carpeta Mis documentos > Mis vídeos.
Vídeo ::: Captura de vídeo 474
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Kino es un editor de vídeo digital para Linux que permite capturar vídeo de una cámara DV,
recortar los clips creados, añadir algunos efectos y exportar a un formato de vídeo: MPEG-1,
MPEG-2, VCD, SVCD o DVD. En Ubuntu también se podría utilizar para la captura el editor de
vídeo Pitivi.
4. Al cabo de unos instantes comenzará la reproducción del vídeo a través de VLC media
player.
Vídeo y animaciones ::: Edición de video 479
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Edición de vídeo
Vídeo y animaciones ::: Edición de video 480
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5.1 Introducción
En Windows para la edición de vídeo se puede utilizar por su simplicidad el programa que ya
viene integrado en el sistema: Windows Movie Maker. En Ubuntu un programa de
prestaciones similares podría ser Pitivi que ya viene instalado a partir de la versión Ubuntu 10.
La edición de video utilizando los programas referenciados excede la extensión y propósito de
este curso.
Por ese motivo se propone la utilización de un sencillo programa para crear un vídeo con una
secuencia de fotografías. En Windows se plantea utilizar PhotoStory 3 y en Ubuntu
Imagination.
8. Photo Story creará una película en formato 4:3. Si las fotos importadas, por sus
dimensiones originales, NO se ajustan a esta proporcionalidad se añadirán por
defecto bordes negros. Estos bordes se mostrarán en el monitor de visualización al
elegir una miniatura en la lista.
9. Para eliminar estos bordes y ajustarlas a la proporción 4:3 de publicación final, haz
clic sobre la primera miniatura de imagen de la lista. A continuación pulsa en el
botón Quitar bordes negros.
10. En el cuadro Quitando bordes negros, Photo Story propone una opción de recorte
de la primera imagen. En la ventana Antes puedes pulsar y arrastrar el área de
visualización para definir manualmente el recorte. En la ventana Después se
mostrará el aspecto que tendría la imagen tras aplicar el recorte definido. Clic en el
botón Sí para confirmar la operación. Observa que el borde negro ha desaparecido.
Vídeo y animaciones ::: Edición de video 483
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
Para abandonar el asistente de recorte pulsa en el botón Cancelar. Para no aplicar
recorte a la imagen pulsa en el botón No. En este caso se propone quitar los bordes
negros a todas las fotografías.
11. Sólo si es necesario Photo Story propone la eliminación de bordes oscuros mediante
recorte fotografía a fotografía. En cada caso haz clic sobre el botón Sí o bien pulsa
en el botón Sí a todo para que realice esta operación en todas las fotos en un solo
paso. Tras concluir la revisión de toda la lista se muestra un mensaje de
confirmación. Pulsa en Aceptar.
12. Tras este proceso la lista de miniaturas mostrará un icono de edición debajo de cada
imagen sobre la que se haya aplicado el recorte necesario para quitar los bordes
negros. Este icono indica que la imagen ha sido modificada respecto al original.
13. Si fuese necesario quitar el recorte o bien definir un encuadre distinto, haz clic
derecho sobre la miniatura correspondiente y elige Edición > Recortar. En el panel
que se muestra con esa imagen, pestaña Girar y recortar, desactiva la opción
Recortar para eliminar el recorte o pulsa directamente en el botón Restablecer para
Vídeo y animaciones ::: Edición de video 484
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
14. Para moverse por la lista de miniaturas utiliza los botones de flechas
Retroceder/Avanzar situados a la derecha de esta lista o bien en las respectivas
esquinas inferiores del monitor. Haz clic sobre una imagen de la lista para
seleccionarla y visualizarla en el monitor. Para eliminar una imagen de la lista,
selecciónala previamente y pulsa en el botón Eliminar ubicado en esta botonera
derecha.
15. Para modificar el orden en que se mostrarán las imágenes, pulsa sobre una imagen y
arrástrala sobre la lista para situarla por adelante o detrás en la lista.
Vídeo y animaciones ::: Edición de video 485
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
16. Haz clic sobre la primera imagen de la lista para seleccionarla. Ésta se visualizará en
el monitor.
17. Pulsa en Edición … situado en la botonera inferior del Monitor.
18. Selecciona la pestaña Agregar efecto. En la lista Efecto: elige, por ejemplo,
Resplandor difuso. No te resistas a probar el resto del catálogo. En la Vista Previa
que acompaña podrás observar el aspecto tras aplicar cada uno de estos efetos.
19. Para confirmar la aplicación del efecto elegido pulsa en el botón Guardar.
20. Utiliza los botones de flechas Retroceder/Avanzar que aparecen en este panel para
situarse en la siguiente fotografía de la lista sin necesidad de cerrar esta ventana.
21. Repite la secuencia de pasos 19-22 para eliminar el efecto aplicado sobre una imagen
seleccionando en la lista de efectos : (ninguno) y luego pulsa en Guardar. Recuerda
Vídeo y animaciones ::: Edición de video 486
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
22. Una vez terminada la edición de imágenes conviene guardar el proyecto. Para ello
pulsa en el botón Guardar proyecto … situado debajo de la lista de imágenes.
23. En el cuadro Guardar como introduce un nombre de archivo. Por ejemplo: fotos.
Photo Story añade automáticamente la extensión de archivo *.WP3. Este archivo se
guardará por defecto en la carpeta Mis documentos > Mis vídeos.
24. Clic en Guardar para terminar. Repite los pasos 25-27 cada vez que desees guardar
los cambios. De esta forma podrás abrirlo en otro momento y continuar en el punto
donde lo dejaste.
25. Una vez importadas y organizadas las imágenes podemos continuar con la edición de
nuestra narración. Para ello pulsa en el botón Siguiente > . Para retroceder a la
anterior fase pulsa en < Atrás.
1. En la fase Agregar títulos a las imágenes se podrán añadir textos explicativos a las
imágenes si se estima oportuno. Sobre la lista de miniaturas haz clic en la primera
imagen para seleccionarla.
Vídeo y animaciones ::: Edición de video 487
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Para modificar las propiedades de la fuente de letra, haz clic en el botón Seleccionar
fuente.
7. Durante esta fase otra posibilidad es editar el efecto de imagen aplicado. Para ello
basta con desplegar la lista de efectos situada en la base del monitor y elegir uno de
ellos o bien la entrada (ninguno).
Vídeo y animaciones ::: Edición de video 488
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
En lugar de añadir un título general para la película en la primera imagen (“Paisajes
asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la
información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre
cada una de las miniaturas de la lista y repetir la secuencia de pasos 2-6 de este apartado.
No se ha propuesto agregar un título a cada imagen porque Photo Story no implementa
por defecto movimiento a una imagen cuando se le incorpora un título. No obstante
puedes probar a hacerlo y la película resultante mostrará una diapositiva detrás de otra
sin animación de zoom en cada imagen.
Nº Texto
1 Cubos de la memoria (LLanes)
2 Elogio al horizonte (Gijón)
3 Faro (Cudillero)
4 Hórreo asturiano (Pueblo de Asturias-Gijón)
5 Iglesia Santiago Apostol (Castropol)
6 Molino de río (Villaviciosa)
7 Santa María del Naranco (Oviedo)
8 Acantilados (Cabo Peñas)
8. Para pasar a la siguiente fase pulsa en el botón Siguiente > situado en la parte
inferior de la ventana.
Vídeo y animaciones ::: Edición de video 489
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Prueba de micrófono. Lee el párrafo que se sugiere en voz alta frente al micrófono.
De este modo se ajustará automáticamente el volumen del micrófono. Clic en
Siguiente >.
4. Prueba del altavoz. Lee sobre el micrófono el texto que se sugiere y escúchalo por el
altavoz gracias al pequeño retardo con que se reproduce. Si se produjese algún acople
o zumbido baja el deslizador de volumen de la columna Reproducción.
7. Habla en voz alta frente al micrófono: “Paisajes asturianos”. Para terminar pulsa en
el botón Detener grabación.
9. Para visualizar cómo queda pulsa en el botón Vista previa… situado debajo de la
botonera de grabación.
10. Cuando se añade una narración a una imagen, en la lista de miniaturas, mostrará un
icono en forma de globo de texto en su esquina inferior izquierda.
Notas:
Nº Texto
1 Cubos de la memoria (LLanes)
2 Elogio al horizonte (Gijón)
3 Faro (Cudillero)
4 Hórreo asturiano (Pueblo de Asturias-Gijón)
5 Iglesia Santiago Apostol (Castropol)
6 Molino de río (Villaviciosa)
7 Santa María del Naranco (Oviedo)
8 Acantilados (Cabo Peñas)
Para eliminar el audio grabado haz clic en el botón Eliminar narración y confirma el
borrado
6. En la Posición inicial coloca el puntero del ratón sobre el centro del encuadre y
cuando el puntero tome el aspecto de una cruz de doble flecha, pulsa y arrastra para
colocar el encuadre en otra posición sobre la fotografía. En este caso trata de centrar
el encuadre respecto al monumento.
Vídeo y animaciones ::: Edición de video 495
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
7. Si marcas la opción Establecer que la posición inicial coincida con la posición final
de la imagen anterior entonces el tamaño y posición del encuadre coincidirá con el
utilizado en la posición final de la imagen anterior. En este caso no es necesario.
8. Si marcas la opción Establecer que la posición final sea la misma que la posición
inicial entonces el tamaño y posición del encuadre será el mismo tanto en la posición
inicial como final. Si lo dejas así esta imagen no tendrá animación durante su
visualización. En este caso tampoco es necesario.
9. Para aumentar o disminuir de tamaño del encuadre, tanto en la posición inicial como
final, pulsa y arrastra con el ratón sobre un selector de recorte situado en una
esquina.
10. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón
Vista previa …
11. Si eliges la opción Establecer la duración automáticamente, Photo Story ajustará la
duración del movimiento en función del tamaño del encuadre tanto en la posición
inicial como la posición final. Este valor oscilará entre 5 y 8 segundos. Sin embargo si
deseas definir la duración manualmente, selecciona la opción Número de segundos
para mostrar la imagen y en el contador numérico define la duración en segundos.
Vídeo y animaciones ::: Edición de video 496
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
12. Para recuperar el encuadre definido por defecto por Photo Story pulsa en el botón
Restablecer.
13. Para guardar los cambios pulsa en el botón Guardar.
14. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta
ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente. Utiliza
distintos tipos de transiciones. Observa que si al modificar una transición, tratas de ir
a la siguiente imagen, Photo Story te pedirá confirmación para guardar los cambios
introducidos.
15. Desde la ventana Personalizar movimiento haz clic sobre la pestaña Transición.
16. Photo Story define por defecto una transición Fundido en el paso de una imagen a
otra. En la parte superior del panel Transición observa que la casilla Iniciar imagen
actual usando una transición está activada. Si la desactivas el paso de una imagen a
otra se realizará sin transiciones. Debajo podrás observar una vista previa de la
Imagen anterior y de la Imagen actual. En el centro se puede visualizar
dinámicamente el efecto de Transición elegido en la evolución desde la imagen
anterior a la imagen actualmente seleccionada.
17. Para modificar el modo de transición pulsa sobre otra en la lista de Transiciones. Por
ejemplo: Estrella, hacia fuera. Observa que la transición elegida en cada caso
muestra un recuadro gris más ancho que el resto.
Vídeo y animaciones ::: Edición de video 497
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
18. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón
Vista previa …
19. Si eliges la opción Establecer duración de la transición automáticamente, Photo
Story ajustará la duración de la misma. Sin embargo si deseas definir la duración
manualmente, selecciona la opción Número de segundos para mostrar la transición
y en el contador numérico define la duración en segundos.
20. Para recuperar la transición definida por defecto por Photo Story pulsa en el botón
Restablecer.
21. Para guardar los cambios pulsa en el botón Guardar.
22. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta
ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente.
Utilízalos para definir distintas transiciones sobre cada imagen.
23. Una vez terminada la edición de transiciones, observa que en la lista de miniaturas se
marcan con un icono de dos rectángulos entrelazados aquellas imágenes que tienen
una transición distinta al Fundido.
24. Haz clic en el botón Siguiente para pasar a la siguiente fase de creación de la
película.
Vídeo y animaciones ::: Edición de video 498
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. En la lista de miniaturas haz clic sobre la primera imagen para añadir música de fondo
a partir de ésta.
Notas:
Se pueden incluir distintas músicas en una misma película. Para ello selecciona
otra imagen en la lista de miniaturas y repite la secuencia de pasos 3-4. A partir
de esta nueva imagen hasta el final se añadirá la nueva música.
Para ver cómo queda el resultado final pulsa en el botón Vista previa … Observa
cómo Photo Story ajusta la melodía a la duración de la película asegurando un
final rítmico o en desvanecimiento de volumen adecuados.
Para eliminar una música de fondo, haz clic sobre la imagen donde comienza y
pulsa en el botón Eliminar música … que aparece en este panel.
Vídeo y animaciones ::: Edición de video 500
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Notas:
Si has seguido los pasos indicados la película se encontrará en la carpeta Mis
documentos > Mis vídeos con el nombre fotos.wmv.
Desde la pantalla de Finalización puedes pulsar en < Atrás para regresar a la pantalla
anterior Guardar la narración. Desde ellas puedes generar otros archivos WMV con
distintas calidades (cada una con un nombre distinto) siguiendo la secuencia de pasos
1-6 indicada en este apartado.
Vídeo y animaciones ::: Edición de video 503
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Para instalar este programa desde el escritorio de Ubuntu selecciona Aplicaciones > Centro
de software de Ubuntu. En el buscador introduce el término imagination y en el ítem de
instalación correspondiente pulsa en el botón Instalar.
6. Para moverse por la lista de imágenes utiliza los botones de flechas Ir al primero |
Anterior | Siguiente | Ir al último situados en la barra de herramientas superior.
Haz clic sobre una imagen de la lista para seleccionarla y visualizarla en el monitor.
7. Para eliminar una imagen de la lista, selecciónala previamente en el listado inferior y
pulsa la tecla Supr o bien elige Diapositiva > Eliminar.
10. Conviene guardar el proyecto. Para ello selecciona Presentación > Guardar
proyecto como …
11. En el cuadro de diálogo Guardar un proyecto de presentación … introduce el
nombre de la presentación. Por ejemplo: miPresentacion y haz clic en el botón
Guardar. Se genera un archivo que contiene toda la información necesaria para
generar la presentación de imágenes. Conviene repetir estos pasos cuando se deseen
guardar los cambios realizados.
12. Para agregar un texto a una imagen, selecciona previamente la imagen en el listado
para que se visualice en el visor. A continuación sobre el panel Texto de las
diapositivas introduce el texto “Paisajes asturianos”.
13. Pulsa en el botón que especifica el Tipo y tamaño de la fuente. Elige como tipo de
fuente Sans Bold y como tamaño 36 píxeles.
14. Haz clic en el botón Posición del subtítulo para elegir la alineación horizontal y
vertical de entre las nueve posiciones diferentes. Ejemplo: inferior-centrado.
15. Se puede definir un tipo de Animación para el texto y una Velocidad de la
animación. En este caso no elegiremos ninguna.
Nota:
En lugar de añadir un título general para la película en la primera imagen (“Paisajes
asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la
información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre
cada una de las miniaturas de la lista y repetir la secuencia de pasos de este apartado.
No se propone agregar un título a cada imagen. No obstante puedes probar a hacerlo y la
película resultante mostrará una diapositiva detrás de otra donde cada una exhibirá el
texto explicativo correspondiente.
Vídeo y animaciones ::: Edición de video 506
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nº Texto
1 Cubos de la memoria (LLanes)
2 Elogio al horizonte (Gijón)
3 Faro (Cudillero)
4 Hórreo asturiano (Pueblo de Asturias-Gijón)
5 Iglesia Santiago Apostol (Castropol)
6 Molino de río (Villaviciosa)
7 Santa María del Naranco (Oviedo)
8 Acantilados (Cabo Peñas)
17. Para cada imagen se puede definir una animación que consiste en un movimiento de
zoom. Selecciona la segunda fotografía del listado en esta presentación y en el panel
Movimiento de las diapositivas arrastra el deslizador del Zoom para definir un zoom
de 1.5 y pulsa en el botón Añadir y a continuación en el botón Actualizar. Esta
acción añade una diapositiva nueva a continuación de la diapositiva original donde la
imagen se muestra aumentada en el zoom indicado.
18. Al generar la presentación de diapositivas, el programa Imagination generará
automáticamente el movimiento de transición de una diapositiva a otra. A cada
imagen se le pueden añadir tantas diapositivas como se desee con distintos valores
de magnificación. La navegación sobre cada diapositiva asociada a cada imagen se
realiza utilizando los botones de flechas que aparecen en el apartado Detener punto.
19. En cada estado de zoom de una imagen se puede definir su tiempo de duración en el
combo Duración.
Vídeo y animaciones ::: Edición de video 507
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
26. Se pueden añadir distintos archivos de audio para crear la banda sonora de fondo.
Con los botones situados en la parte inferior de este listado de audios se puede
modificar el orden de reproducción de esos audios y también eliminar los audios
seleccionados.
Vídeo y animaciones ::: Edición de video 508
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
30. Al cabo de unos instantes se habrá generado el archivo de vídeo FLV que contiene la
secuencia de diapositivas. El archivo FLV se puede reproducir utilizando el programa
VLC Media Player.
Vídeo y animaciones ::: Conversión de formatos de vídeo 509
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
6. Conversión de
formatos de vídeo
Vídeo y animaciones ::: Conversión de formatos de vídeo 510
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Metadatos generales del archivo: título, autor, director, album, número de pista,
fecha, duración, etc
Vídeo: códec, bitrate, fotogramas por segundo, aspecto, etc.
Audio: codec, velocidad de muestreo, canales, idioma, bitrate, etc.
Texto: idioma de subtítulos.
Capítulos: número y lista de capítulos.
Video: MKV, OGM, AVI, DivX, WMV, QuickTime, Real, MPEG-1, MPEG-2, MPEG-4, DVD
(VOB)...
Audio: OGG, MP3, WAV, RA, AC3, DTS, AAC, M4A, AU, AIFF...
Subtítulos: SRT, SSA, ASS, SAMI...
4. Para acceder al programa elige Aplicaciones > Sonido y vídeo > MediaInfo
7. El DVD como
fuente de vídeo
Vídeo y animaciones ::: El DVD como fuente de vídeo 516
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota importante:
El software e instrucciones recogidas en este capítulo se proponen como método para realizar
copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no
comercial. En cualquier caso esta información NO se expone para ser usada como herramienta
para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del
archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y
propiedad intelectual legalmente establecidos.
En la actualidad existen algunos programas que realizan esta tarea. Por su facilidad y
compatibilidad se propone DVD Decrypter. Se puede descargar de forma gratuita del sitio
Free-Codecs.com (http://www.free-codecs.com/)
Notas:
Unidad lectora de DVD no detectada. A veces el DVD Decrypter no detecta la unidad
de DVD y en consecuencia no está disponible en la lista Source. Esto suele deberse a
que no están instalados los drivers ASPI correspondientes a esa unidad DVD. ASPI
significa Advanced SCSI Programming Interface y es el software que gestiona la
comunicación entre el ordenador y el dispositivo lector. Para resolver este problema
basta con descargar los drivers ASPI de Windows, descomprimir el ZIP y ejecutar el
programa aspiinst.exe que contiene. Estos drivers se pueden descargar desde la web
oficial de Adaptec (http://www.adaptec.com). La denominación exacta de este
software es: Windows ASPI drivers version v4.71.2 y se pueden aplicar a todos los
sistemas Windows a partir de la versión 98.
Disco DVD bloqueado. En alguna ocasión será necesario, antes de ejecutar DVD
Decrypter, introducir el disco en el lector y a continuación abrir el reproductor de
que dispongamos para visualizar DVDs (por ejemplo WindDVD o PowerDVD). De esta
forma conseguiremos liberar las claves de los archivos protegidos. Cerramos el
reproductor y abrimos DVD Decrypter.
4. DVD Decrypter tiene dos modos de trabajo: modo File (Archivo) donde trabaja con los
archivos del DVD y modo IFO donde trabaja con los contenidos del DVD (capítulos,
pistas, extras, etc). En este caso es necesario trabajar en modo IFO para lo cual en la
barra de menú de DVD Decrypter selecciona Mode > IFO
Vídeo y animaciones ::: El DVD como fuente de vídeo 518
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
crearán dos archivos: IFO y VOB (son subtítulos en modo imagen que luego se puede
pasar a texto con la aplicación SubRip). En un principio se recomienda dejar
activadas todas las pistas.
3. En la sección Step 1: Select input source and output file (Paso 1: Elegir fuente de
entrada y archivo de salida) En “Input directory” localiza el archivo *.VOB que has
capturado del DVD anteriormente.
1. En la sección Step 2: Select audio track and subtitle track. (Paso 2: Elegir pista de
audio y pista de subtítulos), podrás seleccionar el audio/audios y también los
subtítulos.
2. En la lista Audio track(s) (Pistas de Audio), selecciona la pista o pistas de audio que
deseas exportar al archivo de vídeo final. Pueden existir varias procedentes del DVD.
Las pistas disponibles en esta lista dependerán de las ofrecidas por el DVD original y
del tipo de importación realizada con DVD Decrypter. Si no deseas incorporar no
marques ninguna pista.
3. En la lista Subtitle track(s) (Pista de Subtítulos) elige No Subtitles (Ningún Subtítulo).
En este cuadro podrías elegir una de las pistas de subtítulos disponibles.
1. En la sección Step 3: Select output size (Paso 3: Elegir tamaño de salida), podemos
seleccionar el tamaño final que ocupará el archivo. Cuanto mayor sea, mejor será la
calidad del archivo final.
fragmentado éste en trozos de peso igual o inferior a 700 Mb. Esto facilitará la copia
en soporte CD.
4. Si seleccionas la opción Target Quality (in percentage) (Calidad Destino (en
porcentaje)), podrás seleccionar el % de calidad que tendrá el archivo final con
independencia del peso del archivo.
Códec. Se puede usar cualquiera de los dos: DivX y XviD. Es necesario que el códec
elegido esté instalado en el equipo. Recuerda que al instalar Auto Gordian Knot el
códec de XviD ya se instala directamente porque viene incluído en el paquete
mientras que DivX (versión Create) es necesario descargarlo e instalarlo aparte.
Subtitle Options (Opciones de SubTítulos). Este apartado sólo es necesario
configurarlo si hemos incluído subtítulos en la película final. Si marcas la opción
Display only forced subtitles (Mostrar solamente subtítulos forzados) sólo se
mostrarán los subtítulos forzados, es decir, aquellos que se muestran siempre en la
película aunque no tengamos activados los subtítulos. Ejemplo: Traducción al español
o inglés del discurso de un personaje que habla en un tercer idioma y cuyo contenido
se considera importante para el desarrollo de la acción. En el paso 2 tendríamos que
haber selccionado la pista de subtítulos en el idioma adecuado. La opción Use
external subtitles se refiere a la posibilidad de cargar los subtítulos de un archivo
externo pero no funciona bien en todos los reproductores por lo que conviene no
activarlo.
3. Si pulsas en el botón Preview (Vista previa), tras cierta espera, podrás ver una vista
previa del aspecto final del vídeo pero sin el audio.
2. En la Cola de Tareas (Job queue) aparecerá una nueva entrada con información del
nombre del archivo AVI final, su carpeta de ubicación y una casilla de verificación
activada.
3. Una vez introducida esta tarea en la Cola de Tareas podemos cerrar AutoGK y
continuar en otro momento con la conversión definida. Otra posibilidad es abrir otro
DVD para añadir una segunda tarea de conversión a la lista. En cualquier caso la
codificación no comenzará hasta que no se lo indiquemos.
4. Para comenzar con la creación de la película AVI final pulsa en el botón Start (Inicio).
5. AutoGK irá abriendo y cerrando programas según lo vaya necesitando para realizar las
distintas partes del proceso: creación del proyecto con DGIndex, test de
compresibilidad, compresión con VirtualDubMod, audio con BeSweet, etc. En la
Vídeo y animaciones ::: El DVD como fuente de vídeo 524
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
ventana de eventos (Log Window) irán apareciendo los mensajes de lo que se está
haciendo. En los primeros pasos habrá que fijarse en la barra de tareas porque al
desplegar alguna de estas aplicaciones será necesario aceptar las condiciones de la
licencia de uso para que el proceso pueda continuar.
Nota:
Nota importante:
El software e instrucciones recogidas en este capítulo se proponen como método para realizar
copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no
comercial. En cualquier caso esta información NO se expone para ser usada como herramienta
para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del
archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y
propiedad intelectual legalmente establecidos.
Es un programa que permite ripear un DVD de vídeo, es decir, obtener un archivo o archivos
de vídeo en el disco duro a partir de los contenidos de este soporte.
mplayer
dvd::rip utiliza por defecto el programa mplayer para reproducir los fragmentos de DVD y
archivos generados. Para instalarlo sigue una rutina similar a la anterior: Aplicaciones >
Centro de software de Ubuntu.
La mayoría de los DVDs comerciales están encriptados. Para poder leerlos sin problemas
desde dvd::rip, mplayer o incluso VLC Media Player es necesario instalar una librería
adicional. Para ello sigue estos pasos:
sudo /usr/share/doc/libdvdread3/install-css.sh
Vídeo y animaciones ::: El DVD como fuente de vídeo 526
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
8. Clic en la pestaña Extraer Tìtulo. Pulsa el botón Leer tabla de contenidos del DVD
para leer las pistas del DVD que se mostrarán en el listado inferior.
Vídeo y animaciones ::: El DVD como fuente de vídeo 528
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Para visualizar una pista márcala en el listado y a continuación pulsa en el botón Ver
título(s)/capítulo(s) seleccionados.
10. Para comenzar la extracción de la pista al disco duro del equipo, selecciona la pista
que deseas y luego pulsa en el botón Extraer título(s)/capítulo(s) seleccionados.
11. Si deseas tener información de la evolución de la extracción pulsa en la pestaña
Registro.
12. En la pestaña Codificar comprueba los siguientes parámetros que normalmente suelen
venir definidos por defecto:
Opciones de contenedor > Selecciona contenedor: AVI
Opciones de vídeo > Códec de vídeo: xvid
Opciones de vídeo > Tasa de vídeo: 25.000
Opciones de vídeo > Hacer dos pasadas: Sí
Cálculo de tasa de bits de vídeo > 2x700
Opciones del audio > Seleccionar pista: elegir la pista de audio del idioma
adecuado si hubiera varias.
Opciones de audio > MP3: Tasa de bits de 128 kbit/s y 48000 Hz.
8. Insertar un vídeo
en el blog
Vídeo ::: Insertar un vídeo en Blogger 530
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Se mostrará el cuadro de diálogo Añade un vídeo en tu entrada de blog para subir el
vídeo desde nuestro equipo. Clic en el botón Examinar para localizar y señalar el
archivo turismoRural.mov que hemos obtenido en un paso anterior.
Vídeo ::: Insertar un vídeo en Blogger 532
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11. Como se indica en este cuadro de diálogo se pueden subir vídeos en formatos AVI,
MPEG, MOV (QuickTime), RM (Real) y WMV (Windows Media). El tamaño máximo del
archivo de vídeo subido será de 100 MB.
12. Teclea el Título del vídeo y marca la casilla de verificación de condiciones.
13. En la parte inferior activa la casilla de aceptación de condiciones y pulsa en el botón
SUBIR VÍDEO.
14. Durante los segundos invertidos en la subida del archivo de vídeo al servidor se
mostrará dentro del editor un reproductor multimedia con información al respecto:
Uploading vídeo … (Subiendo vídeo). Your video will appear here when finished (Tu
video aparecerá aquí cuando haya terminado).
15. Si el proceso de subida se realiza con éxito se mostrará el reproductor con un botón
PLAY en el centro.
Vídeo ::: Insertar un vídeo en Blogger 533
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
17. A continuación haz clic en el enlace Ver blog para ver el resultado final. Al pulsar en
el botón Play se reproducirá el vídeo subido.
Nota:
Este sistema de publicación de vídeos en Blogger nos ofrece por ahora poco control
sobre la edición y eliminación de los vídeos subidos. Es uno de los temas pendientes
de mejorar en Blogger.
Vídeo ::: Insertar un vídeo en Blogger 534
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
8.1.3.1 Introducción
9. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir
archivo para pulsar en el botón Examinar y localizar el archivo de imagen
captura.jpg. Clic en el botón Subir.
10. Repite el paso anterior para subir el archivo del reproductor flvplayer.swf y el
archivo de vídeo video.flv. El vídeo tardará un poco en subir porque tiene cierto peso.
11. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a
ella.
En la variable file se indica la referencia a la ubicación del archivo de vídeo flv que se
reproduce. Puedes modificar este valor para reproducir un vídeo con otro nombre
distinto. En las variables height y width se indican la altura y anchura en píxeles con
que se visualizará el reproductor. El vídeo tiene unas dimensiones originales de
384x288 píxeles. Puede comprobarlo utilizando MediaInfo tal y como se explicaba en
un apartado anterior. La botonera ocupa 20 píxeles de altura. Sumados a los 288 del
vídeo hacen un total de 308 píxeles para el total del reproductor.
<embed src="http://sites.google.com/site/fernandoposada/video/flvplayer.swf"
width="384" height="308" allowfullscreen="true"
flashvars="file=http://sites.google.com/site/fernandoposada/video/video.flv&image=
http://sites.google.com/site/fernandoposada/video/captura.jpg&width=384&height=
308">
</embed>
10. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo ::: Insertar un vídeo en Wordpress 540
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Sin embargo en una entrada de un blog de Wordpress se pueden insertar de forma gratuita
vídeos alojados en servicios externos. En este capítulo vamos a tratar algunos de ellos.
8.2.2 Blip.tv
1. Visita la web de Blip.tv (http://blip.tv/)
2. Utiliza el buscador para localizar el vídeo que te interesa. Otra opción es crear una
cuenta y subir tu propio vídeo. Sitúate en el vídeo para su visualización.
3. En la columna lateral derecha que acompaña al vídeo se ofrece una barra en color
naranja. Haz clic en el combo Share y selecciona la opción Embed. A continuación
haz clic en el combo Show Player y selecciona la opción Wordpress.com. Clic en el
botón Go.
Vídeo ::: Insertar un vídeo en Wordpress 542
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Selecciona el código que se ofrece debajo, haz clic derecho y elige Copiar.
8.2.3 DailyMotion
1. Visita la web de DailyMotion (http://www.dailymotion.com/es)
2. Busca el vídeo que deseas insertar en un articulo de tu blog Wordpress. Fíjate en la
URL o dirección de esa página del tipo:
http://www.dailymotion.com/video/xcfw1n_el-viento-de-marte-medido-gracias-a_tech
[dailymotion id=xcfw1n]
[flickr video=http://www.flickr.com/photos/chaddles/2402990826]
o bien
[flickr video=2402990826]
8.2.4.2 LiveVideo
1. Localiza un vídeo en LiveVideo (http://www.livevideo.com/)
2. Copia el identificador ID del vídeo que figura en su URL.
Ejemplo:
http://www.livevideo.com/video/F25406F905A64843B19E7CDC3CFD04A4/cool-mac.aspx
[livevideo id=F25406F905A64843B19E7CDC3CFD04A4]
8.2.4.3 PodTech
1. Localiza un vídeo en PodTech (http://www.podtech.net/)
2. Haz clic en el botón naranja Share (Compartir).
3. Marca la casilla Embedding in Wordpress.com y haz clic en el botón Copy.
4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada.
8.2.4.4 Viddler
1. Localiza un vídeo en Viddler (http://www.viddler.com/)
2. Haz clic en el botón Embed This (Insertar Esto).
3. Marca la opción Wordpress.com, selecciona el código y haz clic derecho para
Copiar.
4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada
8.2.4.5 Videolog
1. Localiza un vídeo en Videolog (http://videolog.tv/)
2. Haz clic en el botón Wordpress.
3. Selecciona el código y haz clic derecho para Copiar.
4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada.
Vídeo ::: Insertar un vídeo en Wordpress 545
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
9. Youtube:
video en streaming
Vídeo y animaciones ::: Youtube, video en streaming 547
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Pulsa en el botón Subir vídeo. Si dispones de cámara web en el equipo otra opción es
pulsar en el botón Grabar de cámara web para crear el vídeo utilizando este
dispositivo.
5. Se abre un cuadro de diálogo donde debes seleccionar el vídeo a subir. En cuanto
pulsas el botón Aceptar comienza la subida al servidor.
6. Mientras se sube el archivo puedes completar los siguientes datos del vídeo
Título. Por ejemplo: Paisajes asturianos.
Descripción. Texto breve que describe el vídeo. Ejemplo: Algunas fotografías
sobre paisajes asturianos.
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.
Categoría. Selecciona una categoría o tema. Ejemplo: Viajes y eventos.
Privacidad. Es posible elegir entre Comparte tu vídeo con el mundo (opción
recomendada) o bien Privado.
8. Una vez finalizada la subida haz clic en el enlace Mis Vídeos. A la sección Mis Vídeos
siempre puedes ir desde el menú horizontal superior pulsando en el nombre de
usuario y seleccionando la opción Mis vídeos.
Vídeo y animaciones ::: Youtube, video en streaming 549
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
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.
9. Observa que se ha creado una entrada nueva con el vídeo. Para visualizar su
contenido haz clic en el botón Reproducir.
10. Desde este panel se puede pulsar en sus distintos botones para realizar diversas
tareas:
Reproducir. Para visualizar el vídeo tal y como lo verán el resto de usuarios
de Youtube.
Editar. Permite personalizar distintos parámetros avanzados de reproducción
del vídeo.
Anotaciones. Es una herramienta ideal para crear anotaciones sobre la línea
de tiempo del propio vídeo: bocadillos, notas, regiones destacadas,
indicaciones de pausa, etc.
Cambiar Audio. Facilita modificar la pista original de audio por otra del
listado que propone Youtube. Otra posibilidad es pulsar en el enlace Título y
Subtítulos y se puede subir un archivo de subtítulos.
Insight. Al hacer clic en este botón se mostrarán distintos datos estadísticos
sobre la visualización del vídeo.
Eliminar. Se utiliza para eliminar el vídeo de Youtube y liberar con ello el
espacio disponible para la cuenta en el servidor.
Descargar MP4. Al pulsar en este botón se descargará la película en formato
de alta calidad MP4.
Vídeo y animaciones ::: Youtube, video en streaming 550
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Comentarios
- Permitir comentarios automáticamente. Opción por defecto.
- Permitir comentarios de amigos automáticamente y demás
comentarios sólo con aprobación
- Permitir todos los comentarios únicamente con aprobación
- No permitir comentarios
Comentar votación.
- Sí, permitir a los usuarios votar sobre los comentarios. Opción
por defecto.
- No permitir las votaciones a los comentarios.
Respuestas en vídeo.
- Sí, permitir que se añadan respuestas en vídeo
automáticamente. Permitir que otros usuarios de YouTube
puedan relacionar automáticamente sus vídeos con el mío.
- Sí, permitir respuestas una vez que las haya aprobado. Es la
opción por defecto.
- No, no permitir respuestas en vídeo. No permitir relacionar
este video con otros.
Puntuaciones.
- Sí, permitir que otras personas puntúen este vídeo. Permitir
que este video pueda ser puntuado por los usuarios. Es la
opción por defecto.
- No, no permitir que se puntúe este vídeo. No permitir que
este video pueda ser votado.
Inserción.
- Sí, los sitios externos pueden insertar y reproducir este vídeo.
Es la opción por defecto.
- No, los sitios externos NO pueden insertar ni reproducir este
vídeo.
Distribución.
- Sí, hacer que este vídeo esté disponible en móviles y TV
- No, este vídeo no debería estar disponible en móviles ni en TV.
5. También puedes elegir la gama de colores del reproductor que más se ajusta a la
página donde se incrustará así como el tamaño del reproductor.
6. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción
copiará el código embed/insertar en el portapapeles.
Vídeo y animaciones ::: Youtube, video en streaming 552
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
1. Abre una nueva pestaña del navegador web y accede a la URL de inicio de Blogger:
https://www.blogger.com/start?hl=es
2. Introduce sus credenciales (usuario y contraseña) en el apartado Accede a través de
tu cuenta de Google y pulsa en el botón Acceder.
3. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio.
4. En este panel aparecerán los distintos blogs que gestionas en Blogger.
5. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición
del blog donde deseas publicar el artículo.
10. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo y animaciones ::: Youtube, video en streaming 553
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
http://www.youtube.com/watch?v=CkRS3wDg1xU
10. A partir de esta URL añade la etiqueta [youtube= … para completar, en el caso del
ejemplo que nos ocupa, lo siguiente:
[youtube=http://www.youtube.com/watch?v=CkRS3wDg1xU]
Para ocultar los vídeos relacionados que aparecen una vez finalizada la reproducción
del vídeo:
[youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&rel=0]
10. Repite los pasos anteriores para añadir dos o tres vídeos más sobre Picasso. No es
necesario utilizar de nuevo el buscador porque en la lista Videos Relacionados se
muestran algunos vídeos que están relacionados con el actual.
11. En la barra de menú horizontal superior elige Usuario > Listas de reproducción.
1. En la columna izquierda donde aparecen las listas de reproducción haz clic en el lista
de reproducción creada.
2. Clic en el botón Compartir donde se muestra la URL de la lista de reproducción o bien
el código embed.
13. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo y animaciones ::: Youtube, video en streaming 560
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
Las listas de reproducción NO se integran en un artículo de Wordpress.com ni siquiera
utilizando el servicio VodPod.com
4. También puedes elegir la gama de colores del reproductor que más se ajusta a la
página donde se incrustará así como el tamaño del reproductor. En este caso vamos a
elegir un tamaño del reproductor de 320x265 píxeles.
5. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción
copiará el código embed/insertar en el portapapeles.
6. Desde el interfaz de gestión de Blogger elige Diseño > Elementos de la página.
7. Clic en el enlace Añadir un gadget.
8. Pulsa en el botón “+” para añadir el gadget HTML/Javascript.
10. Clic derecho sobre el cuadro de Contenido y elige Pegar. Para que el reproductor no
sobrepase los límites de la barra lateral en algunas de las plantillas utilizadas quizás
sea necesario reducir las dimensiones 320x265 píxeles que aparecen en este código
por 192x159.
11. Para terminar pulsa en el botón GUARDAR.
12. Clic en el enlace Ver blog para observar el resultado final.
RTVE: http://www.youtube.com/user/rtve
Europa Press: http://www.youtube.com/user/europapress
Antena 3: http://www.youtube.com/user/antena3
La Sexta: http://www.youtube.com/user/misextatv
Cuatro: http://www.youtube.com/user/cuatro
4. En la página Configurar Barra de Vídeo introduce el Título del gadget. Por ejemplo:
Canal RTVE.
5. En esta página se pueden configurar los siguientes parámetros:
Youtube. Permite elegir las opciones de Vídeos más vistos, Vídeos mejor
valorados y Vídeos recientes. En este caso marcaremos Vídeos recientes.
Canales. Introduce aquí rtve que el identificador Youtube del canal de RTVE
fácilmente deducible de su URL: http://www.youtube.com/user/rtve
Palabras clave. Puedes introducir etiquetas para que sólo se muestren los vídeos
que tengan asociadas estas palabras. En este caso tecleamos noticias.
6. En la parte inferior se muestra una vista previa en función de las opciones elegidas.
7. Pulsa en el botón GUARDAR.
8. Clic en el enlace Ver blog para observar el resultado final.
Vídeo y animaciones ::: Youtube, video en streaming 564
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Abre una nueva pestaña en el navegador web mediante Archivo > Nueva pestaña.
Visita la web de Youtube: http://www.youtube.com y utiliza el buscador para
localizar un vídeo de Picasso.
5. Clic en el botón Insertar para mostrar el cuadro de código embed asociado a ese
vídeo.
8. En el cuadro de diálogo que se muestra haz clic derecho sobre el cuadro de texto y
elige Pegar para pegar el código embed copiado anteriormente.
Vídeo y animaciones ::: Youtube, video en streaming 565
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
11. Despliega el combo Add to Collection (Añadir a la colección) para elegir la colección
deseada. Ejemplo: Canal Picasso. Clic en el botón Save (Guardar).
12. Repite los pasos anteriores para añadir a la colección de VodPod un par de vídeos de
Youtube sobre Picasso.
13. Regresa a VodPod y haz clic en Home y luego en Your vídeos (Tus vídeos).
14. Para filtrar los vídeos de esta colección despliega el combo Collection y elige el
nombre de la misma.
Vídeo y animaciones ::: Youtube, video en streaming 566
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
15. En el listado se muestran los vídeos de esta lista. En el pie de la página de VodPod
haz clic en el enlace Widgets. Otra posibilidad es pulsar en el enlace Home > Sharing
17. En el área Advanced Setup (Configuración avanzada) selecciona como Sytle (Estilo),
por ejemplo, Social – Standard y como Source Collection (Colección Fuente) la
colección de vídeos creada con anterioridad: Canal Picasso.
18. Selecciona y haz clic derecho para Copiar el código que se proporciona.
Vídeo y animaciones ::: Youtube, video en streaming 567
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
19. Abre una pestaña nueva en el navegador web y accede al interfaz de administración
de tu blog Wordpress. Para añadir el widget a tu blog selecciona Apariencia >
Widgets.
24. Al visualizar el frontend del blog se mostrará un widget con los vídeos de la colección.
Vídeo y animaciones ::: Youtube, video en streaming 568
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Desde Youtube se pueden añadir títulos, subtítulos y anotaciones a tus propios vídeos pero no
a los vídeos subidos por otros usuarios. Con Overstream se puede subtitular cualquier video
alojado, por ejemplo, en Youtube.
Los vídeos subtitulados se pueden compartir con los demás e integrar dentro de una página
web o entrada de tu blog.
2. En otra pestaña del navegador utiliza el buscador de Youtube para localizar 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.
Ejemplo: http://www.youtube.com/watch?v=z_RAEESmsrs
5. Tras unos segundos de espera en el visor se cargará la película. Los pasos para crear
los subtítulos serían (ver imagen):
Vídeo y animaciones ::: Youtube, video en streaming 570
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10. Debajo del reproductor se muestra un cuadro de texto con el código Embed.
11. Clic derecho y selecciona Copiar para copiar este código HTML al portapapeles.
4. En el cuadro de diálogo Post to your Blog haz clic en el enlace (Click if you're having
trouble) (Clic si tienes problemas). Sobre el cuadro de texto haz clic derecho y elige
Pegar. Clic en el enlace preview (vista previa).
Vídeo y animaciones ::: Youtube, video en streaming 574
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Introduce la URL of your blog (URL de tu blog), Username (Usuario) y Password para
realizar la publicación directa sobre tu blog de Wordpress.
6. Teclea el título del nuevo artículo que contendrá el vídeo Title y el texto del mismo
en Body. Clic en el botón Publish.
7. Clic en el botón View your blog (Ver tu blog). Se mostrará un artículo de tu blog
conteniendo el video overstream. Es posible posteriormente reeditar esta entrada y
modificar su texto.
Vídeo y animaciones ::: Servicios de vídeo 575
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
10.1 Introducción
En la Web 2.0 existen multitud de espacios donde es posible almacenar vídeos para su
posterior difusión y publicación en nuestro blog. La reproducción mediante streaming que
proporcionan estos espacios facilitan su visionado a través de Internet. Actualmente el líder
en este sector es Youtube pero también existen otras alternativas interesantes: Revver,
Vimeo o Metacafe.
Revver: http://www.revver.com
Vimeo: http://www.vimeo.com
Metacafe: http://www.metacafe.com
2. Utiliza el buscador para localizar el vídeo que te interesa. Sitúate en su página para
visionarlo.
3. El siguiente paso es copiar el código embed. En cada servicio web se hace de una
forma distinta:
Revver:
Vimeo:
3.1 Clic en el botón </> Embed que aparece dentro del reproductor.
3.2 En el cuadro Embed this video (Incrusta este vídeo) haz clic derecho sobre el
código y selecciona la opción Copiar.
Metacafe:
3.1 Clic en el botón <> Incrustar. Clic derecho en la casilla Embeddable Player y
selecciona Seleccionar todo y luego Copiar.
Vídeo y animaciones ::: Servicios de vídeo 578
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
http://vimeo.com/240975
[vimeo http://vimeo.com/240975]
O bien
[vimeo 240975]
La anchura y altura por defecto del reproductor insertado es 400x300 píxeles. Sin
embargo en la etiqueta se pueden especificar otras dimensiones:
Anexo 1.
Canales de suscripción
Anexo I. Canales de suscripción 581
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Su funcionamiento se basa en un archivo XML diseñado con una sintaxis especial de etiquetas
y que está ubicado en una dirección concreta del sitio web. Se actualiza cada vez que se
publica una nueva entrada de tal forma que contiene los titulares de las últimas noticias
publicadas. Este archivo puede ser leído por los usuarios utilizando el propio navegador web
o bien un programa específico. En ambos casos, cada vez que se inicia el programa
(navegador o lector de feeds), chequea de forma automática el contenido de los canales
suscritos y muestra al lector las novedades si las hubiera.
En la actualidad los dos principales formatos XML de canales de suscripción utilizados en los
blogs son: RSS y Atom. Se diferencian en la sintaxis que utilizan para la difusión de noticias
pero su funcionamiento es similar.
Blogger
4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se
ofrece el formato Atom para la suscripción.
Wordpress
5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato
RSS para la suscripción.
Ambos
6. Se muestra una página con un resumen de los últimos artículos publicados en el blog
ordenados comenzando por el más reciente. Si deseas leer en detalle uno de estos
Anexo I. Canales de suscripción 582
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
artículos haz clic sobre el enlace de su título para acceder al artículo en el blog
original.
Blogger
14. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del
blog y también a los comentarios de un artículo concreto. Sin embargo para la
suscripción a estos canales NO se ofrece un enlace directo en la página principal o
página de un artículo siendo necesario utilizar las prestaciones de la barra de
dirección del navegador web.
Si haces clic en el título de una entrada accedes a una página donde sólo se
muestra ese artículo y dependiendo de la configuración definida quizás
Anexo I. Canales de suscripción 584
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Blogger
4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se
ofrece el formato Atom para la suscripción.
Wordpress
5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato
RSS para la suscripción.
Ambos
Blogger
9. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del
blog y también a los comentarios de un artículo concreto. Sin embargo para la
suscripción a estos canales NO se ofrece un enlace directo en la página principal o
página de un artículo siendo necesario utilizar las prestaciones de la barra de
dirección del navegador web.
Si haces clic en el título de una entrada accedes a una página donde sólo se
muestra ese artículo y dependiendo de la configuración definida quizás
también los comentarios. Internet Explorer vuelve a detectar que en esa
página se están ofreciendo de forma oculta el canal de suscripción en
formatos Atom y RSS para las entradas del blog pero también el canal de
suscripción en formato Atom para los comentarios que se realicen a esa
entrada.
10. En Internet Explorer una forma de acceder a los canales que nos hemos suscrito es
seleccionar: Ver > Barra del explorador > Fuentes. Esta acción mostrará el panel de
Fuentes disponibles. Al hacer clic en una de ellas en el panel derecho se mostrará el
listado de noticias que contiene.
Anexo I. Canales de suscripción 587
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Nota:
Con las credenciales de una cuenta de Google se puede acceder al servicio Google
Reader (http://www.google.com/reader/) que permite gestionar la suscripción y
lectura de canales de feeds utilizando el interfaz web que proporcionan. También se
pueden compartir con otros amigos.
3. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Enlaces de
suscripción.
4. Por defecto se ofrece como título de este gadget: Suscribirse a. En este caso
aceptaremos este título y pulsa en el botón GUARDAR.
5. Para ver el resultado final haz clic en el enlace Ver blog. En la columna lateral se
mostrará el nuevo gadget ofreciendo enlaces para la suscripción a entradas y a
comentarios incluyendo su incorporación en servicios Web 2.0 que integran la
suscripción a canales feed.
Anexo I. Canales de suscripción 588
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
3. Se muestra un cuadro de diálogo con la URL de ese canal. Pulsa y arrastra para
seleccionar la dirección completa. Sobre ella haz clic derecho y elige Copiar.
6. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Feed.
7. En el cuadro de diálogo Configurar feed haz clic derecho sobre el cuadro de texto
URL del feed y elige la opción Pegar.
Anexo 2. Delicious,
marcadores sociales
Anexo II. Delicious, marcadores sociales 594
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En este caso vamos a continuar con la instalación de botones porque suponemos que te
encuentras en tu equipo personal. En función del navegador web que se utilice se propondrá
la instalación de la extensión. Clic en el botón Add buttons.
Anexo II. Delicious, marcadores sociales 595
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En cualquiera de los casos si seguimos el asistente de 3 pasos propuesto por Delicious, tras
finalizar el paso 2, se salta al paso 3 donde se propone importar los favoritos del navegador.
Firefox:
Internet Explorer:
Si es la primera vez que utilizas Delicious se recomienda saltar el paso 3 de importar favoritos
para finalizar con el asistente.
Nota:
Para acceder al instalador de los botones en otro momento utiliza las siguientes URL:
1. Clic en el botón Import Now para enviar a tu cuenta Delicious los favoritos que
en ese momento tiene tu navegador local.
2. A continuación se mostrará un mensaje notificando que el proceso de importación
se ha realizado con éxito.
3. Clic en el botón Your Bookmarks para acceder al listado de marcadores
importados.
Anexo II. Delicious, marcadores sociales 599
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
5. Para navegar hasta uno de mis favoritos basta con hacer clic sobre el marcador
correspondiente en el panel Bookmarks.
6. Una vez autentificado haz clic en el enlace Save a new bookmark (Guardar un nuevo
marcador).
7. Clic derecho sobre la casilla URL y elige Pegar. Clic en el botón Next (Siguiente).
8. En la ficha del marcador puedes introducir su URL, título, notas, etiquetas o tags,
compartir (share), etc. Para terminar pulsa en el botón Save (Guardar).
Anexo II. Delicious, marcadores sociales 604
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Otra posibilidad de búsqueda es pulsar directamente sobre una etiqueta de las situadas en el
listado All Tags. Este listado se muestra en la columna derecha de la página. Observa que al
seleccionar una etiqueta, ésta se añade al encabezado de filtrado y el listado de marcadores
que se muestra corresponde a todos aquellos que contienen la mencionada etiqueta.
Anexo II. Delicious, marcadores sociales 605
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
En el listado de All Tags se muestran todas las etiquetas. En la parte superior de las mismas
también aparecen las etiquetas relacionadas Related Tags. Se denomina etiquetas
relacionadas a aquellas que se han introducido en un mismo marcador. Por ejemplo: si hemos
etiquetado un marcador con cuatro etiquetas: cursos formación profesorado distancia,
entonces Delicious considera que estos cuatro marcadores están relacionados. Al elegir uno
cualquiera en el listado All Tags el resto de etiquetas se mostrarán en el apartado Related
Tags. Si elijo una etiqueta relacionada ésta se añadirá al filtrado permitiendo una búsqueda
más fina.
Otra posibilidad de búsqueda por etiquetas es seleccionar Tags > My tags en la barra de
herramientas de la página de Delicious y luego pulsar en una de las etiquetas. Esto mostrará
el listado de marcadores filtrados por esa etiqueta.
Otra opción para buscar por etiquetas es utilizar la barra lateral de Delicious en el navegador
web. Para ello teclea el tag en el cuadro Search (Buscar) o bien elige una etiqueta en el
marco Tags (Etiquetas). Haz clic en una etiqueta y en el marco BookMarks (Marcadores) se
mostrarán los marcadores que contienen esa etiqueta.
4. De esta forma en esta sección se mostrarán los marcadores de los usuarios que hemos
añadido a nuestra red social.
2. Clic en el botón Add a subscription (Añadir una suscripción). Introduce una etiqueta y
pulsa en el botón Add (Añadir). Si marcas la opción From a specific user (De un
usuario específico) podrás introducir el nombre de un usuario y limitar la suscripción a
los marcadores creados por el usuario indicado.
4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.
5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
de la página.
6. Clic en el enlace Añadir un gadget.
7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.
10. Clic en el enlace Ver blog para visualizar el aspecto final de este distintivo de
Delicious.
Las listas de enlaces o linkrolls es una forma de mostrar en tu blog o página web los últimos
favoritos que has catalogado en tu cuenta de Delicious. Primero es necesario configurar los
parámetros de visualización de este gadget y luego se copia y pega el código HTML que
proporciona Delicious para hacer posible esta integración en tu blog.
1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Link
Rolls. (Configuración > Blogging > Listas de enlaces)
2. En la página Link Rolls configura las distintas opciones de visualización:
Title. En este caso puedes introducir como título Enlaces favoritos.
Tags (Etiquetas). Si introduces etiquetas separadas por comas sólo se
visualizarán los marcadores que tengan estas etiquetas.
Icon (Icono). Puedes elegir el icono que acompañará al listado.
Quantity (Cantidad). Establece el número de los últimos marcadores que
aparecerán en el listado. Por defecto este valor es 5.
Bullet (Viñeta). En este apartado se puede seleccionar el tipo de viñeta con
que se mostrará cada marcador en el listado.
Sort (Orden). Permite establecer una ordenación en el listado de marcadores
que se muestran: Most recent (Más recientes) o Alphabetically
(Alfabéticamente).
Show (Mostrar). Permite mostrar Tags (Etiquetas), Notes (Anotaciones
realizadas en los marcadores), Username (nombre del usuario) y Add to
Network (afiliarse a la red).
4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.
5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
de la página.
6. Clic en el enlace Añadir un gadget.
7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.
10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de
marcadores soportado por Delicious.
Tagrolls o listas de etiquetas representan una forma excelente de mostrar las etiquetas de
Delicious como parte de tu sitio web o blog. Al igual que en ocasiones anteriores el
procedimiento de integración es sumamente fácil y consiste en configurar los parámetros de
visualización y a continuación copiar y pegar el código HTML en un gadget del blog.
1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Tag
Rolls. (Configuración > Blogging > Listas de etiquetas)
2. En la página Tag Rolls configura las distintas opciones de visualización:
Title. En este caso puedes introducir como título Mis etiquetas Delicious.
Icon (Icono). Puedes elegir si se incluirá el icono de Delicious o no.
Quantity (Cantidad). Permite definir el número máximo de etiquetas que
incluirá en el listado. Se mostrarán las etiquetas de mayor frecuencia.
Font (Fuentes). Permite definir el límite mínimo y máximo del tamaño de
fuente y el color (código hexadecimal de color, como por ejemplo, ff0000
sería el rojo). Estos valores se refieren a la etiqueta menos abundante
incluida en el listado y la etiqueta con más coincidencias.
Sort (Orden). Permite establecer una ordenación en el listado de etiquetas
que se muestran: Alphabetically (Alfabéticamente) o Count (Contador).
Flow (Aspecto). En este caso elegiremos Cloud (Nube) para definir que el
listado de etiquetas tenga el aspecto de una nube de etiquetas. Otra
posibilidad es elegir List (Lista).
Anexo II. Delicious, marcadores sociales 611
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.
5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
de la página.
6. Clic en el enlace Añadir un gadget.
7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.
10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de
marcadores soportado por Delicious. El usuario al pulsar en un enlace de la nube será
enviado a Delicious donde se mostrará un listado de todos los marcadores asignados a
esa etiqueta.
Nota:
A
Administrador
Es un rol de usuario que dispone de todos los permisos sobre el blog: edición de artículos,
gestión de usuarios, configuración de opciones, etc.
Adobe Reader
Programa gratuito de Adobe para leer archivos PDF.
Archivo
En un blog es el conjunto de entradas antiguas que normalmente se ofrecen clasificadas por
años, meses, días, etc.
Artículo
Cada entrada o post de un blog.
Atom
Formato de difusión de noticias de un blog o sitio web para suscripción.
Audioblog
Tipo de blog donde cada entrada suele ser un audio en formato MP3 o similar.
Autor
Es un rol de usuario reconocido en el blog con permisos para crear y publicar sus propios
artículos pero, a diferencia del administrador, no puede editar los artículos de los demás ni
configurar los parámetros del blog.
B
BackEnd
Es el área de acceso restringido del blog. En este espacio entra el autor/autores del blog para
gestionar su contenido.
Barra lateral
Es la parte del blog que muestra los gadgets o módulos que incorporan prestaciones
adicionales al blog.
Bitácora
Término en castellano que originalmente se ha aplicado al blog para enfatizar su uso primitivo
como diario de a bordo. Es una palabra que ha sido sustituida por el término anglosajón:
"blog".
Blog
Sistema para publicar fácilmente contenidos en Internet a título individual o colectivo. Su
información se organiza en artículos ordenados cronológicamente.
Blogger
Servicio que proporciona al usuario con credenciales de Google la oportunidad de crear y
mantener uno o varios blogs.
Glosario de términos ::: Módulo 1 : Blogs 616
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Blogosfera
Red de blogs en internet.
Blogroll
Colección de enlaces favoritos que se ofrece en la barra lateral de un blog
Blogspot
Todos los blogs creados en Blogger tienen una URL similar: http://<usuario>.blogspot.com
Borrador
Es la entrada o artículo de un blog que no se visualiza en el frontend porque todavía no se ha
publicado.
C
Cabecera
Parte de un blog donde se muestra el título del mismo y en algunos casos una imagen o
banner representativos de fondo.
Canal de suscripción
Sistema que permite a los lectores de un blog o sitio web recibir notificación de las nuevas
entradas publicadas sin necesidad de navegar hasta él. Para ello se puede utilizar un
navegador web o bien un lector específico de noticias.
CMS
Content System Management = Sistema de Gestión de Contenidos. Es una aplicación que
suele estar diseñada para funcionar en un servidor web. El administrador puede publicar
contenidos en su sitio utilizando las prestaciones de esta aplicación a través de su interfaz
web.
Comentario
Son aportaciones enviadas por los lectores de un artículo de un blog. Se visualizan si el
administrador los aprueba.
Creative Commons
Organización que ofrece a cualquier usuario la posibilidad de elegir las condiciones en que
desea compartir un trabajo publicado en Internet.
D
Del.icio.us
Servicio Web 2.0 que permite la gestión individual y colaborativa de los marcadores a páginas
web favoritas.
E
Entrada
Cada artículo o post de un blog.
Glosario de términos ::: Módulo 1 : Blogs 617
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Etiquetas
En inglés "tags". Se utilizan para asignarlas a los artículos y facilitar su clasificación temática.
F
Feed
Es el canal de suscripción que ofrece un blog o sitio web.
Firefox
Navegador web alternativo a Internet Explorer con interesantes prestaciones:
multiplataforma, extensiones, diccionarios, plugins, etc.
Folksonomía
Sistema de clasificación de los contenidos (artículos, enlaces, etc) basado en la libre asignación
de etiquetas por parte del usuario
Fotolog
Tipo de blog donde la foto es el elemento principal de publicación.
FrontEnd
Es el área pública del blog que muestra los artículos publicados que pueden ser leídos por
cualquier usuario que accede al mismo.
G
Gadget
Pequeño recuadro que se integra en una página web a modo de mosaico y que se ejecuta
como una mini‐aplicación independiente. Está diseñado para enriquecer la información o
servicios de esa página. En un blog se suele mostrar en la barra lateral. También recibe el
nombre de widget.
GMail
Servicio de correo electrónico de Google de excelentes prestaciones y en creciente capacidad
de almacenamiento.
Google Apps
Servicio Web 2.0 ofrecido por Google a los usuarios con cuenta de Gmail y que permite la
edición colaborativa de documentos utilizando herramientas ofimáticas en línea: documentos
de texto, presentación, hojas de cálculo, etc.
Google Calendar
Servicio de agenda‐calendario individual y colectivo de Google.
Google Docs
Servicio para crear y compartir documentos.
Google Maps
Servicio de Google que facilita la localización geográfica de imágenes, textos y documentos.
Google Sites
Servicio de Google que permite crear un sitio web.
Glosario de términos ::: Módulo 1 : Blogs 618
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
L
Lector
Es el usuario que accede al frontend del blog para leer los artículos del mismo. Si el blog está
configurado adecuadamente podrá enviar sus comentarios.
LMS
Learning Management System = Sistema de Gestión del Aprendizaje y se utiliza para crear
entornos de elearning. El LMS más utilizado en la actualidad es Moodle.
M
Marcadores
Accesos directos a las direcciones de sitios web favoritos.
Marcadores dinámicos
Tipo de marcadores o favoritos que utiliza Firefox para afiliarse a un canal de suscripción.
Muestra cada cierto tiempo un enlace a cada uno de los últimos artículos de ese blog o página
web.
Marcadores sociales
Enlaces a sitios web favoritos que se guardan para facilitar su posterior localización y acceso.
Cuando los compartimos con otros usuarios reciben la denominación de "sociales".
Microblog
Tipo de blog donde los artículos están limitados en su extensión de caracteres.
Moblog
Tipo de blog orientado a su visualización en un teléfono móvil.
Moderación
Acción que realiza el administrador de un blog sobre los comentarios enviados por los lectores
a sus artículos. Puede aprobarlos o eliminarlos.
N
Nube de etiquetas
Conjunto de etiquetas que se suelen mostrar en la barra lateral de un blog donde el tamaño de
fuente con que se muestra cada etiqueta dependerá de su frecuencia de uso. En ocasiones la
pulsar sobre una etiqueta se muestra el listado de entradas a las que se les ha asignado esa
etiqueta.
O
Openblog
Tipo de blog que proporciona a sus visitantes la posibilidad de publicar de forma abierta o
libre.
Glosario de términos ::: Módulo 1 : Blogs 619
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
P
PDF
Formato de documento muy extendido en internet. Destinado a la consulta de documentos
paginados de cierta extensión. Se pueden leer con distintos programas gratuitos, desde
distintos sistemas, con un tamaño reducido, con posibilidad de búsquedas, presentación
idéntica en cualquier impresora y protección anticopia frente a terceros.
PDF Creator
Aplicación gratuita para generar archivos PDF. Este programa instala una impresora virtual
que permite crear un archivo PDF a partir de cualquier programa desde el que se pueda
imprimir.
Plantilla
Conjunto de archivos HTML y CSS que determinan el estilo gráfico de un blog.
Podcast
Sistema para la difusión de audios en formato MP3.
Post
Cada artículo o entrada de un blog.
R
Rol
En Blogger se reconocen 3 tipos de roles de usuarios: administrador, autor y lector.
RSS
Formato de difusión de noticias de un blog o sitio web para suscripción.
S
Slideshare
Servicio Web 2.0 para el almacenamiento y difusión de presentaciones de diapositivas.
Sumatra PDF
Programa gratuito y portable para leer archivos PDF.
Suscripción
Permite disponer de las últimas novedades publicadas en el navegador web o lector de
noticias sin necesidad de acceder directamente a este sitio web.
T
Trackback
También llamados enlaces de retroceso. Permiten realizar un seguimiento de otros blogs que
han enlazado a un artículo de nuestro blog.
Glosario de términos ::: Módulo 1 : Blogs 620
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Tumbleblog
Tipo de blog poco estructurado que no se ajusta a una temática concreta.
Twitter
Formato de nanoblogging o microblogging donde el usuario publica entradas que contiene
texto y enlaces de una longitud no superior a 140 caracteres
V
Videoblog
Tipo de blog donde las entradas son clips de vídeo ordenados cronológicamente.
W
Web 2.0
Término acuñado por el americano Dale Dougherty que engloba sitios web basados en la
partición colaborativa de los usuarios frente a los sitios de la Web 1.0 menos interactivos.
Wiki
Sistema para crear documentación de un proyecto de forma colaborativa. La información se
organiza en páginas y capítulos.
Wordpress
Servicio alternativo a Blogger que permite crear y mantener un blog.
Y
Youtube
Es el gran líder en repositorios de vídeo en Internet. Permiten el alojamiento y difusión de
vídeos. Proporcionan sporte de almacenamiento y también de difusción en streaming
facilitando su correcta visualización a través de internet.
Glosario de términos
Módulo 2. Imagen
Glosario de términos ::: Módulo 2 : Imagen 622
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
B
BMP
(BitMap = Mapa de bits). Formato de archivo de imagen digital de calidad.
C
Código Embed
Código HTML que permite insertar un objeto flash o similar dentro de una página web.
F
Flickr
Servicio Web 2.0 que permite administrar y compartir tus fotos en línea.
G
GIF
(Graphics Interchange Format = Formato de Intercambio Grafíco). Formato de archivo de
imagen digital con una paleta de colores máxima de 256 colores. Especialmente diseñado para
comprimir imágenes de colores sólidos.
GIMP
GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para la
manipulación de imágenes. Es una aplicación adecuada para la edición y composición de
imágenes así como para el retoque fotográfico.
Google Maps
Servicio que proporciona herramientas para la consulta e integración web de mapas
geográficos y para la situación de recursos en esos mapas.
I
Iframe
Marco interno definido en una página HTML que muestra el contenido de otra página HTML.
J
JPG‐JPEG
(Joint Photographic Experts Group = Grupo de Expertos Fotográficos Unidos). Formato de
archivo de imagen digital con una paleta de colores máxima de 16 millones de colores.
Especialmente diseñado para comprimir imágenes fotográficas.
Glosario de términos ::: Módulo 2 : Imagen 623
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
M
Modo de color
Sistema de coordenadas que permiten describir el color de cada píxel utilizando los valores
numéricos. Ejemplo: Modo RGB donde cada color resulta de la combinación de tres canales:
Rojo‐Verde‐Azul con un valor de intensidad entre 0 y 255.
P
Picasa
Programa que se instala en el ordenador para el tratamiento y gestión de las imágenes
almacenadas en él.
Picasa Web
Servicio Web 2.0 asociado a las credenciales de usuario Google donde puedes administrar y
compartir tus fotos en línea.
Píxel
Es la unidad mínima de visualización de una imagen digital. Ésta se compone de una parrilla de
puntos o píxeles cuando se visualiza en una pantalla o se imprime.
PNG
(Portable Network Graphic = Gráfico portable para la red). Formato de archivo de imagen
digital con una paleta de colores máxima de 16 millones de colores.
Profundidad de color
Número de bits necesarios para codificar y guardar la información de color de cada pixel en
una imagen. Por ejemplo: una profundidad de color de 8 bits permite "2 elevado a 8" colores,
es decir, 256 colores.
R
Resolución
Grado de detalle o calidad de una imagen digital. Se mide en pixeles por pulgada (ppp) o en
inglés dpi (dots per inch).
S
Slide.com
Servicio Web 2.0 que nos permite subir una colección de imágenes y luego obtener una
atractiva presentación en línea que las muestra de forma secuencial y con efectos especiales.
Slideshare
Servicio de alojamiento y publicación en línea de presentaciones realizadas con Powerpoint u
OpenOffice. Se utiliza para subir presentaciones y compartirlas con los demás.
Glosario de términos ::: Módulo 2 : Imagen 624
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
T
TIF‐TIFF
(Tagged Image File Format = Formato de Archivo de Imagen Etiquetada). Formato de archivo
de imagen digital de calidad.
X
XCF
Formato de imagen específico de GIMP.
Glosario de términos
Módulo 3. Audio
Glosario de términos ::: Módulo 3: Audio 626
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
A
Audacity
Software libre y de código abierto para grabar y editar audios.
C
CDex
Programa gratuito para extraer las pistas de un CD de audio a archivos MP3.
Códec
Acrónimo de "codificación/descodificación". Es un algoritmo especial que reduce el número de
bytes que ocupa un archivo de audio. Los archivos codificados con un códec específico
requieren el mismo códec para ser decodificados y reproducidos. El códec más utilizado en
audio es el MP3.
D
Decibelio
Unidad de medida del volumen o intensidad de un sonido. El silencio se cuantifica como 0 dB y
el umbral del dolor para el oído humano se sitúa en torno a los 130‐140 dB.
E
Estéreo
Audio que se reproduce por los dos canales: derecho (R) e izquierdo (L).
F
Frecuencia
Número de vibraciones por segundo que da origen al sonido analógico. Se mide en hertzios.
G
Goear
Servicio Web 2.0 que permite subir y guardar archivos de audio en su servidor.
L
LAME
Códec que se propone utilizar con Audacity para la exportación de audios a formato MP3.
Listas de audio
Listados de archivos de audio que permiten la reproducción continuada y secuencial de los
mismos.
Glosario de términos ::: Módulo 3: Audio 627
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Loop
Fragmento musical de corta duración que reproducido en bucle transmite la sensación de un
acompañamiento musical más largo.
M
MediaInfo
Programa gratuito que permite conocer las propiedades o características técnicas de un
archivo de audio o video digitales.
Metadatos
Información adicional de un archivo de audio MP3 que se muestra en el reproductor y que
proporciona datos del título, artista, año, género, título del album, etc.
MIDI
(Musical Instrument Digital Interface = Interface Digital para
Instrumentos Digitales). Formato de audio que no resulta de la digitalización de un audio
analógico. Contiene secuencias de intervención de los dispositivos MIDI (sintetizadores) donde
se recoge qué instrumento suena, en qué forma lo hace y cuándo.
Mono
El sonido mono sólo está definido por un canal y al reproducirse origina un sonido semejante
al escuchado con un solo oído. Carece de la sensación espacial que proporciona la audición
estereofónica.
MP3
Formato MPEG 1 Layer 3 de archivo para audio creado por el Instituto Fraunhofer. Por su
extraordinario grado de compresión y alta calidad está liderando el mundo del audio digital.
O
OGG
Formato de audio reciente que surge como alternativa libre y de código abierto al formato
MP3.
P
PCM/ADPCM
Códec de compresión de audio en formato WAV.
PixelOut
Reproductor de audio elaborado en tecnología Flash y que permite integrarlo en una página
web para mostrar la reproducción de un archivo de sonido.
Glosario de términos ::: Módulo 3: Audio 628
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
R
Resolución
El número de bits utilizados para guardar cada muestra digital de la señal analógica de audio.
Ejemplo: 16 bits significa una calidad de "2 elevada a 16", es decir, 65536 niveles de amplitud.
S
SoundCloud
Espacio Web 2.0 gratuito destinado a la publicación de archivos de audio.
T
Tasa de muestreo
Define el intervalo de tiempo tras el cual se toma una muestra de señal análogica de audio
para generar el audio digital. Así por ejemplo una tasa de muestreo de 44100 Hz significa que
se tomaron esa cantidad de muestras en un segundo.
V
Velocidad de transmisión
También llamado bitrate se refiere a la cantidad de espacio físico medido en bits que ocupa un
segundo de duración de ese audio. El bitrate puede ser constante o variable.
W
WAV
(WaveForm Audio File = Archivo de Audio de Formato Onda). Es un formato de archivo de
audio con excelente calidad pero con un peso considerable.
Glosario de términos
Módulo 4. Video
Glosario de términos ::: Módulo 4: Video 630
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
A
Auto Gordian Knot
Software para la conversión de archivos de vídeo VOB en archivos de vídeo AVI codificados con
DivX o XviD.
AVI
(Audio Video Interleaved = Audio y Video Intercalado). Formato de archivo de vídeo de gran
calidad y peso.
C
Códec
Acrónimo de "codificación/descodificación". Es un sistema que permite reducir el número de
bytes que ocupa un archivo de vídeo. Los archivos codificados con un códec específico
requieren el mismo códec para ser decodificados y reproducidos. Ejemplos de códecs de vídeo:
DivX, XviD, etc.
Código Embed
Código HTML que permite insertar el visor y el vídeo elegido en un repositorio de vídeos.
D
DV
Digital Video. Es la tecnología que utilizan las cámaras de vídeo al guardar la grabación en
formato digital.
DVD Decrypter
Programa que extrae los archivos VOB de un disco DVD a una carpeta del disco duro del
ordenador.
DVD Video
Soporte de reproducción de vídeo. Muestra una estructura especial de carpetas y ficheros (en
algunos casos encriptados) que al ser reproducidos por programas específicos (VLC Media
Player, por ejemplo) mostrará una película organizada en capítulos.
F
FLV
Formato de archivo de vídeo de Adobe Flash para visualizar vídeos en Internet. Es el formato
que utiliza Youtube por defecto.
Fotograma Clave
Fotogramas del vídeo que se guardan integramente durante el proceso de
compresión/codificación de un archivo de vídeo.
Glosario de términos ::: Módulo 4: Video 631
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Fotogramas por segundo.
Es el número de fotogramas por segundo que contiene un vídeo durante su reproducción.
Oscila entre 15 y 30 fps.
Fotos Narradas
Aplicación gratuita que se instala en Windows XP que permite crear un vídeo WMV a partir de
una secuencia de imágenes y audios.
M
MediaInfo
Programa gratuito que permite conocer las propiedades o características técnicas de un
archivo de audio o video digitales.
Metacafe
Servicio Web 2.0 para la publicación y difusión de vídeos
MOV
Formato de archivo de vídeo desarrollado por Apple para reproducir con QuickTime Player.
MP4
Formato de archivo de vídeo desarrollado por Apple para reproducir vídeo de calidad en
streaming. Es el formato que utiliza el dispositivo iPod para reproducir vídeos.
MPEG
(Moving Pictures Expert Group = Grupo de Expertos de Películas). Formato de archivo de vídeo
estándar para la compresión de vídeo digital.
O
OverStream
Servicio Web 2.0 que permite personalizar un vídeo en línea alojado en Youtube, Google
Vídeo, etc incorporándole comentarios y subtítulos.
R
Ratio
Proporción entre la anchura y la altura de la ventana de reproducción de un video.
Habitualmente 4:3 o bien 16:9 para los DVD.
Revver
Servicio Web 2.0 para la publicación y difusión de vídeos
RM
Formato de archivo de vídeo de Real Networks.
Glosario de términos ::: Módulo 4: Video 632
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
S
Sintonizadora TV
Tarjeta que se instala en el ordenador y que se conecta a la señal de antena o a un dispositivo
de vídeo externo. Se utiliza como entrada de vídeo al ordenador para la obtención de
contenidos.
Sistema de televisión
Sistema de reproducción por televisión característico de cada país o zona geográfica: NTSC
(USA, CentroAmérica, Japón), PAL (Europa), SECAM (Francia), etc.
Streaming
Tecnología servidor‐cliente que permite a los visitantes visualizar un vídeo de cierta duración y
calidad. Tras completarse el buffer inicial la reproducción se inicia y se completa de forma
contínua mientras que la descarga del resto se completa en segundo plano.
SuperC
Software gratuito que se utiliza para convertir un archivo de vídeo de un formato en otro.
Admite la lectura y conversión de un amplio catálogo de formatos de vídeo.
SWF
Extensión de archivo que suele contener una animación o utilidad diseñada con el programa
Adobe Flash. Este archivo se suele embeber dentro de una página HTML para mostrarse a
través del navegador. Para su correcta visualización es necesario que el navegador web del
cliente disponga del plugin de Adobe Flash instalado y actualizado.
V
Velocidad de transmisión
Es la cantidad de espacio físico (en bits) que ocupa un segundo de duración de ese vídeo.
Video Download Helper
Extensión del navegador Firegox que permite descargar y guardar en local un vídeo, audio o
imagen que se muestra dentro de una página web. En este curso se propone como
herramienta para la descarga en local de archivos de vídeo FLV de Youtube.
VideoCD
Formato de CD que al insertarlo en una unidad arranca por defecto el reproductor de vídeo
para mostrar su contenido.
Vimeo
Servicio Web 2.0 para la publicación y difusión de vídeos.
VLC Media Player
Software gratuito y universal capaz de reproducir cualquier formato de archivo de vídeo. Se
dispone de versión instalable y también portable para memoria USB.
Glosario de términos ::: Módulo 4: Video 633
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
W
Windows Movie Maker
Aplicación integrada en Windows que permite capturar el vídeo de una cámara digital de vídeo
DV.
WMV
(Windows Media Video). Formato de archivo de vídeo desarrollado por Microsoft para la
difusión de vídeo por Internet.
Y
Youtube
Servicio Web 2.0 de búsqueda y alojamiento de vídeos.
Bibliografía
sobre Web 2.0
Bibliografía sobre Web 2.0 635
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Título:
La Blogosfera Hispana. Pioneros de la cultura digital.
Autor:
Jose Manuel Cerezo y otros.
Licencia:
E-book bajo licencia Creative Commons “Reconocimiento-
NoComercial SinObraDerivada”
Editado por:
Fundación France Telecom España
Fecha de publicación:
2006
Reseña Bibliográfica:
Recopilación de artículos sobre distintos aspectos de la blogoesfera hispana escritos por
algunos de los expertos más conocidos. Se abarcan temas como la teoría de los blogs, impacto
de los blogs en internet, visibilidad, relaciones con las instituciones, negocios, etc.
URL de descarga:
http://www.fundacionorange.es/areas/25_publicaciones/la_blogosfera_hispana.pdf
Título:
Planeta 2.0. Inteligencia colectiva o medios fast food.
Autor:
Cristóbal Cobo y Hugo Pardo.
Licencia:
E-book bajo licencia Creative Commons “Reconocimiento-NoComercial
SinObraDerivada”.
ISBN:
978-84-934995-8-7
Fecha de publicación:
2007
Reseña Bibliográfica:
Este libro pretende desde su primer capítulo ser un aglutinador de ideas, al diseñar un breve
marco teórico para el darwinismo digital de la World Wide Web y recopilar un vasto mapa de
lecturas para aquellos interesados en comprender y profundizar en este momento evolutivo
de Internet. Este trabajo refuerza algunas ideas que pretenden proteger al lector del
alineamiento ciego con los discursos grandilocuentes y con la dicotomía wired / tired /
expired. Sin vocación de predecir el futuro, se reflexiona si se vive una fase determinante y
creativa de la inteligencia colectiva o si simplemente se trata de un escenario de medios fast
food, de consumo rápido y de carácter amateur en rápida transición hacia una nueva etapa
evolutiva.
URL de descarga:
http://www.planetaweb2.net/
Bibliografía sobre Web 2.0 636
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Título:
Web 2.0
Autor:
Antonio Fumero y Genís Roca.
Editado por:
Fundación Orange.
Licencia:
E-book bajo licencia Creative Commons “Reconocimiento-
NoComercial SinObraDerivada”.
Depósito Legal:
M-15478-2007
Fecha de publicación:
2007
Reseña Bibliográfica:
Este libro pretende abarcar un subconjunto de Internet (la web 2.0) que, a su vez, aglutina al
de los blogs. Y es que, más allá de etiquetas, la forma de concebir la Red se ha visto
profundamente alterada con la aparición de nuevas tecnologías que han propiciado un cambio
radical en las rutinas con las que nos equipábamos a la hora de navegar. Tanto el “yo” como
las Redes Sociales han explosionado de manera paralela, figura geométrica que, por azares
del capricho digital, sufre modificaciones de singular importancia al ver sometidas sus
infinitas líneas a profundas intersecciones dando lugar a caprichosos segmentos. Fragmentos
que constituyen reflejos de distintas realidades, tantas como individuos, tantas como retazos
de vida surgen de la fusión, de la ósmosis, incluso de la emulsión de sensibilidades de
distintas densidades.
URL de descarga:
http://www.fundacionorange.es/areas/25_publicaciones/WEB_DEF_COMPLETO.pdf
Título:
El poder de las redes
Autor:
David de Ugarte.
Licencia:
Dominio público.
ISBN:
978-84-611-8873-4
Fecha de publicación:
2007
Reseña Bibliográfica:
Que estamos en un tiempo de cambios y que esos cambios tienen
que ver de alguna manera con las “redes sociales” es ya una idea común, extendida y
repetida hasta el cansancio. Sin embargo nadie parece tener muy claro qué son esas famosas
redes y sobre todo qué tienen de nuevo. A fin de cuentas, si de las redes que hablamos son
las que forman las personas al relacionarse unas con otras, la sociedad siempre fue una red. Y
si hablamos de movimientos de activistas también estuvieron siempre ahí, relacionándose
unos con otros en una especie de universo hiperactivo y paralelo. Hay sin embargo dos
elementos nuevos que todo el mundo entiende intuitivamente relacionados con esta cuestión.
Por un lado Internet y su consecuencia más directa: la eclosión de una nueva esfera de
relación social que pone en contacto a millones de personas cada día. Por otro la aparición en
los últimos años de una amplia literatura sobre redes aplicada a todos los campos, desde la
Física o la Biología hasta la Economía, con toda su inevitable secuela de libros de divulgación,
aplicaciones al marketing y juegos publicitarios.Y luego está toda una serie de movimientos
que van desde la revolución hasta la protesta cívica, pasando por una nueva suerte de
sofisticadas algaradas que nadie sabe clasificar muy bien y que llenan páginas en los
periódicos.
URL de descarga:
http://www.deugarte.com/manual-ilustrado-para-ciberactivistas
Bibliografía sobre Web 2.0 637
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Título:
La revolución de los blogs
Autor:
Jose Luis Orihuela.
Editado por:
La Esfera de los Libros, Madrid.
ISBN:
84-9734-498-7
EAN:
9788497344982
Fecha de publicación:
2006
Reseña Bibliográfica:
Los weblogs, blogs, cuadernos de bitácora o simplemente bitácoras son los sitios web
personales que están poniendo la Red al alcance de todo el mundo. Éste es un libro para
todos aquellos que alguna vez se han preguntado:¿Qué son los weblogs?, ¿Quiénes son y por
qué escriben los bloguers?, ¿Cómo comenzar un weblog?, ¿Cómo escribir buenos comentarios?,
¿Dónde puedo tener un weblog gratis?, ¿Cómo puedo encontrar otros bloguers en mi país?,
¿Cuáles son los mejores weblogs en español?, etc. Este libro está escrito de forma didáctica
por un reconocido bloguer. Es la primera obra orientada al gran público que examina los
principales ámbitos de impacto de los weblogs -sobre el periodismo, la empresa, la educación
o la política- con ejemplos y referencias para comprender cómo y por qué este nuevo medio
está cambiando nuestra cultura y generando otra nueva: la blogosfera.
URL con más información:
http://www.esferalibros.com/libros/librodetalle.html?libroISBN=8497344987
Direcciones Web
Módulo 1. Blogs
Direcciones Web ::: Módulo 1. Blogs 639
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Módulo 1. Blogs
Web 2.0
Del.icio.us
http://delicious.com/
Google Apps
http://www.google.com/apps/
Genbeta
http://www.genbeta.com/
Xataka
http://www.xataka.com/
Alt1040
http://alt1040.com/
Direcciones Web ::: Módulo 1. Blogs 640
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
EduBlogs
Educastur Blog
http://blog.educastur.es/
Arablogs
http://www.catedu.es/arablogs/
Planeta Educativo
http://www.catedu.es/arablogs/
Aula Blog
http://www.aulablog.com/
Servicios de Blogs
Blogger
http://www.blogger.com
Wordpress
http://www.wordpress.com
Live Journal
http://www.livejournal.com/
Blogger
Página oficial de Ayuda de Blogger:
http://www.google.com/support/blogger/?hl=es
Ayuda Blogger
http://www.ayudablogger.org/
Wordpress.com
Derechos de autor
Creative Commons
http://es.creativecommons.org/
CEDRO
http://www.cedro.org/conceptos_basicos.asp
Software
Adobe Reader
http://www.adobe.com/es/products/reader/
PDF Creator
http://www.pdfforge.org/products/pdfcreator
Direcciones Web
Módulo 2. Imagen
Direcciones Web ::: Módulo 2. Imagen 643
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Módulo 2. Imagen
GIMP
GIMP. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/86/cd/index.htm
GIMP
http://www.gimp.org/
GIMP en español
http://www.gimp.org.es/
GIMP portable
http://portableapps.com/apps/graphics_pictures/gimp_portable
Bigfoto
http://www.bigfoto.com/
DesignPacks
http://www.designpacks.com/
Flickr CC
http://www.flickr.com/creativecommons/
Free Images Co UK
http://www.freeimages.co.uk/
FreeFoto
http://www.freefoto.com/
Image After
http://imageafter.com/
MorgueFILE
http://morguefile.com/
NASA Images
http://www.nasa.gov/multimedia/imagegallery/index.html
Openphoto
http://www.openphoto.net/
Stock.XCHNG
http://www.sxc.hu/
Wikimedia Commons
http://commons.wikimedia.org/wiki/Category:Images/
YotoPhoto
http://www.genbeta.com/web/busca-fotografias-libres-en-yotophoto
Flickr
http://www.flickr.com/
Slide.com
http://www.slide.com/
Slideshare
http://www.slideshare.net/
Picasa
http://picasa.google.com/intl/es/
Google Maps
http://maps.google.es/
Direcciones Web
Módulo 3. Audio
Direcciones Web ::: Módulo 3. Audio 646
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Módulo 3. Audio
Audacity
Multimedia. Introducción. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/84/cd/index.html
Audacity
http://audacity.sourceforge.net/
Audacity Portable
http://portableapps.com/apps/music_video/audacity_portable
CDex
CDex
http://cdexos.sourceforge.net/
Flash Kit
http://www.flashkit.com/
Direcciones Web ::: Módulo 3. Audio 647
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Free Loops
http://www.freeloops.com/
PacDV
http://www.pacdv.com/sounds/index.html
Pockect Fuel
http://www.pocketfuel.com/gallery.php
GoEar
http://www.goear.com/
SoundCloud
http://soundcloud.com/
Direcciones Web
Módulo 4. Video
Direcciones Web ::: Módulo 4. Video 649
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Módulo 4. Video
VLC Media Player
VLC Media Player
http://www.videolan.org/
VideoLan Wiki
http://wiki.videolan.org/Main_Page
Mediateca de EducaMadrid
http://mediateca.educa.madrid.org/
TeacherTube
http://www.teachertube.com/
Google Vídeo
http://video.google.es/
Revver
http://revver.com/
Metacafe
http://www.metacafe.com/
MySpace
http://myspace.com/
Dailymotion
http://www.dailymotion.com/
Guba
http://www.guba.com/
Sharkle.com
http://www.markosweb.com/www/sharkle.com/
Lulu TV
http://www.lulu.tv/
Vsocial
http://vsocial.com/
Current TV
http://www.current.tv/
Colombia aprende
http://www.colombiaaprende.edu.co/html/mediateca
Universidad de Sevilla
Direcciones Web ::: Módulo 4. Video 650
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
http://www.sav.us.es/producciondevideo/videoenred.asp
TV educativa de la UNED
http://www.uned.es/cemav/tv.htm
Mediateca de Educared
http://campusuniv.campusred.net/vod-publico2/
DVD Decrypter
DVD Decrypter en Mr.Bass
http://www.mrbass.org/dvdrip/
AutoGordian
Autogordian GTK
http://www.autogk.me.uk/
Direcciones Web ::: Módulo 4. Video 651
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado
Media Info
Media Info
http://mediainfo.sourceforge.net/es