Manual multimedia y web 2.0
Upcoming SlideShare
Loading in...5
×
 

Manual multimedia y web 2.0

on

  • 11,595 views

 

Statistics

Views

Total Views
11,595
Views on SlideShare
11,255
Embed Views
340

Actions

Likes
3
Downloads
428
Comments
2

13 Embeds 340

http://johnorellana.com 177
http://cocinilladepruebas.blogspot.com.es 112
http://sebasthian10ice.blogspot.com 13
http://tecnologiaconsolacio.blogspot.com 11
http://miportal.hostzi.com 11
http://cursoprofes2012.wikispaces.com 6
http://pacoalvarezperez2012.blogspot.com.es 3
http://cocinilladepruebas.blogspot.com 2
http://recursosaulavirtualytic.blogspot.com.es 1
http://tecnologiaconsolacio.blogspot.com.es 1
http://ntderechod1.blogspot.com 1
http://www.edmodo.com 1
http://elblogdejoaquinp.blogspot.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

12 of 2

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Manual multimedia y web 2.0 Manual multimedia y web 2.0 Document Transcript

    • Índice Temático 2Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoMultimedia y Web 2.0Presentación ......................................................................... 11Módulo 1. Blogs ..................................................................... 131. ¿Qué es la Web 2.0? ................................................................................. 14 1.1 Concepto de Web 2.0 ...................................................................... 15 1.2 Principios generales de la Web 2.0 ...................................................... 16 1.3 Algunos ejemplos de iniciativas Web 2.0 ............................................... 17 1.4 El navegador web .......................................................................... 182. Iniciación a los blogs ............................................................................... 20 2.1 ¿Qué es un blog? ............................................................................ 21 2.2 Anatomía de un blog ....................................................................... 22 2.3 Características de los blogs .............................................................. 24 2.4 Tipos de blogs ............................................................................... 24 2.5 Servicios de blogs........................................................................... 253. Mi primer artículo .................................................................................. 26 3.1 Mi primer artículo en Blogger ............................................................ 27 3.1.1 Crear un blog en Blogger ....................................................... 28 3.1.2 Crear una nueva entrada ....................................................... 31 3.1.3 Añadir título y texto ............................................................ 31 3.1.4 Añadir una imagen .............................................................. 33 3.1.5 Añadir un hipervínculo .......................................................... 34 3.1.6 Otras opciones de la entrada .................................................. 35 3.1.7 Publicar la entrada .............................................................. 36 3.1.8 URL permanente a una entrada ............................................... 36 3.2 Mi primer artículo en Wordpress ......................................................... 37 3.2.1 Crear un blog en Wordpress .................................................... 38 3.2.2 Crear una nueva entrada ....................................................... 40 3.2.3 Añadir título y texto ............................................................ 40 3.2.4 Añadir una imagen .............................................................. 42 3.2.5 Añadir un hipervínculo .......................................................... 44 3.2.6 Otras opciones de la entrada .................................................. 45 3.2.7 Publicar la entrada .............................................................. 47 3.2.8 URL permanente a una entrada ............................................... 474. Gestión de artículos ................................................................................ 49 4.1 Gestión de artículos en Blogger .......................................................... 50 4.1.1 Modificar un artículo ............................................................ 51 4.1.2 Estados de publicación ......................................................... 52 4.1.3 Eliminar un artículo ............................................................. 52 4.1.4 Publicar y despublicar........................................................... 53 4.1.5 Asignar etiquetas ................................................................ 54 4.1.6 Publicar artículos desde el correo electrónico .............................. 55 4.1.7 Exportar e importar entradas .................................................. 60 4.2 Gestión de artículos en Wordpress ...................................................... 63 4.2.1 Modificar un artículo ............................................................ 64 4.2.2 Estados de publicación ......................................................... 65 4.2.3 Eliminar un artículo ............................................................. 66 4.2.4 Publicar y despublicar........................................................... 67 4.2.5 Asignar etiquetas ................................................................ 67 4.2.6 Publicar artículos desde el correo electrónico .............................. 69 4.2.7 Exportar e importar entradas .................................................. 73
    • Índice Temático 3Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5. El editor de entradas ............................................................................... 77 5.1 El editor de entradas en Blogger ......................................................... 78 5.1.1 Formato de texto ................................................................ 79 5.1.2 Corrector ortográfico............................................................ 85 5.1.3 El código HTML ................................................................... 85 5.2 El editor de entradas en Wordpress ..................................................... 87 5.2.1 Formato de texto ................................................................ 88 5.2.2 Corrector ortográfico............................................................ 95 5.2.3 El código HTML ................................................................... 956. Diseño del blog ...................................................................................... 97 6.1 Diseño del blog en Blogger ................................................................ 98 6.1.1 Modificar la plantilla ............................................................ 99 6.1.2 Fuentes y colores .............................................................. 100 6.1.3 Elementos de una página ...................................................... 101 6.1.4 Barra de navegación de Blogger .............................................. 102 6.1.5 Cabecera ......................................................................... 103 6.1.6 Entradas del blog ............................................................... 105 6.1.7 Añadir gadgets a la barra lateral ............................................. 106 6.1.8 Algunos gadgets interesantes ................................................. 109 6.1.9 Edición HTML de la plantilla .................................................. 115 6.1.10 Edición avanzada HTML de la plantilla ..................................... 117 6.2 Diseño del blog en Wordpress ........................................................... 122 6.2.1 Modificar el tema ............................................................... 123 6.2.2 Colores del encabezado ....................................................... 124 6.2.3 Cabecera ......................................................................... 126 6.2.4 Añadir widgets a la barra lateral ............................................. 128 6.2.5 Algunos widgets interesantes ................................................. 131 6.2.6 Edición CSS del tema ........................................................... 135 6.2.7 Marca “Leer más” en un artículo de WP .................................... 1367. Moderación de comentarios ...................................................................... 138 7.1 Moderación de comentarios en Blogger ................................................ 139 7.1.1 Configuración de comentarios ............................................... 140 7.1.2 Envío de comentarios .......................................................... 142 7.1.3 Moderación de comentarios ................................................... 142 7.2 Moderación de comentarios en Wordpress ............................................ 145 7.2.1 Configuración de comentarios ............................................... 146 7.2.2 Envío de comentarios .......................................................... 148 7.2.3 Moderación de comentarios ................................................... 1498. Usuarios y permisos ............................................................................... 152 8.1 Usuarios y permisos en Blogger ......................................................... 153 8.1.1 Tipos de usuarios................................................................ 154 8.1.2 Añadir autores .................................................................. 154 8.1.3 Añadir lectores ................................................................. 155 8.2 Usuarios y permisos en Wordpress ...................................................... 157 8.2.1 Tipos de usuarios................................................................ 158 8.2.2 Añadir usuarios ................................................................. 158 8.2.3 Editar usuarios .................................................................. 1599. Configuración del blog............................................................................. 160 9.1 Configuración del blog en Blogger ...................................................... 161 9.1.1 Opciones básicas ............................................................... 162 9.1.2 Publicación ...................................................................... 163 9.1.3 Formato .......................................................................... 163 9.1.4 Comentarios ..................................................................... 164 9.1.5 Archivo ........................................................................... 164 9.1.6 Correo electrónico ............................................................. 164
    • Índice Temático 4Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2 Configuración del blog en Wordpress .................................................. 165 9.2.1 Opciones generales ............................................................ 166 9.2.2 Escritura ......................................................................... 166 9.2.3 Lectura ........................................................................... 167 9.2.4 Comentarios ..................................................................... 167 9.2.5 Privacidad ....................................................................... 16810. Documentos PDF .................................................................................. 169 10.1 Introducción .............................................................................. 170 10.2 Lectura de archivos PDF en Windows ................................................ 170 10.3 Instalación de PDF Creator en Windows ............................................. 170 10.4 Crear un archivo PDF con PDF Creator ............................................... 171 10.5 Lectura de archivos PDF en Ubuntu ................................................... 174 10.6 Impresora virtual PDF en Ubuntu ...................................................... 175 10.7 Crear documentos PDF desde OpenOffice ........................................... 175 10.8 Publicar un PDF en Blogger ............................................................ 178 10.9 Publicar un PDF en Wordpress ......................................................... 18111. Google Docs ........................................................................................ 185 11.1 ¿Qué es Google Apps? .................................................................... 186 11.1.1 Introducción .................................................................... 186 11.1.2 ¿Por qué Google Apps? ........................................................ 186 11.1.3 Descripción de las aplicaciones más interesantes ........................ 187 11.2 Crear y compartir un documento en Google Docs .................................. 190 11.3 Gestión de archivos en Google Docs .................................................. 200 11.3.1 Importación de archivos a Google Docs .................................... 200 11.3.2 Obtener el enlace para compartir .......................................... 202 11.3.3 Gestión de archivos en Google Docs ........................................ 203 11.3.4 Exportación de archivos ...................................................... 206 11.4 Crear un documento a partir de una plantilla ....................................... 208 11.5 Formularios ............................................................................... 209 11.5.1 ¿Qué son los formularios?..................................................... 209 11.5.2 Crear un nuevo formulario ................................................... 209 11.5.3 Consulta de los resultados de un formulario .............................. 212 11.6 Integración de Google Docs en Blogger ............................................... 213 11.6.1 Integración de un documento de texto .................................... 213 11.6.2 Integración de una presentación ............................................ 216 11.6.3 Integración de una hoja de cálculo ......................................... 217 11.6.4 Integración de un formulario ................................................ 218 11.7 Integración de Google Docs en Wordpress ........................................... 21912. Derechos de autor ................................................................................ 222 12.1 Introducción .............................................................................. 223 12.2 Los derechos de autor ................................................................... 223 12.3 Licencias Creative Commons ........................................................... 223 12.4 Añadir una licencia CC a un blog de Blogger ........................................ 224 12.5 Añadir una licencia CC a un blog de Wordpress ..................................... 228Módulo 2. Imagen.................................................................. 2331. Conceptos básicos de imagen digital ............................................................ 234 1.1 El píxel ...................................................................................... 235 1.2 Resolución de imagen ..................................................................... 235 1.3 Profundidad de color...................................................................... 235 1.4 Modos de color ............................................................................. 236 1.5 Formatos de imagen ...................................................................... 238 1.6 Consejos para la optimización de imágenes .......................................... 239
    • Índice Temático 5Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2. Empezar con GIMP ................................................................................. 241 2.1 ¿Qué es GIMP? .............................................................................. 242 2.2 Instalación de GIMP ...................................................................... 242 2.3 Inicio de GIMP .............................................................................. 243 2.4 El entorno de edición ..................................................................... 243 2.5 Crear una nueva imagen.................................................................. 244 2.6 Guardar una imagen ...................................................................... 2463. Optimización de imágenes ........................................................................ 249 3.1 Conversión de formatos .................................................................. 250 3.2 Reducir la paleta de colores ............................................................. 2574. Dimensiones de una imagen ...................................................................... 259 4.1 Reducir el tamaño de una imagen ...................................................... 260 4.2 Modificar el tamaño del lienzo .......................................................... 263 4.3 Recortado de imágenes ................................................................... 2685. Montaje de imágenes .............................................................................. 2706. Efectos especiales ................................................................................. 275 6.1 Filtros ....................................................................................... 276 6.2 Textos con efectos especiales .......................................................... 2787. Tratamiento de imágenes por lotes ............................................................ 283 7.1 Introducción ................................................................................ 284 7.2 Instalación del plugin DBP de GIMP en Windows ..................................... 284 7.3 Instalación del plugin DBP de GIMP en Ubuntu ....................................... 285 7.4 Conversión por lotes con GIMP .......................................................... 2868. Flickr: galería de fotos ........................................................................... 291 8.1 Introducción ................................................................................ 292 8.2 Subir fotografías a Flickr ................................................................. 292 8.3 Organizar en álbumes .................................................................... 296 8.4 Publicación de una imagen Flickr en el blog .......................................... 296 8.4.1 Insertar la imagen en Blogger ................................................. 297 8.4.2 Insertar la imagen en Wordpress ............................................. 299 8.5 Publicación de presentación Flickr en Blogger ....................................... 300 8.6 Publicación de presentación Flickr en Wordpress .................................... 3039. Picasa Web: álbums de fotos .................................................................... 305 9.1 ¿Qué es Picasa Web? ...................................................................... 306 9.2 Subir fotografías a Picasa Web I......................................................... 307 9.3 Subir fotografías a Picasa Web II ....................................................... 310 9.3.1 Instalación de Picasa 3 en Windows.......................................... 310 9.3.2 Instalación de Picasa 3 en Ubuntu ........................................... 310 9.3.3 Subir imágenes a Picasa Web ................................................. 310 9.4 Publicación de una imagen Picasa en el blog ......................................... 316 9.4.1 Obtener la URL de la imagen ................................................. 316 9.4.2 Insertar la imagen en una entrada de Blogger ............................. 318 9.4.3 Insertar la imagen en una entrada de Wordpress .......................... 319 9.5 Publicación de presentación Picasa en Blogger....................................... 320 9.6 Publicación de presentación Picasa en Wordpress ................................... 32210. Slide.com: presentaciones de fotos ........................................................... 325 10.1 ¿Qué es Slide.com? ....................................................................... 326 10.2 Crear una presentación Slide .......................................................... 326 10.3 Publicar la presentación Slide en Blogger ........................................... 330 10.4 Publicar la presentación Slide en Wordpress ........................................ 331
    • Índice Temático 6Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11. Slideshare.com: presentaciones en línea .................................................... 334 11.1 ¿Qué es SlideShare.net? ................................................................. 335 11.2 Subir una presentación a Slideshare.net ............................................. 335 11.3 Publicar un Slideshare en Blogger ..................................................... 337 11.4 Publicar un Slideshare en Wordpress ................................................. 34012. Google Maps ...................................................................................... 342 12.1 ¿Qué es Google Maps? ................................................................... 343 12.2 Crear un mapa en GMap ................................................................ 343 12.3 Publicar un mapa Google en Blogger ................................................. 346 12.4 Publicar un mapa Google en Wordpress .............................................. 348Módulo 3. Audio ................................................................... 3501. Introducción ......................................................................................... 351 1.1 Conceptos básicos de sonido digital .................................................... 352 1.2 Formatos de archivo de audio ........................................................... 353 1.3 Optimización de archivos de audio ..................................................... 3542. Primeros pasos con Audacity ..................................................................... 355 2.1 ¿Qué es Audacity? ......................................................................... 356 2.2 Instalación del programa en Windows.................................................. 356 2.3 Instalación del programa en Ubuntu ................................................... 357 2.4 El entorno del programa ................................................................. 3583. Reproducción de audio con Audacity ........................................................... 363 3.1 Abrir un archivo de audio ............................................................... 364 3.2 Reproducción del audio .................................................................. 364 3.3 Propiedades de un archivo de audio.................................................... 365 3.3.1 Instalación de MediaInfo en Windows........................................ 365 3.3.2 Instalación de MediaInfo en Ubuntu ......................................... 365 3.3.3 Uso de MediaInfo ................................................................ 367 3.4 Guardar un proyecto de Audacity ....................................................... 3684. Optimización de audios ........................................................................... 369 4.1 Conversión de formato .wav a .mp3 ................................................... 370 4.2 Configurar la calidad de exportación a MP3 .......................................... 372 4.3 Convertir un audio de estéreo a mono ................................................. 373 4.4 Formatos de compresión WAV ........................................................... 3775. La grabación de audio ............................................................................. 380 5.1 Crear una grabación de voz .............................................................. 381 5.2 Grabar audio de un CD.................................................................... 383 5.3 Grabar audio de la radio ................................................................. 386 5.4 Grabar audio de un MIDI .................................................................. 3876. Montajes de audio .................................................................................. 390 6.1 Seleccionar un fragmento de onda .................................................... 391 6.2 Crear un nuevo archivo con un fragmento ............................................ 393 6.3 Recortar un fragmento ................................................................... 394 6.4 Silenciar una selección .................................................................. 394 6.5 Crear un loop de audio ................................................................... 395 6.6 Mezclar pistas de audio ................................................................... 3967. Aplicar efectos ..................................................................................... 3998. Extracción de audio de un CD ................................................................... 406 8.1 CDex en Windows .......................................................................... 407
    • Índice Temático 7Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.1.1 ¿Qué es CDex? ................................................................... 407 8.1.2 Instalación de CDex ............................................................. 407 8.1.3 Extracción de audio de un CD con CDex..................................... 407 8.2 Sound Juicer en Ubuntu .................................................................. 410 8.2.1 ¿Qué es Sound Juicer? .......................................................... 410 8.2.2 Instalación de Sound Juicer ................................................... 410 8.2.3 Extracción de audio de un CD con Sound Juicer ........................... 4109. Integración de audio en el blog .................................................................. 413 9.1 Integración de audio en Blogger ........................................................ 414 9.1.1 Subida de archivos a Google Sites ............................................ 415 9.1.2 Generar el código para inscrustar ............................................ 417 9.1.3 Crear el artículo en Blogger ................................................... 419 9.1.4 Los parámetros de configuración de PixelOut .............................. 422 9.2 Integración de audio en Wordpress ..................................................... 424 9.2.1 Subida de archivos a Google Sites ............................................ 425 9.2.2 Crear el artículo en Wordpress ............................................... 429 9.2.3 Reproductor de audio en Wordpress ......................................... 431 9.2.4 Los parámetros de configuración ............................................. 43210. Repositorios Web 2.0 de audio ................................................................. 434 10.1 GoEar ...................................................................................... 435 10.1.1 ¿Qué es GoEar? ................................................................. 435 10.1.2 Subir tu audio mp3 a GoEar .................................................. 435 10.1.3 Publicación de un audio de GoEar en Blogger ............................ 436 10.1.4 Publicación de un audio de GoEar en Wordpress ......................... 438 10.2 SoundCloud ............................................................................... 440 10.2.1 ¿Qué es SoundCloud? .......................................................... 440 10.2.2 Subir tu audio mp3 a SoundCloud ........................................... 441 10.2.3 Publicación de un audio de SoundCloud en Blogger ..................... 442 10.2.4 Publicación de un audio de SoundCloud en Wordpress .................. 443Módulo 4. Vídeo ................................................................... 4461. Introducción ......................................................................................... 447 1.1 Conceptos básicos de video digital ..................................................... 448 1.2 Formatos de archivos de video .......................................................... 449 1.3 ¿Qué es el streaming? ..................................................................... 450 1.4 Optimización de archivos de video ..................................................... 451 1.5 Dispositivos de captura de video ........................................................ 4522. Reproducción de vídeos con VLC Media Player ................................................ 454 2.1 ¿Qué es VLC Media Player? ............................................................... 455 2.2 Instalación de VLC Media Player en Windows ......................................... 455 2.3 Instalación de VLC Media Player en Ubuntu ........................................... 455 2.4 Reproducción de un vídeo FLV con VLC ................................................ 4563. Descarga de archivos de vídeo ................................................................... 458 3.1 Descarga con vídeos Youtube con Firefox ............................................. 459 3.1.1 ¿Qué es Video DownloadHelper? .............................................. 459 3.1.2 Instalación de la extensión Video DownloadHelper ....................... 459 3.1.3 Descarga desde Youtube ....................................................... 460 3.2 Sitios web para descarga de vídeos..................................................... 4634. Captura de vídeo ................................................................................... 465 4.1 Windows Movie Maker..................................................................... 466 4.1.1 Instalación de Windows Movie Maker ........................................ 466 4.1.2 Abrir Windows Movie Maker ................................................... 466
    • Índice Temático 8Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1.3 Capturar vídeo de cámara DV ................................................. 467 4.1.4 Recortar un clip de vídeo ...................................................... 471 4.1.5 Exportar el archivo de vídeo .................................................. 472 4.2 Kino en Ubuntu ............................................................................ 474 4.2.1 Instalación de Kino ............................................................. 474 4.2.2 Configuración de permisos del puerto raw1394 ............................ 474 4.2.3 Instalación del paquete mjpegtools.......................................... 474 4.2.4 Abrir Kino ........................................................................ 475 4.2.5 Capturar vídeo de cámara DV ................................................. 476 4.2.6 Recortar un clip de vídeo ...................................................... 476 4.2.7 Exportar el archivo de vídeo .................................................. 478 4.2.8 Reproducir el vídeo final ...................................................... 4785. Edición de vídeo .................................................................................... 479 5.1 Introducción ................................................................................ 480 5.2 PhotoStory en Windows................................................................... 480 5.2.1 Instalación de PhotoStory ..................................................... 480 5.2.2 Creación de una narración de fotos .......................................... 480 5.3 Imagination en Ubuntu ................................................................... 503 5.3.1 Instalación de Imagination .................................................... 503 5.3.2 Creación de una narración de fotos .......................................... 5036. Conversión de formatos de vídeo ................................................................ 509 6.1 Propiedades de un vídeo con MediaInfo ............................................... 510 6.1.1 Información de un archivo multimedia que proporciona MediaInfo .... 510 6.1.2 Formatos de archivo leídos por MediaInfo .................................. 510 6.1.3 ¿Para qué se utiliza MediaInfo? ............................................... 510 6.1.4 Instalación de MediaInfo en Windows........................................ 510 6.1.5 Instalación de MediaInfo en Ubuntu ......................................... 510 6.1.6 Uso de MediaInfo ................................................................ 511 6.2 Conversión de formatos de vídeo con WinFF ......................................... 512 6.2.1 ¿Qué es WinFF? .................................................................. 512 6.2.2 Instalación de WinFF en Windows ............................................ 512 6.2.3 Instalación de WinFF en Ubuntu .............................................. 512 6.2.4 Conversión de un vídeo a distintos formatos ............................... 513 6.2.5 Reproducir el vídeo FLV........................................................ 5147. El DVD como fuente de video .................................................................... 515 7.1 Extracción con AutoGordian en Windows .............................................. 516 7.1.1 Introducción ..................................................................... 516 7.1.2 Software necesario ............................................................. 516 7.1.3 Pasos para convertir DVD a AVI ............................................... 517 7.2 Extracción con dvd::rip en Ubuntu ..................................................... 525 7.2.1 Introducción ..................................................................... 525 7.2.2 Software necesario ............................................................. 525 7.2.3 Configuración de dvd::rip ..................................................... 526 7.2.4 Convertir DVD a AVI con dvd::rip ............................................. 5278. Insertar un video en el blog ...................................................................... 529 8.1 Insertar un vídeo en Blogger ............................................................. 530 8.1.1 Insertar un vídeo en Blogger .................................................. 531 8.1.2 El formato Flash Vídeo (FLV) .................................................. 534 8.1.3 Publicación de vídeo FLV en Blogger ........................................ 534 8.2 Insertar un vídeo en Wordpress ......................................................... 540 8.2.1 Vídeos en Wordpress ........................................................... 541 8.2.2 Blip.tv............................................................................. 541 8.2.3 DailyMotion ...................................................................... 543 8.2.4 Otros servicios de vídeo........................................................ 544 8.2.5 VodPod: importación de vídeos para Wordpress ........................... 545
    • Índice Temático 9Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado9. Youtube: video en streaming .................................................................... 546 9.1 ¿Qué es Youtube? .......................................................................... 547 9.2 Acceso autentificado a Youtube ........................................................ 547 9.3 Publicación de un vídeo en Youtube ................................................... 547 9.4 Insertar un video de Youtube en Blogger .............................................. 551 9.4.1 Elegir el vídeo en Youtube .................................................... 551 9.4.2 Insertar el vídeo en una entrada de Blogger ............................... 552 9.5 Insertar vídeo de Youtube en Wordpress .............................................. 553 9.5.1 Elegir el vídeo en Youtube .................................................... 553 9.5.2 Insertar el vídeo en una entrada de Wordpress ............................ 553 9.5.3 Ejemplos de parámetros de integración de Youtube ...................... 554 9.6 Insertar una una lista de vídeos Youtube en Blogger ................................ 555 9.6.1 Crear una lista de vídeos en Youtube ........................................ 555 9.6.2 Insertar la lista de vídeos en una entrada de Blogger..................... 558 9.7 Añadir vídeos de Youtube a un gadget del blog ...................................... 560 9.7.1 Añadir un vídeo de Youtube a un gadget del blog ......................... 560 9.7.2 Los canales en Youtube ........................................................ 562 9.7.3 Añadir un canal temático de Youtube a un gadget del blog ............ 564 9.8 Añadir un video de Youtube a un widget de Wordpress ............................ 568 9.9 OverStream: vídeos subtitulados de Youtube ......................................... 568 9.9.1 ¿Qué es OverStream? ........................................................... 568 9.9.2 Crear un vídeo subtitulado .................................................... 568 9.9.3 Insertar un vídeo Overstream en una entrada de Blogger ................ 572 9.9.4 Insertar un vídeo Overstream en una entrada de Wordpress ............ 57310. Servicios de vídeo ............................................................................... 575 10.1 Introducción .............................................................................. 576 10.2 Copiar el código embed del vídeo ..................................................... 576 10.3 Insertar el vídeo en Blogger ............................................................ 578 10.4 Insertar el vídeo en Wordpress ........................................................ 578AnexosA1. 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 ................................. 591A2. del.icio.us: marcadores sociales .............................................................. 593 2.1 ¿Qué son los marcadores sociales? ...................................................... 594 2.2 ¿Qué es del.icio.us? ....................................................................... 594 2.3 Registrarse en del.icio.us ................................................................ 594 2.4 Instalación de los botones en el navegador ........................................... 594 2.5 Guardar un marcador a un artículo de un blog ....................................... 596 2.6 Importar favoritos del navegador a del.icio.us ....................................... 598 2.7 Editar marcadores del.icio.us desde página web..................................... 599 2.8 Editar los marcadores del.icio.us desde el propio navegador ...................... 600 2.9 Añadir un marcador en un navegador sin botones del.icio.us ...................... 602 2.10 Búsqueda por etiquetas en Mis marcadores.......................................... 604 2.11 Búsqueda de marcadores populares o recientes .................................... 605 2.12 Configuración de mi red social......................................................... 606 2.13 Suscripción a marcadores por etiquetas .............................................. 606
    • Índice Temático 10Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.14 Aplicaciones de del.icio.us en Blogger ............................................... 607 2.14.1 Network Badges ................................................................ 607 2.14.2 Linkrolls ......................................................................... 608 2.14.3 Tagrolls.......................................................................... 610 2.15 Aplicación de del.icio.us en Wordpress .............................................. 612Glosario de términos ........................................................................... 614Bibliografía sobre Web 2.0 ................................................................... 634Direcciones web ................................................................................. 638
    • Presentación 11Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoPresentaciónEn los últimos años hemos asistido a un considerable auge de los espacios web en el entornoeducativo. Hasta tal punto que hay quienes manifiestan que un centro educativo o persona noexiste si no es visible en Internet. Los sitios web no sólo se corresponden con entidadesdpúblicas o privadas sino también con páginas personales de carácter profesional y otrascentradas en el ocio y tiempo libre. Por otra parte la producción de recursos multimedia se haido orientando cada vez más hacia la web en detrimento del soporte CD-ROM o DVD porrazones obvias: coste, inmediatez, facilidad de actualización, difusión, etc.En la publicación de contenidos en Internet la opción más clásica ha sido la edición de páginasweb en el equipo local utilizando un editor visual HTML para luego publicarlas vía FTP en unservidor. Sin embargo esta práctica está cayendo en desuso a favor del empleo de un sistemade gestión de contenidos (CMS=Content Management System) que permite fácilmente laedición en línea. Estas soluciones se imponen porque descentralizan la gestión y facilitan eltrabajo colaborativo. Los CMS de uso más extendido son: Joomla/Drupal (sitio webinstitucional o de proyecto), MediaWiki (wiki), Wordpress/Blogger (blog) y Moodle (e-learning). Otras opciones de publicación son las redes sociales como Tuenti, Facebook,etc.En cualquiera de estas situaciones el curso "Multimedia y Web 2.0" puede resultarinteresante y útil. Su propósito es la formación en los procedimientos básicos para la creaciónde contenidos multimedia adaptados a la web. Se trata de preparar y optimizar recursos detipo texto, imagen, audio o vídeo con una adecuada relación peso/calidad, algo importanteen Internet, y que pueden publicarse en una página HTML, un gestor de contenidos CMS, unared social o bien servir de base para construir objetos o contenidos más complejos utilizandoherramientas de edición general (powerpoint, impress, flash, etc) o herramientas de autorpara recursos multimedia formativos (hot potatoes, jclic, squeak, lim, etc).La idea original en que se basa este curso es aportar pistas para afrontar un proceso creativocompleto. 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 unalocución, etc). A continuación se propone el tratamiento para darles un formato másadecuado. Estos materiales se pueden publicar en un servicio Web 2.0 para finalmenteintegrarlos en una entrada o gadget del blog.No es propósito del curso alcanzar un dominio muy elevado de todos y cada uno de losprogramas 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ánunos recursos de partida, una o varias aplicaciones de software y una secuencia detallada depasos para obtener el contenido multimedia final. Por otra parte se ha pretendido que cadaapartado sea independiente del resto para conseguir cierta modularidad.El curso se organiza en 4 módulos:  Blogs  Imagen  Audio  VideoEn el módulo Blogs se propone Blogger o Wordpress como servicio en el cual crear ygestionar un blog orientado a la publicación de contenidos en Internet. Se detallan losprocedimientos para publicar entradas o artículos que contengan texto, enlace, imágenes,etc. También se describe cómo personalizar su estilo gráfico y añadir gadgets ofuncionalidades adicionales en la idea de dotarlo de cierta singularidad. La publicación dearchivos PDF pone a disposición de los lectores información en este interesante formato.También se hace referencia a las posibilidades de Google Docs para la gestión colaborativade documentos de texto, presentaciones, hojas de cálculo y formularios que también sepueden publicar en un blog. Por su facilidad y prestaciones adicionales, el blog es el
    • Presentación 12Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoprotagonista principal de este curso. Por este motivo toda la producción se orienta a lapublicación final en este medio.En el apartado de Imagen se utilizará el programa GIMP. Se plantean operaciones básicascomo convertir formatos de archivos, reducir la paleta de colores, modificar las dimensionesde la imagen o del lienzo, etc. También se explican procedimientos habituales tales comocomponer imágenes, aplicar filtros y el tratamiento de imágenes por lotes. Se proponendistintos servicios Web 2.0 como Flickr, Picasa, Slide.com, SlideShare.net, etc donde esposible subir fotografías y presentaciones susceptibles de publicación posterior en nuestroblog.En lo relativo al Audio se sugiere el empleo de Audacity para reproducir, grabar desdedistintos medios y convertir a formato mp3 y ogg. Otra posibilidad es extraer el audio de unapista de CD. La edición de audio permite copiar, pegar, mezclar, aplicar efectos, etc paraconseguir un audio más elaborado. Una vez que se dispone de una o varias pistas de audio seutilizarán distintas soluciones para integrar su audición en una entrada del blog. Otra opciónes subir el audio a servicios Web 2.0 como GoEar o DivShare e incrustar posteriormente elreproductor que proporcionan.En el módulo sobre Vídeo se plantean los principales conceptos relacionados con el vídeodigital para luego proponer la visualización de vídeos con el reproductor universal: VLC MediaPlayer. Se proporciona información de cómo utilizar extensiones de Mozilla Firefox (VideoDownloadHelper) 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 conMedia Info y convertir a otros formatos con WinFF. Otra opción es extraer el vídeo de un DVDcon soluciones como AutoGordian. Se ejemplifica cómo mostrar vídeos dentro del artículo deun blog. Los repositorios de vídeos Web 2.0 como Youtube, Revver, Metacafé, Vimeo, etcofrecen una excelente alternativa para el alojamiento y difusión en streaming de vídeos queposteriormente se pueden integrar en Blogger.Todas las aplicaciones de software que se proponen son de uso gratuito y de libredistribución. En muchos casos se ofrecen versiones portables de los programas para facilitarsu uso en una memoria USB sin necesidad de instalación previa en el ordenador. El curso sepuede 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 puedeencontrar aquí recetas útiles para resolver las necesidades más básicas relacionadas con laelaboració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? 14Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. ¿Qué es la Web 2.0?
    • Blogs ::: ¿Qué es la Web 2.0? 15Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.1 Concepto de Web 2.0El término Web 2.0 fue acuñado por el americano Dale Dougherty de la editorial OReillyMedia durante el desarrollo de una conferencia en el año 2004. El término surgió parareferirse a nuevos sitios web que se diferenciaban de los sitios web más tradicionalesenglobados bajo la denominación Web 1.0. La característica diferencial es la participacióncolaborativa de los usuarios. Un ejemplo de sitio web 1.0 sería la Enciclopedia Británicadonde los usuarios pueden consultar en línea los contenidos elaborados por un equipo deexpertos. Como alternativa web 2.0 se encuentra la Wikipedia en la cual los usuarios que lodeseen pueden participar en la construcción de sus artículos. Poco tiempo después, en el año2005, Tim OReilly definió y ejemplificó el concepto de Web 2.0 utilizando el mapaconceptual elaborado por Markus Angermeier.La Web 2.0 o Web social es una “denominación de origen” que se refiere a una segundageneración en la historia de los sitios web. Su denominador común es que están basados en elmodelo 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 deinformación entre los usuarios y la colaboración en la producción de contenidos. Todos estossitios utilizan la inteligencia colectiva para proporcionar servicios interactivos en la red dondeel 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 sesustentan en una base de datos, la cual puede ser modificada por los usuarios del servicio, yasea en su contenido (añadiendo, cambiando o borrando información o asociando datos a lainformación existente), pues bien en la forma de presentarlos, o en contenido y formasimultáneamente."- (Ribes, 2007)
    • Blogs ::: ¿Qué es la Web 2.0? 16Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.2 Principios generales de la Web 2.0 1. Orientado a Internet. Todo está en la web. Sólo hace falta un navegador web y una conexión a Internet. Esto garantiza la movilidad del usuario y el acceso multiplataforma desde cualquier sistema. La actividad depende cada vez más de la conexión a Internet en detrimento del uso de programas instalados en el equipo. La tecnología se apoya más del lado del servidor simplificando al cliente las actualizaciones, revisiones, depuración de errores, etc. 2. Comunidades de usuarios. La Web 2.0 es una actitud y no una tecnología. Su empleo supone la participación bajo las directrices de las “4 C”: Comunicarse, Compartir, Colaborar y Confiar. Los usuarios son creadores de contenidos y no solamente meros consumidores. Y además esta creación se puede realizar de forma cooperativa de acuerdo con unas reglas y roles definidos y aceptados. El administrador delega su confianza en otros usuarios para que puedan publicar libremente. 3. Perpetua Beta. En constante revisión. La aplicación se orienta al usuario y se mejora gracias a la experiencia y aportaciones de éstos. 4. Facilidad. Permite una gestión ágil y precisa de la información en distintos contextos y con distintos propósitos. Gracias al uso de CMS (gestores de contenidos): Joomla, Wordpress, Drupal, Moodle, MediaWiki, etc . 5. Gratuidad. En la mayoría de los casos su uso es gratuito en un contexto personal o educativo. 6. Personalización. Los servicios y gestores CMS se pueden adaptar a las necesidades del usuario al permitir la personalización de muchas de sus opciones: activación/ocultación de gadgets, configuración del tema de presentación (separación de forma y contenidos), categorías para la clasificación de contenidos, etiquetas, etc. 7. Integración y conexión. Los contenidos multimedia soportados por los distintos servicios se integran fácilmente en las páginas de los CMS (embed) y además son directamente enlazables (link). Incluso algunos servicios utilizan los recursos alojados en otros (mashups). Ejemplo: Panoramio permite al usuario añadir una capa de información a un mapa interactivo de Google Maps. Esta integración produce una red compleja cuyos nodos más visibles son los blogs, wikis, joomlas, moodles, drupales, repositorios multimedia y redes sociales. 8. Propagación viral. La información nueva se difunde rápidamente gracias a la suscripción RSS, agregadores, trackbacks, pings, redes sociales, etc. 9. Etiquetado social. El usuario asigna libremente las etiquetas y categorías a los artículos, imágenes, audios, marcadores, podcasts, vídeos, etc. Surgen así las categorías sociales o folksonomías, un sistema de etiquetas sin jerarquías predeterminadas que facilita la búsqueda de los contenidos. 10. Iniciativa descentralizada. Las redes sociales (FaceBook, Ning, Tuenti, …) proporcionan la posibilidad de crear y mantener fácilmente un espacio de encuentro entre personas con intereses comunes. Y todo ello al margen de líderes o hegemonías más verticales. Cualquier persona puede tener en pocos minutos un espacio en Internet donde publicar sus opiniones, consultas, dudas, experiencias, etc y también donde invitar a otros a participar.
    • Blogs ::: ¿Qué es la Web 2.0? 17Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.3 Algunos ejemplos de iniciativas Web 2.0 1. Blogs. Proporcionan un sistema fácil y asequible de publicar en Internet a título individual o colectivo. Es el nodo más abundante en la Web 2.0. Puede ser el escaparate que concentre en un mismo sitio distintos recursos alojados en otros servicios. Admiten una gestión colaborativa de contenidos basada en roles. La información se organiza en artículos ordenados cronológicamente, páginas, enlaces y comentarios. Algunos portales de blogs más populares son: Blogger (http://www.blogger.com/) , Wordpress.com (http://wordpress.com/) , Blogspot (http://blogspot.es/), etc. 2. Wikis. No están tan extendidos como los blogs porque demandan mayor nivel de compromiso en la construcción de contenidos. Se puede utilizar para crear la documentación de un proyecto de forma colaborativa: glosarios, enciclopedias, manuales, enlaces, etc. El espacio wiki por excelencia es la enciclopedia Wikipedia (http://es.wikipedia.org/). 3. Gestores CMS (Content Management System = Sistema de Gestión de Contenidos) Algunos ejemplos de CMS gratuitos son Joomla (http://www.joomlaspanish.org/) o Drupal (http://drupal.org.es/) . Se suelen utilizar para crear sitios web institucionales o corporativos. Para ello basta descargarse la aplicación y subirla a un servidor de hosting. Permiten la publicación colaborativa (roles) en línea de las noticias que afectan a una comunidad. Basan la organización de los artículos en secciones (cajones) y categorías (carpetas dentros de esos cajones). El uso de CMS deja atrás los sitios web estáticos HTML diseñados con FrontPage, Dreamweaver, etc y que se actualizaban subiendo sus páginas mediante un cliente FTP. 4. Plataforma de elearning. Se denominan sistemas LMS (Learning Management System = Sistema de Gestión del Aprendizaje) y se utilizan para crear entornos de elearning. El LMS más utilizado actualmente es Moodle (http://moodle.org/). El profesor/a crea un curso que consiste en una agenda de contenidos y actividades que el alumno realiza siguiendo la progresión establecida. El sistema se complementa con unas herramientas de comunicación (mensajería interna y foros) y con un subsistema de seguimiento de la actividad del alumno. Muchas universidades e instituciones públicas educativas han abandonado el desarrollo de sus propias plataformas de elearning en favor del uso de Moodle. Tanto los CMS como LMS se han clasificado como sitios “Web 1.5” porque admiten un uso 1.0 ó 2.0 en función de cómo sus administradores organicen la participación de los usuarios. 5. Imágenes. Espacios como Flickr (http://www.flickr.com/), Picasa (http://picasa.google.com/), etc permiten el alojamiento en línea de imágenes y luego su posterior utilización en otros servicios o recursos. Otros espacios web de valor añadido como Pixrl (http://www.pixlr.com) ofrece la posibilidad de editar imágenes y añadirles efectos a partir de imágenes propias o alojadas en los repositorios anteriores. 6. Podcasts. Permiten el almacenamiento y difusión de audios. Se trata de recursos que se integran en cualquier CMS o bien se enlazan directamente. Se agrupan y clasifican en categorías o por etiquetas para facilitar la búsqueda de los activos propios y ajenos. Ejemplos: LastFM (http://www.lastfm.es/), Odeo (http://odeo.com/), GoEar (http://www.goear.com/), PodSonoro (http://www.podsonoro.com/), etc. 7. Google Maps. La localización geográfica de imágenes, textos, enlaces, vídeos o documentos facilita el desarrollo de contenidos en múltiples contextos. En la actualidad hay un montón de servicios que aprovechan las prestaciones de la API de Google Maps (http://maps.google.es) para ofrecer la geolocalización de sus recursos
    • Blogs ::: ¿Qué es la Web 2.0? 18Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado sobre uno de sus mapas: Youtube (http://www.youtube.com/), Panoramio (http://www.panoramio.com/), etc. 8. Repositorios de vídeos. Youtube (http://www.youtube.com/) es el gran líder especializado en el alojamiento y difusión de vídeos. Se dispone de millones de documentos videográficos sobre los temas más variados. No sólo proporciona soporte de almacenamiento sino también de difusión en streaming facilitando su correcta visualización a través de internet. Se pueden crear listas de reproducción temáticas, canales, anotaciones en los vídeos, subtítulos, etc. Existen multitud de espacios que representan una alternativa para publicar vídeos: Revver (http://revver.com/), MetaCafe (http://www.metacafe.com/), Vimeo (http://www.vimeo.com/), etc. Algunos soportan retransmisión en directo como LiveStreaming (http://www.livestream.com/). 9. Ofimática en línea. En el desarrollo de proyectos puede resultar interesante por un lado la creación y publicación compartida de documentos de texto, presentaciones y hojas de cálculo y por otra la comunicación en tiempo real (mensajería instantánea) o diferido (emails). En este contexto, por ejemplo, Google Apps (http://  www.google.com/apps/) puede ser un excelente recurso gratuito para crear y desarrollar una comunidad de trabajo. Otra posibilidad es eyeOS (http://eyeos.org/). Se trata de un atractivo escritorio con distintas aplicaciones ofimáticas en línea de carácter colaborativo. Otro paquete ofimático en línea es Zoho (http://www.zoho.com/). 10. Presentaciones. Uno de los usos más extendidos es el diseño y publicación en la Web de presentaciones de diapositivas como SlideShare (http://www.slideshare.net/) o SplashCast (http://www.splashcastmedia.com/), de fotografías como Slide.com (http://www.slide.com/), de documentos como Scribd.com (http://www.scribd.com/), etc que luego se insertan en blogs, wikis, y otros CMS, etc. Otra posibilidad interesante en el conocimiento histórico es organizar una presentación donde se ordenan cronológicamente los recursos sobre una línea de tiempo como XTimeline (http://www.xtimeline.com/). 11. Marcadores sociales. Utilizando servicios como del.icio.us (http://delicious.com/) se puede disponer en línea de los marcadores o favoritos a sitios web y compartir estas direcciones con los demás.1.4 El navegador webComo se ha indicado con anterioridad para acceder a la web 2.0sólo necesitamos disponer de una conexión a Internet y de unnavegador web. En principio se puede utilizar cualquier navegador:Internet Explorer, Google Chrome, Mozilla Firefox, Opera, Flock,etc.Sin embargo en este curso se recomienda el uso de Mozilla Firefoxporque representa una excelente alternativa a Internet Explorer.Sus características más destacadas son:  Multiplataforma. Existen versiones de Mozilla Firefox para Windows, Linux y Mac.  Navegación con pestañas. Se pueden abrir simultáneamente varias páginas web de tal forma que cada una se visualiza en una pestaña independiente. Cada pestaña dispone de su propio botón de cerrado. Si se cierra accidentalmente una pestaña se puede recuperar en el menú Historial.
    • Blogs ::: ¿Qué es la Web 2.0? 19Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado  Restauración de sesión. Cuando Firefox se cierra o reinicia se ofrece la opción de restaurar la sesión para evitar la pérdida de información en formularios, descargas, etc.  Corrector ortográfico. Si se dispone del complemento Diccionario de Español/España se puede activar el corrector ortográfico integrado que subrayará las palabras no tecleadas correctamente en cualquier cuadro de texto de la página web. Mediante clic derecho sobre esa palabra se ofrecerán alternativas para sustituirla.  Sugerencias de búsqueda. Al comenzar a escribir en la barra de búsqueda de Google se mostrará una lista de sugerencias.  Canales RSS. Permite leer directamente los titulares de noticias RSS sin necesidad de tener instalado ningún otro programa.  Búsqueda integrada. Firefox proporciona una barra de búsqueda que integra los motores más utilizados a nivel mundial: Google, Yahoo!, eBay, Diccionario RAE, Wikipedia y Creative Commons. Para ello basta con elegir el motor e introducir el término de búsqueda.  Bloqueador de ventanas emergentes. Se pueden controlar las ventanas emergentes molestas evitando que se desplieguen. Mediante una barra informativa o un icono en la parte inferior de la pantalla se notifica al usuario el bloqueo de ventanas.  Accesibilidad. Firefox incluye distintas prestaciones para facilitar la accesibilidad a personas con deficiencias visuales: aumento del tamaño de la fuente mediante <Ctrl>+Scroll del ratón, compatibilidad con lectores de pantalla (p.e. Freedom Scientific’s JAWS).  Protección antiphising. Cuando una página web sea sospechosa de fraude por robo de identidad digital frente a una entidad bancaria (physing), Firefox advertirá al usuario y ofrecerá una página de búsqueda para encontrar la página auténtica que se está buscando.  Actualizaciones automáticas. Firefox comprueba la versión del navegador y si existe una más reciente avisa al usuario sobre la posibilidad de instalarla. Esta actualización suele ser pequeña resultando fácil y rápida de descargar e instalar.  Protección contra programa espías. Firefox no permite que una página web descargue, instale o ejecute programas en el equipo sin un consentimiento explícito del usuario.  Limpieza de información privada. Utilizando esta utilidad situada en el menú Herramientas se garantiza que se limpian todos los datos privados de la navegación en un solo clic. Es especialmente útil en un equipo multiusuario donde se abre sesión siempre con el mismo usuario Windows.  Complementos. Firefox ofrece más de 1000 complementos que permiten aumentar las prestaciones por defecto de este navegador web: lectura de noticias RSS, herramientas web y de desarrollo, descargas de archivos, privacidad y seguridad, herramientas de búsqueda, marcadores, diccionarios, multimedia, etc. El uso de un administrador de complementos facilita las operaciones de instalación, desinstalación y desactivación.  Temas. Se pueden instalar y configurar distintos temas que permiten cambiar los colores, fuentes, iconos, gráficos, etc del interfaz de Mozilla Firefox.  Plugins. Firefox dispone de la mayoría de plugins necesarios para visualizar todo tipo de contenidos multimedia: Adobe Flash Player, Java, QuickTime, RealPlayer, Windows Media Player, etc.En el sitio web oficial del proyecto Mozilla Firefox podrás encontrar la versión más reciente oque se adapta a tu sistema: http://www.mozilla-europe.org/es/firefox/. Descarga e instalaeste programa en tu equipo. Otra posibilidad es utilizar la versión portable para Windows quepuedes conseguir en: http://portableapps.com/apps/internet/firefox_portable
    • Blogs ::: Iniciación a los blogs 20Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Iniciación a los blogs
    • Blogs ::: Iniciación a los blogs 21Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2.1 ¿Qué es un blog?Un blog es un sitio web que se actualiza periódicamente y que ofrece la lectura deinformación de uno o varios autores sobre temas de interés. La unidad fundamental deinformación de un blog es el artículo, también llamado “post” o “entrada”. Estos artículos semuestran siguiendo una ordenación cronológica inversa, es decir, se mostrará primero elartículo más reciente. En consecuencia podemos definir un blog como una recopilación deartículos ordenados cronológicamente.Para el autor/autores de un blog, se trata de un sistema que facilita la publicación decontenidos multimedia en Internet ofreciendo en todo momento el control y libertad paraeditar y modificar la información publicada.En cada artículo los lectores pueden escribir sus comentarios y el autor darles respuesta. Deesta forma se fomenta un diálogo que autores y lectores pueden compartir. Sin embargo estaopción depende de la moderación del autor o autores del blog y por supuesto de que loslectores decidan intervenir libremente con sus aportaciones.La temática de un blog es muy variada. En la blogosfera hay blogs personales, periodísticos,empresariales, tecnológicos, educativos (edublogs), políticos, etc.Ejemplos de blogs muy populares en España:  Microsiervos: http://www.microsiervos.com/  Genbeta: http://www.genbeta.com/  Xataka: http://www.xataka.com/  Alt1040: http://alt1040.com/  Wwwhatsnew: http://wwwhatsnew.com/
    • Blogs ::: Iniciación a los blogs 22Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2.2 Anatomía de un blogUn blog dispone de dos interfaces diferenciados:  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 BackendLa estructura del Frontend 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 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 23Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEn la lectura de una entrada o artículo se suelen ofrecer los siguientes elementos: 1. Fecha de publicación del artículo. 2. Título del artículo. Cuando el usuario hace clic en su enlace se accede al artículo de forma individual mostrándose los comentarios asociados al final del mismo. 3. Contenido del artículo. Puede contener texto, enlaces, imágenes, audios, vídeos, etc. 4. Autor del artículo. Se muestra el nombre del autor del artículo. Puede resultar interesante cuando en un blog publican varios usuarios. 5. Hora de publicación. 6. Comentarios. Muestra el número de comentarios realizados a esa entrada. Cuando el usuario hace clic en este enlace accede a los comentarios publicados. 7. Edición. Cuando el usuario que navega está autentificado como administrador del blog aparece en cada artículo un icono en forma de lápiz proporcionando un enlace directo al backend de edición de su contenido. 8. Entradas recientes / posteriores. Estos enlaces de navegación situados al final de una página permiten acceder al resto de artículos. 9. Página principal. Enlace a la portada del blog donde se mostrará una página con los últimos artículos publicados. 10. Suscripción. Este enlace permite suscribirse a la publicación de entradas de nuestro blog utilizando el navegador web o bien un programa específico de lectura de feeds.Cuando el artículo se muestra de forma individual en una página, se accede a los comentariosasociados que se sitúan al final de su contenido. El administrador del blog puede permitir odenegar el envío de comentarios a un artículo en concreto o a todos los artículos del blog. Encaso favorable es muy recomendable activar la moderación de comentarios para que eladministrador los supervise antes de que aparezcan publicados. Cada artículo de un blogdispone de una dirección individual y única (permalink o enlace permanente) que se puedeutilizar para situarse en él directamente.
    • Blogs ::: Iniciación a los blogs 24Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2.3 Características de los blogsLas características de los blogs que han justificado su auge han sido:  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.2.4 Tipos de blogsLos blogs tienen distintas variantes en función de su funcionamiento, tipo de contenidopredominante, dispositivo donde se visualizarán, etc. Entre ellos destacan:  Openblog. Es un blog que no requiere interfaz de administración y proporciona una herramienta para que sus visitantes puedan publicar de forma abierta y libre. Es de carácter colectivo y público. Tiene muchas similitudes con un foro. Ejemplo: OpenBlog (http://www.open-b.net).  Fotolog. Como su nombre indica es un blog donde la foto es el elemento principal de publicación. La imagen y la fecha de publicación son los contenidos obligatorios. A diferencia de un álbum de fotos sólo se publica una o dos fotos en cada entrada y se pueden acompañar de comentarios del autor. También admite comentarios de los visitantes y enlaces a los fotologs de los amigos. Ejemplo: Fotoblog (http://www.fotolog.com/).  Videoblog. Un videoblog o vlog es un blog cuyas entradas son clips de vídeo, ordenados cronológicamente y publicados por uno o más autores. El administrador del vlog puede autorizar a otros usuarios a añadir comentarios u otros vídeos dentro de la misma galería. Suelen ser archivos de formato MOV o FLV y utilizan el visor de Adobe Flash para su visualización. Ejemplo: Yograbo (http://www.yograbo.com/).  Audioblog. Es un tipo de blog donde cada entrada suele ser un audio en formato MP3 o similar. Se reproducen en línea gracias a una consola de tecnología Adobe Flash y en algunos casos admiten la descarga de los usuarios.  Moblog. Moblog es un término que surge de la fusión de las palabras "Mobile" y "Blog". Se trata de un servicio de publicación similar a un blog pero orientado a su visualización en equipos móviles: PDA o teléfonos móviles. Se puede acceder a su contenido y publicar desde cualquier dispositivo y lugar. Algunos servicios web 2.0 están orientando la publicación a estos formatos permitiendo la creación y manejo del blog desde equipos fijos o móviles. Ejemplo: Moblob (http://www.moblog.cl/mb_indexframe.php).
    • Blogs ::: Iniciación a los blogs 25Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Tumbleblog. Un tumblelog o tlog es una variante de blog poco estructurado. No se ajusta a una temática concreta y el autor va publicando entradas sobre enlaces, fotografías, informaciones, etc. que va encontrando por Internet. En este sentido recupera un poco el espíritu inicial con que aparecieron los blogs: dar a conocer a los amigos las cosas que cada día te encuentras por la web. La carga textual de sus entradas es mínima y en este sentido es un formato muy ligado al microblogging. Ejemplo: Tumbrl (http://www.tumblr.com/).  Microblog. El microblogging o nanoblogging permite al autor publicar mensajes breves (no superiores a 140 caracteres) formados por texto y enlaces. Estas entradas se muestran en la página del perfil del usuario y también son enviadas a otros usuarios que han elegido la opción de recibirlas. Ejemplo: Twitter (http://twitter.com/).2.5 Servicios de blogsEn Internet existen dos procedimientos para disponer de un blog:  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 sobrecuál elegir entre los dos líderes del sector: Blogger o Wordpress. Ambos tienen ventajas einconvenientes 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 ofrecenun 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 blogde Blogger o bien con un blog de Wordpress
    • Blogs ::: Mi primer artículo 26Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Mi primer artículo
    • Blogs ::: Mi primer artículo 27Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.1 Mi primer artículo en Blogger
    • Blogs ::: Mi primer artículo 28Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEl propósito de este actividad es diseñar tu primera entrada en un blog de Blogger. El temaelegido es una breve pincelada del poeta Federico García Lorca. En este documento seutilizarán: título, texto, imagen y un enlace a una página externa.3.1.1 Crear un blog en BloggerEn este apartado se explican los pasos para crear un blog en el servicio Blogger. Como pasoprevio es necesario disponer de una cuenta Google. Es muy interesante tener esta cuentaporque asociada a ella se disponen de interesantes aplicaciones. Algunas de ellos se trataránen este curso. 1. Abre el navegador web y visita la URL de inicio de Blogger: https://www.blogger.com/start?hl=esSi ya dispones de una cuenta Google (en caso contrario pasa a la siguiente página): 2. Si ya dispones de cuenta Google 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. Un usuario Google puede crear y mantener varios blogs. Haz clic en el enlace Crear un blog.
    • Blogs ::: Mi primer artículo 29Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoSi NO dispones de cuenta Google: 2. Desde la página de inicio de Blogger haz clic en el botón CREAR UN BLOG. 3. Rellena el formulario Crear una cuenta de Google y pulsa en el botón Continuar. 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 contraBlogger nos encontraremos en el paso 2 de creación de nuestro blog.
    • Blogs ::: Mi primer artículo 30Multimedia 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 6. Introduce la palabra de paso o antispam y haz clic en el botón Continuar. 7. En el siguiente paso haz clic sobre una plantilla de presentación del blog y pulsa en el botón Continuar. Posteriormente podrás modificar esta plantilla. 8. Si el proceso de creación del blog ha concluido con éxito se mostrará el mensaje Se ha creado tu blog. Para acceder al panel de administración de contenidos de ese blog haz clic en el botón EMPEZAR A PUBLICAR.
    • Blogs ::: Mi primer artículo 31Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. En posteriores accesos a Blogger encontrarás en el Escritorio una entrada a la administración del blog creado.3.1.2 Crear una nueva entrada 5. Abre el navegador web y accede a la URL de inicio de Blogger: https://www.blogger.com/start?hl=es 6. 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. 7. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio. 8. En este panel aparecerán los distintos blogs que gestionas en Blogger. 9. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición del blog donde deseas publicar el artículo.3.1.3 Añadir título y texto 1. Descarga y descomprime el contenido del archivo lorca.zip. Como resultado obtendrás dos archivos: un fichero de texto lorca.txt y una imagen lorca.jpg.
    • Blogs ::: Mi primer artículo 32Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 33Multimedia 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.3.1.4 Añadir una imagen 1. En la barra de herramientas del editor haz clic en el botón Añadir Imagen. 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. 3. En el área Elige un diseño selecciona un tipo de alineamiento. Por ejemplo: Izquierda. 4. En la parte inferior activa la casilla de aceptación de condiciones y pulsa en el botón SUBIR IMAGEN. 5. 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.
    • Blogs ::: Mi primer artículo 34Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. De regreso al editor se mostrará la imagen insertada en el artículo. Se puede arrastrar la imagen para situarla en cualquier lugar del artículo.Nota: La imagen que se ha subido al servidor siguiendo el procedimiento descrito queda alojada en el servicio Picasa Web asociado a la cuenta de usuario de Google. 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.3.1.5 Añadir un hipervínculoUn enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web yque está vinculada a otras páginas del mismo u otro sitio. Al situar el puntero del ratón sobreél, éste toma el aspecto de una mano. Al hacer clic se mostrará en el navegador web la nuevapágina vinculada al mismo. 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 35Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. 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. 3. Pulsa y arrastra para seleccionar el texto “Más información” situado al final del documento. A continuación en la barra del editor pulsa en el botón Enlace. 4. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar. 5. Clic en el botón Aceptar para guardar la dirección pegada. 6. Para terminar haz clic en el botón GUARDAR AHORA.3.1.6 Otras opciones de la entradaEn la parte inferior del editor:  Etiquetas. Introduce las etiquetas o palabras clave que deseas asociar al artículo pero separadas por comas. Ejemplo: poesía, generación 27.  Comentarios. Haz clic en el enlace Opciones de entrada para mostrar un panel adicional donde se pueden configurar algunos parámetros adicionales. Por ejemplo si se permitirán o no los comentarios de los lectores.  Fecha y hora de la entrada. Se puede modificar la fecha y hora que el sistema asigna por defecto al artículo.
    • Blogs ::: Mi primer artículo 36Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.1.7 Publicar la entrada 1. Clic en el botón PUBLICAR ENTRADA para que el artículo se visualice por los lectores del blog. 2. Para ver el resultado final haz clic en el enlace Ver blog.3.1.8 URL permanente a una entradaAl pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y alfinal aparecerán los comentarios asociados. Si en ese momento te fijas en la barra dedirección del navegador web, podrás comprobar que ese artículo dispone de una URL quepermite acceder al mismo de forma individual. Su formato suele ser: http://<tituloblog>.blogspot.com/<añopub>/<mespub>/<titulo-entrada>.html
    • Blogs ::: Mi primer artículo en Wordpress 37Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.2 Mi primer artículo en Wordpress
    • Blogs ::: Mi primer artículo en Wordpress 38Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEl propósito de este actividad es diseñar tu primera entrada en un blog de Wordpress. El temaelegido es una breve pincelada del poeta Federico García Lorca. En este documento seutilizarán: título, texto, imagen y un enlace a una página externa.3.2.1 Crear un blog en WordpressEn este apartado se explican los pasos para crear un blog en el servicio Wordpress. Como pasoprevio es necesario disponer de una cuenta Wordpress. 1. Abre el navegador web y visita la URL de inicio de Wordpress: http://wordpress.com/. Selecciona como idioma: Spanish-Español.Si NO dispones de cuenta Wordpress: 1. Clic en el botón Registrarse ahora o similar. 2. En el formulario introduce: Nombre de usuario, contraseña (confirmación), dirección de email y aceptación de las condiciones. 3. Al darte de alta en Wordpress ya puedes crear un blog en el mismo paso. Este nuevo blog tendrá la dirección: http://<nombre_de_usuario>.wordpress.com. Para ello marca la casilla ¡Dénme un blog!. 4. Clic en el botón Siguiente. Anota el usuario y contraseña de esta cuenta para no olvidarla.Si ya dispones de una cuenta en Wordpress: 1. Introduce sus credenciales (usuario y contraseña) en una barra superior y pulsa en el botón Iniciar sesión/Log in. 2. Si el proceso de autentificación se ha producido con éxito te situarás en el Tablero. 3. Un usuario de Wordpress puede crear y mantener varios blogs. Al crear tu usuario en Wordpress puedes haber creado un blog por defecto con la dirección http://<nombre_de_usuario>.wordpress.com. Este mismo blog puede servir para realizar las prácticas del curso. Si deseas crear y utilizar otro blog distinto haz clic en el enlace Registrar otro blog que se ofrece debajo del listado de Tus blogs. 4. Introduce los datos del nuevo blog:  Dominio del Blog. Es el identificador que precede a “wordpress.com” en su dirección. Por ejemplo: miblog.wordpress.com. El sistema comprueba al crearlo si ese identificador ya existe. En caso afirmativo solicitará que introduzcas otro nombre.
    • Blogs ::: Mi primer artículo en Wordpress 39Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Título del blog.  Idioma. En este caso elige el idioma principal de tu blog: español.  Privacidad. Marca esta opción si deseas que tu blog aparezca en las listas públicas de Wordpress.com y en los buscadores como Google o Technorati 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. 6. En posteriores accesos a Wordpress encontrarás en el Tablero un listado de los blogs que administras. El acceso a un blog se realizará mediante clic sobre su correspondiente entrada. (Versión en español) (Versión en inglés)
    • Blogs ::: Mi primer artículo en Wordpress 40Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.2.2 Crear una nueva entrada 1. Abre el navegador web y accede a la URL de inicio de Wordpress: http://wordpress.com 2. Introduce sus credenciales (usuario y contraseña) en una barra superior y pulsa en el botón Iniciar sesión/Log in. 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.3.2.3 Añadir título y texto 1. Descarga y descomprime el contenido del archivo lorca.zip. Como resultado obtendrás dos archivos: un fichero de texto lorca.txt y una imagen lorca.jpg. 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 41Multimedia 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 42Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.2.4 Añadir una imagen 1. En la barra de herramientas que se ofrece por encima del editor haz clic en el botón Añadir una imagen. 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. 3. Localiza y apunta al archivo lorca.jpg que hemos obtenido en un paso anterior. Observa que sólo se admiten para subir al servidor los formatos de archivo: jpg, jpeg, png, gif, pdf, doc, ppt, odt, pptx y docx.
    • Blogs ::: Mi primer artículo en Wordpress 43Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Después de seleccionar el archivo de imagen se inicia automáticamente la subida de ese archivo al servidor. Una vez concluida se mostrará la imagen. Introduce el Título de la imagen, por ejemplo, Federico García Lorca. Es la etiqueta que identificará ese archivo en la galería de imágenes guardada en el servidor para ese blog. 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. 6. En el área Alineación selecciona un tipo de alineamiento. Por ejemplo: Izquierda. Esto hace que el texto fluya alrededor de la imagen. Hay otras posibilidades. 7. En Tamaño elige la opción Tamaño completo. Wordpress genera vistas en miniatura de una imagen cuando se sube. En este caso seleccionaremos el tamaño de la imagen completa.
    • Blogs ::: Mi primer artículo en Wordpress 44Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Clic en el botón Insertar en la entrada. La imagen se sitúa dentro del artículo. Puedes hacer clic sobre la imagen para arrastrarla y soltarla en otro lugar del texto de la entrada. 9. De regreso al editor se mostrará la imagen insertada en el artículo. Se puede arrastrar la imagen para situarla en cualquier lugar del artículo.Nota: La imagen que se ha subido al servidor siguiendo el procedimiento descrito queda alojada en la galería multimedia asociada a ese blog. Esta galería dispone de un espacio máximo de 3 GB para guardar imágenes y otros archivos. 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.3.2.5 Añadir un hipervínculoUn enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web yque está vinculada a otras páginas del mismo u otro sitio. Al situar el puntero del ratón sobreél, éste toma el aspecto de una mano. Al hacer clic se mostrará en el navegador web la nuevapágina vinculada al mismo. 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 45Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado los términos de búsqueda relativos al autor que nos ocupa: http://www.google.es/search?q=Federico+García+Lorca 2. 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. 3. Pulsa y arrastra para seleccionar el texto “Más información” situado al final del documento. A continuación en la barra del editor pulsa en el botón Enlace. 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.3.2.6 Otras opciones de la entradaEn la página donde se edita una entrada se pueden configurar distintas opciones de esteartículo:  Publicar. Se pueden definir los siguientes parámetros del artículo haciendo clic en el enlace Editar que acompaña a cada uno: o Estado. Borrador –no publicado-, Pendiente de revisión o Publicado. o Visibilidad. Público, Protegido con contraseña o Privado. o Publicar inmediatamente. Permite definir la fecha y hora posterior o anterior a la actual en que se publicará esa entrada. La opción por defecto es: inmediatamente aunque si se define una fecha futura y se pulsa en el botón Publicar, la entrada no será visible hasta que se alcance esa fecha.
    • Blogs ::: Mi primer artículo en Wordpress 46Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  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.  Comentarios. Activa la casilla Permitir comentarios para permitir los comentarios de los usuarios a esta entrada. Activa la casilla Permitir trackbacks y pingbacks para facilitar los avisos al publicarse este artículo.
    • Blogs ::: Mi primer artículo en Wordpress 47Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.2.7 Publicar la entrada 1. Clic en el botón Publicar para que el artículo se visualicepor los lectores del blog. 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.3.2.8 Enlace permanente a una entradaAl pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y alfinal aparecerán los comentarios asociados. Si en ese momento te fijas en la barra dedirección del navegador web, podrás comprobar que ese artículo dispone de una URL quepermite acceder al mismo de forma individual. Su formato suele ser:http://<identificador_de_blog>.wordpress.com/<añopub>/<mespub>/diapub>/<titulo-entrada>/Este enlace recibe el nombre de Enlace permanente a una entrada.
    • Blogs ::: Mi primer artículo en Wordpress 48Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoCuando se está editando una entrada, en la parte superior del editor, se muestra este enlacepermanente. 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áscorta de acceso directo a este artículo.
    • Blogs ::: Gestión de artículos en Blogger 49Multimedia 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 50Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1 Gestión de artículos en Blogger
    • Blogs ::: Gestión de artículos en Blogger 51Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.1.1 Modificar un artículo 1. Existen distintos procedimientos alternativos para modificar un artículo ya existente:  Desde el Escritorio de Blogger haz clic en el enlace Editar entradas.  Desde el backend de administración del blog haz clic en la pestaña Creación de entradas y luego en la subpestaña Editar entradas.  Si navegas por el frontend del blog y previamente te has autentificado como administrador del mismo, en cada artículo publicado se mostrará un icono de “lápiz” para editar esa entrada directamente. 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 52Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Si el listado de entradas es muy numeroso, para facilitar la localización del artículo a editar se puede filtrar por un término de búsqueda que se introduce en la casilla Buscar. Otra posibilidad es pulsar en el enlace Borradores, Programadas, Importadas o Publicadas según su estado de publicación. 4. Realiza los cambios oportunos en el contenido del artículo y para guardar los cambios pulsa en el botón PUBLICAR ENTRADA (si el artículo ya está publicado) o bien en GUARDAR AHORA (si el artículo está pendiente de publicación).4.2 Estados de publicaciónEn función del estado de publicación, las entradas se clasifican en:  Borradores. Son las entradas que no están publicadas. No se visualizan en el frontend del blog, bien porque no se han terminado todavía o bien porque se ha decidido despublicarlas.  Programadas. En su elaboración se ha definido una fecha futura y al final se ha pulsado en el botón PUBLICAR ENTRADA. Sin la mediación posterior del autor, los lectores tendrán acceso al artículo a partir de la fecha establecida. Mientras tanto la entrada será considerada como Programada y al activarse pasará a la categoría de Publicada.  Importadas. Se trata de entradas que se han creado a partir de la importación de un archivo XML que contiene los artículos exportados de otro blog.  Publicadas. Son las entradas visibles por los lectores.4.3 Eliminar un artículoPara eliminar un artículo desde el panel de entradas: 1. Haz clic en el enlace Suprimir correspondiente al artículo que deseamos eliminar. Otra posibilidad es marcar las entradas deseadas y pulsar en el botón SUPRIMIR SELECCIÓN que se ofrece en la parte inferior del listado de entradas. 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 53Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoNota: 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.4.4 Publicar y despublicarUna vez que se ha publicado una entrada se puede volver a despublicar para que no seavisible por los lectores del blog. El procedimiento para volver a convertir en borrador unaentrada es el siguiente: 1. Accede al listado de entradas del interfaz de administración mediante el enlace Editar entradas. 2. Clic en el enlace Editar que acompaña al título de la entrada en la lista. 3. Si el artículo está publicado se mostrará en la parte inferior un botón con el texto GUARDAR COMO BORRADOR. Al pulsar en este botón, la entrada se convierte en borrador y no se visualiza en el blog.
    • Blogs ::: Gestión de artículos en Blogger 54Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.5 Asignar etiquetasLas etiquetas son palabras clave que permiten organizar y clasificar los artículos por temas oautores. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectorespueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiquetacorrespondiente. Otra posibilidad es asignar su propia etiqueta a cada autor del blog parapoder leer fácilmente todas las entradas de cada uno. 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. 3. Cuando se publica un artículo se muestra acompañado de las etiquetas asociadas. Al hacer clic sobre una de estas etiquetas, se accederá a una página que contiene solamente las entradas con esta etiqueta. 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 55Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 del listado que aparece en la columna izquierda. 6. Las etiquetas se pueden crear directamente durante la edición de un artículo tecleándolas separadas por comas tal y como se describía en el punto 1 de este apartado. Sin embargo un método más seguro quizás sea crearlas desde el panel de entradas para luego simplemente seleccionar la etiqueta o etiquetas adecuadas cuando se edita el artículo. Para crear las etiquetas desde el panel de entradas debes desplegar el listado Acciones de etiquetas … y elegir la opción Nueva etiqueta. En el cuadro que se muestra introduce la nueva etiqueta y pulsa en Aceptar. Nota: No se pueden utilizar los siguientes caracteres en las etiquetas: &<>@!,4.6 Publicar artículos desde el correo electrónicoEn este apartado veremos cómo publicar una entrada en el blog desde el correo electrónico.Se propone utilizar la cuenta de correo GMail asociada al usuario Google creado. Sin embargose podría utilizar cualquier otra cuenta de correo electrónico. 1. Descarga y descomprime el archivo agala.zip. Como resultado de la extracción obtendrás una página HTML y una imagen JPG.
    • Blogs ::: Gestión de artículos en Blogger 56Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Antes de continuar es necesario configurar tu blog para que acepte la publicación de entradas vía email. Para ello abre el navegador web y visita la URL de Blogger: http://www.blogger.com 3. Introduce las credenciales de acceso: usuario y contraseña. Pulsa en el botón Acceder. 4. En el panel del Escritorio haz clic en el enlace Configuración correspondiente al blog que deseamos modificar. 5. Clic en la pestaña Correo electrónico y móvil 6. En el apartado Opciones para la creación de entradas define una dirección secreta para la creación de entradas por correo electrónico. Introduce una palabra compleja y cámbiala con cierta periodicidad. Formará parte de la dirección de correo electrónico a la que debes enviar una entrada para que se publique en tu blog.
    • Blogs ::: Gestión de artículos en Blogger 57Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Puedes elegir 3 opciones:  Publicar correos electrónicos inmediatamente. Si eliges esta opción el mensaje se publicará directamente al enviarlo.  Guardar correos electrónicos como borrador de entradas. El mensaje se guardará como un borrador y será necesario acceder al backend del blog para supervisar su contenido, asignarle las correspondientes etiquetas y publicarlo.  Inhabilitado. Esta opción inhabilita el envío por email de entradas. 8. Para finalizar haz clic en el botón GUARDAR CONFIGURACIÓN. Si la nueva configuración se ha guardado con éxito se mostrará el correspondiente mensaje. A partir de este momento tu blog está preparado. 9. A continuación accede al interfaz web de tu cuenta de correo electrónico en Gmail. Para ello utiliza uno de estos procedimientos alternativos:  Desde el escritorio de Blogger haz clic en el enlace Mi cuenta que aparece en la esquina superior derecha de la página. Haz clic en el enlace GMail.  Abre una ventana en el navegador web y accede a la dirección individual de tu cuenta en GMail: http://www.gmail.com. En el cuadro Acceda a Gmail con su Cuenta de Google, introduce el nombre de usuario y contraseña que has utilizado en Blogger. Clic en el botón Acceder. 10. Clic en el botón Redactar para iniciar la composición de un nuevo mensaje.
    • Blogs ::: Gestión de artículos en Blogger 58Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 15. Para enviar el mensaje haz clic en el botón Enviar.
    • Blogs ::: Gestión de artículos en Blogger 59Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 60Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.7 Exportar e importar entradasLos artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crearcopias de seguridad en local frente a intrusos (robo de contraseñas, ataque de spam, etc),mover los artículos de un blog a otro, migrar de un blog de Blogger a otro sistema, etc. Laexportación/importación de artículos produce como resultado un archivo XML que contieneinformación de las entradas y los comentarios. No incluye los archivos de imagen ni ningúndato sobre la configuración de la plantilla.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. 2. En la página Exporta tu blog haz clic en el botón DESCARGAR BLOG. 3. Se muestra el cuadro de diálogo Abriendo blog-dd-mm-aaaa.xml donde se ofrece la posibilidad de abrir o descargar el archivo XML con la información. Selecciona la opción Guardar archivo y haz clic en el botón Aceptar. El archivo XML se crear y guarda con un nombre de la forma blog-dd-mm-aaaa-xml donde aparece el día (d), mes (d) y año en que se genera esa exportación.
    • Blogs ::: Gestión de artículos en Blogger 61Multimedia 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 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 62Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Introduce la palabra antispam y marca la opción Publicar automáticamente todas las entradas importadas para que los artículos importados se publiquen directamente en el blog. Si deseas revisarlos antes de publicarlos puedes desmarcar esta opción. Recuerda que los artículos mantienen su fecha original salvo que se modifique. Para concluir pulsa en el botón IMPORTAR BLOG. Al cabo de unos instantes se mostrará el listado de entradas con los nuevos artículos.
    • Blogs ::: Gestión de artículos en Wordpress 63Multimedia 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 64Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.2.1 Modificar un artículo 1. Existen distintos procedimientos alternativos para modificar un artículo ya existente:  Desde el Escritorio de Wordpress haz clic en el enlace Entradas  Desde el backend de administración del blog haz clic en el encabezado de bloque Entradas y luego en la subopción Editar.  Si navegas por el frontend del blog y previamente te has autentificado como administrador del mismo, dependiendo del tema definido en el blog, en cada artículo publicado se mostrará un enlace para editar esa entrada directamente.
    • Blogs ::: Gestión de artículos en Wordpress 65Multimedia 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. 3. Si el listado de entradas es muy numeroso, para facilitar la localización del artículo a editar se puede filtrar por fechas o categorías, etc. Otra opción es realizar una búsqueda por un término que se introduce en la casilla Buscar entradas. También es posible pulsar en el enlace Todos, Borradores, Pendientes de revisión y Publicadas según su estado de publicación. 4. Realiza los cambios oportunos en el contenido del artículo y para guardar los cambios pulsa en el botón Actualizar (si el artículo ya está publicado) o bien en Guardar borrador (si el artículo está pendiente de publicación).4.2.2 Estados de publicaciónEn función del estado de publicación, las entradas se clasifican en:  Borradores. Son las entradas que no están publicadas. No se visualizan en el frontend del blog, bien porque no se han terminado todavía o bien porque se ha decidido despublicarlas.  Pendientes de revisión. La entrada está pendiente de revisión por parte de un usuario gestor del blog con capacidad para editarlo y publicarlo.  Publicadas. Son las entradas visibles por los lectores.  Programado. No es un estilo definido en Wordpress pero se corresponde con una entrada publicada en una fecha posterior a la actual. Se visualizará en el frontend cuando se alcance la fecha y hora definidas.
    • Blogs ::: Gestión de artículos en Wordpress 66Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.2.3 Eliminar un artículoPara eliminar un artículo desde el panel del listado de entradas existen varios procedimientosalternativos: 1. En la entrada que deseas eliminar haz clic en el enlace Papelera. 2. Marca la casilla de verificación de la entrada que deseas eliminar y en la lista desplegable Acciones en lote elige la opción Mover a la papelera y pulsa en el botón Aplicar. Cuando se envía una entrada a la papelera ésta se puede recuperar posteriormente. Se accede a las entradas situadas en la papelera haciendo clic en el enlace Papelera. Desde el listado de entradas de la papelera se pueden eliminar de forma permanente en el enlace Borrar permanentemente o bien Restaurar esa entrada para recuperarla de la papelera.
    • Blogs ::: Gestión de artículos en Wordpress 67Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.2.4 Publicar y despublicarUna vez que se ha publicado una entrada se puede volver a despublicar para que no seavisible por los lectores del blog. El procedimiento para volver a convertir en borrador unaentrada es el siguiente: 1. Accede al listado de entradas del interfaz de administración mediante el enlace Entradas > Editar. 2. Clic en el enlace situado en el título de la entrada en la lista. 3. Desde la edición de la entrada, en el cuadro Publicar situado a la derecha, haz clic en el enlace Editar que acompaña al Estado(Publicada). 4. En la lista desplegable elige la opción Borrador y pulsa en el botón Aceptar. 5. Se puede publicar un borrador durante su edición pulsando en el botón Publicar o bien modificando su Estado siguiendo un procedimiento similar al descrito para pasarlo a Borrador.4.2.5 Asignar etiquetasLas etiquetas son palabras clave que permiten organizar y clasificar los artículos por palabrasclave. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectorespueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiquetacorrespondiente. 1. Cuando se edita una entrada, en el cuadro Etiquetas que aparece en la columna derecha se pueden introducir las etiquetas que desees separadas por comas y luego pulsar en el botón Añadir.
    • Blogs ::: Gestión de artículos en Wordpress 68Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 3. Cuando se publica un artículo se muestra acompañado de las etiquetas asociadas. Al hacer clic sobre una de estas etiquetas, se accederá a una página que contiene solamente las entradas con esta etiqueta. 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. 6. Las etiquetas se pueden crear directamente durante la edición de un artículo tecleándolas separadas por comas tal y como se describía en este apartado. Sin embargo un método más seguro quizás sea crearlas desde el panel de entradas para luego simplemente seleccionar la etiqueta o etiquetas adecuadas cuando se edita el artículo. Para crear las etiquetas desde el interfaz de gestión elige Entradas > Etiquetas de las entradas. En la página Añadir nueva etiqueta puedes introducir esa etiqueta, su descripción (opcional) y luego pulsa en el botón Añadir etiqueta.
    • Blogs ::: Gestión de artículos en Wordpress 69Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: No se pueden utilizar los siguientes caracteres en las etiquetas: &<>@!,4.2.6 Publicar artículos desde el correoelectrónicoEn este apartado veremos cómo publicar una entrada en el blog desde el correo electrónico.Se propone utilizar la cuenta de correo GMail asociada al usuario Google creado. Sin embargose podría utilizar cualquier otra cuenta de correo electrónico. 1. Descarga y descomprime el archivo agala.zip. Como resultado de la extracción obtendrás una página HTML y una imagen JPG. 2. Antes de continuar es necesario configurar tu blog para que acepte la publicación de entradas vía email. Desde el interfaz de administración de tu blog selecciona Mi cuenta > Mis blogs situado en la barra de menú horizontal superior.
    • Blogs ::: Gestión de artículos en Wordpress 70Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 4. Se genera una dirección de correo secreta y aleatoria. Es la dirección de correo electrónico a la que debes enviar una entrada para que se publique en tu blog. 5. Si haces clic en el enlace vCard te podrás descargar un archivo de contacto de correo electrónico vCard conteniendo la dirección que puedes utilizar para añadir ese contacto a tu libreta de direcciones. 6. Si pulsas en el enlace Regenerar se creará otra dirección de correo aleatoria. Conviene cambiarla cada cierto tiempo por motivos de seguridad. 7. Para desactivar la posibilidad de enviar por correo electrónico a ese blog haz clic en el enlace Borrar.A continuación ya puedes enviar el mensaje de correo electrónico con la entrada. Para ello sepropone utilizar el webmail de GMail (http://www.gmail.com) y esto supone que debes tenercuenta en GMail. No obstante se puede hacer desde cualquier cuenta de correo electrónicotanto utilizando webmail como un programa cliente de correo como Outlook o similar. 8. Abre una ventana en el navegador web y accede a la dirección individual de tu cuenta en GMail: http://www.gmail.com. En el cuadro Acceda a Gmail con su Cuenta de Google, introduce el nombre de usuario y contraseña. Clic en el botón Acceder.
    • Blogs ::: Gestión de artículos en Wordpress 71Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Clic en el botón Redactar para iniciar la composición de un nuevo mensaje. 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 72Multimedia 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. 14. Para enviar el mensaje haz clic en el botón Enviar. 15. El contenido enviado se habrá publicado como una nueva entrada en el blog. Observa que la imagen adjuntada se ha añadido al final del artículo.
    • Blogs ::: Gestión de artículos en Wordpress 73Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoAlgunas características de la publicación por email:Adjuntos. Si se envía una sola imagen adjunta, ésta se mostrará al final del artículo yseparada del texto. Si se envían varias imágenes adjuntas, éstas se mostrarán como unagalería. Si envías como adjunto un archivo de audio MP3, éste se mostrará usando elreproductor 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.Códigos especiales de publicación. Se pueden incluir en el mensaje de correo electrónicocódigos especiales que configuran distintos aspectos del artículo publicado. Se puedenescribir en cualquier sitio del mensaje y deben ir siempre en minúsculas y entre corchetes.  [category x,y,z] Define la categoría o categorías en que se clasifica esa entrada.  [tags x,y,z] Define las etiquetas de la entrada.  [delay +1 hour] Establece un retraso de 1 hora en la publicación de esa entrada a partir del instante en que se recibe. Por defecto se publica inmediatamente que se recibe.  [comments on | off] Activa (on) o Desactiva los comentarios a esa entrada.  [status publish | pending | draft | private] Define el estado de la entrada: publicado, pendiente, borrador o privado.Más información en: http://en.support.wordpress.com/post-by-email/4.2.7 Exportar e importar entradasLos artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crearcopias de seguridad en local frente a intrusos (robo de contraseñas, ataque de spam, etc),mover los artículos de un blog a otro, migrar de un blog de Wordpress a otro sistema, etc. Laexportación/importación de artículos produce como resultado un archivo XML que contieneinformación de las entradas, comentarios, categorías, etiquetas, etc. Este fichero NO incluyelos archivos de imagen ni ningún dato sobre la configuración de la plantilla.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 74Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En la página Exporta haz clic en el botón Descargar el archivo de exportación. Es posible desplegar un combo y elegir un solo autor para importar las entradas creadas por un autor en concreto. En este caso se propone exportar las entradas de todos los autores. 3. Se muestra el cuadro de diálogo Abriendo wordpress.aaaadd-mm-dd.xml donde se ofrece la posibilidad de abrir o descargar el archivo XML con la información. Selecciona la opción Guardar archivo y haz clic en el botón Aceptar. El archivo XML se crear y guarda con un nombre de la forma wordpress.aaaadd-mm-dd.xml donde aparece el día (d), mes (d) y año en que se genera esa exportación.
    • Blogs ::: Gestión de artículos en Wordpress 75Multimedia 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 76Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Pulsa en el botón Subir archivo e importar. 5. En la siguiente página es necesario Asignar autores para indicar a qué autor del blog actual se asignarán las entradas importadas. Para ello se elige uno en la lista desplegable. 6. En el apartado Importar adjuntos marca la casilla Descargar e importar archivos adjuntos para guardar en el blog actual las imágenes y archivos enlazados en los artículos importados. 7. Para terminar pulsa en el botón Enviar. Esta acción añadirá a nuestro blog las entradas contenidas en el XML de importación.
    • Blogs ::: El editor de entradas en Blogger 77Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. El editor de entradas
    • Blogs ::: El editor de entradas en Blogger 78Multimedia 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 79Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5.1.1 Formato de textoBlogger ofrece un editor visual que proporciona ciertas prestaciones para la edición en líneadel texto de artículos.Una práctica habitual de la edición en línea de contenidos es la preparación previa del textocon un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado elartículo se puede publicar en el blog copiando y pegando sobre su editor. De esta formadurante la edición en línea siempre se dispondrá de una copia de seguridad en local. 1. Descarga y descomprime el archivo einstein.zip. Como resultado obtendrás el archivo de texto einstein.txt y el archivo de imagen einstein.jpg. 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 80Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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: 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 Blogger 81Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Elimina la primera línea porque el título ya lo hemos escrito en un paso anterior. Elimina también la anotación de la imagen para insertar en esa posición la foto solicitada. 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 einstein.jpg que hemos obtenido en un paso anterior. Observa que sólo se admiten los formatos de imagen: gif, jpg y png. 12. En el área Elige un diseño selecciona un tipo de alineamiento. Por ejemplo: Izquierda. 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.
    • Blogs ::: El editor de entradas en Blogger 82Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 17. Selecciona el texto “Teoría de la Relatividad Especial” y aplícale el efecto Cursiva. 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 83Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 20. Selecciona el primer subtítulo: “Biografía” y a continuación en la barra de herramientas selecciona Large como Tamaño de fuente. 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 84Multimedia 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. 29. Clic en el botón Aceptar para guardar la dirección pegada. 30. Repite el mismo procedimiento con el siguiente hipervínculo. 31. Para terminar haz clic en el botón GUARDAR AHORA.
    • Blogs ::: El editor de entradas en Blogger 85Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5.1.2 Corrector ortográficoEl editor de entrada de Blogger proporciona un corrector ortográfico. 1. Cuando ya hayas escrito el artículo se puede activar pulsando en el botón Corrector ortográfico que se proporciona en la barra de herramientas del editor. 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.5.1.3 El código HTMLEl editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita lainclusión de etiquetas especiales no contempladas en el entorno visual del editor.Para visualizar el artículo en modo HTML: 1. Clic en el botón Edición de HTML 2. Se muestra una ventana donde es posible editar este código. 3. Para regresar al modo visual pulsa en la pestaña Redactar. 4. Si deseas ver cómo queda el artículo puedes pulsar en el botón Vista previa.
    • Blogs ::: El editor de entradas en Blogger 86Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoNota: 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 87Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.2 El editor de entradas en Wordpress
    • Blogs ::: El editor de entradas en Wordpress 88Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5.2.1 Formato de textoWordpress ofrece un editor visual que proporciona ciertas prestaciones para la edición enlínea del texto de artículos.Una práctica habitual de la edición en línea de contenidos es la preparación previa del textocon un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado elartículo se puede publicar en el blog copiando y pegando sobre su editor. De esta formadurante la edición en línea siempre se dispondrá de una copia de seguridad en local. 1. Descarga y descomprime el archivo einstein.zip. Como resultado obtendrás el archivo de texto einstein.txt y el archivo de imagen einstein.jpg. 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 89Multimedia 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 90Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Elimina la primera línea porque el título ya lo hemos escrito en un paso anterior. Elimina también la anotación de la imagen para insertar en esa posición la foto solicitada. 5. Sobre el editor haz clic en el botón Añadir una imagen. 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. 7. Tras su selección en tu equipo y pulsar en el botón Abrir se inicia automáticamente la subida de ese archivo al servidor de Wordpress. Si el proceso de subida se ha producido con éxito se mostrará una página con los parámetros de la imagen.
    • Blogs ::: El editor de entradas en Wordpress 91Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 92Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Selecciona el texto “Teoría de la Relatividad Especial” y aplícale el efecto Cursiva. 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 93Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 15. Selecciona el primer subtítulo: “Biografía” y a continuación en la barra de herramientas selecciona Titulo 2 como Tamaño de fuente. 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 94Multimedia 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. 24. Clic en el botón Insertar para guardar la dirección pegada. 25. Repite el mismo procedimiento con el siguiente hipervínculo. 26. Para terminar haz clic en el botón Guardar borrador.
    • Blogs ::: El editor de entradas en Wordpress 95Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5.2.2 Corrector ortográficoEl editor de entrada de Wordpress proporciona un corrector ortográfico. 1. Cuando ya hayas escrito el artículo se puede activar pulsando en el botón Corrector ortográfico que se proporciona en la barra de herramientas del editor. 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.5.2. 3 El código HTMLEl editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita lainclusión de etiquetas especiales no contempladas en el entorno visual del editor.Para visualizar el artículo en modo HTML:
    • Blogs ::: El editor de entradas en Wordpress 96Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1. Clic en la pestaña HTML 2. Se muestra una ventana donde es posible editar este código. 3. Para regresar al modo visual pulsa en la pestaña Visual. 4. Si deseas ver cómo queda el artículo puedes pulsar en el botón Vista previa.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 97Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Diseño del blog
    • Blogs ::: Diseño del blog en Blogger 98Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.1 Diseño del blog en Blogger
    • Blogs ::: Diseño del blog en Blogger 99Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoUna de las ventajas de la gestión de un blog es la independencia entre el diseño y elcontenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestroblog a partir de plantillas que se ofrecen prediseñadas, sin que ello afecte al contenido.Blogger ofrece un repertorio de plantillas en la idea de dotar al blog de un diseño y aparienciavisual personalizados.6.1.1 Modificar la plantilla 1. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en la pestaña Diseño. A continuación haz clic en la pestaña Edición de HTML 2. En la parte más inferior de la página Edición de HTML, en el apartado Plantillas antiguas, haz clic en el enlace Seleccionar plantilla de diseño. 3. Se muestra el catálogo de plantillas disponibles para tu blog. Utiliza las barras de desplazamiento vertical para navegar por todo el listado. 4. Observa que en algunas plantillas se ofrecen variantes. En una plantilla en concreto puedes hacer clic sobre una de sus variantes para ver la imagen correspondiente. Si pulsas en el enlace vista preliminar de la plantilla se abrirá una nueva ventana mostrando el aspecto que tendría tu blog con ella.
    • Blogs ::: Diseño del blog en Blogger 100Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Haz clic, por ejemplo, en la plantilla etiqueta como No. 897 6. Para activar esa nueva plantilla haz clic en el botón GUARDAR PLANTILLA. 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.6.1.2 Fuentes y coloresUna vez que hemos asignado una plantilla prediseñada a nuestro blog, Blogger ofrece laposibilidad de personalizar las fuentes y colores de ese tema. 1. Clic en las pestañas Diseño > Fuentes y colores 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. 3. Cuando se selecciona un elemento se puede elegir su color en tres paletas:  Colores de tu blog. Se muestran los colores elegidos en los distintos elementos de tu blog.  Colores que combinan con tu blog. Se ofrecen los colores recomendados. Es muy recomendable elegir para cada elemento un color de esta paleta para asegurar la correspondiente armonía en la carta de colores elegida.  Más colores. En esta paleta se ofrece toda la gama cromática para elegir el color deseado.
    • Blogs ::: Diseño del blog en Blogger 101Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 4. Al seleccionar un elemento HTML en la lista, se mostrará el código hexadecimal del color en el cuadro de texto Editar el código hexadecimal de color. Este código tiene el formato #RRVVAA (R=Rojo, V=Verde, A=Azul) y permite introducir por teclado este valor para definir con exactitud el color de cada elemento. 5. Si deseas buscar alternativas a la distribución de colores de la plantilla seleccionada puedes pulsar reiteradamente en el enlace Mezclar los colores del blog. Esta acción repetida intercambia los colores recomendados entre los distintos elementos HTML de la plantilla. 6. Para modificar el tipo de fuente, desplázate hacia la parte inferior del listado y elige una de las entradas correspondientes a las fuentes. Por ejemplo: Fuente del texto. En el panel podrás definir la Familia de Fuente (Arial, Georgia, Trebuchet, etc), el Estilo de Fuente (Negrita o Cursiva) y el Tamaño de Fuente. 7. Para recuperar la configuración inicial de colores y fuentes puedes pulsar en el enlace Recuperar la plantilla predeterminada. 8. Para guardar la configuración definida pulsa en el botón GUARDAR CAMBIOS.6.1.3 Elementos de una páginaLa estructura del Frontend 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 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 102Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoNota: 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.En este apartado se explican los procedimientos para configurar estos elementosestructurales de un blog. 1. Clic en las pestañas Diseño > Elementos de la página. 2. Desde esta página se pueden modificar algunos parámetros de los elementos estructurales6.1.4 Barra de navegación de Blogger 1. Clic en el enlace Editar que acompaña al elemento Barra de navegación. 2. Se abre una nueva ventana Configuración de la barra de navegación.
    • Blogs ::: Diseño del blog en Blogger 103Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 3. Elige un color de la barra y pulsa en el botón GUARDAR.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. 2. Clic en las pestañas Diseño > Elementos de la página. 3. Clic en el enlace Editar que acompaña al elemento Cabecera. 4. En la página Configurar cabecera puedes redefinir el Título del blog o su Descripción. En este caso activa la opción Imagen > Desde tu equipo y pulsa en el botón Examinar. Selecciona una imagen de encabezado de las anteriores.
    • Blogs ::: Diseño del blog en Blogger 104Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Al cabo de unos instantes la imagen habrá subido al servidor de Blogger. Si deseas eliminarla para subir otra haz clic en el enlace inferior Eliminar imagen. 6. Elige el tipo de Ubicación. Por ejemplo Detrás del título y la descripción. 7. Para terminar pulsa en el botón GUARDAR. 8. Si visualizas el blog verás que ahora la imagen personaliza el encabezado.
    • Blogs ::: Diseño del blog en Blogger 105Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado6.1.6 Entradas del blog 1. Clic en las pestañas Diseño > Elementos de la página. 2. Clic en el enlace Editar que acompaña al elemento Entradas del blog. 3. Se muestra una nueva ventana con las opciones Configurar entradas del blog. En esta página se configura la forma en que se mostrarán las entradas en el blog.Opciones de la página principal Número de entradas en la página principal. Permite definir el número de entradas o de días con entradas que se mostrarán en la página principal o portada.Opciones de la página de entrada En esta página se decide qué elementos se mostrarán u ocultarán y de qué forma en cada entrada: fecha, publicado por, hora, número de comentarios, etiquetas, icono de edición rápida, erc.
    • Blogs ::: Diseño del blog en Blogger 106Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoOrdenar 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.6.1.7 Añadir gadgets a la barra lateralUna de las características más representativas de los blogs es disponer de una o dos columnaslaterales donde se ordenan, de arriba hacia abajo, los distintos gadgets que proporcionanprestaciones adicionales al blog.
    • Blogs ::: Diseño del blog en Blogger 107Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoEl término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra enuna página web a modo de mosaico y que se ejecuta como una mini-aplicación independientediseñada para enriquecer la información o servicios de esa página. De esta forma se puedenmostrar datos adicionales en la misma página sin tener que abandonar esta página.Para añadir un gadget: 1. Clic en el enlace Añadir un gadget. 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 108Multimedia 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.Para modificar los parámetros de un gadget: 1. Clic en el enlace Editar. 2. Se muestra en una ventana con la configuración de ese gadget.
    • Blogs ::: Diseño del blog en Blogger 109Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 3. Realiza las modificaciones oportunas de sus parámetros y para terminar pulsa en el botón GUARDAR.Para eliminar un gadget de la columna lateral: 1. Clic en el enlace Editar de ese gadget. 2. En la ventana de configuración pulsa en el botón ELIMINAR. 3. Después de confirmar la eliminación, ésta tendrá lugar.Para cambiar el orden de los gadgets en la columna lateral: 1. Simplemente arrastra y suelta un gadget por encima o debajo del resto.6.1.8 Algunos gadgets interesantesSe pueden añadir a tu blog los gadgets más habituales:Lista de enlacesAñade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es laforma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces ablogs).Al añadir o editar un gadget de lista de enlaces se abre una nueva ventana donde se puedeconfigurar las propiedades de este listado:  Título: es el título que mostrará el gadget.  Número de enlaces que se mostrarán…: si lo dejas en blanco se verán todos los enlaces.  Ordenación: permite definir el orden en el listado de enlaces.En este cuadro además se proporciona un sencillo interfaz para añadir, editar o suprimir cadauno de estos enlaces.Para terminar pulsa en el botón GUARDAR.
    • Blogs ::: Diseño del blog en Blogger 110Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoEn el blog esta gadget se mostrará en la barra lateral proporcionando los enlaces definidos.Archivo del blogMuestra los enlaces organizados cronológicamente que permite un acceso individual a losdistintos artículos del blog.Al añadir o editar el gadget de Archivo del blog se pueden configurar sus distintospará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 111Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoPara terminar pulsa en el botón GUARDAR. En la barra lateral del blog se mostrarán unosenlaces clasificados de acuerdo con los criterios de configuración definidos.EtiquetasMuestra un listado de todas las etiquetas o categorías definidas en el blog. Cuando el lectorhace clic en una etiqueta se mostrará una página con todos los artículos que contienen esasetiquetas.En la edición de la configuración de este gadget se puede definir el Título, Ordenación (pororden alfabético o por frecuencia) y si se muestra u oculta el número de entradas poretiqueta. Para terminar hacer clic en el botón GUARDAR.
    • Blogs ::: Diseño del blog en Blogger 112Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoEn la barra lateral se mostrará un gadget con las etiquetas o categorías.Enlaces de suscripciónOfrece a los lectores la posibilidad de suscribirse a los artículos y comentarios de tu blogutilizando 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 semostrará.
    • Blogs ::: Diseño del blog en Blogger 113Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoEl lector utilizará la opción Entradas > Atom para suscribirse a tu blog utilizando elnavegador web por defecto o bien un programa específico para leer feed.Cuadro de búsquedaOfrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda parabuscar 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 cualquierentrada de tu blog, en internet en general, en los gadgets que contengan enlaces, etc.
    • Blogs ::: Diseño del blog en Blogger 114Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoAl activar este tipo de gadget en la barra lateral se mostrará un cuadro de búsqueda quepermitirá buscar en estos ámbitos utilizando el motor de Google.Es posible que algunas entradas añadidas recientemente no aparezcan todavía en losresultados de la búsqueda al no haber sido indexadas por el motor de búsquedas de Google.Otros gadgets
    • Blogs ::: Diseño del blog en Blogger 115Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado6.1.9 Edición HTML de la plantillaEl administrador de un blog puede personalizar su estilo gráfico utilizando las opcionesdescritas anteriormente en este documento sin disponer de apenas conocimientos de HTML oCSS. Sin embargo si el administrador dispone de conocimientos del código también podráaplicarlos para personalizar de una forma más fina el aspecto de su blog. Para ello: 1. Desde el interfaz de administración del blog selecciona Configuración > Edición de HTML. 2. En esta página se muestra la sección Realizar copia de seguridad/Restaurar plantilla donde es posible descargar al equipo un archivo XML que contiene la plantilla seleccionada. También es posible subir ese archivo XML al servidor una vez que hemos realizado en local todas las modificaciones oportunas. Todo ello resulta especialmente útil en la edición del código de esta plantilla: copia de seguridad en local, edición con software desde el equipo, fácil restauración a partir del original en caso de errores al modificar la plantilla, etc.
    • Blogs ::: Diseño del blog en Blogger 116Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 3. En la sección Editar plantilla se puede editar en línea la plantilla utilizada en nuestro blog. Las modificaciones en este cuadro requieren disponer de ciertos conocimientos de código HTML y CSS. Si no es así se recomienda no modificarlas. Los contenidos editables de la plantilla son de dos tipos:  Variables. Son nombres de variables asignadas a los distintos elementos del blog y que en esta plantilla se declaran para asignarles un valor hexadecimal del color. Ejemplo: sidebarBGColor (color de fondo de la barra lateral).  Formato CSS. Permiten asignar formato a los distintos elementos de la plantilla utilizando código CSS. 4. Si marcas la opción Expandir plantillas de artilugios se mostrará una plantilla más compleja que permite modificar de forma más detallada el estilo gráfico de los gadgets. En este caso no vamos a marcar esta opción. 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 117Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado6.1.10 Edición avanzada HTML de la plantillaEn este apartado se explican dos ejemplos de cómo se puede utilizar la edición HTML de laplantilla para resolver dos requerimientos no contemplados inicialmente por Blogger.6.1.10.1 Eliminar la barra de navegación de BloggerEn algunas ocasiones puede resultar interesante eliminar la barra de navegación Blogger denuestro blog. 1. En el código de plantilla busca la sección Page Structure y dentro de ella añade el siguiente código: #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. 4. Para comprobar que la barra de navegación ha desaparecido haz clic en el botón VISTA PREVIA. Si deseas recuperar esta barra eliminar el código introducido anteriormente y guarda los cambios.
    • Blogs ::: Diseño del blog en Blogger 118Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado6.1.10.2 Crear un “Leer más” en un artículo de BloggerEn ocasiones resulta interesante crear una entrada que muestre un texto de introducción yoculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa eneste enlace o bien en el título del artículo, entonces la entrada se muestra completa y deforma individual en la página. Este enlace “Leer más” no se contempla por defecto en Bloggerpero se puede conseguir utilizando la siguiente receta.Paso 1. Modificar la plantilla 1. Desde el interfaz de gestión de contenidos haz clic en Diseño > Edición de HTML. 2. En el cuadro del código HTML de la plantilla activa la opción Expandir plantilla de artilugios. 3. Localiza el código siguiente: <div class=’post-header-line-1’/>. 4. Vamos a añadir dos fragmentos de código en las posiciones 1 y 2 que se indican en la figura siguiente: 5. Debajo de la línea de código: <div class=’post-body’ entry-content> sitúa el siguiente código: <b:if cond=data:blog.pageType == "item"> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style>
    • Blogs ::: Diseño del blog en Blogger 119Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Debajo de la línea de código: <data:post.body /> sitúa el siguiente código: <a expr:href=data:post.url>Leer Mas...</a> </b:if> 7. El resultado final es un DIV con un CSS condicional de la siguiente forma: <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> 8. Clic en el botón GUARDAR PLANTILLAPaso 2: Crear una entradaUna vez que hemos modificado la plantilla ahora es necesario crear una entrada utilizando elsiguiente código HTML: <span class="fullpost"> </span>. Fuera de la etiqueta spansituaremos el texto del artículo que se verá siempre y dentro de las etiquetas span el textoque sólo se verá cuando el lector pulse en el enlace “Leer más…” 1. Descarga y descomprime el archivo mariecurie.zip. Como resultado obtendrás un archivo de imagen mariecurie.jpg y un archivo de texto mariecurie.txt. 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 120Multimedia 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 121Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
    • Blogs ::: Diseño del blog en Wordpress 122Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2 Diseño del blog en Wordpress
    • Blogs ::: Diseño del blog en Wordpress 123Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoUna de las ventajas de la gestión de un blog es la independencia entre el diseño y elcontenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestroblog a partir de plantillas que se ofrecen prediseñadas, sin que ello afecte al contenido.Wordpress ofrece un amplio repertorio de plantillas o temas en la idea de dotar al blog de undiseño y apariencia visual personalizados.6.2.1 Modificar el tema 1. Desde el interfaz de gestión de contenidos de tu blog en Wordpress haz clic en la pestaña Apariencia > Temas 2. En la parte superior de la página Administrar temas se muestra el tema actual. En este apartado se puede observar la vista previa del mismo, su nombre, autor, descripción, opciones y etiquetas. Por defecto se suele aplicar el tema Kubrick. 3. Debajo de la selección del Tema actual se muestra un amplio listado de temas en el apartado Browse Themes (Examinar Temas). Pulsa en el enlace A-Z o Más populares para acceder al listado completo paginado y ordenado alfabéticamente o por popularidad. También puedes utilizar el buscador para localizar un tema si conoces su nombre. Otra posibilidad es utilizar filtros.
    • Blogs ::: Diseño del blog en Wordpress 124Multimedia 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. 5. Para activar este nuevo tema haz clic en el enlace Activar. 6. Para contemplar la nueva apariencia del blog haz clic en el enlace Ver sitio.6.2.2 Colores del encabezadoEn función del tema elegido se podrán configurar unas opciones u otras. No todos los temasadmiten personalización de todas las opciones. En el caso que nos ocupa vamos a configurarlas distintas opciones del tema Kubrick (tema por defecto). Para ello busca y selecciona estetema antes de continuar. 1. Clic en Apariencia > Colores del encabezado. 2. Se muestra la página Colores del encabezado.
    • Blogs ::: Diseño del blog en Wordpress 125Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 126Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.2.3 CabeceraLa 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. 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 740 x 192 píxeles. En este apartado se propone utilizar alguno de ellos para personalizar el encabezado. El tamaño de imagen proporcionado se ajusta perfectamente al tema Kubrick o similar. Si has optado por otra plantilla habría que buscar o elaborar imágenes de otras dimensiones que se ajustasen a ella. 2. Clic en las pestañas Apariencia > Cabecera 3. Clic en el enlace Editar que acompaña al elemento Cabecera.
    • Blogs ::: Diseño del blog en Wordpress 127Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 5. Al cabo de unos instantes la imagen habrá subido al servidor de Wordpress. Si deseas eliminarla para subir otra repite el paso anterior con la nueva imagen. 6. Para restaurar la imagen original del tema haz clic en el botón Restaurar cabecera original. 7. Si visualizas el blog verás que ahora la imagen personaliza el encabezado.
    • Blogs ::: Diseño del blog en Wordpress 128Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.2.4 Añadir widgets a la barra lateralUna de las características más representativas de los blogs es disponer de una o dos columnaslaterales donde se ordenan, de arriba hacia abajo, los distintos widgets que proporcionanprestaciones adicionales al blog.El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra enuna página web a modo de mosaico y que se ejecuta como una mini-aplicación independientediseñada para enriquecer la información o servicios de esa página. De esta forma se puedenmostrar 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 barralateral. Sin embargo es posible personalizar los que se mostrarán y el orden en queaparecerán de arriba hacia abajo.Para añadir un widget: 1. Desde el interfaz de administración del blog haz clic en el enlace Apariencia > Widgets.
    • Blogs ::: Diseño del blog en Wordpress 129Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En la página Widgtets se muestra en la columna izquierda dos secciones:  Widgets disponibles. En este apartado se contemplan los widgets disponibles para arrastrar y colocar en la barra lateral. Si arrastras un widget desde la barra lateral a esta sección se eliminará de la barra y se perderá su configuración personalizada.  Widgets inactivos. Al arrastrar un widget desde la barra lateral a esta sección se eliminará de la barra lateral pero se conservará su configuración personalizada por si fuera necesario reutilizarla en un momento dado. 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 130Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPara modificar los parámetros de un widget: 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.Para eliminar un widget de la columna lateral: 1. Clic en el botón de edición del widget 2. En la ventana de configuración pulsa en el botón BorrarPara cambiar el orden de los gadgets en la columna lateral: 1. Simplemente arrastra y suelta un gadget por encima o debajo del resto.
    • Blogs ::: Diseño del blog en Wordpress 131Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.2.5 Algunos widgets interesantesSe pueden añadir a tu blog los widgets más habituales:EnlacesAñade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es laforma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces ablogs).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.Para terminar pulsa en el botón Guardar.En el blog este widget se mostrará en la barra lateral proporcionando los enlaces definidos.
    • Blogs ::: Diseño del blog en Wordpress 132Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoArchivosMuestra un archivo mensual de las entradas del blog.Al añadir o editar el widget de Archivos se pueden configurar sus distintos parámetros:  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 unosenlaces clasificados de acuerdo con los criterios de configuración definidos.Nube de etiquetasMuestra un listado de todas las etiquetas definidas en el blog. Cuando el lector hace clic enuna etiqueta se mostrará una página con todos los artículos que contienen esas etiquetas.En la edición de la configuración de este widget se puede definir el Título. Para terminarhacer clic en el botón Guardar. En la barra lateral se mostrará un widget con las etiquetas.
    • Blogs ::: Diseño del blog en Wordpress 133Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEnlaces de suscripciónOfrece a los lectores la posibilidad de suscribirse a las entradas/artículos y comentarios de tublog utilizando los lectores de feed más conocidos.En la edición de este widget es posible configurar:  Título. Es el título que encabezará el widget en la barra lateral. Ejemplo: Suscripción RSS.  Feed(s) to Display (Feeds a mostrar). Despliega el combo para elegir que se muestre el canal RSS sólo de las Entradas, sólo de los Comentarios o bien de ambos: Entradas y Comentarios.  Formato. Permite definir si estos enlaces a los canales RSS se mostrarán con sólo texto o bien acompañados de un icono RSS.  Image Settings (Configuración de imagen). En este apartado se puede definir el tamaño (Image Size) y el color (Image Color).Para terminar pulsa en el botón Guardar. Para minimizar este widget pulsa en el enlaceCerrar. El lector utilizará estos enlaces para suscribirse a tu blog utilizando el navegador webpor defecto o bien un programa específico para leer feed.BuscarOfrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda parabuscar en las entradas del blog.
    • Blogs ::: Diseño del blog en Wordpress 134Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoAl configurar este widget se puede definir su Título. Clic en el botón Guardar. Al activar estetipo de widget en la barra lateral se mostrará un cuadro de búsqueda que permitirá buscar enlas entradas del blog.Otros widgetsTexto. Es un cuadro con texto plano o código HTML que permite añadir un servicio externo.Imagen. Muestra una imagen en la barra de tareas.Entradas recientes. Proporciona acceso a las entradas más recientes del blog.Meta. Añade un cuadro que proporciona enlaces a la pantalla de Login/Desconexión, alinterfaz de backend para la gestión de contenidos, a la web de Wordpress.com, etc. Estegadget no admite configuración de parámetros.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 oartículos independientes que no se someten a la cronología de las entradas o posts. Seutilizan para situar información más o menos permanente en tu sitio web.
    • Blogs ::: Diseño del blog en Wordpress 135Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoRSS. Permite insertar un cuadro en la barra lateral con las noticias de un feed RSS o Atomexterno o de terceros.6.2.6 Edición CSS del temaEl administrador de un blog puede personalizar su estilo gráfico utilizando las opcionesdescritas anteriormente en este documento sin disponer de apenas conocimientos de HTML oCSS. Sin embargo si el administrador dispone de conocimientos del código CSS también podráaplicarlos para personalizar de una forma más fina el aspecto de su blog. Para ello: 1. Desde el interfaz de administración del blog selecciona Apariencia > Editar CSS 2. En página Editor de estilos CSS puedes introducir el código CS personalizado de la plantilla. Sin embargo este servicio actualmente es un servicio de pago en Wordpress.comNota importante:La posibilidad de personalizar el CSS del tema siguiendo el procediiento descrito es unservicio de pago en Wordpress.com
    • Blogs ::: Diseño del blog en Wordpress 136Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.2.7 Marca “Leer más” en un artículo de WordpressEn ocasiones resulta interesante crear una entrada que muestre un texto de introducción yoculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa eneste enlace o bien en el título del artículo, entonces la entrada se muestra completa y deforma individual en la página. 1. Descarga y descomprime el archivo mariecurie.zip. Como resultado obtendrás un archivo de imagen mariecurie.jpg y un archivo de texto mariecurie.txt. 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 137Multimedia 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 138Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7. Moderación de comentarios
    • Blogs ::: Moderación de comentarios en Blogger 139Multimedia 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 140Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado7.1.1 Configuración de comentariosEl administrador o autor de un blog debe tener previsto desde un principio cómo deseagestionar los comentarios de sus lectores. Para ello: 1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Configuración > Comentarios. 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 semostrará formulario para su envío. Si se selecciona ocultar NO se suprimen los comentariosexistentes ya que podrán volver a visualizarse en cualquier momento si se elige de nuevomostrar. Se pueden mostrar los comentarios con carácter general y luego no permitircomentarios 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.Ubicación del formulario de comentarios.  Página completa. Al final de los comentarios se ofrecerá un enlace que mostrará el formulario de envío de comentarios en una página nueva.  Ventana emergente. Ofrecerá un enlace que mostrará el formulario en una ventana emergente del navegador web.  Entrada incrustada a continuación. El formulario de envío de comentarios se ofrecerá en la misma página que el artículo e inmediatamente debajo de los comentarios ya publicados.Opción predeterminada de comentarios para entradas.  Las nuevas entradas tienen comentarios. Si está activada esta opción se admitirán comentarios en las nuevas entradas.  Las nuevas entradas no tienen comentarios. Si se elige esta opción las entradas que se publiquen a continuación NO dispondrán de la posibilidad de enviar comentarios mientras que las anteriores sí.Enlaces de retroceso. Se pueden mostrar u ocultar los trackbacks que permiten realizar elseguimiento de otros blogs que han enlazado a este artículo.
    • Blogs ::: Moderación de comentarios en Blogger 141Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoOpción predeterminada de enlaces de retroceso para entradas.  Las nuevas entradas tienen enlaces de retroceso. Si está activada esta opción se admitirán enlaces de retroceso en las nuevas entradas.  Las nuevas entradas no tienen enlaces de retroceso. Si se elige esta opción las entradas que se publiquen a continuación NO dispondrán de enlaces de retroceso.Formato de hora de los comentarios.Mensaje del formulario de comentarios. Se puede introducir un texto personalizado queacompaña al formulario de entrada del comentario.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 Escritoriose 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 unlector no registrado en el blog envíe un comentario. Si esta casilla está vacía no se enviaránotificación.Mostrar palabra de verificación en comentarios. Se puede mostrar u ocultar la introducciónde una palabra de verificación antispam. Conviene activar esta opción si configuramos laposibilidad de que un lector anónimo pueda enviar comentarios. Los autores del blog notendrán que introducir esta palabra de paso para enviar comentarios.Mostrar imágenes de perfil en los comentarios. Se puede elegir entre mostrar u ocultar elperfil de los usuarios en los comentarios publicados.Correo electrónico de notificación de comentarios. En este listado se pueden escribir hasta10 direcciones de correo electrónico separadas por comas. Los destinatarios recibiránnotificación por correo electrónico cada vez que alguien envíe un comentario en el blog.
    • Blogs ::: Moderación de comentarios en Blogger 142Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado7.1.2 Envío de comentariosEn función de la configuración definida para el envío de comentarios, el formulario semostrará en la misma página a continuación de los comentarios publicados o se ofrece unenlace para abrirlo en una nueva ventana o ventana emergente. Comentario. Se teclea el comentario en el cuadro de texto admitiendo algunas etiquetas HTML como <b> (negrita), <i> (cursiva) o <a href=’http://www…” (enlaces). Verificación de palabra. El lector debe teclear la palabra antispam que se lee para que su comentario sea enviado. Si pulsas en el icono de accesibilidad se oirá un código numérico que se puede introducir como alternativa. Elegir identidad. El usuario puede enviar el comentario con las siguientes identidades:  Anónimo. No indicará ninguna credencial)  Nombre/URL. Nombre del usuario y URL de su blog o espacio blog si lo desea.  OpenID. Identificador de OpenID o alguno de los servicios como LiveJournal, Wordpress, TypePad, AIM, etc.  Cuenta Google. Usuario y contraseña. Para completar el envío se pulsa en el botón PUBLICAR COMENTARIO.Si el administrador del blog ha elegido la opción Siempre para la moderación de comentariosentonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opciónNunca entonces el comentario se publicará directamente.7.1.3 Moderación de comentariosSi el administrador del blog ha elegido la opción Siempre para la moderación de comentariosentonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opciónNunca entonces el comentario se publicará directamente. Esta configuración se realiza en lapágina Configuración > Comentarios.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 143Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2. Se mostrará el listado de comentarios pendientes de revisar. Para leer su contenido completo haz clic sobre el contenido de su entrada. 3. Marca la casilla correspondiente a ese comentario. Para publicarlo pulsa en el botón PUBLICAR. Para eliminarlo pulsa en el botón RECHAZAR.Nota: Blogger no proporciona herramientas para modificar el contenido de los comentarios. Sólo es posible publicarlos o suprimirlos.Suprimir un comentarioPara 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. 3. Al estar autentificado como administrador aparecerá al final de cada comentario un icono con forma de “papelera”. Clic en este icono Suprimir comentario. 4. Clic en el botón SUPRIMIR COMENTARIO.
    • Blogs ::: Moderación de comentarios en Blogger 144Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Se accede a una página de confirmación que incluye el comentario para su revisión. 6. Si cambias de opinión haz clic en el botón CANCELAR. Al hacer clic en el botón SUPRIMIR COMENTARIO se borra el texto del comentario en la página pero se deja el nombre del autor y un mensaje que dice “este comentario ha sido suprimido”. Para eliminar también esta marca será necesario borrar la referencia al comentario en una segunda tentativa. Si se ha activado previamente la opción ¿Eliminar para siempre? entonces no quedará ningún rastro del comentario en el blog. En cualquier caso el comentario es irrecuperable desde la primera vez que se pulsa en el botón SUPRIMIR COMENTARIO, tanto si hemos marcada la opción ¿Eliminar para siempre? o no.Notas:  Si se ha suprimido un comentario, no hay forma de recuperarlo.  No es posible editar los comentarios. Se puede copiar y pegar para volver a escribirlo con los cambios que se desee. Sin embargo, la hora de entrada se modificará y dejará constancia que se trata de un nuevo comentario.
    • Blogs ::: Moderación de comentarios en Wordpress 145Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado 7.2 Moderación de comentarios en Wordpress
    • Blogs ::: Moderación de comentarios en Wordpress 146Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado7.2.1 Configuración de comentariosEl administrador de un blog debe tener previsto desde un principio cómo desea gestionar loscomentarios de sus lectores. Para ello: 1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Opciones > Comentarios. 2. Desde esta página de Opciones de comentarios se pueden tomar decisiones sobre el comportamiento del blog en relación con la gestión de los comentarios de los lectores:Configuración por defecto de las entradas  Tratar de notificar a todos los sitios enlazados en la entrada.  Permitir notificaciones de enlace desde otros sitios (pingbacks y trackbacks)  Permitir comentarios en las nuevas entradasOtras opciones de comentarios  El autor del comentario debe rellenar el nombre y el e-mail  Los usuarios deben registrarse e identificarse para comentar  Cerrar automáticamente los comentarios en las entradas con más de 14 días  Activar los comentarios anidados hasta 3 niveles  Separa los comentarios en páginas de 50 comentarios por página y se muestra la última página por defecto. Los comentarios se ordenarán con los más antiguos al principio
    • Blogs ::: Moderación de comentarios en Wordpress 147Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesoradoEnviarme un e-mail cuando  Alguien envía un comentario  Se ha recibido un comentario para moderarPara que un comentario aparezca  Un administrador debe aprobar el comentario  El autor del comentario debe tener un comentario previamente aprobadoModeració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".Lista negra de comentarios  Cuando un comentario contenga cualquiera de estas palabras en su contenido, nombre, URL, e-mail, o IP, será marcado como spam. Una palabra o IP por línea. Tendrá en cuenta las coincidencias parcialesl, así que "press" coincidirá con "WordPress".Responder comentarios vía correo electrónico  Habilitar el envío de respuestas en los comentarios por correo electrónicoSuscribirse a los comentarios  Mostrar a un suscribirse a los comentarios en el formulario de comentariosSuscribirse al blog  Mostrar a un suscribirse al blog opción en el formulario de comentariosAvataresUn avatar es una imagen para identificar a un usuario y normalmente sale al lado de sunombre en los comentarios o referencias. Desde aquí puedes permitir la visualización de losavatares de los usuarios que dejen comentarios en tu blog.Visibilidad  No mostrar avatares  Mostrar avataresPuntuació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 adultoAvatar por defectoPara usuarios que no tiene un avatar personalizado podemos mostrar uno genérico o unlogotipo basado en la dirección de correo electrónico del mismo.  Hombre misterioso  Blanco  Logo de Gravatar  Identicon (Generado)  Wavatar (Generado)  MonsterID (Generado)
    • Blogs ::: Moderación de comentarios en Wordpress 148Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado 3. Tras definir los valores de estos parámetros haz clic en el botón Guardar cambios.7.2.2 Envío de comentariosCuando se accede a la lectura individual de un artículo o entrada del blog, en la parte inferiorse muestran los comentarios de los lectores y al final de los mismos se ofrece un formulariopara el envío de nuevos comentarios.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.Para completar el envío se pulsa en el botón Enviar comentario. Si el usuario se encuentraautentificado previamente en Wordpress entonces en este formulario no se solicitará elusuario, ni la dirección de correo ni la web.Si el administrador del blog ha desactivado la opción “Un administrador debe aprobar elcomentario” entonces el comentario se publicará directamente. Si se activa esta opción seránecesaria la supervisión de un administrador del blog para que se publique y sea visible portodos los usuarios lectores.
    • Blogs ::: Moderación de comentarios en Wordpress 149Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado7.2.3 Moderación de comentariosPara activar la moderación de todos los comentarios que nos envíen los lectores es necesarioconfigurar al menos los siguientes parámetros en Opciones > Comentarios > Para que uncomentario aparezca …  Un administrador debe aprobar un comentario: Activado  El autor del comentario debe tener un comentario previamente aprobado: No activado.Aprobar un comentario 1. Cuando existe moderación de comentarios, al lector que envía un comentario se le muestra un mensaje donde se le indica que su comentario está pendiente de moderación por un administrador del blog. 2. El administrador desde el interfaz de gestión accede a la moderación de comentarios a través del enlace Comentarios que está acompañado de un valor numérico que indica el número de comentarios pendiente de moderación. 3. Se mostrará el listado de comentarios entre los que se encuentran aquellos pendientes de revisar. 4. Puedes aprobar un comentario con carácter individual pulsando en el enlace Aprobar que se muestra en ese comentario. Otra posibilidad es el aprobado masivo. Para ello marca la casilla correspondiente a todos los comentarios que deseas aprobar y a continuación despliega el combo de Acciones en lote, elige la opción Aprobar y a continuación pulsa en el botón Aplicar.
    • Blogs ::: Moderación de comentarios en Wordpress 150Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesoradoSuprimir un comentarioPara 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 151Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesoradoEditar un comentarioWordpress permite editar el contenido de un comentario. Para ello basta con elegir la opciónEditar o bien Edición rápida para acceder a una página donde es posible modificarlo.Marcar como spamSi marcas un comentario como spam éste se guarda en la carpeta Spam de los comentarios ycualquier otro comentario enviado posteriormente desde la misma IP será destinadoautomáticamente a esta carpeta.
    • Blogs ::: Usuarios y permisos en Blogger 152Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. Usuarios y permisos
    • Blogs ::: Usuarios y permisos en Blogger 153Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.1 Usuarios y permisos en Blogger
    • Blogs ::: Usuarios y permisos en Blogger 154Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado8.1.1 Tipos de usuariosBlogger contempla en un blog tres tipos de usuarios: administrador, autor y lector.  Administrador. El usuario que ha creado el blog es el administrador y dispone de todos los permisos. Puede definir las opciones de configuración del blog, establecer su estilo gráfico, añadir usuarios como autores o lectores, modificar los artículos del resto de autores, etc. El administrador puede asignar permisos de administrador a un usuario autor.  Autor. Los usuarios registrados como autores en el blog tienen permisos muy definidos y limitados: pueden crear y publicar sus propios artículos, enviarlos por email y darse de baja. No pueden editar los artículos del resto de autores, ni moderar comentarios ni modificar las opciones de configuración.  Lector. El registro de lectores en un blog tiene sentido cuando se limita el acceso en modo lectura a usuarios registrados. El usuario debe introducir sus credenciales para poder leer el contenido de los artículos.Nota:  En un blog de Blogger sólo se pueden añadir usuarios que dispongan de cuenta en Google.8.1.2 Añadir autores 1. Desde el interfaz de gestión del blog selecciona Configuración > Permisos. 2. En la página de Permisos, en el apartado Autores del blog en el botón AÑADIR AUTORES. 3. En el cuadro de texto introduce las direcciones de correo electrónico Google de los usuarios (separados por comas) que desees añadir como autores a la gestión del blog. Otra posibilidad es pulsar en el enlace Seleccionar de los contactos para elegirlos de la agenda Google de tus contactos personales.
    • Blogs ::: Usuarios y permisos en Blogger 155Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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.8.1.3 Añadir lectores 1. Desde el interfaz de gestión del blog selecciona Configuración > Permisos. 2. En la sección Lectores del blog puedes configurar su lectura como sigue:  Cualquiera. Todos los artículos serán de lectura pública y anónima. No es necesario introducir credenciales.  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 156Multimedia 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 usuariosSi se decide restringir el acceso en modo lectura a un blog entonces al tratar de acceder através de su URL, se mostrará un formulario para introducir las credenciales de usuario.
    • Blogs ::: Usuarios y permisos en Wordpress 157Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2 Usuarios y permisos en Wordpress
    • Blogs ::: Usuarios y permisos en Wordpress 158Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado8.2.1 Tipos de usuariosWordpress contempla en un blog 4 tipos de usuarios: administrador, editor, autor ycolaborador.  Administrador. Tiene un control completo sobreelblog y puede gestionarlo cualquier aspecto del mismo: entradas, comentarios, configuración de opciones, selección de temas, importación/exportación, gestión de usuarios, etc. Se recomienda que el número de administradores por blog sea reducido.  Editor. Puede publicar, editar y borrar cualquier entrada o página, moderar comentarios, gestionar categorías, etiquetas y enlaces, así como subir imágenes y archivos. También tiene acceso a las estadísticas del blog.  Autor. Puede editar, publicar y borrar sólo sus propios artículos pudiendo también subir documentos e imágenes.  Colaborador. Puede editar sus entradas pero NO puede publicarlos. Es necesario que un administrador supervise y apruebe su entrada para que sea visible en el frontend del blog. No dispone de permisos para subir imágenes y documentos.8.2.2 Añadir usuarios 1. Desde el interfaz de gestión del blog selecciona Usuarios > Autores y usuarios 2. En la sección Añadir a un usuario de la comunidad introduce el email con que el usuario se ha inscrito en la comunidad Wordpress.com. 3. En la lista desplegable Perfil elige el tipo de usuario que le asignarás: administrador, editor, autor o colaborador. Si la dirección de correo electrónico no está registrada se propone enviarle una invitación para registrarse como usuario de Wordpress.
    • Blogs ::: Usuarios y permisos en Wordpress 159Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado8.2.3 Editar usuarios 1. Desde el interfaz de gestión del blog selecciona Usuarios > Autores y usuarios. 2. Se muestra el listado de usuarios adscritos a nuestro blog. 3. Para borrar un usuario o usuarios de la gestión marca su casilla, despliega la lista Acciones en lote que se ofrece en la parte superior del listado, elige la opción Borrar y pulsa en el botón Aplicar. 4. Para modificar el perfil de un usuario o usuarios marca su casilla, despliega la lista Cambiar perfil a … para seleccionar el nuevo perfil y pulsa en el botón Cambiar. 5. Si pulsas en el enlace que se ofrece en el número de Entradas del usuario se mostrarán las entradas creadas y publicadas por ese autor.
    • Blogs ::: Configuración del blog en Blogger 160Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9. Configuración del blog
    • Blogs ::: Configuración del blog en Blogger 161Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.1 Configuración del blog en Blogger
    • Blogs ::: Configuración del blog en Blogger 162Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.1.1 Opciones básicas 1. Desde el interfaz de gestión de tu blog elige Configuración > Básico. 2. En la página Básico se pueden configurar las siguientes opciones: Herramientas del blog Se ofrecen 3 opciones interesantes: Importar blog - Exportar blog - Suprimir blog. Puedes importar entradas y comentarios desde un blog exportado previamente, exportar este blog o suprimirlo de forma permanente. 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. ¿Deseas añadir tu blog a nuestras listas? Si se indica Sí el blog actual se añadirá a la página principal de Blogger y al listado que se utiliza en la barra de navegación de Blogger (Play y Siguiente blog). Si se elige No, el blog no aparecerá en estos sitios pero seguirá estando disponible en su URL individual. En este caso se mostrará en tu perfil salvo que lo ocultes. ¿Deseas permitir que los motores de búsqueda encuentren tu blog? Si seleccionas Sí se incluirá tu blog en el motor de búsquedas de Google. Si seleccionas No el blog será accesible en su URL pero se especificará que los motores de búsqueda no lo cataloguen. ¿Mostrar Edición rápida en su blog? Si se activa esta opción, cuando se navega por el blog, en cada entrada se mostrará un icono en forma de lápiz, para editar directamente ese artículo con un solo clic. ¿Mostrar enlaces de envío de entradas? Está configurado por defecto como No. Si activas esta opción, al final de cada entrada se mostrará un icono en forma de sobre. Al hacer clic en él, se mostrará un formulario que permite al lector enviar la URL del artículo a un amigo. Contenido para adultos Si se selecciona Sí, los usuarios de tu blog verán un mensaje de advertencia y se les solicitará confirmación para ver tu blog. Configuración global: ¿Mostrar el modo de composición para todos sus blogs? Establece si el editor de artículos mostrará o no botones para la edición visual de contenidos. Configuración global: ¿Habilitar transliteración? Permite agregar al editor un botón de traducción del inglés a uno de los idiomas seleccionados: Hindú, Malayo, Tamil, etc. con unos caracteres diferentes.
    • Blogs ::: Configuración del blog en Blogger 163Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.1.2 Publicación 1. Desde el interfaz de gestión de tu blog elige Configuración > Publicación. 2. En esta página podemos configurar dos opciones muy interesantes del blog: Dominio personalizado. Si dispones de un dominio personal, como por ejemplo, www.<midominio>.<com>, entonces se puede configurar para que apunte al blog creado. De esta forma cuando un usuario en Internet utilice esta URL será redireccionado a tu blog en Blogger. Este dominio personal se puede comprar con alguna de las empresas asociadas a Google o bien se puede aportar si se ha registrado con cualquier otra. Dirección en Blogspot. Si no disponemos de dominio personalizado (es lo más habitual), entonces la URL de acceso al blog es del tipo: http://<miblog>.blogspot.com. En este apartado de la gestión del blog es posible modificar el identificador <miblog> que forma parte de su URL de acceso siempre y cuando esté disponible.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: Mostrar. Especifica el número de entradas que se mostrarán en la página principal o portada del blog. El resto se organizarán en sucesivas páginas a las que se accederá utilizando enlaces situados al final de la página con el texto “Entradas antiguas”. También se puede configurar la página principal para que muestre las entradas de un número concreto de días hasta un máximo de 500 entradas. Formato de cabecera de fecha. Permite definir la forma en que se mostrará la fecha cuando se muestra en la parte superior de cada entrada. 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. Formato de hora. Establece el formato de la hora. Zona horaria. Es conveniente establecer esta zona horaria para ajustar la publicación programada de artículos. Idioma. Señala el idioma utilizado en el blog. En este caso español. 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 título. Si eliges Sí se mostrará un cuadro de texto para introducir el título del artículo cuando se crea una nueva entrada. En caso contrario no se podrá definir título del artículo. Mostrar campo de enlace. Al crear una entrada permite introducir una URL adicional a un archivo de audio o URL relacionada. Habilitar alineación flotante. Permite alinear texto e imágenes en el artículo utilizando la etiqueta <div clear:both>. Si tienes problemas posteriores selecciona No.
    • Blogs ::: Configuración del blog en Blogger 164Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Plantilla de entrada. Si se introduce texto o código en este cuadro, éste se incluirá automáticamente cada vez que se cree una nueva entrada.9.1.4 ComentariosVer 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 lasentrada 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 entradapermiten 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 depágina se incluye información extraída del título de la entrada. Si no se activa esta opciónentonces las URLs individuales de las entradas no serán amigables. Ejemplo:http://multimediaweb20.blogspot.com/2009_08_07_archive.html#13052934595552663049.1.6 Correo electrónico 1. En la sección Configuración > Correo electrónico y móvil puedes introducir hasta 10 direcciones de correo electrónico donde se enviará una notificación cada vez que se publique algún artículo en tu blog.
    • Blogs ::: Configuración del blog en Wordpress 165Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2 Configuración del blog en Wordpress
    • Blogs ::: Configuración del blog en Wordpress 166Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado9.2.1 Opciones generales 1. Desde el interfaz de gestión de tu blog elige Opciones > General. 2. En la página Opciones Generales se pueden configurar las siguientes opciones:  Título del sitio/Site Title. Contiene el título del sitio.  Descripción corta. Este texto explica en pocas palabras qué sitio es éste.  Dirección de email. Esta dirección se utiliza para la gestión del blog. Si se modifica la dirección, se enviará un email de confirmación a esa nueva dirección. La nueva dirección debe estar activa antes de confirmarla.  Zona horaria. Permite elegir la zona horaria en format UTC o bien una ciudad que esté en la misma zona horaria que la tuya.  Formato de Fecha. Para definir un formato predefinido de la fecha o bien uno personalizado utilizandi, por ejemplo, la plantilla “j F Y” para “27 Abril 2010”  Formato de Hora. Elige un formato de hora.  La semana empieza. En España la semana empieza por el lunes.  Idioma. Es el idioma por defecto del blog.  Blog Picture/Icon. Imagen o icono del blog. En este apartado se puede subir una foto en formato JPG o PNG que será utilizada como imagen del blog en Wordpress.com. Se permitirá cortar la foto después de subirla.9.2.2 Escritura 1. Desde el interfaz de gestión de tu blog elige Opciones > Escritura. 2. En esta página podemos configurar las siguientes opciones del blog:  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 167Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado9.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:  La página inicial mostrará … Normalmente por defecto un blog muestra en su portada las últimas entradas publicadas. Sin embargo es posible seleccionar aquí la opción Una página estática y en el combo elegir la página que se mostrará en la portada. En este caso se visualizará siempre la misma información y para acceder a las entradas el usuario utilizará los enlaces que se proporcionan en la barra lateral. Recuerda que la página es una entrada especial que no se incluye en el orden cronológico de artículos.  Número máximo de entradas a mostrar en el blog. Permite establecer el número de entradas que se mostrarán por página en la portada.  Número máximo de entradas a mostrar en el feed. Especifica el número de entradas que se incluirán en el canal de suscripción feed asociado al blog.  Mostrar, para cada entrada en el feed. En el canal de noticias feed se puede mostrar inicialmente el texto completo del artículo o bien el resumen.  Para cada artículo en una fuente de noticias enriquecida, mostrar… En este apartado se puede configurar qué elementos (categoría, etiquetas, contador de comentarios, etc) se incluirán en la información de cada entrada en el canal de noticias feed.  Codificación para páginas y feeds. La codificación utilizada por defecto es UTF-8.  Configuraciones de email. En este apartado se puede introducir un texto de invitación que se envía a los usuarios suscriptores. A este mensaje se añaden de forma automática la URL del sitio y los detalles de confirmación.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:Configuración por defecto de las entradas  Attempt to notify any blogs linked to from the article. Intentar notificaciones a cualquier blog enlazado con o desde el artículo.  Permitir notificaciones de enlace desde otros sitios (pingbacks y trackbacks).  Permitir comentarios en las nuevas entradas. (Esta configuración puede ser modificada para cada entrada en particular)Otras opciones de comentarios  El autor del comentario debe rellenar el nombre y el e-mail  Los usuarios deben registrarse e identificarse para comentar  Cerrar automáticamente los comentarios en las entradas con más de XX días  Activar los comentarios anidados hasta XX niveles  Separa los comentarios en páginas de XX comentarios por página y se muestra la página (primera/última) por defecto  Los comentarios se ordenarán con los (más antiguos/más recientes) al principioEnviarme un e-mail cuando  Alguien envía un comentario  Se ha recibido un comentario para moderarPara que un comentario aparezca  Un administrador debe aprobar el comentario  El autor del comentario debe tener un comentario previamente aprobado
    • Blogs ::: Configuración del blog en Wordpress 168Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoModeració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".Lista negra de comentarios  Cuando un comentario contenga cualquiera de estas palabras en su contenido, nombre, URL, e-mail, o IP, será marcado como spam. Una palabra o IP por línea. Tendrá en cuenta las coincidencias parcialesl, así que "press" coincidirá con "WordPress".Responder comentarios vía correo electrónico  Habilitar el envío de respuestas en los comentarios por correo electrónicoSuscribirse a los comentarios  Mostrar a un suscribirse a los comentarios en el formulario de comentariosSuscribirse al blog  Mostrar a un suscribirse al blog opción en el formulario de comentariosAvataresUn avatar es una imagen que representa al usuario acompañando a su nombre en uncomentario. Esta imagen es visible en aquellos blogs que lo permiten. En este apartado de laconfiguración del blog se puede activar que se muestren los avatares de aquellos usuarios queenvien comentarios al blog.Visibilidad  No mostrar avatares  Mostrar avataresPuntuació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 adultoAvatar por defectoPara usuarios que no tienen un avatar personalizado podemos mostrar uno genérico o unlogotipo basado en su dirección de correo electrónico.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 169Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10. Documentos PDF
    • Blogs ::: Documentos PDF 170Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.1 IntroducciónEn un sitio web es frecuente poner a disposición de los usuarios documentos en formato PDFpara la consulta de información. Ejemplo: los boletines oficiales. Las ventajas que ofrece estetipo 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.En este capítulo se explican los siguientes procedimientos: 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.10.2 Lectura de archivos PDF en WindowsEn Windows necesitamos un programa que nos permita abrir y leer los archivos PDF. La opciónmás habitual es Adobe Reader. Puedes descargar e instalar el archivoAdbeRdr903_es_ES.exe. La instalación se realiza siguiendo las opciones por defecto delasistente. Tras la instalación se creará un acceso directo en el escritorio. Haciendo clic eneste icono se iniciará el programa. Desde el navegador web, cuando hagas clic en un enlace aun documento PDF se iniciará automáticamente Adobe Reader mostrando el contenido delarchivo referenciado en el interior de una ventana del navegador.Si deseas consultar la web de Adobe para comprobar si existe una nueva versión delprograma: http://www.adobe.esOtra alternativa al uso de Adobe Reader es disponer de un programa portable para leerdocumentos PDF. Es el caso del programa Sumatra PDF. Descarga y descomprime el archivoSumatraPDFPortable_1.0.1.paf.exe en una carpeta de tu disco duro o bien en tu pendrive.10.3 Instalación de PDF Creator en WindowsEl programa Adobe Reader permite la lectura de documentos PDF pero no su creación. En sudefecto se propone utilizar PDFCreator como aplicación de libre distribución para crear undocumento PDF a partir de un archivo Word, Excel, etc:http://sourceforge.net/projects/pdfcreator/
    • Blogs ::: Documentos PDF 171Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. Descarga el archivo PDFCreator-0_9_9_setup.exe y ejecuta el asistente de instalación. 2. Selecciona el idioma de instalación. Elige Español y pulsa en el botón Aceptar. 3. Bienvenido al asistente de instalación de PDFCreator. Clic en Siguiente> para continuar. 4. Acuerdo de Licencia. Marca la opción Acepto el acuerdo y pulsa en el botón Siguiente > 5. Tipo de instalación. Activa la opción Instalación estándar y pulsa en el botón Siguiente > 6. Nombre de la impresora. PDF Creator instala una impresora virtual en tu sistema. Desde cualquier aplicación que pueda imprimir se podrán generar archivos PDF si imprimes en esta impresora virtual. En este cuadro se puede definir el nombre con que el sistema identificará a este dispositivo virtual. Conviene dejar la opción por defecto: PDFCreator y pulsar en Siguiente >. 7. Selecciona la Carpeta Destino. Esta aplicación se instala por defecto en la carpeta Archivos de programa. Si deseas instalarlo en otra carpeta pulsa en el botón Examinar aunque se recomienda aceptar la opción por defecto. Clic en el botón Siguiente > 8. Barra de herramienta PDFCreator. Este cuadro de información muestra que tras instalar PDFCreator se puede disponer de una barra de herramientas adicional en Internet Explorer que te permitirá guardar documentos HTML en formato PDF. 9. Selección de componentes. Acepta las opciones por defecto haciendo clic en el botón Siguiente> 10. Selecciona la carpeta del Menú de Inicio. Clic en el botón Siguiente > 11. Selecciona las Tareas Adicionales. Clic en el botón Siguiente> 12. Listo para instalar. Clic en el botón Instalar. 13. Finalizando el asistente de instalación de PDFCreator. Clic en el botón Terminar.10.4 Crear un archivo PDF con PDFCreator 1. Descarga y descomprime el archivo plantas.zip. Como resultado dispondrás de un archivo de texto: plantas.txt y de una página HTML: plantas.html 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 172Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 4. Ahora vamos a imprimir el documento. Elige Archivo > Imprimir. 5. En el cuadro Imprimir selecciona en la lista Nombre la impresora virtual de PDFCreator. Clic en el botón Aceptar.
    • Blogs ::: Documentos PDF 173Multimedia 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. 7. Pulsa en el botón Guardar. 8. Se muestra el cuadro Guardar como … En la lista desplegable Guardar en: selecciona la carpeta destino donde se guardará el archivo PDF final. En la casilla Nombre teclea, por ejemplo, como nombre de archivo plantas. PDFCreator añade automáticamente la extensión *.PDF. Clic en el botón Guardar. 9. Para terminar se abrirá el Adobe Reader mostrando el nuevo archivo PDF.Nota:Una vez que has instalado Adobe Reader y PDF Creator se puede crear un PDF desdecualquier programa que permita la impresión: Microsoft Office, Internet Explorer, MozillaFirefox, etc. Si se utiliza con un navegador web permite realizar copias de seguridad enformato PDF de las páginas web que se visitan. El proceso se iniciará de forma similar a comose describe en este apartado a partir del comando Archivo > Imprimir.
    • Blogs ::: Documentos PDF 174Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.5 Lectura de archivos PDF en UbuntuUbuntu dispone por defecto de un programa instalado para leer y crear documentos PDF. Setrata de Evince Visor de documentos PDF.Para comprobar que está instalado: 1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu 2. En la casilla Buscar introduce el término pdf. Observa que al cabo de unos instantes se mostrará en el listado derecho de aplicaciones la entrada Visor de documentos (Ver documentos multipágina). 3. Éste es el programa que nos permitirá leer e imprimir a PDF desde Ubuntu.Si tratamos de abrir un archivo PDF descargado de Internet a través del navegador o bien unfichero PDF del equipo se abrirá esta aplicación mostrando su contenido. De esta formapodremos leerlos.
    • Blogs ::: Documentos PDF 175Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.6 Impresora virtual PDF en UbuntuLa distribución de Ubuntu proporciona por defecto una impresora virtual PDF que permitecrear un documento PDF a partir de cualquier aplicación mediante Archivo > Imprimir yseleccionando este dispositivo virtual.Para crear un documento PDF con Ubuntu sigue estos pasos: 1. Arranca el navegador web Mozilla Firefox y sitúate en una página web. 2. A continuación selecciona Archivo > Imprimir. 3. En el panel Imprimir, pestaña General, selecciona la opción de Imprimir a un archivo. En la sección Formato de salida marca la opción PDF. 4. Introduce el nombre del archivo PDF en la casilla Nombre. Despliega el combo Guardar en la carpeta para elegir la carpeta destino donde se guardará el documento. 5. Clic en el botón Imprimir. Al cabo de unos instantes dispondrás del archivo PDF en la carpeta destino.10.7 Crear documentos PDF desde OpenOfficeLos programas de OpenOffice como Writer (textos) o Impress (presentaciones) permitenexportar a un documento en formato PDF sin necesidad de disponer de una impresora virtualde PDF instalada en el equipo.WindowsSi no dispones de OpenOffice puedes descargar e instalar la versión portable de OpenOffice:OpenOffice2.exe. Descomprime el contenido en una carpeta de tu disco duro o pendrive paradisponer de este completo paquete ofimático.
    • Blogs ::: Documentos PDF 176Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoUbuntuEn las mayoría de distribuciones de Ubuntu viene instalado OpenOffice por defecto. Seaccede a una de sus aplicaciones desde el escritorio mediante: Aplicaciones > Oficina >OpenOffice.org …AmbosUna vez que ya disponemos de OpenOffice seguimos los siguientes pasos: 1. Abre OpenOffice. 2. Clic en el enlace Crear un documento de texto > Documento de texto 3. Crea un pequeño documento utilizando este procesador de textos. 4. Una vez terminado el documento selecciona la opción Archivo > Exportar en formato PDF …
    • Blogs ::: Documentos PDF 177Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Se muestra el cuadro Opciones de PDF donde es posible configurar ciertos parámetros del PDF resultante. En este caso aceptamos las opciones por defecto y pulsamos en el botón Exportar. 6. En el cuadro Exportar selecciona la carpeta destino en la lista Examinar carpetas. Teclea el nombre del archivo en el cuadro de texto Nombre del PDF y haz clic en el botón Guardar.
    • Blogs ::: Documentos PDF 178Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.8 Publicar un PDF en BloggerEl interfaz de gestión que ofrece Blogger NO permite subir directamente archivos PDF. Sinembargo, de la misma forma que existe un espacio donde se guardan las imágenes (ÁlbumesWeb de Picasa) , existe un espacio denominado Google Sites, asociado a la cuenta de usuarioGoogle, donde es posible subir archivos de distinto tipo para luego enlazarlos desde el blogpara su descarga. En este apartado se explica el procedimiento para hacerlo. 1. Accede a la web de Blogger: http://www.blogger.com 2. Introduce las credenciales de tu cuenta Google y pulsa en el botón Acceder. 3. Clic en el enlace Mi cuenta que aparece en la esquina superior derecha de Blogger. 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. 7. Elige como plantilla la opción Archivador. 8. En Nombre introduce pdf. Observa que la carpeta contenedora de archivos se creará en la ruta: /site/<nombre_usuario>/pdf. Clic en el botón Crear página.
    • Blogs ::: Documentos PDF 179Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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 180Multimedia 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 12. La ruta del enlace será del tipo: http://sites.google.com/site/<nombre_usuario>/pdf/plantas.pdf?attredirects=0 13. Abre el Bloc de Notas y selecciona Edición > Pegar para no perder esta referencia. 14. En la barra superior izquierda selecciona Mas > Más > Blogger o bien escribe directamente en la barra de dirección del navegador la URL de acceso a Blogger: http://www.blogger.com 15. Como ya estabas autentificado previamente al regresar a Blogger te situará en el escritorio. Clic en el botón NUEVA ENTRADA del blog donde deseas publicar tu nuevo artículo. 16. Descarga y descomprime el archivo plantas.zip. Como resultado dispondrás de un archivo de texto: plantas.txt y de una página HTML: plantas.html. Si ya lo has hecho en el apartado anterior no es necesario repetir este paso. 17. Como título introduce La alimentación de las plantas y copia y pega el contenido del archivo de texto plantas.txt como cuerpo del artículo. 18. Al final añade una línea con el texto PDF sobre Anatomía de las plantas. Selecciona este fragmento y pulsa en el botón Enlace para pegar la dirección del PDF que has subido a tu cuenta de Google Sites. Clic en Aceptar.
    • Blogs ::: Documentos PDF 181Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 19. Pulsa en el botón PUBLICAR ENTRADA. A continuación haz clic en Ver blog para ver la apariencia del artículo.10.9 Publicar un PDF en WordpressEl interfaz de gestión que ofrece Wordpress permite subir directamente un archivo PDF paraluego situar un enlace al mismo en una entrada del blog. En este apartado se explica elprocedimientopara hacerlo. 1. En la barra lateral izquierda del interfaz de administración de tu blog en Wordpress elige la opción Entradas > Añadir 2. Descarga y descomprime el archivo plantas.zip. Como resultado dispondrás de un archivo de texto: plantas.txt y de una página HTML: plantas.html. Si ya lo has hecho en el apartado anterior no será necesario este paso. 3. Como título introduce La alimentación de las plantas y copia y pega el contenido del archivo de texto plantas.txt como cuerpo del artículo. 4. Al final añade una línea con el texto PDF sobre Anatomía de las plantas. 5. Clic en el icono Añadir una imagen que se ofrece en la parte superior del editor de entradas.
    • Blogs ::: Documentos PDF 182Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. En el cuadro de diálogo Añadir una imagen elige la pestaña Desde el ordenador y pulsa en el botón Elegir archivos. Observa que aunque inicialmente se sugiere Añadir una imagen, este procedimiento permite subir distintos tipos de archivos: imágenes (*.jpg, *.png y *.gif), documentos PDF (*.pdf), documentos de Word (*.doc y *.docx), presentaciones de Powerpoint (*.ppt y *.pptx) y documentos de OpenOffice (*.odt) 7. Selecciona la carpeta donde se encuentra el archivo plantas.pdf , selecciona ese archivo y luego haz clic en el botón Abrir. 8. Cuando se produce con éxito la subida en la parte inferior de este panel se muestran los datos del archivo subido. Selecciona la URL del enlace y haz clic derecho para elegir la opción Copiar.
    • Blogs ::: Documentos PDF 183Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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 184Multimedia 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. 15. Para terminar pulsa en el botón Publicar. 16. Para visualizar el aspecto del artículo haz clic en el botón Ver entrada.
    • Blogs ::: Google Docs 185Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Google Docs
    • Blogs ::: Google Docs 186Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.1 ¿Qué es Google Apps?11.1.1 IntroducciónGoogle Apps es un servicio web 2.0 ofrecido por Google a los usuarios registrados con cuentade Gmail (http://www.gmail.com). Se puede utilizar para desarrollar una comunidad deusuarios 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)11.1.2 ¿Por qué Google Apps?En el entorno educativo o laboral o de ocio es frecuente encontrarse con la necesidad de unsoporte informático a una experiencia de colaboración entre un grupo de personas en eldiseño de un trabajo colectivo. El denominador común de cualquiera de estas iniciativas serápor un lado la creación y publicación compartida de documentos de texto, presentaciones yhojas de cálculo y por otra la comunicación en tiempo real (mensajería instantánea) odiferido (emails). En este contexto Google Apps puede ser un excelente recurso para crear ysoportar la actividad de un grupo de trabajo.Google Apps ofrece una serie de ventajas en el trabajo colaborativo: 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 187Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.1.3 Descripción de las aplicaciones más interesantesGmail. Servicio de correo electrónico.http://mail.google.com  7 Gb de espacio de almacenamiento y en alza.  Sistema de correo web muy potente: búsqueda integrada de mensajes, lista de contactos, organización en carpetas, reglas de mensajes, etc.  Accesible desde cualquier navegador: IExplorer, Firefox, Safari, Mozilla, etc.  Protección antivirus y antispam.  Configuración POP: se pueden descargar los mensajes en un cliente de correo electrónico como Outlook, Thunderbird, Eudora o similar.  Garantía de alta disponibilidad: 99%Para configurar una cuenta en un cliente de correo son necesarios 2 pasos:  Activar el acceso POP en el webmail: http://mail.google.com/support/bin/answer.py?answer=13273  Configurar una cuenta en el cliente de correo: http://mail.google.com/support/bin/topic.py?topic=12805Google Talks. Servicio de mensajería instantánea.http://www.google.com/talk/intl/es/  Permite conversaciones de voz utilizando el programa Google Talk o bien un cliente compatible con este protocolo como Pidgin. Si un contacto no está conectado se le puede dejar un mensaje de voz.  Transferencias de archivos en tiempo real.  Lista de contactos integrada.  Acceso vía web al subsistema de envío de mensajes de texto en tiempo real.  Integración en Gmail que permite desde ésta saber quien está online y enviarle un mensaje en tiempo real desde el navegador del correo electrónico.  Las conversaciones se pueden guardar en un archivo.
    • Blogs ::: Google Docs 188Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoGoogle Calendar. Servicio de agenda-calendario individual y colectivo.http://www.google.com/calendar/  Permite anotar los eventos en la agenda y enviar invitaciones a otras personas o programar recordatorios en ventana emergente o por email.  Interfaz intuitivo e interactivo con funciones de arrastrar y soltar.  Lista de contactos integrada.  Incorpora la posibilidad de reservar espacios para reuniones.  Control de quien puede o no puede ver o editar tu calendario.  Accesible desde cualquier navegador web: IExplorer, Firefox o Safari.Google Docs. Servicio para crear y compartir documentos.http://docs.google.comGoogle Docs permite crear documentos de texto, presentaciones y hojas de cálculo medianteun editor que se utiliza a través del navegador web. Esto facilita la edición de un documentoonline entre varias personas simultáneamente desde sus respectivos navegadores.Es posible importar y exportar archivos en Google Docs de una forma muy sencilla. Parautilizar un archivo guardado en el equipo basta con subirlo (importarlo) y continuar allí dondese había dejado. Para trabajar con documentos sin conexión o distribuirlos como adjuntos, sepuede 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.Las características más destacadas de Google Docs son:
    • Blogs ::: Google Docs 189Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Creación de nuevos documentos o importación de documentos locales que es posible continuar editándolos desde cualquier equipo conectado a Internet.  Colaboración en tiempo real: se puede trabajar sobre un documento e invitar a otros usuarios para editarlo simultáneamente aunque se encuentren en distintas ubicaciones.  Historial de revisiones: se guarda una lista de revisiones para poder comprobar lo que añadió o eliminó cada uno y cuando lo hizo.  Herramientas de búsqueda: permite buscar los documentos utilizando un motor de búsqueda muy eficaz.  Seguridad y privacidad: el propietario o creador del documento elige quién puede ver o editar su documento.  Multiplataforma: se puede acceder a Google Docs desde cualquier navegador web.Google Sites. Servicio para crear un sitio web.http://sites.google.comGoogle Sites es una aplicación online que permite crear un sitio web de grupo de formasencilla y colaborativa. Los usuarios pueden reunir en un único lugar y de una forma rápidainformación variada, incluidos vídeos, calendarios, presentaciones, archivos adjuntos y texto.Las características más destacadas de Google Sites son:  Personalización del estilo gráfico del sitio dotando a todas las páginas de una apariencia similar y acorde con el grupo o proyecto.  Crear una nueva página con un simple clic de botón.  En el diseño de una página se pueden utilizar variados tipos de plantillas: web, anuncios, archivador, etc.  Centralizar información compartida: se pueden subir archivos adjuntos y se puede incrustar contenido multimedia (vídeos, documentos de Google Docs, presentaciones de Picassa, gadgets de iGoogle, etc) en las páginas web.  Administración de los permisos de edición y publicación del sitio.  Incorporación del motor de búsqueda de Google a los contenidos del sitio.Esta suite se complementa con otras interesantes aplicaciones como Google Reader (organizalas suscripciones RSS), Google Photos (albumes web con Picassa), Google Maps (Mapas parageolocalización de fotos), Google Grupos (foros de debate e intercambio de archivos), etc.
    • Blogs ::: Google Docs 190Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.2 Crear y compartir un documento en Google DocsEn este tutorial se explica el procedimiento para crear y compartir un documento sencillo enuna comunidad de Google Docs.Paso 1. Acceder a Google Docs 1. Visita la dirección de Gmail: www.gmail.com 2. Introduce tus credenciales de Gmail: usuario y contraseña. Si no dispones de ellas crea una cuenta y en pocos minutos dispondrás de estos datos de acceso. 3. Desde el interfaz de Gmail haz clic en el enlace Docs.Si el interfaz se muestra en inglés haz clic en el enlace Settings que aparece en la esquinasuperior derecha y elige Settings Docs. A continuación define Español como idioma y Madridcomo franja horaria. Clic en Save (Guardar).Si el interfaz de edición de documentos de que dispones NO coincide con las capturas depantalla que se incluyen en este manual quizás sea debido a que no tienes activada la últimaversión del editor. Para ello en la barra de menús de la esquina superior derecha de la páginaelige Configuración > Configuración de Docs. En la página Configuración, pestaña Ediciónhay que marcar la opción Nueva versión de documentos de Google > Crea nuevosdocumentos de texto con la versión más reciente del editor de documentos.Paso 2. Crear un nuevo documento 1. Para crear un nuevo documento selecciona Crear nuevo > Documento. 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 191Multimedia 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.Paso 3. Buscar información 5. A continuación vamos a buscar en Wikipedia la información necesaria para elaborar el documento. Para ello desde el navegador web selecciona Archivo > Nueva pestaña. 6. En el cuadro de búsquedas de Firefox despliega la lista de motores de búsqueda pulsando en la cabeza de flecha negra que acompaña al icono del buscador activado por defecto. Selecciona Wikipedia (es-ES). Otra posibilidad es acceder a Wikipedia buscando su dirección por Google.
    • Blogs ::: Google Docs 192Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. A continuación introduce el término de búsqueda. En este caso: Federico García Lorca. Al pulsar en el icono de lupa o al pulsar la tecla enter se mostrará la página de resultados de Wikipedia. 8. Puede mostrarse directamente el artículo sobre Federico García Lorca o bien la página de resultados de Wikipedia. En este caso pulsa en el primer enlace o bien en el botón Ir del cuadro de búsqueda que contendrá la cadena de búsqueda introducida. Esta acción nos situará en la página de esta enciclopedia sobre el tema buscado. 9. Sobre el documento de Wikipedia pulsa y arrastra para seleccionar un párrafo o párrafos. A continuación en la barra de menús del navegador selecciona Editar > Copiar. Otra posibilidad es hacer clic derecho sobre la selección y en el menú flotante que se muestra elegir la opción Copiar. 10. En el navegador web pulsa en la pestaña anterior para regresar al documento de Google Docs. Haz clic debajo del título y a continuación selecciona en la barra de menús del navegador Edición > Pegar o bien pulsa las teclas Ctrl+V Esta acción pegará el texto sobre el documento que estamos elaborando.
    • Blogs ::: Google Docs 193Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPaso 4. Editar el texto 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.Paso 5. Insertar una imagen de Internet 14. En el navegador web pulsa en la pestaña de Wikipedia. Ahora vamos a capturar la imagen. Clic derecho sobre la imagen del artículo de Wikipedia y selecciona la opción Copiar la ruta de la imagen.
    • Blogs ::: Google Docs 194Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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… 17. Clic en el botón Seleccione.
    • Blogs ::: Google Docs 195Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPaso 6. Insertar un hipervínculo 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 196Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 22. Clic en el botón Aceptar.Paso 7. Guardar el documento 23. Durante la edición del documento, éste se guarda cada cierto tiempo sin avisar al usuario. Si la última versión del documento NO se encuentra guardada en el servidor se mostrará activo el botón Guardar en la esquina superior derecha del editor de documentos. Si los últimos cambios ya están guardados se mostrará el botón Guardado deshabilitado. 24. El nombre del archivo si no lo hemos ise genera automáticamente y se muestra siempre debajo del logo de Google Docs. Si deseas cambiarlo selecciona Archivo > Cambiar nombre e introduce el nuevo.
    • Blogs ::: Google Docs 197Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPaso 8. Configurar las opciones de CompartirEn relación con un documento creado en Google Docs existen 3 tipos de usuarios: propietario,colaborador y lector. La diferencia entre estos dos últimos radica en que el colaboradorpuede modificar el documentoaunque no sea su propietario. 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. 26. Clic en el pestaña Invitar a usuarios. 27. En el recuadro Invitar puedes escribir la dirección de correo electrónico de cada usuario que deseas invitar. Sitúa cada usuario en una línea independiente o bien separados por coma. Otra posibilidad es hacer clic en el enlace Elegir de los contactos. En el cuadro Elegir de la lista de contactos puedes pulsar en Todos o bien pulsando sobre los usuarios deseados. Para terminar clic en el botón Finalizado. Se recomienda añadir usuarios con cuenta en Google.
    • Blogs ::: Google Docs 198Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 29. Para completar el registro existen dos opciones alternativas:  Enviar un mensaje a cada usuario. Para ello introduce el Asunto y el Mensaje de notificación. También es posible marcar la opción Enviarme una copia. Para completar el registro y enviarle un mensaje a cada usuario pulsa en el botón Enviar.  Añadir sin enviar invitación. Se registra al usuario pero no se le envía mensaje de invitación. Clic en el enlace Añadir sin enviar invitació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 199Multimedia 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. 33. Clic en la pestaña Permisos avanzados podrás configurar 2 opciones:  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.Algunos detalles de compartir:  Cualquier documento se puede compartir en modo edición o lectura con un total máximo de 200 usuarios.  En los Documentos y presentaciones sólo 10 personas pueden editar al mismo tiempo. En una Hoja de Cálculo hasta 50.  Cuando se está editando un documento a la vez que otro colaborador, su nombre aparece en la parte inferior derecha del documento.  Cuando un usuario accede a Ver presentación se abre una ventana de Chat donde los usuarios puede intercambiar opiniones en tiempo real a través del teclado. 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 200Multimedia 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.11.3 Gestión de archivos en Google Docs11.3.1 Importación de archivos a Google Docs 1. Descarga y descomprime en tu equipo la presentación de Powerpoint TIC_project.ppt adjunta. 2. Accede a Google Docs en modo autentificado. Si el interfaz del gestor de archivos está en inglés lo puedes pasar al español en la sección Settings (Configuración) accesible en el enlace superior derecha del gestor. 3. Desde el gestor de archivos pulsa en el enlace Subir/Upload 4. Clic en el enlace Seleccionar archivos para subir 5. Navega en el disco duro de tu ordenador para seleccionar el archivo de la presentación descargada: TIC_project.ppt.
    • Blogs ::: Google Docs 201Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Asegúrate de que está activada la casilla Convertir documentos, presentaciones y hojas de cálculo a los formatos correspondientes de Google Docs. De esta forma el archivo será subido y transformado para ser editado por el sistema de edición de Google. 7. Clic en el botón Iniciar la subida. Existe una limitación de peso para cada tipo de archivo que se puede subir: documentos, presentaciones, hojas de cálculo y documentos PDF. 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 202Multimedia 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.11.3.2 Obtener el enlace para compartirSe puede invitar a participar como colaborador o como lector a un usuario eligiendo eldocumento y seleccionando Compartir > Invitar a usuarios.Otra posibilidad es activar la opción de que cualquier usuario anónimo (sin disponer de cuentaen Google) pueda acceder directamente a nuestro documento con solo disponer de su URL odirección en internet. Le enviaríamos esta URL pegada en un mensaje de correo electrónico y
    • Blogs ::: Google Docs 203Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesoradoel usuario accedería a este documento pulsando en el enlace sin necesidad de introducirninguna credencial. 1. En el gestor de archivos de Google Docs marca la casilla de verificación que acompaña a un documento. 2. En la barra de herramientas del gestor de archivos elige Compartir > Obtener el enlace para compartir … 3. En el cuadro de diálogo Obtener el enlace para compartir marca la casilla Permitir que lo vea cualquiera que tenga el enlace. Como se indica NO se requiere introducir credenciales (usuario y contraseña) de acceso. 4. Clic derecho sobre en enlace que se proporciona y elige Copiar. A continuación puedes pegar esta dirección en un mensaje de correo electrónico para enviársela a otro usuario. Si hemos asignado permisos de edición a ese usuario autentificado o bien hemos permitido la edición pública (sin autentificar) entonces el mencionado usuario podrá modificar su contenido. En caso contrario sólo podrá leerlo al acceder a la URL enviada. 5. Clic en el botón Guardar y cerrar.11.3.3 Gestión de archivos en Google DocsDesde el administrador de archivos se pueden realizar distintas operaciones con los archivos.
    • Blogs ::: Google Docs 204Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEn la columna izquierda del administrador de archivos se muestran las categorías y carpetasen que se organizan todos los archivos accesibles para el usuario actual a través deladministrador de archivos. Es importante recordar que sólo serán accesibles a través de esteinterfaz aquellos archivos de los que sea propietario y aquellos compartidos por otros paraese usuario en concreto.Basta hacer clic sobre una categoría o carpeta en la columna izquierda, para que se muestredetalle de los archivos que contiene en el panel derecho.Las categorías y carpetas de la columna izquierda son:  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.Desde el administrador de archivos se pueden realizar las operaciones más habituales:Para crear un nuevo archivo:Nuevo > Documento | Hoja de cálculo | Presentación | Formulario | Desde la plantillaPara crear una carpeta nueva:Nuevo > Carpeta (Folder).Para cambiar de nombre un archivo:Marca la casilla del documento en el panel derecho y pulsa en el botón Cambiar nombrePara cambiar de nombre una carpeta:Selecciona la carpeta en el panel izquierdo y en el panel derecho pulsa sobre su nombre paraintroducir el nuevo nombre.
    • Blogs ::: Google Docs 205Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPara eliminar un archivo:Marcar la casilla del documento y pulsar en el botón Suprimir. El documento se moverá a lacarpeta Papelera situada en la columna izquierda de la página.Para mover un archivo a otra carpeta:Marcar la casilla del archivo y pulsar en el botón Carpetas para seleccionar la carpetadestino. Otra posibilidad es arrastrar un archivo desde el panel derecho hasta soltarlo sobre lacarpeta correspondiente en la columna izquierda.Para definir las opciones de compartir:Marcar la casilla del archivo y pulsar en Compartir > Invitar a usuarios.Para ocultar/mostrar un archivo activa su casilla de selección y luego selecciona Másacciones > Ocultar/Mostrar. El archivo oculto se guardará en la carpeta Ocultos que apareceen la columna izquierda del administrador de archivos.
    • Blogs ::: Google Docs 206Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPara ver el Historial de Revisiones de un documento existen dos procedimientosalternativos que se pueden utilizar:  Desde el explorador de archivos de Google Docs, activa la casilla de selección del archivo correspondiente y a continuación selecciona Más acciones > Revisiones.  Desde el editor de ese archivo, elige Archivo > Ver historial de revisión.Utilizando cualquiera de estos dos procedimientos se puede navegar por las distintasversiones 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 lohizo. 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 principalesopciones de procesamiento.11.3.4 Exportación de archivosA partir de cualquier archivo de Google Docs se puede obtener una copia para manejar en eldisco duro local fuera de línea o bien para enviar como adjunto en un correo electrónico apersonas ajenas a la comunidad. 1. Desde el administrador de archivos marca la casilla de selección del archivo que deseas exportar. 2. En la barra de herramientas selecciona Más opciones > Exportar como… Dependiendo del tipo de archivo se mostrarán distintas opciones de exportación:
    • Blogs ::: Google Docs 207Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  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. 3. Despliega el combo para elegir el formato de exportación. 4. A continuación pulsa en el botón Descargar para guardar en local el archivo en el formato elegido.Nota:En ocasiones cuando se utiliza Mozilla Firefox puede ocurrir que se conozca la carpetadestino donde se guardan los archivos descargados. Para saber dónde lo hace o bien forzar aque 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 archivosen para elegir la carpeta destino donde se guardarán todas las descargas o bien marca laopción Preguntarme siempre dónde guardar los archivos.
    • Blogs ::: Google Docs 208Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.4 Crear un documento a partir de una plantillaGoogle Docs proporciona un amplio catálogo de plantillas que facilitan la creación de nuevosdocumentos de texto, presentaciones, etc. 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 209Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.5 Formularios11.5.1 ¿Qué son los formularios?Google Docs ofrece la posibilidad de diseñar un formulario de preguntas, enviar la URL deacceso a los usuarios que deseemos para que lo rellenen y luego recoger sus respuestas enforma de tabla y gráficos de datos.11.5.2 Crear un nuevo formulario 1. Desde el gestor de archivos elige Nuevo > Formulario (Form). 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. 3. Debajo del título y descripción del formulario aparecerá el listado de preguntas. 4. Para editar una pregunta haz clic en el botón con el icono del lápiz en la esquina superior derecha de esa entrada. Para eliminar una pregunta haz clic en el botón con el icono de la papelera. 5. Para añadir una nueva pregunta en el botón superior izquierda elige Añadir elemento > Tipo de pregunta. 6. En este caso se propone realizar el siguiente formulario de preguntas donde se experimentan algunas de sus distintas modalidades:Pregunta 1:
    • Blogs ::: Google Docs 210Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPregunta 2:Pregunta 3:Pregunta 4:
    • Blogs ::: Google Docs 211Multimedia 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. 10. Para terminar el formulario haz clic en el botón Guardar. 11. En la parte inferior de la página de edición del formulario se proporciona la URL de acceso directo al formulario. Haz clic en este enlace y se abrirá una nueva ventana mostrando el formulario. En la barra de dirección del navegador selecciona la dirección y haz clic derecho para elegir Copiar.
    • Blogs ::: Google Docs 212Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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.11.5.3 Consulta de los resultados de un formulario 1. En el gestor de archivos de GDocs haz clic sobre el formulario creado. 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. 4. Para disponer de la URL de acceso al formulario, en la edición de su hoja de cálculo puedes elegir Formulario > Ir al formulario en directo. 5. Para ver el resumen de las respuestas enviadas al formulario, en la edición de su hoja de cálculo, elige Formulario > Mostrar el resumen de respuestas. En esta página se mostrará gráficos resumen de las respuestas almacenadas.
    • Blogs ::: Google Docs 213Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Para detener/reactivar el envío de respuestas al formulario, desde la edición de su hoja de cálculo asociada, elige Formulario > Aceptando respuestas.11.6 Integración de Google Docs en BloggerExisten dos formas de integrar un documento de GDocs en un blog de Blogger:  Enlace a su URL. 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.  Marco interno a su URL. Se utiliza la etiqueta iframe que permite crear un marco interno que apunte a una dirección URL.11.6.1 Integración de un documento de texto 1. En el gestor de archivos de GDocs haz clic sobre el título de un documento de texto. 2. En la esquina superior derecha del editor de documentos pulsa en el botón Compartir y después elige la opción Publicar en la Web.
    • Blogs ::: Google Docs 214Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 3. Clic en el botón Iniciar la publicación que se ofrece en el panel Publicar en la Web. 4. Si se desea detener la publicación del documento haz clic en el botón Detener publicación. En este caso vamos a dejar activada la publicación y además marcaremos la opción Volver a publicar automáticamente cuando se realicen cambios para asegurarnos de que seguirá publicado aunque realicemos cambios. 5. Selecciona la dirección al documento que se proporciona, clic derecho y elige Copiar.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.Marco interno a su URL: 7. Otra posibilidad es pegar en el código HTML del artículo lo siguiente: <iframe src="<url_documento>" width="100%" height="400"></iframe> donde <url_documento> es la dirección o URL al documento que hemos copiado en el paso anterior. También se puede copiar y pegar el código HTML que se ofrece en el panel Publicar en la Web
    • Blogs ::: Google Docs 215Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 9. Al publicar el artículo se mostrará en su interior un marco interno dentro del cual se leerá el documento de Google Docs.
    • Blogs ::: Google Docs 216Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.6.2 Integración de una presentación 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 3. Clic en el botón Publicar documento. 4. Se muestra una página donde se puede …  Detener la publicación de la presentación en Internet pulsando en este botón.  Copiar la URL de la presentación. Selecciona la URL, clic derecho y elige Copiar.  Copiar el código para insertar el reproductor en el código HTML de tu blog. 5. Cabe la posibilidad de crear un enlace en la entrada de tu blog a la URL que hemos copiado. El procedimiento es similar al explicado en el apartado anterior para los documentos de texto. En una presentación NO es posible exportar el contenido al artículo de un blog. 6. Sin embargo la opción más interesante es insertar un visor con la presentación en la entrada de tu blog. Para ello en la página donde hemos decidido que la presentación de GDocs se publicara configura las siguientes opciones:  Tamaño del reproductor. En este caso elegiremos el tamaño pequeño.  Avanzar la presentación de forma automática. La opción por defecto es cada 3 segundos.  Iniciar la presentación cuando se cargue el reproductor. Puedes activar esta opción para que el visor comience con la reproducción automática cuando se cargue.
    • Blogs ::: Google Docs 217Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Reiniciar la presentación después de la última diapositiva. Si activas esta casilla después de la última diapositiva se mostrará la primera y así sucesivamente en bucle infinito. 7. Una vez que has definido los distintos parámetros del reproductor, selecciona el código HTML que se ofrece y haz clic derecho para seleccionar Copiar. 8. Sitúate en el editor de la entrada de tu blog, haz clic en la pestaña Edición de HTML y haz clic derecho para elegir Pegar. Al publicar la entrada y visualizar su aspecto verás que se ha insertado un reproductor mostrando el contenido de la presentación.11.6.3 Integración de una hoja de cálculo 1. Desde el gestor de archivos de GDocs haz clic sobre el título de una hoja de cálculo para acceder al editor de la misma. 2. Una vez situado en el editor de la presentación, elige Compartir > Publicar como página web. 3. Se pueden publicar Todas las hojas o sólo una hoja en concreto. Marca la opción Volver a publicar automáticamente cuando se realicen los cambios. Clic en el botón Iniciar la publicación. 4. En la sección Obtener un enlace a los datos publicados elige una de las siguientes opciones:
    • Blogs ::: Google Docs 218Multimedia 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.11.6.4 Integración de un formulario. 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 219Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. En la página de edición del formulario elige Más acciones > Incrustar. 4. Se muestra el cuadro de diálogo Incrustar. Haz clic derecho sobre el código y elige Copiar. 5. Si pegas este código en el código de una entrada del blog se insertará en el formulario. 6. Desde la edición de un informe puedes elegir Ver respuesta > Resumen para luego copiar la URL de la barra de dirección del navegador web y crear un enlace a esta página que muestra de una forma gráfica el resumen del formulario.11.7 Integración de Google Docs en WordpressEn un blog de Wordpress no se admite la etiqueta HTML <iframe> por razones de seguridad.Por ello NO es posible integrar una marco interno en una entrada del blog mostrando undocumento de Google.Por este motivo para integrar un documento de GDocs en un blog de Wordpress se utiliza elenlace a su URL. Esto se puede aplicar a documentos de texto, presentaciones, hojas decálculo, formularios, etc. Se escribe un texto y en él se define un enlace de tal forma quecuando el usuario hace clic en él es redirigido a esa dirección del documento alojado enGoogle Docs. 1. En el gestor de archivos de GDocs haz clic sobre el título de un documento de texto.
    • Blogs ::: Google Docs 220Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En la esquina superior derecha del editor de documentos pulsa en el botón Compartir y después elige la opción Publicar en la Web. 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. 3. En el panel Publicar en la Web haz clic en el botón Iniciar la publicación. 4. Si se desea detener la publicación del documento haz clic en el botón Detener publicación. En este caso vamos a dejar activada la publicación y además marcaremos la opción Volver a publicar automáticamente cuando se realicen cambios para asegurarnos de que seguirá publicado aunque realicemos cambios.
    • Blogs ::: Google Docs 221Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Selecciona el Enlace de documento que se proporciona, clic derecho y elige Copiar. 6. Ya hemos copiado el enlace directo al documento. Si nos situamos en el editor de artículos de Wordpress se puede insertar mediante un texto al que luego asociamos un enlace.
    • Blogs ::: Derechos de autor 222Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12. Derechos de autor
    • Blogs ::: Derechos de autor 223Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado12.1 IntroducciónEn 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 interesanteestablecer las condiciones de uso.12.2 Los derechos de autorLos materiales multimedia tanto en formato cdrom como en internet están sujetos a la mismalegislación sobre derechos de autor que el resto de obras: libros, pinturas, música, etc. Estosignifica que si decidimos incorporar recursos ajenos (léase imágenes, audios, vídeos, etc) anuestro espacio web debemos conocer y respetar las condiciones de uso que han definido losautores de estos materiales. Y esto es especialmente significativo cuando el material quehemos elaborado supera el contexto de uso particular y se pretende publicar en internet. Esentonces cuando existe posibilidad de ser utilizado por otras personas incluso en claracompetencia con el material original.En ocasiones cuando accedemos a un espacio web, su autor explicita la posibilidad dereutilización a cambio de citar la procedencia (derecho de cita) o bien de que no sefragmente su obra (derecho de obra no derivada).Sin embargo cuando esto no se indica o bien se muestra una licencia de copyright (derechosreservados) conviene ser cauteloso. La apropiación indiscriminada de materiales ajenos paraelaborar un material propio no se puede justificar desde la ausencia de ánimo de lucro quecaracteriza las iniciativas donde participemos. Esta justificación no es suficiente y se hacenecesario en estos casos contactar con el autor o autores para obtener su permiso y en casofavorable citar siempre la fuente de procedencia.12.3 Licencias Creative CommonsCreative Commons (http://es.creativecommons.org/) es una organización que ofrece acualquier usuario la posibilidad de elegir las condiciones en que desea compartir un trabajopublicado en Internet. Para ello debe elegir entre 4 condiciones: Reconocimiento (Attribution): El material creado puede ser distribuido, copiado y exhibido por terceras personas si se reconoce la autoría en los créditos. No Comercial (Non commercial): El material original y los trabajos derivados pueden ser distribuidos, copiados y exhibidos mientras su uso no sea comercial. 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.De la combinación de estas condiciones se logran componer los 6 tipos de licencias que sepueden elegir:
    • Blogs ::: Derechos de autor 224Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Reconocimiento (by): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Reconocimiento - Sin obra derivada (by-nd): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se pueden realizar obras derivadas. Reconocimiento - No comercial - Sin obra derivada (by-nc-nd) : El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se puede obtener ningún beneficio comercial. No se pueden realizar obras derivadas. Reconocimiento - No comercial (by-nc): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se puede obtener ningún beneficio comercial. Reconocimiento - No comercial - Compartir igual (by-nc-sa): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se puede obtener ningún beneficio comercial y las obras derivadas tienen que estar bajo los mismos términos de licencia que el trabajo original. Reconocimiento - Compartir igual (by-sa): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Las obras derivadas tienen que estar bajo los mismos términos de licencia que el trabajo original.12.4 Añadir licencia CC a un blog Blogger Si estás interesado/a en situar una licencia CC (Creative Commons) en la barra lateral de tu blog puedes seguir los siguientes pasos: 1. Visita la web de Creative Commons: http://es.creativecommons.org/licencia/ 2. Pulsa en el enlace Escoger una licencia 3. En la pregunta ¿Quiere permitir usos comerciales de su obra? marca la opción deseada. Por ejemplo: No. 4. En la pregunta ¿Quiere permitir modificaciones de su obra? señala una respuesta. Por ejemplo: Yes, as long as others share alike (Sí pero compartir igual)
    • Blogs ::: Derechos de autor 225Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. En la lista desplegable Jurisdicción de su licencia elige el país de procedencia. También es posible añadir información adicional de la obra pero en este caso no lo haremos. 6. De la combinación de las respuestas emitidas surgirá la licencia antes descrita como: Reconocimiento-No comercial-Compartir Igual. 7. Clic en el botón Escoja una licencia. 8. Selecciona el modelo de icono que deseas incluir en tu página HTML: 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. 13. En la pestaña Elementos de la página haz clic en el enlace Añadir un gadget.
    • Blogs ::: Derechos de autor 226Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 14. Clic en el botón Añadir (+) para incorporar a la barra lateral un gadget del tipo HTML/Javascript. 15. En el cuadro de diálogo Configurar HTML/Javascript introduce como Título el texto Licencia Creative Commons y en el cuadro Contenido haz clic derecho y selecciona Pegar para pegar el código HTML copiado desde Creative Commons. En este código puedes modificar el texto: “Esta obra …” por “Este blog…” 16. Clic en el botón GUARDAR.
    • Blogs ::: Derechos de autor 227Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. 18. Clic en el botón GUARDAR. 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 228Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado12.5 Añadir una licencia CC a un blog de WP Si estás interesado/a en situar una licencia CC (Creative Commons) en la barra lateral de tu blog puedes seguir los siguientes pasos: 1. Visita la web de Creative Commons: http://es.creativecommons.org/licencia/ 2. Pulsa en el enlace Escoger una licencia 3. En la pregunta ¿Quiere permitir usos comerciales de su obra? marca la opción deseada. Por ejemplo: No. 4. En la pregunta ¿Quiere permitir modificaciones de su obra? señala una respuesta. Por ejemplo: Yes, as long as others share alike (Sí pero compartir igual)
    • Blogs ::: Derechos de autor 229Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. En la lista desplegable Jurisdicción de su licencia elige el país de procedencia. También es posible añadir información adicional de la obra pero en este caso no lo haremos. 6. De la combinación de las respuestas emitidas surgirá la licencia antes descrita como: Reconocimiento-No comercial-Compartir Igual. 7. Clic en el botón Escoja una licencia. 8. Selecciona el modelo de icono que deseas incluir en tu página HTML: 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 230Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12. Arrastra y suelta el widget Texto sobre la barra lateral derecha. 13. En el cuadro de texto Título introduce el texto Licencia Creative Commons. En el cuadro de texto inferior haz clic derecho y elige Pegar para pegar el código HTML que te ha proporcionado el espacio Creative Commons. 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 231Multimedia 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 232Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
    • Módulo 2. Imagen
    • Imagen ::: Conceptos básicos de imagen digital 234Multimedia 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 235Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoAntes de estudiar los procedimientos más habituales de optimización y tratamiento deimágenes es conveniente repasar algunas ideas clave relacionadas con la imagen digital.1.1 El píxelEl píxel es la unidad mínima de visualización de una imagen digital. Si aplicamos el zoomsobre ella observaremos que está formada por una parrilla de puntos o píxeles. Las cámarasdigitales y los escáneres capturan las imágenes en forma de cuadrícula de píxeles.1.2 Resolución de imagenEs el grado de detalle o calidad de una imagen digital ya sea escaneada, fotografiada oimpresa. Este valor se expresa en ppp (píxeles por pulgada) o en inglés dpi (dots per inch).Cuantos más píxeles contenga una imagen por pulgada lineal, mayor calidad tendrá.La resolución de un monitor se refiere al número de píxeles por pulgada que es capaz demostrar. La resolución de una pantalla de ordenador PC es de 72 ppp.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 unacámara de 8 MP es aquella capaz de tomar una fotografía con 8 millones de píxeles.1.3 Profundidad de colorLa profundidad de color se refiere al número de bits necesarios para codificar y guardar lainformación de color de cada píxel en una imagen. Un bit es una posición de memoria quepuede tener el valor 0 ó 1. Cuanto mayor sea la profundidad de color en bits, la imagendispondrá de una paleta de colores más amplia. Se utiliza 1-bit para imágenes enblanco/negro, sin grises (0=color negro, 1= color blanco), 2-bits = 4 colores (00=color negro,
    • Imagen ::: Conceptos básicos de imagen digital 236Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado01=color X, 10=color Y, 11=color blanco), 3-bits = 8 colores, ..., 8-bits = 256 colores, ..., 24-bits = 16.7 millones de colores.1.4 Modos de colorLlamamos modo de color al sistema de coordenadas que nos permiten describir el color decada píxel utilizando valores numéricos.Los modos de color más utilizados son:  Modo monocromático. Se corresponde con una profundidad de color de 1 bit. La imagen está formada por píxeles blancos o píxeles negros puros.  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 237Multimedia 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 238Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.5 Formatos de imagenLas imagénes digitales se pueden guardar en distintos formatos. Cada uno se corresponde conuna extensión específica del archivo que lo contiene. Los más utilizados en la actualidad son:BMP, GIF, JPG, TIF y PNG.BMP (Bitmap = Mapa de bits)  Ha sido muy utilizado porque fue desarrollado para aplicaciones Windows.  La imagen se forma mediante una parrilla de píxeles.  El formato BMP no sufre pérdidas de calidad y por tanto resulta adecuado para guardar imágenes que se desean manipular posteriormente.  Ventaja: Guarda gran cantidad de información de la imagen.  Inconveniente: El archivo tiene un tamaño muy grande.GIF (Graphics Interchange Format = Formato de Intercambio Gráfico).  Ha sido diseñado específicamente para comprimir imágenes digitales.  Reduce la paleta de colores a 256 colores como máximo (profundidad de color de 8 bits).  Admite gamas de menor número de colores y esto permite optimizar el tamaño del archivo que contiene la imagen.  Ventaja: Es un formato idóneo para publicar dibujos en la web.  Inconveniente: No es recomendable para fotografías de cierta calidad ni originales ya que el color real o verdadero utiliza una paleta de más de 256 colores.JPG-JPEG (Joint Photographic Experts Group = Grupo de Expertos Fotográficos Unidos).  A diferencia del formato GIF, admite una paleta de hasta 16 millones de colores.  Es el formato más común junto con el GIF para publicar imágenes en la web.  La compresión JPEG puede suponer cierta pérdida de calidad en la imagen. En la mayoría de los casos esta pérdida se puede asumir porque permite reducir el tamaño del archivo y su visualización es aceptable. Es recomendable utilizar una calidad del 60-90 % del original.  Cada vez que se modifica y guarda un archivo JPEG, se puede perder algo de su calidad si se define cierto factor de compresión.  Las cámaras digitales suelen almacenar directamente las imágenes en formato JPEG con máxima calidad y sin compresión.  Ventaja: Es ideal para publicar fotografías en la web siempre y cuando se configuren adecuadamente dimensiones y compresión.  Inconveniente: Si se define un factor de compresión se pierde calidad. Por este motivo no es recomendable para archivar originales.TIF-TIFF (Tagged Image File Format = Formato de Archivo de Imagen Etiquetada).  Almacena imágenes de una calidad excelente.  Utiliza cualquier profundidad de color de 1 a 32 bits.  Es el formato ideal para editar o imprimir una imagen.  Ventaja: Es ideal para archivar archivos originales.  Inconveniente: Produce archivos muy grandes.PNG (Portable Network Graphic = Gráfico portable para la red).  Es un formato de reciente difusión alternativo al GIF.  Tiene una tasa de compresión superior al formato GIF (+10%)  Admite la posibilidad de emplear un número de colores superior a los 256 que impone el GIF.  Debido a su reciente aparición sólo es soportado en navegadores modernos como IE 4 o superior.
    • Imagen ::: Conceptos básicos de imagen digital 239Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoNota: Para visualizar la extensión de los archivos desde el explorador de Windows sigue lossiguientes 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.Tras ejecutar estas instrucciones se mostrará siempre la extensión de los archivos(.doc, .pdf, .html) cuando utilices el explorador de archivos de Windows para moverte entrelas carpetas de tu disco duro.En la siguiente tabla se recogen las características diferenciales más significativas de los tresformatos de imagen recomendados para publicar una imagen en la web. JPG GIF PNGNúmero de colores: 24 bits Hasta 256 colores Número de colores: 24 bitscolor o 8 bits B/N colorMuy alto grado de Formato de compresión Mayor compresión que elcompresión. formato GIF (+10%)Posible pérdida de Sin pérdida de información Sin pérdida de informacióninformación salvo reducción de coloresAdmite carga progresiva Admite carga progresiva. Admite carga progresivaNo admite fondos Admite fondos transparentes Admite fondos transparentestransparentesNo permite animación Permite animación No permite animación1.6 Consejos para la optimización de imágenesEn este apartado se exponen algunos consejos sobre el tratamiento de imágenes para eldiseño 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 240Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Lo más conveniente es guardar los originales de las imágenes favoritas en formato BMP, TIFF ó JPEG sin comprimir. A partir de ellas se puede crear una copia en formato GIF (PNG) o JPEG con las dimensiones, resolución y paletas adecuados para publicarlas en la web. 7. Las imágenes GIF son más adecuadas para dibujos, gráficos y logotipos. Son aquellas que se pueden representar fácilmente con colores sólidos y una paleta con un número reducido de colores. 8. Las imágenes JPEG son mejores para fotografías e imágenes con degradados, porque admiten color de 24 bits, y porque gracias a su compresión ofrecen una imagen más brillante que ocupa menos espacio en el disco. 9. Es aconsejable NO insertar imágenes en una página utilizando <Ctrl>+<C> (Copiar) y <Ctrl>+<V> (Pegar). Esto creará archivos de baja calidad y de cierto peso. Es preferible optimizar la imagen usando un programa de edición gráfica y luego insertarla en la página.Para reducir el peso de un archivo gráfico se pueden modificar algunos de sus parámetrosutilizando un editor de imágenes como por ejemplo GIMP:  Formato del archivo gráfico: - Conversión de formatos.  Paleta de colores: - Reducir la paleta de colores.  Tamaño de la imagen (Anchura x Altura) - Reducir el tamaño de una imagen. - Recortado de imágenes.
    • Imagen ::: Empezar con GIMP 241Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2. Empezar con GIMP
    • Imagen ::: Empezar con GIMP 242Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado2.1 ¿Qué es GIMP?GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para lamanipulación de imágenes. Es una aplicación adecuada para la edición y composición deimágenes así como para el retoque fotográfico. Esta herramienta es gratuita y representa unaexcelente opción frente a otros programas comerciales como Adobe PhotoShop o Paint ShopPro.2.2 Instalación de GIMPWindowsPara 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 seadapta a tu sistema: http://www.gimp.org/Si deseas utilizar la versión portable para Windows descarga y descomprime el siguientearchivo a una carpeta de tu disco duro o pendrive: GIMP_Portable_2.6.8.paf.exeUbuntuDesde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. Enel buscador introduce el término GIMP y pulsa en el icono de la lupa para buscar el ítemcorrespondiente a esta aplicación. Clic en el botón Instalar que acompaña al ítem Editor deimágenes GIMP.Introduce las credenciales de administrador y al cabo de unos instantes dispondrás delprograma GIMP instalado.
    • Imagen ::: Empezar con GIMP 243Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado2.3 Inicio de GIMPWindows 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. 2. Tras unos instantes se iniciará el programa.Ubuntu 1. Para iniciar este programa desde el escritorio de Ubuntu selecciona Aplicaciones > Gráficos > Editor de imágenes GIMP.2.4 El entorno de edición 1. Descarga y descomprime a una carpeta de tu disco duro el archivo pizarra.zip. En su interior se encuentra el archivo gráfico: pizarra.jpg. 2. Desde la ventana Gimp selecciona Archivo > Abrir. En el cuadro de diálogo Abrir imagen navega para situarte en la carpeta donde se encuentra el archivo pizarra.jpg. 3. Clic sobre este fichero de imagen y pulsa en el botón Abrir. 4. Al abrir una imagen con GIMP se muestran las siguientes ventanas independientes:
    • Imagen ::: Empezar con GIMP 244Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. Caja de herramientas principal. Es el núcleo principal de GIMP. Contiene una botonera de iconos para acceder a las principales herramientas de edición. Si cierras esta ventana se cerrarán el resto de ventanas de la aplicación. 2. Opciones de herramienta. Aparece unida por debajo a la Caja de herramientas principal y contiene las opciones de la herramienta seleccionada en ese momento. 3. Ventana de imagen. GIMP muestra cada imagen abierta en una ventana independiente. 4. Capas, Canales, Rutas y Deshacer. En función de la solapa activada permitirá interactuar con las capas, canales o rutas de la imagen. En la solapa deshacer se mostrará la pila de acciones realizadas permitiendo deshacer/rehacer algunas de ellas con sólo pulsar en los botones de flechas situados en su base. 5. Brochas/Patrones/Degradados. Desde este panel es posible manejar el estilo del trazo del pincel así como los patrones y degradados de los rellenos.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 seleccionaVentanas > 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 alos valores predeterminados. Clic en Aceptar y luego en Reiniciar. Si se cierra GIMP y sevuelve a abrir se mostrarán los paneles por defecto.2.5 Crear una nueva imagen 1. Elige Archivo > Nuevo.
    • Imagen ::: Empezar con GIMP 245Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. En la ventana de la nueva imagen se podrán aplicar las distintas herramientas para crear y editar la imagen deseada.
    • Imagen ::: Empezar con GIMP 246Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado2.6 Guardar una imagen 1. Para guardar una imagen selecciona Archivo > Guardar como … en la ventana que la muestra. 2. En el cuadro de diálogo Guardar imagen teclea un nombre de archivo en la casilla Nombre. Es conveniente que este nombre contenga todos los caracteres en minúsculas, sin espacios en blanco ni caracteres especiales: ñ, signos de puntuación, etc. Para elegir otra carpeta de destino puedes elegir una carpeta desplegando la lista Guardar en la carpeta.
    • Imagen ::: Empezar con GIMP 247Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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 248Multimedia 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 249Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 3. Optimización de imágenes
    • Imagen ::: Optimización de imágenes 250Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor3.1 Conversión de formatosEl propósito de esta actividad es familiarizarse con el uso de GIMP para convertir una imagende un formato a otro. Como sabemos los formatos más ligeros y adecuados a la web son: GIF,PNG y JPEG. En este caso veremos cómo convertir el archivo original BMP a cada uno de estosformatos. 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. 4. Pulsa sobre el botón Abrir.Guardar en formato GIF 1. Clic en Archivo > Guardar como … Se muestra el cuadro de diálogo Guardar imagen. En la lista Guardar en una carpeta se mostrará seleccionada la carpeta destino donde se guardará la nueva imagen.
    • Imagen ::: Optimización de imágenes 251Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 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. 4. Se muestra el cuadro de diálogo Exportar archivo. Asegúrate de que está seleccionada la opción por defecto: Convertir a indexada usando ajustes predefinidos. Esto significa que se reducirá la paleta de colores de la imagen original hasta un máximo de 256 colores. Otra opción es Convertir a tonos de gris. Clic en el botón Exportar.
    • Imagen ::: Optimización de imágenes 252Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 5. En el cuadro de diálogo Guardar como GIF puedes definir:  Entrelazar. Si activas la opción Entrelazar entonces el archivo que contiene la imagen incluye una copia tosca de la imagen al comienzo de la cadena de datos de tal forma que el usuario que la descarga desde Internet ve rápidamente su contenido y conforme se va descargando va ganando en calidad.  Comentario GIF. En este comentario puedes añadir información adicional al archivo de imagen: autor, fecha de creación, etc. 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 253Multimedia y Web 2.0 ::: Edición 2010 ::: Aula MentorGuardar en formato JPG 1. Regresa a la ventana principal de GIMP para abrir de nuevo la imagen original en formato BMP mediante Archivo > Abrir. 2. Clic en Archivo > Guardar como … Se muestra el cuadro de diálogo Guardar imagen. En la lista Guardar en una carpeta se mostrará seleccionada la carpeta destino donde se guardará la nueva imagen. 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 254Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 5. En el cuadro de diálogo Guardar como JPEG define la calidad de la imagen. Si activas la casilla Mostrar vista previa en la ventana de la imagen observarás el aspecto de la imagen para cada valor de calidad que establezcas. Arrastra el deslizador para una calidad del 85%. Cuanto mayor es la calidad, mayor será el tamaño del archivo que contiene esta imagen. Observa que a medida que arrastras el deslizador hacia la izquierda para disminuir la calidad, el tamaño del archivo también disminuye y viceversa. 6. Ahora la ventana de imagen muestra el archivo paint.jpg.Guardar en formato PNG 1. Regresa a la ventana principal de GIMP para abrir de nuevo la imagen original en formato BMP mediante Archivo > Abrir. 2. Clic en Archivo > Guardar como … Se muestra el cuadro de diálogo Guardar imagen. En la lista Guardar en una carpeta se mostrará seleccionada la carpeta destino donde se guardará la nueva imagen. 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 255Multimedia 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 256Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 6. Para terminar pulsa en el botón Guardar. 7. Abre el explorador de Windows y encontrarás los archivos GIF, JPG y PNG creados. Cada uno ha sido creado con la configuración que se recoge en las figuras anteriores. Todas ellas tienen las dimensiones de la imagen original: 300x225 pixeles y una resolución similar: 72 ppp. Observa que las diferencias de calidad son mínimas mientras que el tamaño del archivo se reduce considerablemente en los formatos GIF y JPG. Aunque el formato PNG comprime más que el GIF, en este caso produce un archivo de mayor peso porque conserva una paleta de colores de 24 bits. BMP Color 24-bits GIF Color 8-bits JPG Color 24-bits PNG Color 24-bits 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 257Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor3.2 Reducir la paleta de colores El archivo que contiene una imagen puede reducirse de peso disminuyendo la paleta de colores que utiliza. En esta práctica reduciremos la gama de colores que utiliza una imagen aplicando distintos tipos de paletas para comprobar a continuación la influencia sobre el peso del archivo final. 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. 2. En la barra de título de la ventana de imagen se muestra el nombre del archivo paint.jpg y entre paréntesis la etiqueta RGB. Esta etiqueta se refiere a la paleta de colores que utiliza la imagen. En este caso 16 millones de colores. 3. Para reducir la gama de colores selecciona Imagen > Modo > Indexado. 4. En el cuadro de diálogo Conversión de color indexado marca la opción Generar paleta óptima dejando en el contador el número 256 colores como máximo. 5. Clic en Convertir.
    • Imagen ::: Optimización de imágenes 258Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 6. Observa que ahora en la barra de título aparece la etiqueta (indexado …) 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. 256 colores 128 colores 64 colores 32 colores
    • Imagen ::: Dimensiones de una imagen 259Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Dimensiones de una imagen
    • Imagen ::: Dimensiones de una imagen 260Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.1 Reducir el tamaño de una imagenUno de los principales factores que determinan el peso de un archivo gráfico es el tamaño dela imagen que contiene, es decir, el número de píxeles en anchura y altura. Se recomiendautilizar un programa como GIMP para definir exactamente el tamaño final con que se utilizarácada imagen.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. Esaconsejable reducir las dimensiones de la imagen previamente con GIMP u otro editor deimá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 261Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Pulsa sobre el botón Abrir. 5. En la ventana de imagen elige Imagen > Escalar la imagen … 6. Se muestra el cuadro de diálogo Escalar la imagen. 7. En Tamaño de la imagen se muestra la Anchura y Altura en píxeles de la imagen actual. Observa que puedes modificar estos valores mediante los botones de incremento/decremento o bien tecleando otros. Sin embargo si entre ambas casillas y a la derecha aparece un icono de cadena cerrada, cuando trates de modificar la anchura, automáticamente se definirá la altura respetando las proporciones originales y evitando que la imagen se deforme. Al hacer clic sobre este icono de bloqueo se desactivará esta proporcionalidad y podrás definir valores independientes. 8. En el cuadro de diálogo Escalar la imagen despliega la lista de unidades de tamaño y selecciona porcentaje. De esta forma se definirá el nuevo tamaño de la imagen
    • Imagen ::: Dimensiones de una imagen 262Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado utilizando un porcentaje de reducción a partir del tamaño original. En la casilla Anchura introduce el valor 50%. Observa que si el bloqueo de proporciones está activado al pulsar enter automáticamente se completa la Altura con idéntico porcentaje. 9. En la lista de Interpolación elige la opción Cúbica para definir el método que utilizará GIMP para reducir la imagen. 10. Clic en el botón Escala para aplicar la reducción de tamaño. 11. Se puede deshacer la operación de escala seleccionando en la barra de menús de la ventana de imagen: Edición > Deshacer. 12. A continuación elige Archivo > Guardar como … 13. En el cuadro de diálogo Guardar imagen define como nombre del nuevo archivo, por ejemplo, tranvía_50.jpg. Es importante que especifiques la extensión (.jpg) y también que definas un nombre distinto para evitar sobrescribir el archivo original. Asegúrate de recordar en qué carpeta destino se guardará. 14. Clic en el botón Guardar. 15. En la ventana Guardar como JPEG, sitúa el deslizador Calidad en 100% para evitar pérdidas de calidad y analizar comparativamente el peso del archivo final resultante atendiendo solamente a la reducción de tamaño. 16. Pulsa en el botón Aceptar.
    • Imagen ::: Dimensiones de una imagen 263Multimedia 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.4.2 Modificar el tamaño del lienzoEn ocasiones es necesario disponer de más lienzo en blanco dentro de una imagen paraañadirle más elementos. 1. Extrae a una carpeta el archivo cisne.jpg contenido en el ZIP que se adjunta a continuación: cisne.zip. Sus características técnicas son: 330x240 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 77 Kb. 2. Haz doble clic sobre el acceso directo de GIMP situado en el escritorio:
    • Imagen ::: Dimensiones de una imagen 264Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 … 6. En el cuadro de diálogo Establecer el tamaño del lienzo de la imagen se muestra la Anchura y Altura actuales del lienzo. En este caso 330x240 píxeles. Clic en el icono de bloqueo de proporcionalidad para poder aumentar la altura sin que ello implique incrementar la anchura. Tras su pulsación el icono debe tener el aspecto de dos eslabones de cadena separados.
    • Imagen ::: Dimensiones de una imagen 265Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 266Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Se muestra una ventana para introducir el texto. Debajo de la barra de herramientas encontrarás un panel donde es posible definir la tipografía del texto: fuente, tamaño, color, estilo, etc. 12. En la pequeña ventana del Editor de textos de GIMP escribe, por ejemplo, “EL CISNE BLANCO” y luego pulsa en el botón Cerrar. 13. Para situar el cuadro de texto más centrado, vete al cuadro de herramientas y selecciona la herramienta Mover capas y selecciones 14. Acerca el puntero del ratón al cuadro de texto y cuando éste adquiera el aspecto de una cabeza de flecha negra con una cruz de doble flecha en su esquina inferior derecha, pulsa sobre el cuadro de texto creado y arrástralo para situarlo más centrado. 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 267Multimedia 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 268Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.3 Recortado de imágenesEn este apartado se plantea obtener una nueva imagen a partir de la selección y recortado deun área concreta en una imagen original más grande. Esta tarea puede resultar especialmenteútil en la elaboración de imágenes muy utilizadas en una página web y que destacan por unaestética marcada por la desproporción entre las dimensiones de anchura y altura. Es el casode un banner (468x60 pixeles), de una cabecera (768x90 pixeles) o bien de un rascacielos(120x600 pixeles). 1. Extrae el archivo cadenas.jpg contenido en el ZIP que se adjunta a continuación: cadenas.zip 2. Abre GIMP. 3. Elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir imagen. Localiza el archivo cadenas.jpg. Clic sobre este archivo y pulsa en el botón Abrir. 4. En el cuadro de herramientas elige la herramienta Seleccionar Regiones Rectangulares. 5. Sobre la ventana de imagen, pulsa y arrastra sobre la fotografía para definir un área rectangular alargada que contenga el monumento central. 6. En el menú de la ventana de imagen elige Imagen > Recortar a la selección.
    • Imagen ::: Dimensiones de una imagen 269Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 270Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Montaje de imágenes
    • Imagen ::: Montaje de imágenes 271Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoLas herramientas para seleccionar, copiar y pegar facilitan el montaje de imágenes. En estapráctica se ejemplifican las posibilidades de las distintas herramientas de selección. Estas seaplican para eliminar ciertas partes de una imagen combinando seleccionar y cortar. 1. Extrae los archivos paisaje.jpg y vaca.gif contenido en el ZIP: paisaje.zip 2. Abre GIMP. 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. 4. En el cuadro de herramientas selecciona la herramienta Seleccionar regiones rectangulares 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 272Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Selecciona la herramienta Seleccionar regiones elípticas en el cuadro de herramientas 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. Nota: La selección rectangular y circular se han incluido con carácter demostrativo ya que en este ejemplo no sería necesario usarlas. 8. Elige la herramienta Varita mágica en el cuadro de herramientas. Con ella podrás elegir regiones continuas del dibujo. 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 273Multimedia 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. 11. En el cuadro de herramientas elige la herramienta Seleccionar regiones por colores. Con esta herramienta podrás seleccionar la región de la imagen que tenga el mismo color. 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 274Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 15. Haz clic sobre la ventana de la imagen paisaje.jpg para seleccionarla. 16. Editar > Pegar en. Pulsa y arrastra sobre la imagen de la vaca para situarla en el lugar más adecuado del paisaje. A continuación haz clic en cualquier lugar fuera de esta selección para fijar su posición. 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 275Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 6. Efectos especiales
    • Imagen ::: Efectos especiales 276Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor6.1 FiltrosEl término “Filtro” proviene de la fotografía tradicional y aludía a una serie de cristales quese situaban delante del objetivo de la cámara para conseguir efectos especiales. Los filtrosque proporciona GIMP permiten aplicar a una imagen original un sinfín de efectos de retoquey modificaciones. En esta práctica se explica cómo aplicar un filtro y algunos ejemplos. 1. Extrae el archivo manzanas.jpg contenido en el ZIP: manzanas.zip 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. Localiza el archivo manzanas.jpg. Clic sobre este archivo y pulsa en el botón Abrir. 4. Para aplicar un tipo de filtro, selecciona la opción de menú Filtros > … Elige por ejemplo Desenfoque [Blur] > Desenfoque de movimiento. 5. A continuación se muestra un cuadro de diálogo donde es posible configurar distintos parámetros del filtro antes de aplicarlo. El tipo de valores dependerá de la clase de filtro elegido. En la mayoría de los casos si se activa la casilla Vista previa se dispondrá de una pequeña ventana que permitirá contemplar el resultado final antes de aplicarlo.
    • Imagen ::: Efectos especiales 277Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 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: Imagen original Desenfoque > Pixelar Ruido > Esparcir Luces y sombras > Luces y sombras > Distorsiones > Ondular Mosaico de cristal Destello de lenteDistorsiones > 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 278Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 9. En el cuadro de diálogo Guardar imagen introduce un nombre de archivo distinto de la imagen original para no sobrescribirla. Por ejemplo: manzanas_lienzo.jpg y para terminar pulsa en el botón Guardar. 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.2 Textos con efectos especialesGIMP proporciona herramientas sencillas para el diseño de un banner de texto. Éste se puedeutilizar como encabezado de una página web. 1. Desde la ventana principal de GIMP selecciona Archivo > Nuevo. 2. En el cuadro de diálogo Crear una imagen nueva introduce las dimensiones, por ejemplo, 468 y 60 en las casillas Anchura y Altura respectivamente. Otra opción es elegir como Plantilla la opción Web banner common 468x60 3. Pulsa en el botón Aceptar. 4. Para visualizar el panel de opciones de una herramienta, en la ventana principal, selecciona Ventanas > Diálogos empotrables > Opciones de herramienta. 5. Haz clic sobre la herramienta Texto en el cuadro de herramientas.
    • Imagen ::: Efectos especiales 279Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 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. 7. Clic sobre la casilla Color de las opciones de herramienta. En el cuadro de diálogo Color del texto que se despliega selecciona el color negro. Existen varios procedimiento alternativos para ello:  Teclear el valor hexadecimal 000000 del color negro en la casilla Notación HTML  Clic en la esquina inferior izquierda de la paleta de colores.  Introduce los valores 0-0-0 en las casillas R-G-B (Red-Green-Blue = Rojo- Verde-Azul).
    • Imagen ::: Efectos especiales 280Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 8. Una vez elegido el color pulsa en el botón Aceptar. 9. Clic sobre el lienzo de la imagen y en el cuadro Editor de textos de Gimp teclea el texto. Por ejemplo: GIMP. Para terminar pulsa el botón Cerrar. 10. En el cuadro de herramientas de GIMP elige la herramienta Mover capas y selecciones. 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 281Multimedia 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. Básico II Bisel degradado Bovinación Bruñido Calor resplandeciente Contorno 3D Desmenuzar Neón Resplandor Starburst Starscape Texturizado 17. Para guardar un banner selecciona Archivo > Guardar como … 18. Introduce como nombre, por ejemplo, banner.gif . En este caso es conveniente guardarlo en formato GIF. 19. Si al definir la extensión del archivo (.gif) eliges este formato GIMP te mostrará un cuadro de diálogo Exportar archivo. Acepta las opciones por defecto pulsando directamente en el botón Exportar.
    • Imagen ::: Efectos especiales 282Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 20. A continuación se mostrará un cuadro de diálogo Guardar como GIF. Pulsa en el botón Aceptar.
    • Imagen ::: Tratamiento de imágenes por lotes 283Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.Tratamiento de imágenes por lotes
    • Imagen ::: Tratamiento de imágenes por lotes 284Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado7.1 IntroducciónA menudo es necesario optimizar una colección de fotografías extraídas de la cámara digitalcon intención de ajustar sus dimensiones, resolución, formato, etc. para publicarlas en la webo compartirlas en la red local del centro.Esto se puede realizar con GIMP, imagen a imagen, aplicando los procedimientos descritos conanterioridad. Sin embargo cuando se trata de un número elevado de fotos es necesariorealizar 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. Sinembargo el diseño y manejo de scripts no resulta intuitivo ni fácil.En su lugar se propone utilizar el plugin DBP (Davids Batch Processor) para GIMP. Estecomplemento permite ejecutar de forma automática operaciones en una lista de archivos deimagen, como por ejemplo, el redimensionamiento. DBP proporciona un entorno gráfico paracrear una lista de imágenes con intención de definir y aplicar operaciones como la correccióndel color, redimensionamiento, recorte, suavizado, cambio de nombre o guardar en otrosformatos. DBP sólo procesa imágenes en modo color RGB mostrando un error cuando se tratade procesar imágenes en modo color indexado. Por otra parte DBP nunca sobreescribe laimagen original por lo que es necesario definir la tarea de renombrar o mover a otra carpetacada archivo resultante.7.2 Instalación del plugin DBP de GIMP enWindowsEl plugin DBP no se incluye en la instalación por defecto de GIMP. Es necesario descargarlo einstalarlo en la carpeta de plugins de GIMP 2. 1. Descarga y descomprime en una carpeta de tu disco duro el zip: dbp-1.1.8.zip. Como resultado obtendrás el archivo: dbp.exe. Otra opción es visitar la web de su fabricante y descargar, si existe, una versión más reciente: http://members.ozemail.com.au/~hodsond/dbp.html 2. Abre GIMP y selecciona Editar > Preferencias.
    • Imagen ::: Tratamiento de imágenes por lotes 285Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Clic sobre la entrada más inferior Carpetas y pulsa en la entrada Plugins o Complementos. En el panel derecho podrás ver la ruta de la carpeta donde se instalan los plugins o complementos que utiliza GIMP. Ejemplo: C:Archivos de programaGIMP-2.0libgimp2.0plug-ins 4. Copia el archivo dbp.exe a esta carpeta de plugins. 5. Reinicia el programa GIMP.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.7.3 Instalación del plugin DBP de GIMP en Ubuntu 1. Descarga y descomprime en la carpeta personal el zip: dbpSrc-1-1-9.tgz. Para descomprimir haz clic derecho sobre este fichero y elige Extraer aquí. Como resultado obtendrás la carpeta de código fuente: dbp-1.1.9. Otra opción es visitar la web de su fabricante y descargar, si existe, una versión más reciente: http://members.ozemail.com.au/~hodsond/dbp.html 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. 3. A continuación desde el escritorio selecciona Aplicaciones > Accesorios > Terminal. 4. Teclea cd dbp-1.1.9 para situarte en la carpeta que contiene el código fuente descargado del plugin. 5. Introduce: sudo apt-get install libgimp2.0-dev para instalar desde internet el código de desarrollo de la aplicación GIMP 2 necesario para la compilación. Transcurridos unos segundos se habrá completado la instalación de estas librerías. 6. Teclea make y si la compilación ha tenido éxito make install para finalizar la instalación. 7. Cierra la ventana del terminal.
    • Imagen ::: Tratamiento de imágenes por lotes 286Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado7.4 Conversión por lotes con GIMP 1. Extrae a la carpeta gallery el contenido del archivo gallery.zip. Como resultado de esta operación tendrás en esta carpeta varios archivos con imágenes de Asturias. Todas ellas tienen unas dimensiones de 800x533 píxeles. Estos archivos gráficos pueden ser el resultado del volcado de las fotografías realizadas con una cámara digital. En este caso su peso y dimensiones será muy superior al ejemplo que nos ocupa. 2. Abre GIMP y selecciona Filtros > Batch Process (Extensiones > Procesamiento por lotes). Esta entrada se ha creado nueva en el menú de GIMP como consecuencia de la instalación con éxito del plugin DBP. 3. Se muestra el cuadro de diálogo Davids Batch Processor (Procesador por Lotes de David).Paso 1: Selección de archivos de entrada 4. En la pestaña Input (Entrada) pulsa en el botón Add Files (Añadir Archivos). 5. En el cuadro de diálogo Add Image Files (Añadir Archivos de Imagen) navega por el panel inferior izquierda para situarte en la carpeta gallery. Haz clic sobre la primera imagen, pulsa la tecla Mayus y sin soltarla haz clic sobre la última imagen. Esta acción seleccionará el conjunto de imágenes a añadir. Clic en el botón Abrir.
    • Imagen ::: Tratamiento de imágenes por lotes 287Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. En la pestaña Input de Davids 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).Paso 2: Definir opciones de redimensionamiento. 7. Clic en la pestaña Resize (Redimensionar). Activa la casilla Enable (Permitir) y marca una de las dos opciones:  Relative (Relativa): en este caso se propone utilizar esta opción. Consiste en realizar una redimensionamiento proporcional (tanto por uno) a las dimensiones actuales de la imagen. Marca la opción Keep Aspect (Mantener radio de aspecto) para asegurar que la foto conserve la relación de dimensiones ancho y alto y no se deforme. En X Scale e Y Scale arrastra los deslizadores a la izquierda o introduce los valores de 0,50 (tanto por uno).  Absolute (Absoluta): se utilizar para redimensionar la imagen a la anchura Width y altura Height que se introducen como dato.
    • Imagen ::: Tratamiento de imágenes por lotes 288Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPaso 3. Definir el nombre de las nuevas imágenes 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 289Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Este procesador, por defecto, guarda las imágenes resultado de la conversión en la misma carpeta que las imágenes originales. Esto se indica con la expresión "same as source" (Mismo que fuente) que aparece sobre el botón Select Dir. Sin embargo si no definimos un nombre distinto para las imágenes destino nunca sobreescribirá las originales. Simplemente no las creará. 10. Si deseas elegir otra carpeta distinta como destino de las nuevas imágenes entonces pulsa el botón Select Dir (Elegir carpeta) y navega para seleccionarla. Si haces esto no será necesario modificar el nombre de las nuevas imágenes porque lo copiará de las respectivas originales. 11. Si vas a crear las imágenes en la misma carpeta, como es el caso, vamos a añadir un prefijo al nombre de las nuevas imágenes. También se podría añadir un sufijo. Para ello introduce, por ejemplo, "tmb_" en el cuadro de texto Add Prefix: (Añadir Prefijo). Esto añadirá este prefijo al nombre de la imagen original para asignárselo a la imagen final.Paso 4. Definir el formato de las nuevas imágenes. 12. Clic en la pestaña Output (Salida) 13. Despliega la lista Format (Formato) y elige, en este caso, JPG. 14. Arrastra el deslizador Quality (Calidad) para definir la calidad. Si las fotografías provienen de una cámara de fotos admitirá una calidad de 80% sin muchos problemas.
    • Imagen ::: Tratamiento de imágenes por lotes 290Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoPaso 5. Realizar el procesamiento por lotes 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 291Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. Flickr: galería de fotos
    • Imagen ::: Flickr: galería de fotos 292Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado8.1 IntroducciónFlickr (http://www.flickr.com) es un servicio Web 2.0 donde puedes administrar y compartirtus fotos en línea. Las características más destacadas de este servicio son:  Subir fotos. Puedes hacerlo desde tu equipo, enviándolas por correo electrónico o utilizando el teléfono móvil con su cámara.  Organizar. Clasifica las fotos en colecciones o álbumes. A cada imagen se le puede asignar una etiqueta para facilitar su búsqueda.  Compartir. Utiliza grupos y controles de privacidad para compartir tus fotos.  Mapas. Sobre un mapa de Google Maps se puede geolocalizar el lugar donde se tomó cada foto y compartirlo con los demás.  Publicaciones. Puedes elaborar tarjetas, albumes, marcos, etc utilizando las imágenes subidas.  Mantenerse en contacto. Para enviar y recibir información sobre las actualizaciones de fotografías de familiares y amigos.La exploración de todas las posibilidades de Flickr excede el propósito de este curso. Sepropone centrarse en la utilización de estas imágenes en línea en los artículos de tu blog.También admite la subida de vídeos pero esta prestación no se cita.Para utilizar Flickr es necesario disponer de una cuenta en Yahoo. Desde la portada de Flickrse puede crear una pulsando en el botón Crear tu cuenta.8.2 Subir fotografías a Flickr 1. Descarga y descomprime el archivo gallery.zip a una carpeta del equipo. Como resultado de esta tarea se obtendrá una colección de fotografías para ser subidas a Flickr. 2. Abre Mozilla Firefox y visita la web de Flickr en la URL: http://www.flickr.com. 3. Clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo. 4. Desde la portada selecciona Tú > Cargar fotos y vídeos
    • Imagen ::: Flickr: galería de fotos 293Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Clic en el enlace del Paso 1: Elegir fotos y vídeos 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 294Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7. Se muestra un cuadro de diálogo donde aparecen seleccionadas las fotos elegidas. Si pulsas en Agregar más podrás añadir más a este listado. 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 295Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. Para continuar pulsa en el botón Cargar fotos y vídeos. 10. Transcurridos unos minutos se mostrará el mensaje de éxito en la subida y un enlace de acceso para añadir descripciones a las fotos. Si haces clic en él se mostrará una página donde es posible definir para cada una: título, descripción y etiquetas. 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 296Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado8.3 Organizar en álbumes 1. Si no estás autentificado debes hacer clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo. 2. Desde el menú superior horizontal haz clic en la opción Organizar. Tras unos segundos de carga se mostrará el organizador de Flickr. 3. Clic en la pestaña Álbumes y luego en el enlace Crear nuevo álbum. 4. Desde el panel de nuevo album: 4.1 Introduce el título del álbum, p.e.: “Mi viaje por Asturias”. 4.2 Para añadir fotografías a este nuevo álbum debes arrastrar las imágenes que aparecen en la franja inferior al panel derecho superior. 4.3 Arrastra una imagen del álbum al cuadrado visor que aparece sobre el título. Esta será la imagen que represente el albúm. 4.4 Pulsa en el botón Guardar.8.4 Publicación de una imagen Flickr en el blog 1. Si no estás autentificado debes hacer clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo. 2. Desde la página Tus fotos selecciona una imagen haciendo clic sobre ella para visualizarla en solitario. Por ejemplo, sobre la foto del Faro de Cudillero.
    • Imagen ::: Flickr: galería de fotos 297Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 3. Haz clic derecho sobre la fotografía y selecciona 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.8.4.1 Insertar la imagen en Blogger 1. 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. 2. Añade como título: Faro de Cudillero 3. En el editor de artículos pulsa en el botón Añadir imagen.
    • Imagen ::: Flickr: galería de fotos 298Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 4. 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. 5. 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. 6. 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. 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". 8. Clic en el botón PUBLICAR ENTRADA. 9. Para ver el aspecto del artículo haz clic en el enlace Ver Blog.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 299Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado8.4.2 Insertar la imagen en Wordpress 1. Accede al interfaz de gestión de contenidos de tu blog en Wordpress.com. 2. Selecciona Entradas > Añadir. 3. Añade como título: Faro de Cudillero 4. En el editor de artículos pulsa en el botón Añadir una imagen. 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. 6. Introduce como Texto alternativo en este caso: Faro de Cudillero. 7. Pulsa en el botón Insertar en la entrada
    • Imagen ::: Flickr: galería de fotos 300Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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". 9. Clic en el botón Publicar. 10. Para ver el aspecto del artículo haz clic en el enlace Vista previaNota: 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.8.5 Publicación de presentación Flickr en Blogger 1. Si no estás autentificado en Flickr debes hacer clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo. 2. En la barra de menús de Flickr selecciona Tú > Tus álbumes. 3. A continuación haz clic sobre el album creado anteriormente. Una vez dentro del álbum observa que existe un enlace con el texto Presentación. Si se hace clic en este enlace se mostrará una presentación con la secuencia de fotografías que forman parte del álbum. 4. Durante la visualización de la presentación haz clic en el enlace Compartir situado en la esquina superior derecha de la presentación. Esta acción mostrará el cuadro Compartir esta presentación.
    • Imagen ::: Flickr: galería de fotos 301Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. 6. Según el método utilizado:  Opción A Marco interno: En el cuadro de texto Seleccionar la dirección URL: haz clic en el botón Copiar en el portapapeles.  Opción B Visor de Flash. En el cuadro de texto Seleccionar el código HTML pulsa en el botón Copiar en el portapapeles. 7. 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. 8. Añade como título: Mis viajes por Asturias 9. En el editor haz clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    • Imagen ::: Flickr: galería de fotos 302Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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: <iframe src="<url>" width="400" height="300"> </iframe> 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. 12. Clic en el botón PUBLICAR ENTRADA. 13. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.
    • Imagen ::: Flickr: galería de fotos 303Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado8.6 Publicación de presentación Flickr enWordpress 1. Si no estás autentificado en Flickr debes hacer clic en el enlace Iniciar sesión e introduce tus credenciales Yahoo. 2. En la barra de menús de Flickr selecciona Tú > Tus álbumes. 3. A continuación haz clic sobre el album creado anteriormente. Una vez dentro del álbum observa que existe un enlace con el texto Presentación. Si se hace clic en este enlace se mostrará una presentación con la secuencia de fotografías que forman parte del álbum. 4. Durante la visualización de la presentación haz clic en el enlace Compartir situado en la esquina superior derecha de la presentación. Esta acción mostrará el cuadro Compartir esta presentación. 5. En el cuadro de texto Seleccionar la dirección URL pulsa en el botón Copiar en el portapapeles. Wordpress NO permite copiar y pegar código HTML del tipo iframe o bien object/embed por razones de seguridad. Por este motivo vamos a crear un enlace en el artículo a la dirección o URL de la presentación de imágenes en Flickr.
    • Imagen ::: Flickr: galería de fotos 304Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Accede al interfaz de administración de Wordpress y elige Entradas > Añadir. 7. Introduce como título: Mis viajes por Asturias. 8. Teclea el texto: “Ver presentación de fotografías”. Selecciona este texto y pulsa en el botón Insertar/Editar enlace del editor. 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. 10. Clic en el botón Insertar. 11. De regreso a la edición del artículo haz clic en el botón Publicar. 12. Pulsa en el enlace Ver entrada para comprobar cómo se visualiza el artículo y la presentación de fotografías.
    • Imagen ::: Picasa Web, álbums de fotos 305Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. Picasa Web, álbums de fotos
    • Imagen ::: Picasa Web, álbums de fotos 306Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.1 ¿Qué es Picasa Web?Picasa Web (http://picasaweb.google.com/) es un servicio Web 2.0 asociado a lascredenciales de usuario Google donde puedes administrar y compartir tus fotos en línea. Lascaracterísticas más destacadas de este servicio son:  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 instalaen el equipo para manejar y editar nuestros archivos de fotos en local y por otra parte PicasaWeb que es la aplicación web que nos permite almacenarlas en un servidor remoto paracompartirlas con los demás. La exploración de todas las posibilidades de ambas aplicacionesexcede el propósito de este curso. Por ello se propone incidir especialmente en la integraciónde 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 decredenciales para tu blog de Blogger conviene que utlices las mismas. Existen dos formasalternativas para acceder a Picasa Web:  Visita la URL de Picasa Web: http://picasaweb.google.com/ e introduce tus credenciales Google.  Visita la URL de de Blogger: http:///www.blogger.com e introduce tus credenciales Google. A continuación haz clic en Mi cuenta y luego en Albumes Picasa Web.Al entrar por primera vez a Picasa Web y haber realizado los ejercicios del módulo de Blogscon Blogger verás que ya dispones de algunas fotos subidas en tu cuenta. Esto es debido a quecuando subes imágenes en los artículos de tu blog en Blogger, éstas se guardanautomáticamente en un álbum de Picasa Web con el nombre asignado al blog. Desde PicasaWeb puedes administrar estas fotos pero hazlo con cautela porque si eliminas una fotografíadesde aquí puede ocurrir que ésta no se vea luego en el correspondiente artículo de tu blog.
    • Imagen ::: Picasa Web, álbums de fotos 307Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.2 Subir fotografías a Picasa Web IA continuación se explica el procedimiento para subir fotos a tu cuenta de Picasa Webutilizando el navegador web. 1. Descarga y descomprime el archivo gallery.zip a una carpeta del equipo. Como resultado de esta tarea se obtendrá una colección de las fotos. 2. Visita la web de Picasa Web en la URL: http://picasaweb.google.com/ e introduce tus credenciales Google. 3. Se muestra una página con los álbumes que ya tenemos en Picasa Web. Vamos a subir todas las imágenes a un álbum independiente. Clic en el botón Subir. 4. En el cuadro de diálogo Subir fotos puedes seleccionar un álbum existente o crear uno nuevo. Para elegir uno haz clic en la entrada correspondiente y pulsa en el botón Seleccionar álbum. En este caso se propone crear un álbum nuevo. Para ello haz clic en el enlace crea uno nuevo. 5. Introduce como Título el siguiente texto: Mis viajes por Asturias.
    • Imagen ::: Picasa Web, álbums de fotos 308Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Clic en la opción Público en el apartado de Visibilidad para este álbum. Para terminar haz clic en el botón Continuar. 7. Selecciona cada archivo de imagen pulsando en el botón Examinar… y localizando cada uno de los archivos obtenidos del ZIP anterior. Puedes subir hasta 5 imágenes en cada intento. 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. 9. Clic en el botón Iniciar subida. 10. Transcurridos unos instantes se mostrará una página con las fotos subidas en el nuevo álbum. Repite los pasos anteriores para subir el resto de imágenes pero ahora eligiendo el mismo álbum. 11. Dentro del álbum se pueden editar algunos de sus parámetros en el menú Editar:
    • Imagen ::: Picasa Web, álbums de fotos 309Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado  Propiedades del álbum. Permite modificar el título, fecha de creación, visualización pública o privada, etc. que se ha establecido al crear el álbum.  Tapa del álbum. Ofrece la posibilidad de elegir la imagen que representará al álbum en el listado de álbumes.  Mapa del álbum. Se accede a un mapa Google donde es posible situar cada una de las fotos.  Títulos. Si deseas modificar el título descriptivo que acompaña a cada imagen.  Eliminar álbum. Para eliminar el álbum y liberar el espacio ocupado en el servidor.  Organizar y cambiar orden. Esta opción da paso a un interfaz que permite redefinir el orden secuencial en que se mostrarán las fotos mediante “arrastrar y colocar”. 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 310Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.3 Subir fotografías a Picasa Web IIEn este apartado vamos a explicar el procedimiento para crear un álbum y subir las imágenesa Picasa Web desde tu equipo utilizando el programa Picasa 3.9.3.1 Instalación de Picasa 3 en Windows 1. Descarga e instala en tu equipo el instalador picasa3-setup.exe del programa Picasa 3. Como resultado de este proceso de instalación obtendrás en el escritorio de tu equipo el icono de acceso directo al programa. También puedes descargar la última versión en la web de Google Picasa: http://picasa.google.com/intl/es/9.3.2 Instalación de Picasa 3 en Ubuntu 1. Descarga e ejecuta en tu equipo el instalador picasa_3.0-current_i386.deb. Como resultado del proceso de instalación obtendrás un acceso al programa mediante Aplicaciones > Gráficos > Picasa > Picasa. También puedes descargar la última versión en la web de Google Picasa para Linux: http://picasa.google.com/linux/9.3.3 Subir imágenes a Picasa Web 2. Descarga y descomprime el archivo fauna.zip a una carpeta del equipo. Como resultado de esta tarea dispondrás de una carpeta con el nombre fauna y en su interior podrás encontrar una colección de las fotos sobre animales salvajes. 3. Inicia el programa Picasa 3. 4. En primer lugar comprueba si la carpeta fauna se encuentra en la lista de carpetas que se muestra en la columna izquierda de Picasa.
    • Imagen ::: Picasa Web, álbums de fotos 311Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Si no es así elige Archivo > Añadir carpeta a Picasa. En el Administrador de carpetas localiza y selecciona la carpeta fauna en el listado de carpetas y en la columna derecha activa la opción Explorar una vez o bien Explorar siempre. Pulsa en el botón Aceptar. 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 312Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. En la esquina inferior izquierda se mostrará la colección de miniaturas correspondiente a la selección de fotos realizada. Clic en el botón de Álbumes que se muestra y selecciona Nuevo álbum. 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 313Multimedia 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 314Multimedia 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 315Multimedia 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 316Multimedia 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.9.4 Publicación de una imagen Picasa en el blog9.4.1 Obtener la URL de la imagen 1. Si no estás autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botón Acceder. 2. Al acceder autentificado se mostrará la página Mis fotos donde son accesibles los álbumes que tenemos subidos al servidor. Clic sobre el álbum Fauna africana creado con anterioridad para abrirlo.
    • Imagen ::: Picasa Web, álbums de fotos 317Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. 5. Otra posibilidad es utilizar la URL de embed que se ofrece en la columna derecha donde se muestra la imagen. Esta opción nos permitirá elegir el tamaño de la imagen que deseamos utilizar en nuestro blog. Para ello haz clic en Enlace a esta foto. Despliega el combo Seleccionar tamaño para elegir un tamaño, por ejemplo, de 400 píxeles. 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 318Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. Selecciona la URL a la imagen que viene a continuación de la etiqueta <img src=”… Es la dirección que está entre comillas pero sin incluirlas. A continuación elige Edición > Copiar.9.4.2 Insertar la imagen en una entrada de Blogger 9. 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. 10. Añade como título: El buitre 11. En el editor de artículos pulsa en el botón Añadir imagen. 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 319Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 16. Clic en el botón PUBLICAR ENTRADA. 17. Para ver el aspecto del artículo haz clic en el enlace Ver Blog.9.4.3 Insertar la imagen en una entrada de Wordpress 1. Desde el interfaz de gestión de contenidos de tu blog en Wordpress elige la opción Entradas > Añadir para crear una nueva entrada. 2. Añade como título: El buitre 3. En el editor de artículos pulsa en el botón Añadir una imagen. 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. 5. Esta tarea pegará la URL absoluta de la imagen. Introduce el Texto alternativo de la imagen. Clic en el botón Insertar en la entrada que se muestra en este panel.
    • Imagen ::: Picasa Web, álbums de fotos 320Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. 7. Clic en el botón Publicar. 8. Para ver el aspecto del artículo haz clic en el enlace Ver Entrada.9.5 Publicación de presentación Picasa en Blogger 1. Si no estás autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botón Acceder. 2. Al acceder autentificado se mostrará la página Mis fotos donde son accesibles los álbumes que tenemos subidos al servidor. Clic sobre el álbum Fauna africana creado con anterioridad para abrirlo. 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. 4. Clic en el enlace Incrustar proyección de diapositivas. 5. Se muestra el cuadro de diálogo Crear una presentación de diapositivas.
    • Imagen ::: Picasa Web, álbums de fotos 321Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 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. 12. Clic en el botón PUBLICAR ENTRADA. 13. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.
    • Imagen ::: Picasa Web, álbums de fotos 322Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado9.6 Publicación de presentación Picasa enWordpress 1. Si no estás autentificado en Picasa Web (http://picasaweb.google.com/) debes introducir tus credenciales Google y pulsar en el botón Acceder. 2. Al acceder autentificado se mostrará la página Mis fotos donde son accesibles los álbumes que tenemos subidos al servidor. Clic sobre el álbum Fauna africana creado con anterioridad para abrirlo. 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 323Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 4. Selecciona el código HTML que se ofrece en la casilla Copiar el HTML para inscrustarlo en el sitio web. Haz clic derecho y elige Seleccionar todo. De nuevo haz clic derecho para elegir Copiar. 5. Accede al interfaz de gestión de contenidos y selecciona Entradas > Añadir para crear un nuevo artículo. 6. Añade como título: Fauna africana 7. Clic en el pestaña HTML para acceder al código HTML de la entrada. 8. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. 9. Clic en el botón Publicar.
    • Imagen ::: Picasa Web, álbums de fotos 324Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10. Pulsa en el enlace Ver entrada para comprobar cómo se visualiza la presentación.
    • Imagen ::: Slide.com : presentaciones de fotos 325Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10. Slide.com: presentaciones de fotos
    • Imagen ::: Slide.com : presentaciones de fotos 326Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.1 ¿Qué es Slide.com?Slide.com (http://www.slide.com) es un servicio web 2.0 que nos permite subir unacolección de imágenes y luego obtener en línea una atractiva presentación que las muestra deforma secuencial y con efectos especiales. Esta presentación tendrá una URL que podemoscompartir con otras personas. También es posible integrarla dentro de una página web oartículo de un blog. Este servicio puede resultar interesante para publicar las fotos de losdistintos eventos en que participes.10.2 Crear una presentación Slide 1. Descarga y descomprime el archivo gallery.zip en una carpeta del disco duro. Como resultado de esta tarea dispondrás de una colección de fotografías para crear tu presentación. Otra posibilidad es utilizar una colección propia. 2. Abre el navegador web Firefox y visita la web de Slide.com: http://www.slide.com 3. Se puede crear una presentación sin necesidad de registrarse como usuario de este servicio. Sin embargo conviene registrarse haciendo clic en el enlace Regístrate para poder editar en cualquier momento las presentaciones creadas. Para ello introduce tu email y la contraseña. Una vez completado el registro, en el formulario ENTRAR introduce estos datos para autentificarte. 4. Clic en el botón Crear un Slide Show o bien en inglés Make a Slide Show. 5. En la pestaña Mis archivos haz clic en el botón Busca para subir las imágenes desde el equipo. 6. En el cuadro de diálogo Seleccione los archivos … navega para situarte dentro de la carpeta anterior. Puedes seleccionar un solo archivo con hacer clic sobre él. Para añadir, uno a uno, a la selección pulsa previamente la tecla Ctrl y sin soltarla vete haciendo clic sobre los archivos que deseas elegir. Para añadir una lista de archivos: haz clic en el primero, pulsa la tecla Mayus y sin soltarla haz clic en el último. Verás que se seleccionan todos. Utiliza este truco para elegir todos los archivos de imagen de esta carpeta.
    • Imagen ::: Slide.com : presentaciones de fotos 327Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7. Clic en el botón Abrir. 8. Transcurridos unos segundos se habrán subido estas imágenes al servidor remoto. Una vez finalizado el proceso se mostrará el mensaje Subida terminada. En la vista previa de la presentación que se muestra en la parte superior de la página ya aparecen estas imágenes. 9. En el panel inferior donde se muestran las imágenes subidas se puede realizar los siguientes ajustes:  Nombre de Slide Show: Mi viaje por Asturias  Pies de foto: Escribe el pie de página para cada fotografía ya que por defecto se sitúa el nombre del archivo.  Orden de las fotografías. Arrastra las imágenes para colocarlas en el orden en que se mostrarán.  Azar. Si activas esta casilla las fotos se mostrarán de forma aleatoria. 10. En el panel derecho Personaliza se pueden configurar interesantes opciones de la presentación:  Estilo, Temas y Skins: puedes combinar las distintas opciones de estos parámetros para conseguir presentaciones más personalizadas. En la pestaña Estilo se puede activar la casilla Azar para que se muestre cada vez con un estilo aleatorio y desplegar la lista Rapidez para elegir la velocidad de la animación: Fast, Medium y Show (Rápido, Medio y Lento).
    • Imagen ::: Slide.com : presentaciones de fotos 328Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado  Música: permite elegir una música de fondo entre un amplio repertorio de melodías. Si desactivas la casilla Toca automáticamente en Slide Show la música no sonará hasta que el usuario efectúe clic sobre el icono del altavoz.  Fondo: para elegir un color de fondo.  Efectos: para aplicar efectos de sepia, blanco/negro, etc a las fotos.  Tamaño: en función del modelo definido para el estilo se podrá elegir un tamaño estándar: small, medium o large (pequeño, mediano y grande).
    • Imagen ::: Slide.com : presentaciones de fotos 329Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado  Privacidad: permite establecer si la presentación será de acceso público o particular. Se recomienda la opción de acceso público. 11. Para terminar de configurar la presentación pulsa en el botón Guardar. 12. Si no te has registrado y autentificado Slide.com te ofrece la oportunidad de registrarte. Si continuas sin registrar no será posible editar más adelante el slide creado. En este caso no es necesario por lo que pulsa el botón Continuar para seguir. 13. Al final verás la presentación de tus fotos con los parámetros de estilo, audio y animación definidos. Atención: No cierres el navegador web para poder realizar el próximo apartado de publicación en tu blog.
    • Imagen ::: Slide.com : presentaciones de fotos 330Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado10.3 Publicar la presentación Slide en Blogger 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 4. 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. 5. Añade como título: Mi presentación Slide 6. En el editor haz clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 7. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. 8. Clic en el botón PUBLICAR ENTRADA.
    • Imagen ::: Slide.com : presentaciones de fotos 331Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.10.4 Publicar la presentación Slide en Wordpress 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. 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 332Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 4. Selecciona el código numérico que identifica al slide de fotos. Es el valor numérico del parámetro channel o bien id. A continuación en la barra de menús selecciona Edición > Copiar. 5. Al final del documento del bloc de notas teclea el siguiente código: [slideshow id=&w=426&h=320] 6. A continuación del parámetro id en este código pega el valor numérico copiado anteriormente y correspondiente a tu slideshow. El resultado final será del tipo: [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 333Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 11. Clic en el botón Publicar. 12. Pulsa en el enlace Ver entrada para comprobar cómo se visualiza la presentación.
    • Imagen ::: Slideshare, presentaciones en línea 334Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Slideshare: presentaciones en línea
    • Imagen ::: Slideshare, presentaciones en línea 335Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.1 ¿Qué es Slideshare.net?Slideshare (http://www.Slideshare.net) es un servicio de alojamiento y publicación en líneade presentaciones realizadas con herramientas como Powerpoint u OpenOffice. Puedesutilizarlo para subir tus presentaciones y compartirlas. También puedes buscar y utilizar lasrealizadas por otras personas. En este curso se propone Slideshare como una interesanteopción para publicar en la web nuestras propias presentaciones y luego poder integrarlas enel código HTML de una página de tu blog.Conviene registrarse previamente para crear tu cuenta en Slideshare. Para ello haz clic en elenlace Signup y completa el formulario indicando email, usuario y contraseña. A partir de esemomento ya dispones de credenciales de identificación y acceso.11.2 Subir una presentación a Slideshare.net 1. Descarga y descomprime el archivo TIC_project.zip en el disco duro de tu equipo. Como resultado de esta tarea obtendrás el archivo TIC_project.ppt que contiene una presentación realizada en PowerPoint. 2. Abre el navegador y visita la página de Slideshare: http://www.Slideshare.net 3. En el cuadro de Login introduce las credenciales de acceso. 4. Clic en el enlace Upload (Subir). 5. En la página se muestra información sobre el tipo de archivos que se pueden subir: .ppt, .pps, .pptx, .ppsx (Powerpoint), .odp (Impress de OpenOffice), .pdf o bien documentos de Office 97-2003-2007 (.doc, .rtf y .xls) u OpenOffice (.odt, .ods u .pdf). Actualmente el límite máximo es 100 MB. 6. Clic en el botón Browse and select files … (Navegar y elegir archivos …). 7. En el cuadro de diálogo Seleccione los archivos … navega para situarte en la carpeta donde has descargado y descomprimido el archivo TIC_project.ppt.
    • Imagen ::: Slideshare, presentaciones en línea 336Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Selecciónalo y pulsa en el botón Abrir. 9. Tras unos segundos de espera se subirá esta presentación en Slideshare. 10. Cuando el proceso de subida ha tenido éxito se solicitan algunos datos adicionales:  Title (Título). Es el título de la presentación. Ejemplo: Proyecto TIC en un centro educativo  Tags (Etiquetas). Es una relación de palabras-clave separadas por espacios en blanco que permitirán localizar esta presentación utilizando la herramienta de búsqueda de Slideshare. Ejemplo: TIC proyecto integracion educacion tecnologias  Language (Idioma). Selecciona la opción Spanish (Español).  Description (Descripción). Un breve comentario que a modo de introducción permite describir la presentación.  Allow file download. (Permitir descarga de archivo). Si marcas esta opción los usuario podrán descargarse el archivo original. 11. Para concluir el proceso de subida pulsa en el botón Publish. 12. Tras pulsar este botón se produce otro tiempo de espera. Slideshare está transformando el archivo original en una película Flash que se mostrará al usuario mostrando el contenido de esa presentación. 13. Clic en el enlace superior My Slidespace.
    • Imagen ::: Slideshare, presentaciones en línea 337Multimedia 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:  Recuerda que las transiciones de diapositivas, efectos animados, audios y vídeos introducidos en la presentación original se pierden cuando la subes a Slideshare.net.  Una vez subida la presentación se ofrece la posibilidad de añadir un audio MP3 a la presentación para crear un SlideCast donde audio e imagen se muestran sincronizados. El audio debe estar alojado en un servidor web.  También se ofrece la posibilidad de insertar vídeos de Youtube.11.3 Publicar un Slideshare en Blogger 1. Haz clic derecho sobre el cuadro de texto Embed (embebido) para elegir Seleccionar todo. 2. Vuelve a hacer clic derecho sobre el cuadro de texto y elige la opción Copiar.
    • Imagen ::: Slideshare, presentaciones en línea 338Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. 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. 4. Añade como título: Mi presentación Slideshare 5. En el editor haz clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 6. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar. 7. Clic en el botón PUBLICAR ENTRADA. 8. Pulsa en el enlace Ver blog para comprobar cómo se visualiza la presentación.
    • Imagen ::: Slideshare, presentaciones en línea 339Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoNota:  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 340Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado11.4 Publicar un Slideshare en Wordpress 1. Haz clic en el botón More options (Más opciones) que aparece en la parte derecha del cuadro de texto que contiene el código Embed. 2. Se muestra el código para Wordpress.com en la casilla for WordPress.com. Haz clic derecho en este cuadro de texto y selecciona la opción Copiar. 3. Desde el interfaz de gestión de contenidos de tu blog en Wordpress elige la opción Entradas > Añadir. 4. Añade como título: Mi presentación Slideshare 5. En el editor haz clic en la pestaña Visual y a continuación clic derecho sobre el cuadro del editor para pegar el código de SlideShare. 6. Pulsa en el botón Publicar.
    • Imagen ::: Slideshare, presentaciones en línea 341Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Pulsa en el botón Ver entrada para comprobar cómo se visualiza la presentación.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 342Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Google Maps
    • Imagen ::: Google Maps 343Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado12.1 ¿Qué es Google Maps?Google Maps (http://maps.google.es/) proporciona herramientas para la integración demapas geográficos en nuestro sitio web o blog. De esta forma es posible proporcionar a loslectores de nuestro blog un mapa con la ubicación de centros de interés referenciados.Básicamente consiste en añadir al mapa una capa con señaladores, textos, imágenes, enlaces,etc. Estas prestaciones son susceptibles de aplicarse a múltiples contextos educativos,culturales, empresariales, etc donde sea interesante la técnica de geolocalización de recursosmultimedia: visitas, itinerarios, noticias, proyectos, fotografías, etc.12.2 Crear un mapa en GMap 1. Accede a la web de Google Maps: http://maps.google.es/ 2. Clic en el enlace Acceder situado en la esquina superior derecha. 3. Introduce las mismas credenciales (usuario y contraseña) que utilizas habitualmente para Blogger. 4. Para situar un marcador sobre el mapa es necesario autentificarse previamente. Si ya lo has hecho pulsa en el enlace Mis Mapas.
    • Imagen ::: Google Maps 344Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Clic en el botón Crear un mapa nuevo 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. 8. Descarga y descomprime el archivo gmaps.zip. Como resultado obtendrás un archivo de texto gmaps.txt. Haz doble clic sobre él para abrirlo con el Bloc de Notas. En él se proporciona título, descripción e imagen de algunos de los monumentos más importantes de España. Puedes seleccionar otros si lo estimas conveniente. 9. Regresa al mapa de Google y haz clic en el botón Añadir un marcador de posición y a continuación haz clic en el punto del mapa donde desees situarlo. Por ejemplo: Coloca un alfiler en Barcelona.
    • Imagen ::: Google Maps 345Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 346Multimedia 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.12.3 Publicar un mapa Google en Blogger 1. Pulsa en el botón Enlazar que se muestra en la esquina superior derecha del mapa. En el cuadro que aparece se ofrece en primer lugar un enlace directo a este mapa en Google Maps. Esta dirección se puede copiar (clic derecho+Seleccionar todo y clic derecho+Copiar) y pegar (clic derecho+Pegar) sobre el cuerpo de un mensaje de correo electrónico para enviarlo a otros usuarios y compartir con ellos este mapa. 2. Para insertar el mapa en un artículo del blog hay que copiar el código que se ofrece en el cuadro Pegar HTML para insertar en sitio web. Para ello haz clic derecho sobre este cuadro y elige Seleccionar todo. Después haz clic derecho y elige la opción Copiar. 3. 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. 4. Añade como título: Mi mapa Google 5. En el editor haz clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 6. Haz clic derecho sobre el cuadro de texto del editor y elige Pegar.
    • Imagen ::: Google Maps 347Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Clic en el botón PUBLICAR ENTRADA. 8. Pulsa en el enlace Ver blog para comprobar cómo se visualiza el mapa Google.
    • Imagen ::: Google Maps 348Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado12.4 Publicar un mapa Google en Wordpress 1. Pulsa en el botón Enlazar que se muestra en la esquina superior derecha del mapa. En el cuadro que aparece se ofrece en primer lugar un enlace directo a este mapa en Google Maps. Esta dirección se puede copiar (clic derecho+Seleccionar todo y clic derecho+Copiar) y pegar (clic derecho+Pegar) sobre el cuerpo de un mensaje de correo electrónico para enviarlo a otros usuarios y compartir con ellos este mapa. 2. Para insertar el mapa en un artículo del blog hay que copiar el código que se ofrece en el cuadro Pegar HTML para insertar en sitio web. Para ello haz clic derecho sobre este cuadro y elige Seleccionar todo. Después haz clic derecho y elige la opción Copiar. 3. Accede al interfaz de gestión de contenidos de Wordpress y elige la opción Entradas > Añadir para crear un nuevo artículo. 4. Añade como título: Mi mapa Google 5. En el editor haz clic en la pestaña HTML para mostrar el código HTML del artículo. 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 349Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Clic en el botón Publicar. 8. Pulsa en el enlace Ver entrada para comprobar cómo se visualiza el mapa Google.
    • Módulo 3. Audio
    • Audio ::: Introducción 351Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. Introducción
    • Audio ::: Introducción 352Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.1 Conceptos básicos del sonido digitalFrecuencia.Es el número de vibraciones por segundo que da origen al sonido analógico. El espectro de unsonido se caracteriza por su rango de frecuencias. Ésta se mide en Hertzios (Hz). El oídohumano capta sólo aquellos sonidos comprendidos en el rango de frecuencias 20 Hz y 20.000Hz.Tasa de muestreo (sample rate).Un audio digital es una secuencia de ceros y unos que se obtiene del muestreo de la señalanalógica. La tasa de muestreo o sample rate define cada cuánto tiempo se tomará el valorde la señal analógica para generar el audio digital. Esta tasa se mide en Hertzios (Hz). Porejemplo: 44100 Hz. nos indica que en un segundo se tomaron 44100 muestras de la señalanalógica de audio para crear el audio digital correspondiente. Un audio tendrá más calidadcuanto mayor sea su tasa de muestreo. Algunas frecuencias estándares son 44100 Hz., 22050Hz., y 11025 Hz.Resolución (bit resolution)Es el número de bits utilizados para almacenar cada muestra de la señal analógica. Unaresolución de 8-bits proporciona 256 (28) niveles de amplitud, mientras que una resolución de16-bits alcanza 65536 (216). Un audio digital tendrá más calidad cuanto mayor sea suresolución. Ejemplo: El audio de calidad CD suele ser un sonido de 44.100 Hz – 16 bits –estereo.Velocidad de transmisión (bitrate)El bitrate define la cantidad de espacio físico (en bits) que ocupa un segundo de duración deese audio. Por ejemplo, 3 minutos de audio MP3 a 128kBit/sg, ocupa 2,81 Mb de espacio físico(3min x 60 seg/min x 128 kBit/seg = 23040 kBits -> 23040 kBits x 1024 bits/Kbit : 8bits/bytes : 1024 bytes/Kbytes : 1024 Kbytes/Mbytes = 2,81 MBytes ó Mb). Por ejemplo en losaudios en formato MP3 se suele trabajar con bitrates de 128 kbps (kilobits por segundo). Elaudio tendrá más calidad cuanto mayor sea su bitrate y el archivo que lo contiene tendrámayor peso. Esta magnitud se utiliza sobre todo en el formato MP3 de audio más destinado ala descarga por Internet.CBR/VBRConstant/Variable Bitrate. CBR indica que el audio ha sido codificado manteniendo el bitrateconstante a lo largo del clip de audio mientras que VBR varía entre un rango máximo ymí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 elnúmero de bytes que ocupa un archivo de audio. Los archivos codificados con un codecespecífico requieren el mismo códec para ser decodificados y reproducidos. El códec másutilizado en audio es el MP3.Decibelio.Unidad de medida del volumen o intensidad de un sonido. El silencio o ausencia de sonido secuantifica 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 353Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado1.2 Formatos de archivos de audioLas audios digitales se pueden guardar en distintos formatos. Cada uno se corresponde conuna extensión específica del archivo que lo contiene. Existen muchos tipos de formatos deaudio y no todos se pueden escuchar utilizando un mismo reproductor: Windows Media Player,QuickTime, WinAmp, Real Player, etc. Aquí trataremos los formatos más utilizados yuniversales: WAV, MP3 y OGG.Formato WAV  El formato WAV (WaveForm Audio File) es un archivo que desarrolló originalmente Microsoft para guardar audio. Los archivos tienen extensión *.wav  Es ideal para guardar audios originales a partir de los cuales se puede comprimir y guardar en distintos tamaños de muestreo para publicar en la web.  Es un formato de excelente calidad de audio.  Sin embargo produce archivos de un peso enorme. Una canción extraída de un CD (16 bytes, 44100 Hz y estéreo) puede ocupar entre 20 y 30 Mb.  Compresión: Los archivos WAV se pueden guardar con distintos tipos de compresión. Las más utilizadas son la compresión PCM y la compresión ADPCM. No obstante incluso definiendo un sistema de compresión, con un audio de cierta duración se genera un archivo excesivamente pesado.  El formato WAV se suele utilizar para fragmentos muy cortos (no superiores a 3-4 segundos), normalmente en calidad mono y con una compresión Microsoft ADPCM 4 bits.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  El formato OGG ha sido desarrollado por la Fundación Xiph.org.  Es el formato más reciente y surgió como alternativa libre y de código abierto (a diferencia del formato MP3).  Muestra un grado de compresión similar al MP3 pero según los expertos en música la calidad de reproducción es ligeramente superior.  No todos los reproductores multimedia son capaces de leer por defecto este formato. En algunos casos es necesario instalar los códecs o filtros oportunos.  El formato OGG puede contener audio y vídeo.Mención especial merece el formato MIDI. No es un formato de audio propiamente dicho porlo que se comentan aparte sus características.
    • Audio ::: Introducción 354Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesoradoFormato MIDI  El formato MIDI (Musical Instrument Digital Interface = Interface Digital para Instrumentos Digitales) en realidad no resulta de un proceso de digitalización de un sonido analógico. Un archivo de extensión *.mid almacena secuencias de dispositivos MIDI (sintetizadores) donde se recoge qué instrumento interviene, en qué forma lo hace y cuándo.  Este formato es interpretado por los principales reproductores del mercado: Windows Media Player, QuickTime, etc.  Los archivos MIDI se pueden editar y manipular mediante programas especiales y distintos de los empleados para editar formatos WAV, MP3, etc. El manejo de estos programas suele conllevar ciertos conocimientos musicales.  Los archivos MIDI permiten audios de cierta duración con un reducido peso. Esto es debido a que no guardan el sonido sino la información o partitura necesaria para que el ordenador la componga y reproduzca a través de la tarjeta de sonido.  Se suelen utilizar en sonidos de fondo de páginas HTML o para escuchar composiciones musicales de carácter instrumental.  El formato MIDI no permite la riqueza de matices sonoros que otros formatos ni la grabación a partir de eventos sonoros analógicos.1.3 Optimización de archivos de audioPara optimizar el peso del archivo de audio será necesario utilizar un editor para reduciralguno o algunos de los siguientes parámetros: 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.En los siguientes capítulos de este documento se describirán los procedimientos necesariospara realizar estas tareas sobre un audio original utilizando el editor Audacity.
    • Audio ::: Primeros pasos con Audacity 355Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Primeros pasos con Audacity
    • Audio ::: Primeros pasos con Audacity 356Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2.1 ¿Qué es Audacity? Es un programa libre y de código abierto para grabar y editar sonidos. Existe versiones para Windows, Linux, Mac, etc. (http://audacity.sourceforge.net/)2.2 Instalación del programa en WindowsPaso 1. Instalación de AudacityDescarga y ejecuta el instalador de Audacity para Windows: audacity-win-unicode-1.3.12.exe. El programa se instalará en la carpeta de Archivos de programa y se creará unicono de acceso directo en el escritorio.Otra posibilidad es descargar y descomprimir en una carpeta de tu disco duro o pendrive laversión portable para Windows: audacity-win-unicode-1.3.12.zip. Esta versión no necesitainstalación.En el sitio web oficial del proyecto Audacity podrás encontrar la versión más reciente o quese adapta a tu sistema: http://audacity.sourceforge.net/Paso 2. Instalación de los códecs LAME y FFmpegPara 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 serinteresante 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 delicencias de uso. 1. Dentro de la carpeta de instalación de Audacity crea una subcarpeta con el nombre codecs. 2. Descarga y ejecuta el instalador de LAME MP3 definiendo la carpeta codecs como destino de instalación: Lame_v3.98.2_for_Audacity_on_Windows.exe. Esta rutina copiará el códec en su interior. 3. Descarga y ejecuta el instalador de FFmpeg definiendo la carpeta codecs como destino de instalación: FFmpeg_2009_01_08_for_Audacity_on_Windows.exe. Esta rutina copiará el códec en su interior. 4. Abre Audacity para configurar el programa indicándole la ubicación de estos códecs. 5. En la barra de menús selecciona Edición > Preferencias. 6. En el cuadro de diálogo Preferencias de Audacity haz clic en Bibliotecas. Clic en el botón Ubicar para localizar la Biblioteca MP3 (lame_enc.dll) y la Biblioteca FFmpeg (avformat-52.dll).
    • Audio ::: Primeros pasos con Audacity 357Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado2.3 Instalación del programa en UbuntuPaso 1. Instalación de Audacity 1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. 2. En el cuadro de búsqueda introduce el término audacity y pulsa en el icono de búsqueda. 3. Se muestra el elemento de instalación de Audacity. Pulsa en el botón Instalar. Al cabo de unos instantes se habrá instalado la aplicación. 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.Paso 2. Instalación de los códecs LAME y FFmpegPara 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 serinteresante 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 delicencias de uso. 1. Desde el escritorio de Ubuntu selecciona Sistema > Administración > Gestor de paquetes Synaptic. 2. Introduce en el cuadro de texto de búsqueda el término libmp3lame y pulsa en el botón Buscar.
    • Audio ::: Primeros pasos con Audacity 358Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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.2.4 El entorno del programa 1. Descarga y descomprime el archivo amanecer.zip a una carpeta de tu equipo. Como resultado de esta extracción obtendrás el archivo WAV: amanecer.wav. 2. Abre Audacity utilizando el icono de acceso directo al programa. 3. Desde Audacity selecciona Archivo > Abrir. 4. En el cuadro de diálogo Seleccione uno o más archivos … despliega la lista Buscar en para seleccionar la carpeta donde se ubica el archivo de audio anterior. En el cuadro inferior selecciona este archivo y pulsa en el botón Abrir. 5. Tras abrir un archivo de sonido mediante el comando Archivo > Abrir, el programa muestra el siguiente entorno:
    • Audio ::: Primeros pasos con Audacity 359Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Aunque algunos se verán con más detalle más adelante, ahora se describen brevemente los principales elementos del interfaz de Audacity: 1. Barra de menús. Como en cualquier aplicación Windows se puede utilizar para activar cualquier opción del programa. 2. Barra de herramientas. Contiene algunas de las operaciones de uso más frecuente: Herramienta de Selección: permite seleccionar un fragmento del audio. Herramienta de Envolvente: se utiliza para modificar el volumen en ciertas áreas. Herramienta de dibujo: con ella se pueden modificar pequeños fragmentos dibujando directamente sobre la representación gráfica de la onda sonora. Suele ser necesario ampliar previamente la vista de la muestra. Herramienta zoom: facilita la visualización de detalles en zonas concretas de la grabación. Herramienta de traslado de tiempo: permite desplazar un fragmento de la grabación sobre la línea de tiempo: adelante-atrás.
    • Audio ::: Primeros pasos con Audacity 360Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Modo Multi-herramienta: permite utilizar las herramientas Selección, Envolvente y Traslado sin tener que ir seleccionándolas individualmente. 3. Barra de control de reproducción. Para reproducir en bucle indefinido el fragmento seleccionado pulsa la tecla Mayus y sin soltarla haz clic en el botón Reproducir. 4. Barra de medidores de Nivel de Entrada y salida  Indicador de Nivel de Salida. Durante la reproducción de una grabación mostrará el volumen de salida en cada uno de los dos canales: I-R.  Indicador de Nivel de Entrada. Durante una grabación mostrará el volumen de entrada de la fuente elegida, por ejemplo, el micrófono. 5. Barra de Mezclador  Volumen de Salida. Permite establecer el volumen con que se reproducirá el el audio abierto con Audacity cuando se pulse el botón Reproducir de la barra de Control de Reproducción. Este control de salida se sincroniza con el elemento Onda de la consola de control de volumen de los dispositivos de salida.  Volumen de Entrada. Utiliza el deslizador para definir el volumen con que se grabará el audio procedente del dispositivo de entrada seleccionado (ejemplo: micrófono). No obstante no controla el volumen con que entra la señal de audio sino el volumen que utiliza para grabarla. Si la señal de audio entra saturada, simplemente grabará la señal saturada a menor volumen. 6. Barra de Transcripción. Permite iniciar la reproducción del audio y definir mediante el deslizador la velocidad a la que se reproducirá el audio.
    • Audio ::: Primeros pasos con Audacity 361Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. Cortar, Copiar ó Pegar un fragmento de grabación. Recortar fuera de selección: recorta los fragmentos exteriores a la selección actual. Silenciar selección: transforma a silencio el fragmento de audio seleccionado. Deshacer/Rehacer: deshace o rehace la última operación realizada con el programa. Zoom Acercar/Alejar. Ajustar selección a la ventana: ajusta el fragmento seleccionado a la ventana visible. Ajustar el proyecto a la ventana: ajusta la grabación completa a la ventana disponible. 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 362Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Botones Silencio/Sólo. Permite silenciar una pista o conseguir que sólo se reproduzca ésta.  Deslizadores de volumen y balance. Arrastra estos deslizadores para definir el volumen y balance relativo a esa pista. El balance se refiere a que la pista se reproduzca más por el altavoz izquierdo (I) o bien por el altavoz derecho (D). 9. Barra de Selección. Situada por defecto en la parte inferior de la ventana. Muestra la frecuencia del proyecto de grabación actual y también permite definir de forma numérica la selección de un fragmento de audio.
    • Audio ::: Reproducción de audio con Audacity 363Multimedia 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 364Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.1 Abrir un archivo de audio 1. Descarga y descomprime el archivo amanecer.zip para guardar el archivo amanecer.wav que contiene en una carpeta del disco duro local. 2. Para iniciar Audacity haz doble clic sobre el icono del programa en el escritorio. 3. Selecciona Archivo > Abrir 4. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta localizar el archivo amanecer.wav que hemos situado anteriormente en el disco duro. 5. Clic sobre este archivo de la lista y pulsa en el botón Abrir.3.2 Reproducción del audio Utiliza la consola de reproducción y grabación situada en la barra superior  Play (Reproducir): reproduce el fragmento de onda que está seleccionada o bien su totalidad. Observa que si pulsas la tecla Mayus y sin soltarla haces clic sobre el botón Play se reproducirá en bucle contínuo, es decir, al llegar al final comenzará por el principio.  Pausa: detiene temporalmente la reproducción o grabación de audio. Para reanudar el proceso basta con pulsar de nuevo en este botón.  Stop (Parar): detiene la reproducción o grabación.  Ir al principio: sitúa la cabeza lectora al principio de la grabación.  Ir al final: envía la cabeza lectora al final de la grabación.  Grabar: graba la señal de entrada en una nueva pista a partir de la posición actual de la cabeza lectora.
    • Audio ::: Reproducción de audio con Audacity 365Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.3 Propiedades de un archivo de audioPara conocer las propiedades de un archivo de audio o de vídeo se propone el uso delsoftware gratuito MediaInfo (http://mediainfo.sourceforge.net/es).3.3.1 Instalación de MediaInfo en Windows 1. Descarga y ejecuta el instalador MediaInfo_GUI_0.7.33_Windows_i386.exe para Windows. 2. Otra posibilidad es descargar y descomprimir a tu disco duro o pendrive el archivo MediaInfo_GUI_0.7.33_Windows_i386.zip. Es una versión que no necesita instalación. 3. En este caso accede al interior de esta carpeta y haz doble clic sobre el archivo ejecutable MediaInfo.exe3.3.2 Instalación de MediaInfo en Ubuntu 1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu 2. En el cuadro de diálogo Centro de software de Ubuntu elige Editar > Orígenes del software … 3. En el cuadro de Orígenes del software selecciona la pestaña Otro software. A continuación haz clic en el botón Añadir. 4. En la casilla Línea de APT copia y pega la siguiente línea:
    • Audio ::: Reproducción de audio con Audacity 366Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado deb http://ppa.launchpad.net/shiki/mediainfo/ubuntu lucid main 5. Clic en el botón Añadir origen. 6. Repite los pasos anteriores para añadir la siguiente fuente de software. deb-src http://ppa.launchpad.net/shiki/mediainfo/ubuntu lucid main 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. 8. En el cuadro de búsqueda introduce el término Mediainfo. Clic en el ítem mediainfo y pulsa en el botón Instalar. Clic en el ítem mediainfo-gui e instálalo. 9. Para iniciar el programa selecciona Aplicaciones > Sonido y vídeo > MediaInfo
    • Audio ::: Reproducción de audio con Audacity 367Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado3.3.3 Uso de MediaInfo 1. La primera vez que se ejecuta MediaInfo se solicita definir el idioma. Elige Español y pulsa en el botón OK. 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. 4. En este cuadro se mostrarán los distintos parámetros de interés sobre el audio contenido en este archivo: a. Velocidad de transmisión (bitrate): 352,8Kbps b. Tamaño de muestreo (sample rate): 44,1KHz c. Canales (mono/estéreo): 2 canales. d. Códec: ADPCM Si es un archivo WAV mostrará el tipo de compresión utilizado. Si es un archivo MP3, además de la información citada, se mostrarán los metacontenidos de las etiquetas ID3 específicas de este formato.
    • Audio ::: Reproducción de audio con Audacity 368Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoNota: Si abres un archivo WAV utilizando Audacity, la información que se muestra en el encabezado de la pista de audio no se corresponde con los datos del archivo importado. Audacity lo transforma automáticamente a la tasa de muestreo (p.e. 44100 Hz), resolución (p.e. 32-bit float) y canales (p.e. Estéreo) definidos por defecto para un proyecto Audacity.3.4 Guardar un proyecto de Audacity 1. Selecciona Archivo > Guardar proyecto como … para guardar el audio con los cambios realizados. 2. Al elegir esta opción el proyecto de edición de audio se guardará con extensión *.AUP . Este archivo contiene todo lo que necesita Audacity para editar este sonido (no sería necesario el archivo WAV que se abrió originalmente). Sin embargo el formato *.AUP no es editable ni reproducible por otros programas. 3. En la casilla Nombre define un nombre del proyecto y haz clic en Guardar. 4. Para cerrar este proyecto elige Archivo > Cerrar.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 369Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.Optimización de audios
    • Audio ::: Optimización de audios 370Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado4.1 Conversión de formato WAV a MP3En esta actividad se detalla el procedimiento para convertir un archivo de audio del formatoWAV al MP3. Cómo se explicó en el primer capítulo, el formato *.WAV puede almacenar elsonido en calidad pura y es ideal para guardar audios originales. Sin embargo para publicar unaudio es preferible transformarlo al formato *.MP3 ya que se reduce considerablemente elpeso del archivo respecto al original manteniendo una adecuada calidad. 1. Descarga y descomprime el archivo amanecer.zip para guardar el archivo amanecer.wav en una carpeta del disco duro. 2. Para iniciar Audacity haz doble clic sobre el icono del programa en el escritorio. 3. Selecciona Archivo > Abrir 4. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta localizar el archivo amanecer.wav. 5. Clic sobre este archivo de la lista y pulsa en el botón Abrir. Se abrirá una ventana con la onda de sonido correspondiente. 6. Selecciona Archivo > Exportar … 7. Se muestra el cuadro de diálogo Editar metadatos. Las etiquetas ID3 se almacenan en el mismo archivo MP3 y son leídas por el reproductor para mostrar previamente en pantalla los metadatos como el título de la pista (Track Title), el artista (Artist Name), el título del álbum (Album Title), el género musical (Genre), el año de creación de la canción (Year), el número de pista (Track Number), etc. Completa esta información o déjala en blanco porque en este caso no es significativa para la práctica. Clic en el botón Aceptar.
    • Audio ::: Optimización de audios 371Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. En el cuadro de diálogo Exportar archivo selecciona la carpeta destino en la lista desplegable Guardar en: . Introduce un nombre de archivo en la casilla Nombre y en Tipo selecciona Archivos MP3 9. No es necesario teclear la extensión porque Audacity la añadirá automáticamente. Clic en el botón Guardar. 7. Para realizar la conversión a MP3, Audacity utiliza el códec LAME. Si Audacity no encuentra el códec instalado en tu equipo, se mostrará un mensaje donde te propone localizarlo. Para ello haz clic en el botón Explorar … y apunta al archivo lame_enc.dll en Windows dentro de tu equipo. 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 372Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Al cabo de unos segundos ya dispondremos del archivo MP3 en la misma carpeta donde se abrió el archivo WAV. Comprueba que el MP3 tiene un peso inferior al WAV original.4.2 Configurar la calidad de exportación a MP3En ocasiones puede interesar reducir aún más el peso del archivo MP3 que se origina duranteel proceso de exportación descrito en el apartado anterior. 1. Vamos a iniciar el proceso a partir de un WAV original. Descarga y descomprime el archivo amanecer.zip para guardar el archivo amanecer.wav en una carpeta de tu equipo. Si este WAV se conserva sin modificaciones del apartado anterior podrías ahorrarte volver a descargarlo y descomprimirlo. 2. Para iniciar Audacity haz doble clic sobre el icono del programa en el escritorio. 3. Selecciona Archivo > Abrir. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta llegar a realizar doble clic sobre el archivo amanecer.wav. Con ello se abrirá una ventana con la onda de sonido correspondiente. 4. Elige Archivo > Exportar … 5. Se muestra el cuadro de diálogo Editar metadatos … Clic en Aceptar. 6. En el cuadro de diálogo Exportar archivo selecciona la carpeta destino en la lista desplegable Guardar en:. En la lista Tipo elige Archivos MP3 7. Clic en el botón Opciones… que se muestra en la parte inferior de este cuadro.
    • Audio ::: Optimización de audios 373Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. En este caso vamos a elegir como Modo de velocidad de transferencia la opción Constante. Despliega la lista Calidad (Quality) y elige un valor de Bit Rate inferior a 128. Por ejemplo: 96 (kbps). 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).4.3 Convertir un audio de estéreo a monoEn la mayoría de los casos no es necesario disponer de una locución o sonido en estéreo. Suversión en mono satisface dignamente el propósito de la aplicación. Esta operación suponereducir el tamaño del archivo. En este apartado se describen los pasos para realizarlo usandoAudacity. 1. Vamos a iniciar el proceso a partir de un WAV original. Descarga y descomprime el archivo amanecer.zip para guardar el archivo amanecer.wav en una carpeta del equipo. Si este WAV se conserva sin modificaciones del apartado anterior podrías ahorrarte volver a descargarlo y descomprimirlo. 2. Para iniciar Audacity haz doble clic sobre el icono del programa en el escritorio. 3. Selecciona Archivo > Abrir. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta llegar a realizar doble clic sobre el archivo amanecer.wav. Con ello se abrirá una ventana con la onda de sonido correspondiente. 4. En el cuadro que visualiza la onda sonora, haz clic en la cabeza de flecha negra situada en la esquina superior derecha del encabezado.
    • Audio ::: Optimización de audios 374Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. En el menú contextual que se ofrece selecciona la opción Dividir pista estéreo. 6. Tras esta elección observa que ahora el canal izquierdo y derecho se muestran en ventanas separadas.
    • Audio ::: Optimización de audios 375Multimedia 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. 8. En el cuadro que permanece, correspondiente al canal izquierdo, pulsa sobre la cabeza de flecha para desplegar el menú contextual. En este menú elige la opción Mono.
    • Audio ::: Optimización de audios 376Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Observa que ahora en el encabezado de la ventana de onda se muestra el texto Mono para indicar la conversión realizada. 10. Elige Archivo > Exportar 11. En el cuadro de diálogo Exportar archivo introduce un nuevo nombre de archivo. No es necesario teclear la extensión porque Audacity la incorpora automáticamente. Por ejemplo: amanecer_24_mono. 12. Desplieg la lista Tipo y selecciona Archivos MP3. 13. Pulsa en el botón Opciones para definir como Quality (Calidad): 24 kbps. Clic en Aceptar.
    • Audio ::: Optimización de audios 377Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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.4.4 Formatos de compresión WAVCuando el audio tiene una duración muy corta resulta interesante conservar el formato WAV.Con Audacity podemos definir distintos formatos de compresión WAV. 1. Iniciamos de nuevo el proceso a partir de un WAV original. Descarga y descomprime el archivo ladrido.zip para guardar el archivo ladrido.wav en una carpeta del disco duro. 2. Abrirlo con Audacity seleccionando Archivo > Abrir. 3. Para guardar el archivo de audio en formato WAV con distintos factores de conversión selecciona Archivo > Exportar. 4. En el cuadro de diálogo Editar metadatos haz clic en el botón Aceptar. 5. En el cuadro de diálogo Exportar archivo elige la carpeta destino en Guardar en:
    • Audio ::: Optimización de audios 378Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Despliega la lista Tipo y selecciona Otros archivos sin comprimir. 7. A continuación pulsa en el botón Opciones … 8. En el cuadro de diálogo Indicar opciones de datos sin comprimir despliega la lista Tipo y elige la entrada WAV (Microsoft) . Depliega el listado Codificación y elige por ejemplo Signed 16 bit PCM. Pulsa en el botón Aceptar. 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 379Multimedia 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 380Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. La grabación de audio
    • Audio ::: La grabación de audio 381Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado5.1 Crear una grabación de vozEn el diseño de una aplicación educativa puede resultar interesante añadir discursos sonoroscon carácter explicativo o de refuerzo. En este ejemplo se describe el proceso para crear unarchivo de audio digital a partir de un discurso pronunciado sobre el micrófono. 1. Abre el programa Audacity. 2. En primer lugar es necesario definir las condiciones del muestreo en la transformación del audio analógico a audio digital: tasa de muestreo (44.100 Hz, 22050 Hz, 11025 Hz, etc) y resolución (16, 24, 32, bits). Para ello elige Editar > Preferencias. 3. Elige la pestaña Calidad y despliega la lista Frecuencia de muestreo predeterminado. Selecciona, por ejemplo, un valor intermedio 22050 Hz. 4. Despliega la lista Formato de muestreo predeterminado y elige 16-bit. 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. 7. Marca la opción de visualización: Ver > Barra de herramientas > Barra de herramientas de dispositivos. De esta forma se visualizará sobre la barra de título de la aplicación Audacity el listado de dispositivos de entrada y salida. 8. En el panel de Dispositivos de entrada (icono de micrófono) selecciona el dispositivo MME: Micrófono (Realtek High Definition). Una vez seleccionado el dispositivo de entrada puedes ocultar este panel mediante Ver > Barra de herramientas > Barra de herramientas de dispositivos.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 382Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. En el menú que se muestra selecciona la opción: Comenzar monitorización. 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 383Multimedia 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.5.2 Grabar audio de un CDAunque hay otros programas que facilitan la extracción directa de música de un CD, conAudacity es posible obtener un fragmento musical a partir de un CD de música. 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. 4. Ajusta el volumen arrastrando el deslizador situado al lado del icono de micrófono 5. 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. En el menú que se muestra selecciona la opción: Comenzar monitorización. De esta forma se monitoriza la señal de entrada.
    • Audio ::: La grabación de audio 384Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. A continuación inserta el CD en la unidad del equipo. Si tu equipo está configurado de esta forma se iniciará Windows Media reproduciendo el CD de audio. En caso contrario debes abrir este programa: Inicio > Todos los programas > Reproductor de Windows Media o dentro de Accesorios. 7. Desde Windows Media Player selecciona en la barra de menú Reproducir > CD de audio. En el cuadro derecho se muestra la lista de pistas donde puedes seleccionar la que desees. 8. Regresa a Audacity. 9. Pulsa en el botón Grabar 10. Clic en el botón Parar en el instante que decidas detener la grabación. 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. Problema con el dispositivo Mezcla estéreo en Windows Vista En ocasiones el item Mezcla estéreo no aparece en el listado de dispositivos de Audacity. Cuando se instala Windows Vista en el equipo este dispositivo suele venir deshabilitado por defecto. La receta para habilitarlo es la siguiente: 1. Clic derecho sobre el icono de audio que aparece en la bandeja de sistema de Windows (esquina inferior derecha de la barra de tareas). 2. Elige la opción Dispositivos de grabación. 3. En el cuadro de diálogo Sonido, pestaña Grabar, sobre el listado de dispositivos haz clic derecho y elige Mostrar dispositivos deshabilitados.
    • Audio ::: La grabación de audio 385Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Se mostrará el dispositivo Mezcla estéreo que por defecto suele venir deshabilitado y oculto. 5. Clic derecho sobre este dispositivo y elige la opción Activar. 6. Para cerrar este panel Sonido pulsa en el botón Aceptar.
    • Audio ::: La grabación de audio 386Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado A partir de ese momento se visualizará Mezcla estéreo en el panel de dispositivos de Audacity. Si con esta receta no se resuelve el problema quizás sea necesario actualizar la versión del driver de la tarjeta de audio para Windows.5.3 Grabar audio de la radioEn esta práctica vamos a utilizar Audacity para grabar un fragmento de audio extraído de unaemisión de radio en Internet. 1. Visita la web http://www.rtve.es/radio/ 2. Selecciona una emisora, por ejemplo, Radio Clásica. 3. En el recuadro Radio clásica en directo pulsa en el botón Play. Al cabo de unos instantes, comenzarás a oir la emisión a través del equipo. 4. Sitúate en 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 … .Una vez seleccionado el dispositivo de entrada puedes ocultar este panel mediante Ver > Barra de herramientas > Barra de herramientas de dispositivos. 7. Ajusta el volumen arrastrando el deslizador situado al lado del icono de micrófono 8. 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. En el menú que se muestra selecciona la opción: Comenzar monitorización. De esta forma se monitoriza la señal de entrada.
    • Audio ::: La grabación de audio 387Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Si la radio web se está escuchando en tu equipo al comenzar la monitorización comenzarán a oscilar los medidores. 10. Pulsa en el botón Grabar 11. Clic en el botón Parar en el instante que decidas detener 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.5.4 Grabar audio de un MIDIEn esta práctica vamos a utilizar Audacity para grabar un fragmento de audio a partir de lareproducción de un archivo MIDI. Esta operación no suele aplicarse para optimizar un archivoMIDI ya que éste es un formato muy ligero sino para incorporar esta fuente de música al panelde mezclas ya que Audacity no importa ni reproduce directamente archivos MIDIs. 1. Descarga y descomprime el archivo mozart.zip para guardar el archivo mozart.mid que contiene en una carpeta del disco duro. 2. Desde el explorador de archivos, sitúate en la carpeta anterior. 3. Haz doble clic sobre el archivo mozart.mid. 4. En un equipo Windows se iniciará el reproductor Windows Media sonando este fragmento musical.
    • Audio ::: La grabación de audio 388Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 … (*) 7. Ajusta el volumen arrastrando el deslizador situado al lado del icono de micrófono 8. 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. En el menú que se muestra selecciona la opción: Comenzar monitorización. De esta forma se monitoriza la señal de entrada. 9. Si el MIDI se está escuchando en tu equipo mediante el Reproductor de Windows Media al comenzar la monitorización comenzarán a oscilar los medidores. 10. Pulsa en el botón Grabar 11. Clic en el botón Parar en el instante que decidas detener 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.
    • Audio ::: La grabación de audio 389Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoNotas:  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 390Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Montajes de audio
    • Audio ::: Montajes de audio 391Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.1 Seleccionar un fragmento de ondaLa reducción del peso de un archivo de audio puede realizarse acortando su duración original.Con un editor de audios como Audacity es posible seleccionar un fragmento de onda conintención de eliminarlo o bien conservarlo descartando el resto no seleccionado. Por otraparte la aplicación de un efecto siempre se realiza sobre un tramo de onda seleccionadapreviamente.En esta práctica vamos a estudiar algunos de los procedimientos para seleccionar. 1. Descarga y descomprime el archivo ambiente.zip para obtener el archivo ambiente.mp3. 2. Inicia Audacity 3. Selecciona Archivo > Abrir 4. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta localizar el archivo ambiente.mp3 que has extraído a tu equipo. 5. Clic sobre este archivo de la lista y pulsa en el botón Abrir. Se abrirá una ventana con la onda de sonido correspondiente. 6. Selecciona la herramienta de selección en el cuadro de herramientas. 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 392Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Veamos por ejemplo el procedimiento para seleccionar el fragmento musical comprendidoentre el segundo 2,95 y 3,90. 1. Pulsa sobre el botón de herramienta Zoom. 2. Haz clic reiteradamente sobre la representación de la onda hasta que la escala se sitúe en centésimas de segundo: 2,70-2,80-2,90 … Para disminuir el zoom haz clic derecho. 3. Vuelve a elegir la herramienta Selección. 4. Haz un solo clic sobre la onda para situar la línea de cursor inicialmente en el punto 2,95. 5. Arrastra la barra de desplazamiento horizontal situada en la parte inferior de la ventana si fuera necesario para visualizar el punto 3,90 de la grabación. 6. Presiona la tecla <Mayus> (flecha arriba) y sin soltarla haz otro clic sobre la onda en el punto 3,90. 7. Observa que la porción de onda seleccionada se muestra destacada sobre fondo gris más oscuro. Se pueden mover los límites inicial y final de este fragmento. Para ello basta con aproximar el puntero del ratón a estos límites y cuando éste tome el aspecto de una mano, pulsar y arrastrar.Otras opciones de selección son:  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 393Multimedia 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 herramientaSelecció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 seintroducen por teclado estos valores permitiendo un ajuste con una precisión de milésimas desegundo.6.2 Crear un nuevo archivo con un fragmento 1. Descarga y descomprime el archivo ambiente.zip para obtener el archivo ambiente.mp3. No es necesario realizar esta operación si ya dispones de él del apartado anterior de este capítulo. 2. Inicia el programa Audacity. 3. Selecciona Archivo > Abrir 4. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta localizar el archivo ambiente.mp3. 5. Clic sobre este archivo de la lista y pulsa en el botón Abrir. Se abrirá una ventana con la onda de sonido correspondiente. 6. Activa la herramienta Selección en la barra de herramientas de Audacity. 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 9. Selecciona Archivo > Nuevo. 10. En la nueva ventana, haz clic en el botón Pegar. 11. Elige Archivo > Exportar. 12. Se muestra el cuadro de diálogo Editar metadatos. Clic en Aceptar. 13. 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: ambiente2. No es necesario añadir la extensión *.mp3 porque Audacity lo hace de forma automática.
    • Audio ::: Montajes de audio 394Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 14. En la lista desplegable Tipo selecciona la entrada Archivos MP3. 15. Si deseas configurar la calidad del archivo mp3 resultante pulsa en el botón Opciones y defínela en la lista Calidad. Pulsa en el botón Aceptar.6.3 Recortar un fragmento 1. Descarga y descomprime el archivo ambiente.zip para obtener el archivo ambiente.mp3. No es necesario realizar esta operación si ya dispones de él del apartado anterior de este capítulo. 2. Inicia el programa Audacity. 3. Selecciona Archivo > Abrir para localizar el archivo ambiente.mp3. 4. Activa la herramienta Selección en la barra de herramientas de Audacity. 5. Selecciona un fragmento de onda mediante pulsar+arrastrar+soltar. 6. Para eliminar el audio no seleccionado haz clic en el botón Recortar o bien elige Editar > Recortar. Observa que Audacity sólo retiene la onda seleccionada. 7. Para situar la onda seleccionada al comienzo de la grabación, elige la herramienta Traslado en el tiempo y a continuación arrastra la selección al comienzo de la pista. 8. Elige Archivo > Exportar 9. Se muestra el cuadro de diálogo Editar metadatos. Clic en Aceptar. 10. 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: ambiente3. No es necesario añadir la extensión *.mp3 porque Audacity lo hace de forma automática. 11. En la lista desplegable Tipo selecciona la entrada Archivos MP3. 12. Si deseas configurar la calidad del archivo mp3 resultante pulsa en el botón Opciones y defínela en la lista Calidad. Pulsa en el botón Aceptar.6.4 Silenciar una selección 1. Descarga y descomprime el archivo ambiente.zip para obtener el archivo ambiente.mp3. No es necesario realizar esta operación si ya dispones de él del apartado anterior de este capítulo. 2. Inicia el programa Audacity. 3. Selecciona Archivo > Abrir para localizar y abrir el archivo ambiente.mp3 4. Selecciona la parte inicial de la onda mediante pulsar+arrastrar+soltar. 5. Para silenciar el audio seleccionado haz clic en el botón Silenciar selección. 6. Esta opción convierte en silencio el tramo de audio seleccionado. Para deshacer la operación elige Editar > Deshacer Silencio 7. Para crear un archivo con los cambios realizados sigue el procedimiento habitual: Archivo > Exportar
    • Audio ::: Montajes de audio 395Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado6.5 Crear un loop de audioEl archivo de un audio de duración media o larga suele tener un peso elevado parareproducirse previa descarga a través de Internet, incluso si se trata de un archivo MP3. Aveces la situación admite emplear como recurso alternativo un audio más corto pero quereproducido en bucle con “n” repeticiones transmite la sensación de un acompañamiento máslargo. Esto es especialmente útil en sonidos de fondo. En esta práctica vamos a crear un loopa partir de un audio más largo. 1. Descarga y descomprime el archivo house.zip para obtener el archivo house.mp3. 2. Inicia el programa Audacity. 3. Selecciona Archivo > Abrir para localizar el archivo house.mp3. 4. Escucha la grabación con detenimiento. Advertirás que este audio se puede sustituir fácilmente por un primer fragmento repetido varias veces. 5. Haz clic en la herramienta Zoom 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) 7. Activa la herramienta Selección en la barra de herramientas de Audacity. 8. Selecciona el fragmento inicial comprendido entre 0,00 y 0,05 y a continuación elige Editar > Borrar. 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 396Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Si necesitas modificar los extremos de la selección, debes detener la reproducción antes. Aproxima el puntero del ratón a un extremo de la selección y cuando tome el aspecto de una mano, pulsa y arrastra. 12. Para copiar la selección, haz clic en el botón Copiar. 13. Elige Archivo > Nuevo. 14. En la nueva ventana, haz clic en el botón Pegar. 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.6.6 Mezclar pistas de audioCon Audacity se puede componer una grabación de audio mezclando varios sonidos originales.Cada uno de éstos ocupará una pista independiente de la grabación y al pulsar el botón playse reproducirán todos simultáneamente. 1. Descarga y descomprime el archivo poema.zip para guardar el archivo poema.ogg y el archivo fondo_clasico.ogg en una carpeta de tu equipo.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 397Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. A continuación selecciona la herramienta de Traslado en tiempo. 8. Pulsa y arrastra la onda seleccionada en la pista poema para centrarla respecto a la pista superior que contiene la música de fondo. 9. Vuelve a seleccionar la herramienta Seleccionar y efectúa un clic en cualquier espacio en blanco para deseleccionar la onda de poema. 10. Clic en el botón Reproducir para escuchar el resultado de la composición. 11. Después de escuchar el resultado quizás estimes necesario reducir el volumen de la música de fondo cuando entra la locución. Para ello selecciona el fragmento central de la pista con el fondo_clasical.ogg. 12. A continuación selecciona Efecto > Amplificar 13. En el cuadro de diálogo Amplificar arrastra el deslizador de amplificación hacia la izquierda para definir un valor negativo. Por ejemplo un valor entre -7 y -9. 14. Clic en el botón Aceptar.
    • Audio ::: Montajes de audio 398Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 15. Clic en el botón Reproducir para escuchar el resultado final. 16. Para crear el archivo MP3 con la composición elige Archivo > Exportar 17. Se muestra el cuadro de diálogo Editar metadatos… Clic en Aceptar. 18. 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: mezcla. No es necesario añadir la extensión *.mp3 porque Audacity lo hace de forma automática. 19. En la lista desplegable Tipo selecciona la entrada Archivos MP3. 20. Si deseas configurar la calidad del archivo mp3 resultante pulsa en el botón Opciones y defínela en la lista Quality. En este caso dejaremos la opción por defecto. Pulsa en el botón Aceptar. 21. Si deseas guardar el proyecto de audio para continuar editándolo más adelante selecciona Archivo > Guardar proyecto como … El proyecto de Audacity se guarda como un archivo de extensión *.aup.
    • Audio ::: Aplicar efectos 399Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Aplicar efectos
    • Audio ::: Aplicar efectos 400Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoAudacity proporciona múltiples efectos que se pueden aplicar a un fragmento de audiodigital: amplificar su volumen, modificar su velocidad o ritmo, ecualizarlo, eliminar el ruido,etc. 1. Descarga y descomprime el archivo para guardar el archivo aventura.mp3. 2. Inicia Audacity. 3. Selecciona Archivo > Abrir 4. En el cuadro de diálogo Selecciona uno o más archivos de audio … navega hasta localizar el archivo aventura.mp3 que hemos extraído anteriormente. 5. Clic sobre este archivo de la lista y pulsa en el botón Abrir. 6. Antes de aplicar un efecto es necesario seleccionar un tramo de pista de audio. Elige la herramienta Selección. 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:  Amplificar. Aumenta o disminuye el volumen del audio seleccionado. Introduce en la casilla Amplificación (dB) el valor en decibelios que se aumentará el volumen o bien puedes arrastrar el deslizador inferior. Si activas la casilla Permitir recorte no podrás amplificar por encima del rango de frecuencias de la onda. Esto evitará la distorsión.  Realce de graves. Aumenta el volumen de las frecuencias bajas. Indica el límite de frecuencias bajas que se seleccionarán y los decibelios que se incrementarán de volumen.
    • Audio ::: Aplicar efectos 401Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Cambiar ritmo. Al arrastrar el deslizador a la derecha o introducir un porcentaje positivo en la casilla Cambio percentual se incrementará la velocidad del tramo seleccionado no variando el tono pero disminuyendo la duración. Si se desplaza a la izquierda o se introduce un % negativo se ralentizará incrementándose la duración.  Cambiar tono. Permite cambiar el tono del fragmento de sonido seleccionado manteniéndose el tiempo constante. Este efecto se suele aplicar mejor a grabaciones vocales que no tienen música de fondo. Se puede especificar el incremento/decremento de tono de cuatro formas distintas y alternativas: Tono musical, Semitonos, Frecuencia o bien Cambio porcentual.
    • Audio ::: Aplicar efectos 402Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Cambiar velocidad. Modifica la velocidad del audio y con ello cambia el tiempo y el tono. Arrastra a derecha o izquierda el deslizador del cambio porcentual para aumentar o disminuir la velocidad. Este efecto se suele aplicar a las locuciones para distorsionar la voz.  Compresor de rango dinámico. Comprime el rango dinámico de la selección de tal forma que las partes más fuertes se suavizan manteniendo el volumen de las partes más suaves. Opcionalmente se puede aplicar Ganancia para conseguir un volumen final más alto.
    • Audio ::: Aplicar efectos 403Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Eco. Añade el efecto eco a una selección. Define el Tiempo de retraso en segundos entre la reproducción del sonido y su eco correspondiente. Se recomienda utilizar un Factor de decaimiento próximo a 0,50000. Este efecto no incrementa la longitud de la selección, por lo que conviene añadir previamente silencio al final de la pista mediante Generar > Silencio.  Ecualización. Ajusta o reduce las frecuencias extrañas del fragmento elegido. Puedes seleccionar una curva de ecualización predefinida o dibujar tu propia curva.  Desvanecer progresivamente/Aparecer progresivamente: Se aplican directamente sobre una selección inicial o final realizada en la grabación para definir una aparición o desaparición progresiva de la música.
    • Audio ::: Aplicar efectos 404Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Eliminación de ruido. Facilita la eliminación de ruido de una grabación. Este efecto se suele aplicar en dos pasos: i. Selecciona un pequeño fragmento de silencio donde aparece el ruido. A continuación elige Efecto > Eliminación de ruido y pulsa el botón Obtener perfil de ruido. De esta forma Audacity sabrá qué debe filtrar. ii. Seleccionar todo el audio a filtrar, arrastra el deslizador para indicar el % de ruido que deseas eliminar y pulsa en el botón Eliminar ruido. Para terminar haz clic en el botón Cerrar.  Invertir. Voltea verticalmente la onda de sonido, invirtiendo su fase.  Normalizado. Normalizar un audio consiste en corregir su DC offset, es decir, ajustar el desplazamiento vertical de la onda y/o fijar la amplitud para que tenga un valor máximo fijo, por ejemplo, -3 dB. Suele ser útil normalizar una pista de audio antes de mezclarla con otras.
    • Audio ::: Aplicar efectos 405Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Repetir. Repite la selección un determinado número de veces. Esta operación es rápida y gestiona adecuadamente el espacio intermedio por lo que se utiliza mucho para crear bucles pseudos-infinitos.  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. 10. Elige Archivo > Exportar. 11. Se muestra el cuadro de diálogo Editar metadatos … Clic en Aceptar. 12. 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: aventura_efecto. No es necesario añadir la extensión *.mp3 porque Audacity lo hace de forma automática. 13. En la lista desplegable Tipo selecciona la entrada Archivos MP3. 14. Si deseas configurar la calidad del archivo mp3 resultante pulsa en el botón Opciones y defínela en la lista Calidad. Pulsa en el botón Aceptar.
    • Audio ::: Extracción de audio de un CD 406Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Extracción de audio de un CD
    • Audio ::: Extracción de audio de un CD 407Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado8.1 CDex en Windows8.1.1 ¿Qué es CDex?CDEX (http://cdexos.sourceforge.net/) es un programa gratuito para Windows que nos vapermitir extraer directamente un fragmento musical de un CD de audio o bien de una fuentede sonido conectada al ordenador para guardarlo en un archivo en formato WAV o MP3.8.1.2 Instalación de CDexDescarga y ejecuta el instalador de CDex para Windows: cdex_170b2_enu.exe. El programase instalará y se creará un icono de acceso directo en el escritorio.Otra posibilidad es descargar y descomprimir en una carpeta de tu disco duro o pendrive laversión portable para Windows: cdex_170b2_enu.zip. Esta versión no necesita instalación.En el sitio web oficial del proyecto CDex podrás encontrar la versión más reciente o que seadapta a tu sistema: http://cdexos.sourceforge.net/8.1.3 Extracción de audio de un CD con CDex 1. Introduce un CD de música en la unidad de CD/DVD. 2. Inicia CDex. Para configurar el idioma español selecciona Options > Languages > Spanish. 3. Si dispones de varias unidades, desde CDex selecciona aquella donde has insertado el disco. 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 408Multimedia 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. Extraer pista(s) de CD a archivo(s) WAV. Si pulsas en este botón se creará un archivo WAV por cada pista elegida del CD. Extraer pista(s) de CD a formato comprimido. Si pulsas en este botón se creará un archivo MP3 por cada pista elegida del CD. Conviene introducir en las casillas Artísta, Género, Título y Año para crear adecuadamente las etiquetas ID del MP3 final. Extraer fragmento de CD. Al pulsar este botón se muestra un cuadro de diálogo donde se puede elegir la posición inicial y final del fragmento que se extraerá de la pista. En la casilla se puede introducir el nombre del archivo final. En Formato de salida elige WAV o bien Codificado (MP3). Pulsa sobre el botón Aceptar para iniciar la extracción.
    • Audio ::: Extracción de audio de un CD 409Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. ¿Dónde se guardan los archivos de audio resultantes? CDex suele guardarlo en la carpeta My Music dentro de la carpeta donde se encuentra el programa. Se puede modificar la carpeta destino utilizada por CDex mediante Opciones > Configuración de CDex. En la solapa Nombre de archivos, pulsa en el botón “…” situado al lado de la casilla Pistas extraídas para navegar por el disco duro y elegir la ubicación de la nueva carpeta. Para guardar los cambios pulsa en el botón Aceptar.
    • Audio ::: Extracción de audio de un CD 410Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado8.2 Sound Juicer en Ubuntu8.2.1 ¿Qué es Sound Juicer?Sound Juicer es un programa que suele venir instalado por defecto en Ubuntu y que seutiliza para reproducir las pistas de audio de un CD y para extraerlas a archivos OGG y MP3.8.2.2 Instalación de Sound JuicerPara instalar Sound Juicer en tu equipo Ubuntu: 1. Desde el escritorio selecciona Aplicaciones > Centro de Software de Ubuntu. 2. En la casilla de búsqueda introduce Sound Juicer. 3. Selecciona el ítem Extractor de sonido de CD y pulsa en el botón Instalar. 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 esnecesario instalar previamente el paquete gstreamer0.10-plugins-ugly-multiverse. Para ellosigue estos pasos: 1. Desde el escritorio selecciona Sistema > Administración > Gestor de paquetes Synaptic 2. Clic en el botón Buscar e introduce como término de búsqueda: gstreamer y pulsa en el botón Buscar. 3. Haz doble clic sobre la casilla de verificación izquierda correspondiente a la entrada gstreamer0.10-plugins-ugly-multiverse. 4. A continuación haz clic en el botón Aplicar.8.2.3 Extracción de audio de un CD con Sound JuicerPara convertir una pista de audio de un CD a un archivo MP3: 1. Introduce el CD de audio en el ordenador. 2. Si Sound Juicer no arranca por defecto puedes abrirlo desde el escritorio mediante Aplicaciones > Sonido y Vídeo > Extractor de música de CDs Sound Juicer 3. Desde Sound juicer selecciona Editar > Preferencias.
    • Audio ::: Extracción de audio de un CD 411Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 8. Una vez concluido el proceso de conversión se mostrará un mensaje indicando que ha finalizado con éxito. Si deseas abrir la carpeta destino haz clic en el botón Abrir. Para cerrar este mensaje pulsa en el botón Cerrar.
    • Audio ::: Extracción de audio de un CD 412Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 413Multimedia 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 414Multimedia 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 415Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del ProfesoradoEn este apartado se explica el procedimiento para integrar un audio en un artículo de tu blogutilizando el reproductor PixelOut 2 (http://www.1pixelout.net/code/audio-player-wordpress-plugin/) . Se trata de un objeto diseñado con tecnología Adobe Flash que se puedeañadir fácilmente a un artículo para que el lector al interactuar con él pueda escuchar unaudio almacenado en un archivo MP3 externo.9.1.1 Subida de archivos a Google Sites 1. Descarga y descomprime el archivo pixelout.zip en una carpeta de tu equipo. Como resultado obtendrás la carpeta pixelout dentro de la cual se encuentra un archivo de texto brahms.txt, una imagen brahms.jpg, un audio MP3 danzahungara.mp3 y el reproductor de PixelOut player.swf 2. Accede a la web de Blogger: http://www.blogger.com 3. Introduce las credenciales de tu cuenta Google y pulsa en el botón Acceder. 4. Clic en el enlace Mi cuenta que aparece en la esquina superior derecha de Blogger. 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. 8. Elige como plantilla la opción Archivador.
    • Audio ::: Integración de audio en Blogger 416Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. En Nombre introduce audio. Observa que la carpeta contenedora de archivos se creará en la ruta: /site/<nombre_usuario>/audio. 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 417Multimedia 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.9.1.2 Generar el código para incrustarEn este paso vamos a utilizar un asistente para generar el código HTML necesario paraincrustar (embed) el reproductor en nuestro artículo del blog. 1. Descarga y descomprime el archivo configuradorPixelOut.zip. Obtendrás la carpeta configuradorPixelOut. Utiliza el explorador de archivos para entrar dentro de esta carpeta y hacer doble clic sobre el archivo index.html. Los archivos de este asistente se utilizarán en tu equipo y no es necesario subirlos a Google Sites.
    • Audio ::: Integración de audio en Blogger 418Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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. 3. Regresa a la página de Google Sites y haz clic derecho sobre el enlace correspondiente al reproductor player.swf y elige la opción Copiar la ruta del enlace. 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 419Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Sitúate en el Generador de código de PixelOut y haz clic derecho sobre el cuadro de texto URL del audio MP3 y elige la opción Pegar. Esta acción pegará la ruta absoluta al audio danzahungara.mp3 que hemos alojado en nuestra cuenta de Google Sites. 7. En las URLs de reproductor y MP3 elimina la coletilla ?attdirects=0. Aunque funcionaría igual conviene simplificar el código todo lo posible. 8. Utilizando el interfaz del Generador de código de Pixelout también puedes definir el resto de parámetros de funcionamiento y visualización que tendrá el reproductor. Más adelante se explican con más detalle. En este caso se propone aceptar los valores por defecto. Haz clic en el botón Crear código. 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.9.1.3 Crear el artículo en Blogger 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. 6. Utiliza el explorador de archivos para abrir (doble clic) el archivo de texto brahms.txt. Se abrirá el Bloc de Notas mostrando su contenido. 7. 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. 8. Regresa al navegador web que muestra el editor de Nueva entrada de Blogger. Teclea el título: Brahms. 9. 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.
    • Audio ::: Integración de audio en Blogger 420Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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 421Multimedia 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. 19. Para terminar pulsa en el botón PUBLICAR ENTRADA. 20. A continuación haz clic en el enlace Ver blog para ver el resultado final
    • Audio ::: Integración de audio en Blogger 422Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado9.1.4 Los parámetros de configuración dePixelOutEl reproductor de PixelOut admite personalizar su interfaz definiendo distintos valores en lasvariables que aparecen en el parámetro flashvars. Fíjate que esta cadena utiliza el formatovariable=valor&; donde “&amp” es la notación HTML del signo “&”.  autostart=yes . El reproductor se abrirá automáticamente e iniciará la reproducción de la pista. El valor por defecto es no.  loop=yes . La pista se reproducirá indefinidamente. El valor por defecto es no.  bg=0xHHHHHH. Background color. Color de fondo expresado en valor hexadecimal como por ejemplo: 0xFFFFFF = blanco.  leftbg=0xHHHHHH Left background color. Color fondo izquierdo.  rightbg=0xHHHHHH Right background color Color fondo derecho.  rightbghover=0xHHHHHH Right background color (hover) Color fondo derecho al situar el ratón sobre él.  lefticon=0xHHHHHH Left icon color Color del icono izquierdo.  righticon=0xHHHHHH Right icon color. Color del icono derecho.
    • Audio ::: Integración de audio en Blogger 423Multimedia 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