SlideShare una empresa de Scribd logo
Manual multimedia y web 2.0
Índice Temático                                                                                                2
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Multimedia y Web 2.0

Presentación ......................................................................... 11

Módulo 1. Blogs ..................................................................... 13
1. ¿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 .......................................................................... 18

2. 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........................................................................... 25

3. 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 ............................................... 47

4. 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                                                                                                3
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

5. 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 ................................................................... 95

6. 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 .................................... 136

7. 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 ................................................... 149

8. 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 .................................................................. 159

9. 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                                                                                                 4
Multimedia 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 ....................................................................... 168

10. 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 ......................................................... 181

11. 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 ........................................... 219

12. 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 ..................................... 228

Módulo 2. Imagen.................................................................. 233
1. 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                                                                                                 5
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

2. 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 ...................................................................... 246

3. Optimización de imágenes ........................................................................ 249
      3.1 Conversión de formatos .................................................................. 250
      3.2 Reducir la paleta de colores ............................................................. 257

4. 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 ................................................................... 268

5. Montaje de imágenes .............................................................................. 270

6. Efectos especiales ................................................................................. 275
      6.1 Filtros ....................................................................................... 276
      6.2 Textos con efectos especiales .......................................................... 278

7. 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 .......................................................... 286

8. 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 .................................... 303


9. 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 ................................... 322

10. 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                                                                                                 6
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

11. 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 ................................................. 340

12. 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 .............................................. 348


Módulo 3. Audio ................................................................... 350
1. 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 ..................................................... 354

2. 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 ................................................................. 358

3. 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 ....................................................... 368

4. 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 ........................................................... 377

5. 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 .................................................................. 387

6. 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 ................................................................... 396

7. Aplicar efectos ..................................................................................... 399

8. Extracción de audio de un CD ................................................................... 406
      8.1 CDex en Windows .......................................................................... 407
Índice Temático                                                                                                 7
Multimedia 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 ........................... 410

9. 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 ............................................. 432

10. 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 .................. 443

Módulo 4. Vídeo ................................................................... 446
1. 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 ........................................................ 452

2. 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 ................................................ 456

3. 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..................................................... 463

4. 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                                                                                                8
Multimedia 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 ...................................................... 478

5. 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 .......................................... 503

6. 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........................................................ 514

7. 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 ............................................. 527

8. 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                                                                                              9
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

9. 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 ............ 573
10. 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 ........................................................ 578

Anexos
A1. Canales de suscripción .......................................................................... 580
      1.1 ¿Qué es un canal de suscripción? ........................................................ 581
      1.2 Suscripción con el navegador Firefox 3+ ............................................... 581
      1.3 Suscripción con el navegador IExplorer 7+ ........................................... 584
      1.4 Enlaces de suscripción a tu blog Blogger .............................................. 587
      1.5 Enlaces de suscripción a tu blog Wordpress ........................................... 588
      1.6 Añadir un feed externo a tu blog ....................................................... 589
             1.6.1 Buscar un canal de feeds ...................................................... 589
             1.6.2 Añadir un canal feed externo a Blogger ..................................... 589
             1.6.3 Añadir un canal feed externo a Wordpress ................................. 591

A2. 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                                                                                              10
Multimedia 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 .............................................. 612


Glosario de términos ........................................................................... 614

Bibliografía sobre Web 2.0 ................................................................... 634

Direcciones web ................................................................................. 638
Presentación                                                                                11
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



Presentación
En los últimos años hemos asistido a un considerable auge de los espacios web en el entorno
educativo. Hasta tal punto que hay quienes manifiestan que un centro educativo o persona no
existe si no es visible en Internet. Los sitios web no sólo se corresponden con entidades
dpúblicas o privadas sino también con páginas personales de carácter profesional y otras
centradas en el ocio y tiempo libre. Por otra parte la producción de recursos multimedia se ha
ido orientando cada vez más hacia la web en detrimento del soporte CD-ROM o DVD por
razones obvias: coste, inmediatez, facilidad de actualización, difusión, etc.

En la publicación de contenidos en Internet la opción más clásica ha sido la edición de páginas
web en el equipo local utilizando un editor visual HTML para luego publicarlas vía FTP en un
servidor. Sin embargo esta práctica está cayendo en desuso a favor del empleo de un sistema
de gestión de contenidos (CMS=Content Management System) que permite fácilmente la
edición en línea. Estas soluciones se imponen porque descentralizan la gestión y facilitan el
trabajo colaborativo. Los CMS de uso más extendido son: Joomla/Drupal (sitio web
institucional 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 resultar
interesante y útil. Su propósito es la formación en los procedimientos básicos para la creación
de contenidos multimedia adaptados a la web. Se trata de preparar y optimizar recursos de
tipo texto, imagen, audio o vídeo con una adecuada relación peso/calidad, algo importante
en Internet, y que pueden publicarse en una página HTML, un gestor de contenidos CMS, una
red social o bien servir de base para construir objetos o contenidos más complejos utilizando
herramientas de edición general (powerpoint, impress, flash, etc) o herramientas de autor
para 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 creativo
completo. En primer lugar se plantea la obtención de los recursos multimedia originales
(léase fotos o vídeos de la cámara digital, pistas de audio de un CD o grabación de una
locución, etc). A continuación se propone el tratamiento para darles un formato más
adecuado. Estos materiales se pueden publicar en un servicio Web 2.0 para finalmente
integrarlos en una entrada o gadget del blog.

No es propósito del curso alcanzar un dominio muy elevado de todos y cada uno de los
programas que se proponen. Sería necesario un curso específico para cada uno. En su defecto,
siguiendo un enfoque práctico, se plantea una necesidad y a continuación se proporcionarán
unos recursos de partida, una o varias aplicaciones de software y una secuencia detallada de
pasos para obtener el contenido multimedia final. Por otra parte se ha pretendido que cada
apartado sea independiente del resto para conseguir cierta modularidad.

El curso se organiza en 4 módulos:

       Blogs
       Imagen
       Audio
       Video

En el módulo Blogs se propone Blogger o Wordpress como servicio en el cual crear y
gestionar un blog orientado a la publicación de contenidos en Internet. Se detallan los
procedimientos 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 o
funcionalidades adicionales en la idea de dotarlo de cierta singularidad. La publicación de
archivos 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 colaborativa
de documentos de texto, presentaciones, hojas de cálculo y formularios que también se
pueden publicar en un blog. Por su facilidad y prestaciones adicionales, el blog es el
Presentación                                                                               12
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


protagonista principal de este curso. Por este motivo toda la producción se orienta a la
publicación final en este medio.

En el apartado de Imagen se utilizará el programa GIMP. Se plantean operaciones básicas
como convertir formatos de archivos, reducir la paleta de colores, modificar las dimensiones
de la imagen o del lienzo, etc. También se explican procedimientos habituales tales como
componer imágenes, aplicar filtros y el tratamiento de imágenes por lotes. Se proponen
distintos servicios Web 2.0 como Flickr, Picasa, Slide.com, SlideShare.net, etc donde es
posible subir fotografías y presentaciones susceptibles de publicación posterior en nuestro
blog.

En lo relativo al Audio se sugiere el empleo de Audacity para reproducir, grabar desde
distintos medios y convertir a formato mp3 y ogg. Otra posibilidad es extraer el audio de una
pista de CD. La edición de audio permite copiar, pegar, mezclar, aplicar efectos, etc para
conseguir un audio más elaborado. Una vez que se dispone de una o varias pistas de audio se
utilizarán distintas soluciones para integrar su audición en una entrada del blog. Otra opción
es subir el audio a servicios Web 2.0 como GoEar o DivShare e incrustar posteriormente el
reproductor que proporcionan.

En el módulo sobre Vídeo se plantean los principales conceptos relacionados con el vídeo
digital para luego proponer la visualización de vídeos con el reproductor universal: VLC Media
Player. Se proporciona información de cómo utilizar extensiones de Mozilla Firefox (Video
DownloadHelper) para descargar al disco duro del equipo archivos de vídeo desde Internet.
También el procedimiento para conocer los detalles técnicos de un archivo multimedia con
Media Info y convertir a otros formatos con WinFF. Otra opción es extraer el vídeo de un DVD
con soluciones como AutoGordian. Se ejemplifica cómo mostrar vídeos dentro del artículo de
un blog. Los repositorios de vídeos Web 2.0 como Youtube, Revver, Metacafé, Vimeo, etc
ofrecen una excelente alternativa para el alojamiento y difusión en streaming de vídeos que
posteriormente se pueden integrar en Blogger.

Todas las aplicaciones de software que se proponen son de uso gratuito y de libre
distribución. En muchos casos se ofrecen versiones portables de los programas para facilitar
su uso en una memoria USB sin necesidad de instalación previa en el ordenador. El curso se
puede seguir con un equipo Windows XP/Vista/7 o bien Ubuntu Linux 10.

El alumno/a de este curso con interés en el diseño de materiales digitales multimedia puede
encontrar aquí recetas útiles para resolver las necesidades más básicas relacionadas con la
elaboración y adaptación al medio web de recursos de texto, imagen, audio y vídeo.
Módulo 1. Blogs
Blogs ::: ¿Qué es la Web 2.0?                                         14
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




          1. ¿Qué es la Web 2.0?
Blogs ::: ¿Qué es la Web 2.0?                                                                  15
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



1.1 Concepto de Web 2.0

El término Web 2.0 fue acuñado por el americano Dale Dougherty de la editorial O'Reilly
Media durante el desarrollo de una conferencia en el año 2004. El término surgió para
referirse a nuevos sitios web que se diferenciaban de los sitios web más tradicionales
englobados bajo la denominación Web 1.0. La característica diferencial es la participación
colaborativa de los usuarios. Un ejemplo de sitio web 1.0 sería la Enciclopedia Británica
donde los usuarios pueden consultar en línea los contenidos elaborados por un equipo de
expertos. Como alternativa web 2.0 se encuentra la Wikipedia en la cual los usuarios que lo
deseen pueden participar en la construcción de sus artículos. Poco tiempo después, en el año
2005, Tim O'Reilly definió y ejemplificó el concepto de Web 2.0 utilizando el mapa
conceptual elaborado por Markus Angermeier.




La Web 2.0 o Web social es una “denominación de origen” que se refiere a una segunda
generación en la historia de los sitios web. Su denominador común es que están basados en el
modelo de una comunidad de usuarios. Abarca una amplia variedad de redes sociales, blogs,
wikis y servicios multimedia interconectados cuyo propósito es el intercambio ágil de
información entre los usuarios y la colaboración en la producción de contenidos. Todos estos
sitios utilizan la inteligencia colectiva para proporcionar servicios interactivos en la red donde
el usuario tiene control para publicar sus datos y compartirlos con los demás.

Se puede entender como 2.0 "todas aquellas utilidades y servicios de Internet que se
sustentan en una base de datos, la cual puede ser modificada por los usuarios del servicio, ya
sea en su contenido (añadiendo, cambiando o borrando información o asociando datos a la
información existente), pues bien en la forma de presentarlos, o en contenido y forma
simultáneamente."- (Ribes, 2007)
Blogs ::: ¿Qué es la Web 2.0?                                                                16
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



1.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?                                                               17
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



1.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?                                                                18
Multimedia 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 web
Como se ha indicado con anterioridad para acceder a la web 2.0
sólo necesitamos disponer de una conexión a Internet y de un
navegador 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 Firefox
porque 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?                                                                19
Multimedia 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 o
que se adapta a tu sistema: http://www.mozilla-europe.org/es/firefox/. Descarga e instala
este programa en tu equipo. Otra posibilidad es utilizar la versión portable para Windows que
puedes conseguir en: http://portableapps.com/apps/internet/firefox_portable
Blogs ::: Iniciación a los blogs                                      20
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




        2. Iniciación a los blogs
Blogs ::: Iniciación a los blogs                                                          21
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


2.1 ¿Qué es un blog?
Un blog es un sitio web que se actualiza periódicamente y que ofrece la lectura de
información de uno o varios autores sobre temas de interés. La unidad fundamental de
información de un blog es el artículo, también llamado “post” o “entrada”. Estos artículos se
muestran siguiendo una ordenación cronológica inversa, es decir, se mostrará primero el
artículo más reciente. En consecuencia podemos definir un blog como una recopilación de
artículos ordenados cronológicamente.

Para el autor/autores de un blog, se trata de un sistema que facilita la publicación de
contenidos multimedia en Internet ofreciendo en todo momento el control y libertad para
editar y modificar la información publicada.

En cada artículo los lectores pueden escribir sus comentarios y el autor darles respuesta. De
esta forma se fomenta un diálogo que autores y lectores pueden compartir. Sin embargo esta
opción depende de la moderación del autor o autores del blog y por supuesto de que los
lectores decidan intervenir libremente con sus aportaciones.

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                                                            22
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


2.2 Anatomía de un blog
Un 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                                           Backend

La 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                                                           23
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



En 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 comentarios
asociados que se sitúan al final de su contenido. El administrador del blog puede permitir o
denegar el envío de comentarios a un artículo en concreto o a todos los artículos del blog. En
caso favorable es muy recomendable activar la moderación de comentarios para que el
administrador los supervise antes de que aparezcan publicados. Cada artículo de un blog
dispone de una dirección individual y única (permalink o enlace permanente) que se puede
utilizar para situarse en él directamente.
Blogs ::: Iniciación a los blogs                                                            24
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


2.3 Características de los blogs
Las 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 blogs
Los blogs tienen distintas variantes en función de su funcionamiento, tipo de contenido
predominante, 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                                                            25
Multimedia 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 blogs
En 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 sobre
cuál elegir entre los dos líderes del sector: Blogger o Wordpress. Ambos tienen ventajas e
inconvenientes resultando Wordpress una opción algo más compleja.

Existen también medios de comunicación, como por ejemplo el diario “El País”, que ofrecen
un servicio gratuito de Blogs: http://blogs.elpais.com/

Nota importante:

A partir de este momento el alumno/a del curso podrá elegir entre seguir el curso con un blog
de Blogger o bien con un blog de Wordpress
Blogs ::: Mi primer artículo                                          26
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                  3. Mi primer artículo
Blogs ::: Mi primer artículo                                          27
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




             3.1 Mi primer artículo
                        en Blogger
Blogs ::: Mi primer artículo                                                                28
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

El propósito de este actividad es diseñar tu primera entrada en un blog de Blogger. El tema
elegido es una breve pincelada del poeta Federico García Lorca. En este documento se
utilizarán: título, texto, imagen y un enlace a una página externa.



3.1.1 Crear un blog en Blogger
En este apartado se explican los pasos para crear un blog en el servicio Blogger. Como paso
previo es necesario disponer de una cuenta Google. Es muy interesante tener esta cuenta
porque asociada a ella se disponen de interesantes aplicaciones. Algunas de ellos se tratarán
en este curso.

    1. Abre el navegador web y visita la URL de inicio de Blogger:
       https://www.blogger.com/start?hl=es




Si 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                                                             29
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Si 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 contra
Blogger nos encontraremos en el paso 2 de creación de nuestro blog.
Blogs ::: Mi primer artículo                                                                30
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    5. En el paso 2 “Asignar un nombre al blog” introduce los siguientes datos del nuevo
       blog:
            Título del blog. Ejemplo: El blog de …
            Dirección del blog (URL). Será la dirección que tendrá nuestro blog en
               Blogger. Esta URL es del tipo: http://<miblog>.blogspot.com Conviene elegir
               una dirección fácil de recordar. Antes de continuar conviene pulsar en el
               enlace Comprobar disponibilidad para verificar si esa dirección está libre. Si
               no se te ocurre una dirección puedes utilizar tu nombre de usuario en Google:
               http://<TuUsuarioGoogle>.blogspot.com




    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                                                                31
Multimedia 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                                                                32
Multimedia 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                                                               33
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón GUARDAR
       AHORA que aparece por debajo del editor de artículos. Esta acción almacenará los
       cambios introducidos en el servidor remoto.




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                                                                34
Multimedia 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ínculo
Un enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web y
que 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 nueva
pá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                                                              35
Multimedia 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 entrada
En 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                                                                 36
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




3.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 entrada

Al pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y al
final aparecerán los comentarios asociados. Si en ese momento te fijas en la barra de
dirección del navegador web, podrás comprobar que ese artículo dispone de una URL que
permite 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                             37
Multimedia 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                                                      38
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

El propósito de este actividad es diseñar tu primera entrada en un blog de Wordpress. El tema
elegido es una breve pincelada del poeta Federico García Lorca. En este documento se
utilizarán: título, texto, imagen y un enlace a una página externa.



3.2.1 Crear un blog en Wordpress
En este apartado se explican los pasos para crear un blog en el servicio Wordpress. Como paso
previo 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                                                39
Multimedia 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                                                   40
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


3.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                                                   41
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Regresa al navegador web que muestra el editor de Agregar una nueva entrada de
       Wordpress. Teclea el título: Federico García Lorca.
    5. Haz clic dentro del editor de artículos y a continuación haz clic derecho para elegir la
       opción Pegar. Esta acción pegará el texto copiado del archivo de texto anterior
       evitando tener que teclearlo.




    6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón Guardar
       borrador. Esta acción almacenará los cambios introducidos en el servidor remoto.
Blogs ::: Mi primer artículo en Wordpress                                                 42
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




3.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                                                43
Multimedia 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                                                   44
Multimedia 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ínculo
Un enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web y
que 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 nueva
pá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                                                45
Multimedia 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 entrada
En la página donde se edita una entrada se pueden configurar distintas opciones de este
artí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                                                  46
Multimedia 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                                                      47
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




3.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 entrada

Al pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y al
final aparecerán los comentarios asociados. Si en ese momento te fijas en la barra de
dirección del navegador web, podrás comprobar que ese artículo dispone de una URL que
permite 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                                                48
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Cuando se está editando una entrada, en la parte superior del editor, se muestra este enlace
permanente. Si pulsas en el botón Editar puedes cambiar la última parte de esta dirección.
Otra posibilidad es pulsar en el botón conseguir URL corta que proporciona una dirección más
corta de acceso directo a este artículo.
Blogs ::: Gestión de artículos en Blogger                             49
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




          4. Gestión de artículos
Blogs ::: Gestión de artículos en Blogger                             50
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     4.1 Gestión de artículos
                  en Blogger
Blogs ::: Gestión de artículos en Blogger                                                   51
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.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                                                    52
Multimedia 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ón
En 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ículo
Para 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                                                   53
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Nota:
        Si el artículo contiene alguna imagen también se solicita confirmación para eliminarla
        o bien conservarla. Recuerda que las imágenes subidas se guardan en la cuenta de
        Picasa asociada al usuario Google con que se ha creado el blog.



4.4 Publicar y despublicar
Una vez que se ha publicado una entrada se puede volver a despublicar para que no sea
visible por los lectores del blog. El procedimiento para volver a convertir en borrador una
entrada 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                                                  54
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.5 Asignar etiquetas
Las etiquetas son palabras clave que permiten organizar y clasificar los artículos por temas o
autores. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectores
pueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiqueta
correspondiente. Otra posibilidad es asignar su propia etiqueta a cada autor del blog para
poder 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                                                 55
Multimedia 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ónico
En 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 embargo
se 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                                                 56
Multimedia 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                                                  57
Multimedia 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                                                 58
Multimedia 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                                                 59
Multimedia 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                                                  60
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.7 Exportar e importar entradas
Los artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crear
copias 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. La
exportación/importación de artículos produce como resultado un archivo XML que contiene
información de las entradas y los comentarios. No incluye los 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 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                                               61
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML
       guardado en el equipo.

Importación
    1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados,
       haz clic en la pestaña Configuración > Básico. Clic en el enlace Importar blog.




    2. Desde la página Importar un blog haz clic en el botón Examinar para localizar el
       archivo blog-dd-mm-aaaa-xml que hemos guardado en nuestro equipo como resultado
       de un proceso de exportación anterior.
Blogs ::: Gestión de artículos en Blogger                                              62
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    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                           63
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




          4. Gestión de artículos
                   en Wordpress
Blogs ::: Gestión de artículos en Wordpress                                                 64
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.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                                                  65
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    2. Si has seguido los dos primeros métodos accederás al listado de artículos del blog. Haz
       clic en el enlace Editar de la entrada correspondiente para acceder a su edición.
       También puedes hacer un simple clic sobre el enlace situado en el titulo de la
       Entrada.




    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ón
En 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                                                 66
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2.3 Eliminar un artículo
Para eliminar un artículo desde el panel del listado de entradas existen varios procedimientos
alternativos:

    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                                                 67
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2.4 Publicar y despublicar
Una vez que se ha publicado una entrada se puede volver a despublicar para que no sea
visible por los lectores del blog. El procedimiento para volver a convertir en borrador una
entrada 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 etiquetas
Las etiquetas son palabras clave que permiten organizar y clasificar los artículos por palabras
clave. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectores
pueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiqueta
correspondiente.

    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                                             68
Multimedia 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                                              69
Multimedia 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 correo
electrónico
En 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 embargo
se 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                                               70
Multimedia 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 se
propone utilizar el webmail de GMail (http://www.gmail.com) y esto supone que debes tener
cuenta en GMail. No obstante se puede hacer desde cualquier cuenta de correo electrónico
tanto utilizando webmail como un programa cliente de correo como Outlook o similar.

    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                                               71
Multimedia 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                                               72
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    13. Para insertar una imagen en el artículo final es necesario enviarla como adjunto del
        mensaje de correo electrónico. Clic en el enlace Adjuntar un archivo para localizar y
        abrir el archivo de imagen lorca.jpg.




    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                                                   73
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Algunas 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 y
separada del texto. Si se envían varias imágenes adjuntas, éstas se mostrarán como una
galería. Si envías como adjunto un archivo de audio MP3, éste se mostrará usando el
reproductor de audio de Wordpress. Si envías otros archivos de documentos como PDF, DOC,
etc entonces se mostrarán como enlaces en el artículo.

Códigos especiales de publicación. Se pueden incluir en el mensaje de correo electrónico
códigos especiales que configuran distintos aspectos del artículo publicado. Se pueden
escribir 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 entradas
Los artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crear
copias 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. La
exportación/importación de artículos produce como resultado un archivo XML que contiene
información de las entradas, comentarios, categorías, etiquetas, etc. Este fichero NO incluye
los 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                                             74
Multimedia 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                                             75
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML
       guardado en el equipo.

Importación
    1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados,
       haz clic en la pestaña Herramientas > Importar.




    2. Desde la página Importar haz clic en el sistema desde el que importarás. Es posible
       importar las entradas a partir de un XML de Blogger o de Wordpress. En este caso haz
       clic en Wordpress.




    3. Desde la página Importar desde Wordpress haz clic en el botón Examinar para
       localizar el archivo wordpress.aaaa-mm-dd.xml que hemos guardado en nuestro
       equipo como resultado de un proceso de exportación anterior.
Blogs ::: Gestión de artículos en Wordpress                                              76
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    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                            77
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




      5. El editor de entradas
Blogs ::: El editor de entradas en Blogger                            78
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                         5.1 El editor de
                     entradas en Blogger
Blogs ::: El editor de entradas en Blogger                                                79
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.1.1 Formato de texto
Blogger ofrece un editor visual que proporciona ciertas prestaciones para la edición en lí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 texto
con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el
artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma
durante la edición en línea siempre se dispondrá de una copia de seguridad en local.

    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                                                  80
Multimedia 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                                                  81
Multimedia 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                                                      82
Multimedia 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                                                 83
Multimedia 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                                                 84
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    25. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
        primera referencia: Es un enlace a Google que ya incluye el término de búsqueda:
        http://es.wikipedia.org/wiki/Einstein
    26. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
        copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
    27. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
        A continuación en la barra del editor pulsa en el botón Enlace.




    28. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar.




    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                                                    85
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.1.2 Corrector ortográfico
El 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 HTML
El editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita la
inclusió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                                               86
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Nota:
        Más adelante se explicará cómo utilizar la edición HTML para insertar en una entrada
        el código embed que integra recursos multimedia alojados en otros servicios.
Blogs ::: El editor de entradas en Wordpress                          87
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




 5.2 El editor de entradas
             en Wordpress
Blogs ::: El editor de entradas en Wordpress                                              88
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.2.1 Formato de texto
Wordpress ofrece un editor visual que proporciona ciertas prestaciones para la edición en
lí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 texto
con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el
artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma
durante la edición en línea siempre se dispondrá de una copia de seguridad en local.

    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                                                89
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    3. Teclea el título de la entrada: Albert Einstein. Haz clic dentro del editor de artículos
       y a continuación haz clic derecho para elegir la opción Pegar. Esta acción pegará el
       texto copiado del archivo de texto anterior evitando tener que teclearlo.




Notas:
    Como ocurre en la mayoría de editores visuales en línea es recomendable copiar y
       pegar a partir de texto plano creado con el Bloc de Notas. Otra posibilidad, para
       diseños más elaborados, es editar previamente la página con un editor visual HTML
       como Kompozer (http://kompozer.net/). Lo que NO se recomienda es pegar a partir
       de un documento Word porque se introduce código oculto innecesario y en ocasiones
       produce que no se vea adecuadamente. En este caso es preferible utilizar el Bloc de
       Notas como paso intermedio para pegar el contenido Word y luego volver a
       seleccionar y copiar para pegarlo sobre el editor final.
    El texto pegado es un guión del artículo a realizar. Incluye anotaciones entre
       corchetes que referencian la posición de la imagen y el formato de los distintos
       fragmentos del texto. Es necesario borrar estas anotaciones entre corchetes y aplicar
       los cambios apuntados.
Blogs ::: El editor de entradas en Wordpress                                              90
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    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                                                91
Multimedia 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                                                    92
Multimedia 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                                               93
Multimedia 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                                               94
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    20. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la
        primera referencia: Es un enlace a Google que ya incluye el término de búsqueda:
        http://es.wikipedia.org/wiki/Einstein
    21. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
        copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
    22. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
        A continuación en la barra del editor pulsa en el botón Enlace.




    23. En el cuadro de diálogo Insertar/Editar enlace: haz clic derecho en la casilla URL del
        enlace y elige Pegar. En el Destino selecciona la opción Abrir el enlace en una
        nueva ventana.




    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                                                  95
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.2.2 Corrector ortográfico
El 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 HTML
El editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita la
inclusió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                                             96
Multimedia 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                                  97
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                              6. Diseño del blog
Blogs ::: Diseño del blog en Blogger                                  98
Multimedia 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                                                         99
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado

Una de las ventajas de la gestión de un blog es la independencia entre el diseño y el
contenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestro
blog 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 apariencia
visual 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                                                       100
Multimedia 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 colores
Una vez que hemos asignado una plantilla prediseñada a nuestro blog, Blogger ofrece la
posibilidad 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                                                       101
Multimedia 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ágina
La 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                                                102
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Nota:
        Un blog de Blogger dispone por defecto de una barra de navegación superior. Como
        veremos más adelante se puede configurar la gama de colores de esta barra y
        también ocultarla.

En este apartado se explican los procedimientos para configurar estos elementos
estructurales 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
       estructurales




6.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                                                 103
Multimedia 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                                                 104
Multimedia 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                                                  105
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


6.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                                                     106
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



Ordenar elementos
        En esta sección se muestra el aspecto que tendrá cada entrada con los elementos
        seleccionados pero también permite arrastrar y reordenador los elementos situados
        después del cuerpo de la entrada.




Guardar configuración
        Para guardar los cambios definidos en esta configuración haz clic en el botón
        GUARDAR.




6.1.7 Añadir gadgets a la barra lateral
Una de las características más representativas de los blogs es disponer de una o dos columnas
laterales donde se ordenan, de arriba hacia abajo, los distintos gadgets que proporcionan
prestaciones adicionales al blog.
Blogs ::: Diseño del blog en Blogger                                                    107
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en
una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente
diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden
mostrar datos adicionales en la misma página sin tener que abandonar esta página.

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                                                108
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    3. Para añadir un gadget a la barra lateral haz clic en su botón “+”. Por ejemplo:
       Cuadro de búsqueda (Nuevo). Si ya has añadido ese gadget en lugar de este botón
       aparecerá el texto: “Ya se ha añadido”.




    4. Se muestra un panel donde puedes introducir el título del gadget y configurar sus
       parámetros. Estos dependerán del tipo de gadget.
    5. Para terminar pulsa en el botón GUARDAR. El nuevo widget se habrá añadido a la
       barra lateral.




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                                                        109
Multimedia 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 interesantes
Se pueden añadir a tu blog los gadgets más habituales:

Lista de enlaces

Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la
forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a
blogs).




Al añadir o editar un gadget de lista de enlaces se abre una nueva ventana donde se puede
configurar las propiedades de este listado:

       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 cada
uno de estos enlaces.
Para terminar pulsa en el botón GUARDAR.
Blogs ::: Diseño del blog en Blogger                                                       110
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




En el blog esta gadget se mostrará en la barra lateral proporcionando los enlaces definidos.




Archivo del blog
Muestra los enlaces organizados cronológicamente que permite un acceso individual a los
distintos artículos del blog.




Al añadir o editar el gadget de Archivo del blog se pueden configurar sus distintos
parámetros:
     Título: es el título que encabezará ese gadget. Este parámetro es común al resto de
       gadget y permite personalizar el contenido del mismo.
     Estilo. Se pueden elegir tres modelos: Jerarquía (por meses y años), Lista (por
       meses) y Menú desplegable (combo).
     Opciones. Activar o desactivar opciones como Mostrar títulos de las entradas o
       Mostrar primero las entradas más antiguas.
     Frecuencia de archivo. Permite definir el intervalo temporal en que se mostrarán
       organizados los enlaces a las entradas.
     Formato de fecha y Vista previa.
Blogs ::: Diseño del blog en Blogger                                                      111
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Para terminar pulsa en el botón GUARDAR. En la barra lateral del blog se mostrarán unos
enlaces clasificados de acuerdo con los criterios de configuración definidos.




Etiquetas

Muestra un listado de todas las etiquetas o categorías definidas en el blog. Cuando el lector
hace clic en una etiqueta se mostrará una página con todos los artículos que contienen esas
etiquetas.




En la edición de la configuración de este gadget se puede definir el Título, Ordenación (por
orden alfabético o por frecuencia) y si se muestra u oculta el número de entradas por
etiqueta. Para terminar hacer clic en el botón GUARDAR.
Blogs ::: Diseño del blog en Blogger                                                       112
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




En la barra lateral se mostrará un gadget con las etiquetas o categorías.




Enlaces de suscripción
Ofrece a los lectores la posibilidad de suscribirse a los artículos y comentarios de tu blog
utilizando los lectores de feed más conocidos.




                                                                                 ç

En la edición de la configuración de este gadget sólo es necesario definir el título con que se
mostrará.
Blogs ::: Diseño del blog en Blogger                                                    113
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




El lector utilizará la opción Entradas > Atom para suscribirse a tu blog utilizando el
navegador web por defecto o bien un programa específico para leer feed.



Cuadro de búsqueda

Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para
buscar en las entradas o enlaces del blog.




Al configurar este gadget se puede definir su Título y también sus pestañas para definir los
ámbitos de búsqueda: en las entradas de tu blog, en las páginas enlazadas desde cualquier
entrada de tu blog, en internet en general, en los gadgets que contengan enlaces, etc.
Blogs ::: Diseño del blog en Blogger                                                 114
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Al activar este tipo de gadget en la barra lateral se mostrará un cuadro de búsqueda que
permitirá buscar en estos ámbitos utilizando el motor de Google.




Es posible que algunas entradas añadidas recientemente no aparezcan todavía en los
resultados 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                                                       115
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




6.1.9 Edición HTML de la plantilla
El administrador de un blog puede personalizar su estilo gráfico utilizando las opciones
descritas anteriormente en este documento sin disponer de apenas conocimientos de HTML o
CSS. 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                                                        116
Multimedia 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                                                  117
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


6.1.10 Edición avanzada HTML de la plantilla
En este apartado se explican dos ejemplos de cómo se puede utilizar la edición HTML de la
plantilla para resolver dos requerimientos no contemplados inicialmente por Blogger.

6.1.10.1 Eliminar la barra de navegación de Blogger
En algunas ocasiones puede resultar interesante eliminar la barra de navegación Blogger de
nuestro 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                                                      118
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


6.1.10.2 Crear un “Leer más” en un artículo de Blogger

En ocasiones resulta interesante crear una entrada que muestre un texto de introducción y
oculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa en
este enlace o bien en el título del artículo, entonces la entrada se muestra completa y de
forma individual en la página. Este enlace “Leer más” no se contempla por defecto en Blogger
pero se puede conseguir utilizando la siguiente receta.

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                                                       119
Multimedia 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 PLANTILLA




Paso 2: Crear una entrada
Una vez que hemos modificado la plantilla ahora es necesario crear una entrada utilizando el
siguiente código HTML: <span class="fullpost"> </span>. Fuera de la etiqueta span
situaremos el texto del artículo que se verá siempre y dentro de las etiquetas span el texto
que 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                                                       120
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado

    9. En la barra de herramientas del editor haz clic en el botón Añadir Imagen para añadir
        la imagen mariecurie.jpg que se ha descargado en un paso anterior. Reduce el
        tamaño de visualización y ajusta la imagen a la izquierda del primer párrafo.
    10. Selecciona la lista de elementos de su Biografía y de su Obra para pulsar a
        continuación el botón Lista de viñetas para asignarles este formato.
    11. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece. Es un
        enlace     a     Google     que    ya     incluye    el    término      de    búsqueda:
        http://es.wikipedia.org/wiki/Marie_Curie
    12. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha
        copiado al portapapeles de Windows y se ha eliminado de la ubicación actual.
    13. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento.
    14. A continuación en la barra del editor pulsa en el botón Enlace.
    15. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar.
    16. Clic en el botón Aceptar para guardar la dirección pegada.
    17. Hasta aquí el artículo se ha editado como cualquier otro. A continuación vamos a
        situar dentro de la etiqueta span class="fullpost"> </span> el texto que se ocultará
        inicialmente. Clic en la pestaña Edición HTML.




    18. En el código HTML del artículo añade la etiqueta <span class="fullpost"> antes de la
        línea Su biografía. Y luego el cierre de esta etiqueta al final del texto: </span>.
    19. Clic en el botón PUBLICAR ENTRADA. Si accedes a la lectura del artículo verás que se
        muestra el primer párrafo y el enlace Leer más.
Blogs ::: Diseño del blog en Blogger                                  121
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Blogs ::: Diseño del blog en Wordpress                                122
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                        6.2 Diseño del blog
                             en Wordpress
Blogs ::: Diseño del blog en Wordpress                                                   123
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Una de las ventajas de la gestión de un blog es la independencia entre el diseño y el
contenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestro
blog 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 un
diseñ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                                                   124
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Localiza y haz clic, por ejemplo, en la imagen del tema Freshy o bien en el enlace
       Vista previa. Se mostrará una vista previa del blog con ese nuevo tema.




    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 encabezado
En función del tema elegido se podrán configurar unas opciones u otras. No todos los temas
admiten personalización de todas las opciones. En el caso que nos ocupa vamos a configurar
las distintas opciones del tema Kubrick (tema por defecto). Para ello busca y selecciona este
tema 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                                                  125
Multimedia 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                                                   126
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




6.2.3 Cabecera
La estructura del Frontend de un blog suele tener los siguientes elementos:

       Cabecera. Muestra el título del blog y en algunos casos una imagen de fondo. Cuando
        el lector hace clic en el enlace que proporciona se sitúa en la portada o página
        principal del blog.
       Entradas del blog. Contiene los artículos o entradas publicadas. Aparecen ordenados
        cronológicamente situándose arriba el más reciente. En la página principal solo se
        pueden leer un número concreto de artículos. Para acceder a los anteriores se
        proporciona un sistema de paginación con un enlace a “Entradas anteriores”.
       Barra lateral. Contiene los widgets o módulos que incorporan prestaciones
        adicionales al blog: búsqueda, artículos por meses, artículos por etiquetas, lista de
        enlaces, suscripción RSS, etc.




    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                                                 127
Multimedia 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                                                   128
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


6.2.4 Añadir widgets a la barra lateral
Una de las características más representativas de los blogs es disponer de una o dos columnas
laterales donde se ordenan, de arriba hacia abajo, los distintos widgets que proporcionan
prestaciones adicionales al blog.

El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en
una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente
diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden
mostrar datos adicionales en la misma página sin tener que abandonar esta página.




El tema elegido para nuestro blog ya muestra por defecto una serie de widgets en la barra
lateral. Sin embargo es posible personalizar los que se mostrarán y el orden en que
aparecerán de arriba hacia abajo.

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                                                  129
Multimedia 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                                                 130
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Para 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 Borrar

Para 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                                                      131
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


6.2.5 Algunos widgets interesantes
Se pueden añadir a tu blog los widgets más habituales:

Enlaces

Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la
forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a
blogs).




Al añadir o editar un widget de Enlaces se pueden configurar las propiedades de este listado:

       Categoría de enlaces. Despliega esta lista para seleccionar Todos los enlaces o bien
        sólo los enlaces pertenecientes a una categoría.
       Ordenar por: permite definir el tipo de ordenación que se utilizará para mostrar el
        listado de enlaces: Link title (título del enlace), Link rating (valoración del enlace),
        Link ID (Identificador del enlace) y Aleatorio.
       Mostrar la imagen, nombre, descripción y clasificación del enlace. Si se activa
        alguna de estas opciones se mostrará ese parámetro del enlace.
       Links to show (Enlaces a mostrar). Permite especificar el número máximo de enlaces
        que se mostrará en el listado. Si se deja en blanco se mostrarán todos los enlaces.

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                                                    132
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Archivos

Muestra 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 unos
enlaces clasificados de acuerdo con los criterios de configuración definidos.




Nube de etiquetas

Muestra un listado de todas las etiquetas definidas en el blog. Cuando el lector hace clic en
una etiqueta se mostrará una página con todos los artículos que contienen esas etiquetas.




En la edición de la configuración de este widget se puede definir el Título. Para terminar
hacer clic en el botón Guardar. En la barra lateral se mostrará un widget con las etiquetas.
Blogs ::: Diseño del blog en Wordpress                                                      133
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Enlaces de suscripción
Ofrece a los lectores la posibilidad de suscribirse a las entradas/artículos y comentarios de tu
blog utilizando los lectores de feed más conocidos.
En la edición de este widget es posible configurar:




       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 enlace
Cerrar. El lector utilizará estos enlaces para suscribirse a tu blog utilizando el navegador web
por defecto o bien un programa específico para leer feed.




Buscar

Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para
buscar en las entradas del blog.
Blogs ::: Diseño del blog en Wordpress                                                     134
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Al configurar este widget se puede definir su Título. Clic en el botón Guardar. Al activar este
tipo de widget en la barra lateral se mostrará un cuadro de búsqueda que permitirá buscar en
las entradas del blog.

Otros widgets

Texto. Es un cuadro con texto plano o código HTML que permite añadir un servicio externo.




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, al
interfaz de backend para la gestión de contenidos, a la web de Wordpress.com, etc. Este
gadget 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 o
artículos independientes que no se someten a la cronología de las entradas o posts. Se
utilizan para situar información más o menos permanente en tu sitio web.
Blogs ::: Diseño del blog en Wordpress                                                       135
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



RSS. Permite insertar un cuadro en la barra lateral con las noticias de un feed RSS o Atom
externo o de terceros.




6.2.6 Edición CSS del tema
El administrador de un blog puede personalizar su estilo gráfico utilizando las opciones
descritas anteriormente en este documento sin disponer de apenas conocimientos de HTML o
CSS. 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.com




Nota importante:

La posibilidad de personalizar el CSS del tema siguiendo el procediiento descrito es un
servicio de pago en Wordpress.com
Blogs ::: Diseño del blog en Wordpress                                                      136
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


6.2.7 Marca “Leer más” en un artículo de Wordpress
En ocasiones resulta interesante crear una entrada que muestre un texto de introducción y
oculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa en
este enlace o bien en el título del artículo, entonces la entrada se muestra completa y de
forma individual en la página.


    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                                                     137
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    14. Clic en el botón Publicar. Si accedes a la lectura del artículo verás que se muestra el
        primer párrafo y el enlace Leer el resto de esta entrada.
Blogs ::: Moderación de comentarios en Blogger                        138
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                                7. Moderación de
                                     comentarios
Blogs ::: Moderación de comentarios en Blogger                        139
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




           7.1 Moderación de
       comentarios en Blogger
Blogs ::: Moderación de comentarios en Blogger                                          140
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




7.1.1 Configuración de comentarios
El administrador o autor de un blog debe tener previsto desde un principio cómo desea
gestionar 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 se
mostrará formulario para su envío. Si se selecciona ocultar NO se suprimen los comentarios
existentes ya que podrán volver a visualizarse en cualquier momento si se elige de nuevo
mostrar. Se pueden mostrar los comentarios con carácter general y luego no permitir
comentarios a un artículo en concreto.

Persona que puede realizar los comentarios. En este caso se proporcionan 4 opciones:
    Cualquiera. Si se elige esta opción cualquier usuario anónimo podrá enviar
       comentarios.
    Usuarios registrados. Sólo podrán enviar comentarios los usuarios registrados con
       cuenta Google o bien con identidad OpenID. Es necesario introducir estas credenciales
       para completar el envío.
    Usuarios con cuentas Google. Sólo podrán enviar comentarios los usuarios que
       dispongan de cuenta Google.
    Sólo los miembros de este blog. Para enviar un comentario es necesario estar
       registrado como usuario en el blog.

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 el
seguimiento de otros blogs que han enlazado a este artículo.
Blogs ::: Moderación de comentarios en Blogger                                           141
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



Opció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 que
acompañ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 Escritorio
se mostrará un icono de aviso de que existen comentarios por revisar.
Se envía una notificación a la dirección de correo electrónico que se especifique cuando un
lector no registrado en el blog envíe un comentario. Si esta casilla está vacía no se enviará
notificación.

Mostrar palabra de verificación en comentarios. Se puede mostrar u ocultar la introducción
de una palabra de verificación antispam. Conviene activar esta opción si configuramos la
posibilidad de que un lector anónimo pueda enviar comentarios. Los autores del blog no
tendrá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 el
perfil de los usuarios en los comentarios publicados.

Correo electrónico de notificación de comentarios. En este listado se pueden escribir hasta
10 direcciones de correo electrónico separadas por comas. Los destinatarios recibirán
notificación por correo electrónico cada vez que alguien envíe un comentario en el blog.
Blogs ::: Moderación de comentarios en Blogger                                              142
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


7.1.2 Envío de comentarios
En función de la configuración definida para el envío de comentarios, el formulario se
mostrará en la misma página a continuación de los comentarios publicados o se ofrece un
enlace 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 comentarios
entonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opción
Nunca entonces el comentario se publicará directamente.


7.1.3 Moderación de comentarios
Si el administrador del blog ha elegido la opción Siempre para la moderación de comentarios
entonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opción
Nunca entonces el comentario se publicará directamente. Esta configuración se realiza en la
pá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                                         143
Multimedia 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 comentario
Para eliminar un comentario publicado:

    1. Desde el interfaz de gestión del blog elige Creación de entradas > Editar entradas.
    2. En la columna Comentarios del listado de artículos se muestra un enlace a los
       comentarios publicados de cada artículo. Clic en este enlace. Esta acción te enviará
       al frontend del blog mostrando los comentarios publicados.




    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                                             144
Multimedia 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                      145
Multimedia 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                                       146
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado


7.2.1 Configuración de comentarios
El administrador de un blog debe tener previsto desde un principio cómo desea gestionar los
comentarios 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 entradas

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 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                                       147
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado

Enviarme un e-mail cuando
    Alguien envía un comentario
    Se ha recibido un comentario para moderar

Para que un comentario aparezca
    Un administrador debe aprobar el comentario
    El autor del comentario debe tener un comentario previamente aprobado

Moderación de comentarios
    No descartar spam en mensajes antiguos
    Mantener un comentario en espera si contiene más de 2 enlaces (una característica
      común del spam en comentarios es el gran número de enlaces).
    Mantener en la cola de moderación todo comentario que incluya cualquiera de las
      siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples
      palabras o IP con saltos de línea. Atención a las coincidencias en el interior de
      palabras: "press" se encontrará en "WordPress".

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ónico

Suscribirse a los comentarios
     Mostrar a un 'suscribirse a los comentarios' 'en el formulario de comentarios

Suscribirse al blog
     Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios

Avatares
Un avatar es una imagen para identificar a un usuario y normalmente sale al lado de su
nombre en los comentarios o referencias. Desde aquí puedes permitir la visualización de los
avatares de los usuarios que dejen comentarios en tu blog.

Visibilidad
     No mostrar avatares
     Mostrar avatares

Puntuación máxima
    G - Para todos los públicos
    PG - Para mayores de 13 años
    R - Para mayores de 17 años
    X - Contenido adulto

Avatar por defecto
Para usuarios que no tiene un avatar personalizado podemos mostrar uno genérico o un
logotipo 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                                            148
Multimedia 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 comentarios
Cuando se accede a la lectura individual de un artículo o entrada del blog, en la parte inferior
se muestran los comentarios de los lectores y al final de los mismos se ofrece un formulario
para 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 encuentra
autentificado previamente en Wordpress entonces en este formulario no se solicitará el
usuario, ni la dirección de correo ni la web.

Si el administrador del blog ha desactivado la opción “Un administrador debe aprobar el
comentario” 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 por
todos los usuarios lectores.
Blogs ::: Moderación de comentarios en Wordpress                                          149
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado


7.2.3 Moderación de comentarios
Para activar la moderación de todos los comentarios que nos envíen los lectores es necesario
configurar al menos los siguientes parámetros en Opciones > Comentarios > Para que un
comentario 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                                         150
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado




Suprimir un comentario
Para eliminar un comentario:

    1. Desde el interfaz de gestión del blog elige Comentarios. Esta acción muestra todos
       los comentarios. Localiza el comentario que deseas eliminar y al situar el puntero del
       ratón sobre él se muestran las distintas opciones de procesamiento individual. Haz
       clic sobre la opción Papelera. Esta acción mueve ese comentario a la papelera pero
       no lo elimina definitivamente.




    2. Otra forma de enviar a la papelera varios comentarios a la vez consiste en marcar sus
       casillas y a continuación elegir la opción Mover a la papelera en la lista desplegable
       Acciones en lote.
    3. En la parte superior del listado se ofrecen enlaces para filtrar el listado de
       comentarios por Todos, Pendiente, Aprobados, Spam o Papelera.




    4. Para eliminar definitivamente un comentario haz clic en el enlace Papelera y una vez
       dentro de la papelera puedes seleccionar entre Restaurar el comentario o bien
       Borrar permanentemente. Otra opción es pulsar el botón Vaciar papelera.
Blogs ::: Moderación de comentarios en Wordpress                                         151
Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado



Editar un comentario
Wordpress permite editar el contenido de un comentario. Para ello basta con elegir la opción
Editar o bien Edición rápida para acceder a una página donde es posible modificarlo.




Marcar como spam

Si marcas un comentario como spam éste se guarda en la carpeta Spam de los comentarios y
cualquier otro comentario enviado posteriormente desde la misma IP será destinado
automáticamente a esta carpeta.
Blogs ::: Usuarios y permisos en Blogger                              152
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




           8. Usuarios y permisos
Blogs ::: Usuarios y permisos en Blogger                              153
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




      8.1 Usuarios y permisos
                   en Blogger
Blogs ::: Usuarios y permisos en Blogger                                                   154
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


8.1.1 Tipos de usuarios
Blogger 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                                                   155
Multimedia 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                                               156
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                Únicamente autores del blog. Si activas esta opción sólo podrán leer los
                 artículos los usuarios registrados como usuarios

Si se decide restringir el acceso en modo lectura a un blog entonces al tratar de acceder a
través de su URL, se mostrará un formulario para introducir las credenciales de usuario.
Blogs ::: Usuarios y permisos en Wordpress                            157
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




      8.2 Usuarios y permisos
                en Wordpress
Blogs ::: Usuarios y permisos en Wordpress                                                 158
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2.1 Tipos de usuarios
Wordpress contempla en un blog 4 tipos de usuarios: administrador, editor, autor y
colaborador.

       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                                                159
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




8.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                           160
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




9. Configuración del blog
Blogs ::: Configuración del blog en Blogger                           161
Multimedia 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                                                   162
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


9.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                                                  163
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


9.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                                             164
Multimedia 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 Comentarios
Ver el apartado anterior sobre Moderación de comentarios.



9.1.5 Archivo
    1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Configuración >
       Archivo.
    2. En la página de Archivo se pueden configurar los siguientes datos:

Frecuencia de archivo. Permite definir el intervalo con que se mostrarán los enlaces a las
entrada en el gadget Archivo de la barra lateral: Diaria, Semanal o Mensualmente.

¿Habilitar páginas de entrada?. Es una opción activada por defecto. Las páginas de entrada
permiten que cada artículo disponga de su página web con una URL significativa. Ejemplo:
http://multimediaweb20.blogspot.com/2009/08/albert-einstein.html. En esta dirección de
página se incluye información extraída del título de la entrada. Si no se activa esta opción
entonces las URLs individuales de las entradas no serán amigables. Ejemplo:
http://multimediaweb20.blogspot.com/2009_08_07_archive.html#1305293459555266304



9.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                         165
Multimedia 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                                                166
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


9.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                                             167
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


9.2.3 Lectura
    1. Desde el interfaz de gestión de tu blog elige Opciones > Lectura.
    2. En esta página se definen los siguientes parámetros:

       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 principio

Enviarme un e-mail cuando
    Alguien envía un comentario
    Se ha recibido un comentario para moderar

Para 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                                             168
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Moderación de comentarios
    No descartar spam en mensajes antiguos
    Mantener un comentario en espera si contiene más de XX enlaces (una
      característica común del spam en comentarios es el gran número de enlaces).
    Mantener en la cola de moderación todo comentario que incluya cualquiera de las
      siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples
      palabras o IP con saltos de línea. Atención a las coincidencias en el interior de
      palabras: "press" se encontrará en "WordPress".

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ónico

Suscribirse a los comentarios
     Mostrar a un 'suscribirse a los comentarios' 'en el formulario de comentarios

Suscribirse al blog
     Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios

Avatares
Un avatar es una imagen que representa al usuario acompañando a su nombre en un
comentario. Esta imagen es visible en aquellos blogs que lo permiten. En este apartado de la
configuración del blog se puede activar que se muestren los avatares de aquellos usuarios que
envien comentarios al blog.

Visibilidad
     No mostrar avatares
     Mostrar avatares

Puntuación máxima
    Puntuación máxima G - Para todos los públicos
    PG - Para mayores de 13 años
    R - Para mayores de 17 años
    X - Contenido adulto

Avatar por defecto
Para usuarios que no tienen un avatar personalizado podemos mostrar uno genérico o un
logotipo 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                                              169
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                  10. Documentos PDF
Blogs ::: Documentos PDF                                                                   170
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




10.1 Introducción
En un sitio web es frecuente poner a disposición de los usuarios documentos en formato PDF
para la consulta de información. Ejemplo: los boletines oficiales. Las ventajas que ofrece este
tipo de archivo son:
     Se puede abrir con distintas aplicaciones de software gratuito.
     Es accesible desde cualquier plataforma: Windows, Linux, Mac, etc.
     El documento PDF tiene un tamaño más reducido que el original.
     Admite la búsqueda fácil de información entre sus páginas.
     Tiene una presentación idéntica e independiente del dispositivo de visualización
        (pantalla) y de impresión (impresora).
     Permite proteger el contenido del documento frente a terceros.


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 Windows
En Windows necesitamos un programa que nos permita abrir y leer los archivos PDF. La opción
más habitual es Adobe Reader. Puedes descargar e instalar el archivo
AdbeRdr903_es_ES.exe. La instalación se realiza siguiendo las opciones por defecto del
asistente. Tras la instalación se creará un acceso directo en el escritorio. Haciendo clic en
este icono se iniciará el programa. Desde el navegador web, cuando hagas clic en un enlace a
un documento PDF se iniciará automáticamente Adobe Reader mostrando el contenido del
archivo referenciado en el interior de una ventana del navegador.




Si deseas consultar la web de Adobe para comprobar si existe una nueva versión del
programa: http://www.adobe.es

Otra alternativa al uso de Adobe Reader es disponer de un programa portable para leer
documentos PDF. Es el caso del programa Sumatra PDF. Descarga y descomprime el archivo
SumatraPDFPortable_1.0.1.paf.exe en una carpeta de tu disco duro o bien en tu pendrive.



10.3 Instalación de PDF Creator en Windows

El programa Adobe Reader permite la lectura de documentos PDF pero no su creación. En su
defecto se propone utilizar PDFCreator como aplicación de libre distribución para crear un
documento PDF a partir de un archivo Word, Excel, etc:
http://sourceforge.net/projects/pdfcreator/
Blogs ::: Documentos PDF                                                                  171
Multimedia 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                                                        172
Multimedia 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                                                                 173
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    6.   Antes de iniciar la impresión con PDFCreator se solicitan los metadatos del nuevo
         archivo: título, fecha de creación, fecha de modificación, autor, asunto, palabras
         clave, etc. Es importante completar adecuadamente estos datos. Asegúrate de que la
         casilla Al terminar, abrir el documento con el programa predeterminado esta
         activada para ver el aspecto final del documento.




    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 desde
cualquier programa que permita la impresión: Microsoft Office, Internet Explorer, Mozilla
Firefox, etc. Si se utiliza con un navegador web permite realizar copias de seguridad en
formato PDF de las páginas web que se visitan. El proceso se iniciará de forma similar a como
se describe en este apartado a partir del comando Archivo > Imprimir.
Blogs ::: Documentos PDF                                                               174
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




10.5 Lectura de archivos PDF en Ubuntu
Ubuntu dispone por defecto de un programa instalado para leer y crear documentos PDF. Se
trata 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 un
fichero PDF del equipo se abrirá esta aplicación mostrando su contenido. De esta forma
podremos leerlos.
Blogs ::: Documentos PDF                                                               175
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




10.6 Impresora virtual PDF en Ubuntu
La distribución de Ubuntu proporciona por defecto una impresora virtual PDF que permite
crear un documento PDF a partir de cualquier aplicación mediante Archivo > Imprimir y
seleccionando 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 OpenOffice
Los programas de OpenOffice como Writer (textos) o Impress (presentaciones) permiten
exportar a un documento en formato PDF sin necesidad de disponer de una impresora virtual
de PDF instalada en el equipo.

Windows

Si 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 para
disponer de este completo paquete ofimático.
Blogs ::: Documentos PDF                                                            176
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Ubuntu

En las mayoría de distribuciones de Ubuntu viene instalado OpenOffice por defecto. Se
accede a una de sus aplicaciones desde el escritorio mediante: Aplicaciones > Oficina >
OpenOffice.org …

Ambos

Una 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                                                             177
Multimedia 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                                                                    178
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




10.8 Publicar un PDF en Blogger
El interfaz de gestión que ofrece Blogger NO permite subir directamente archivos PDF. Sin
embargo, de la misma forma que existe un espacio donde se guardan las imágenes (Álbumes
Web de Picasa) , existe un espacio denominado Google Sites, asociado a la cuenta de usuario
Google, donde es posible subir archivos de distinto tipo para luego enlazarlos desde el blog
para 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                                                                 179
Multimedia 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                                                                180
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


    11. Utilizando el navegador web Mozilla Firefox haz clic derecho sobre el enlace
        correspondiente al archivo subido y elige la opción Copiar la ruta del enlace




    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                                                               181
Multimedia 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 Wordpress
El interfaz de gestión que ofrece Wordpress permite subir directamente un archivo PDF para
luego situar un enlace al mismo en una entrada del blog. En este apartado se explica el
procedimientopara 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                                                               182
Multimedia 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                                                                183
Multimedia 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                                                               184
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


    12. Despliega el combo Destino y elige la opción Abrir el enlace en una nueva ventana.
    13. Clic en el botón Insertar del cuadro de diálogo Insertar/Editar enlace.
    14. Observa que se crea un enlace a este documento en el artículo.




    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                                                 185
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                     11. Google Docs
Blogs ::: Google Docs                                                                    186
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.1 ¿Qué es Google Apps?

11.1.1 Introducción
Google Apps es un servicio web 2.0 ofrecido por Google a los usuarios registrados con cuenta
de Gmail (http://www.gmail.com). Se puede utilizar para desarrollar una comunidad de
usuarios que utilizan de forma colaborativa sus distintas aplicaciones web ofimáticas: Gmail,
Google Calendar, Talk, Docs, Sites, etc.




Las aplicaciones que proporciona Google Apps son de dos tipos: comunicación (Gmail, Talk,
Reader y Calendar) y de colaboración/publicación (Docs y Sites)

11.1.2 ¿Por qué Google Apps?
En el entorno educativo o laboral o de ocio es frecuente encontrarse con la necesidad de un
soporte informático a una experiencia de colaboración entre un grupo de personas en el
diseñ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 y
hojas de cálculo y por otra la comunicación en tiempo real (mensajería instantánea) o
diferido (emails). En este contexto Google Apps puede ser un excelente recurso para crear y
soportar 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                                                                 187
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.1.3 Descripción de las aplicaciones más interesantes



Gmail. 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=12805



Google 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                                                                      188
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Google 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.com

Google Docs permite crear documentos de texto, presentaciones y hojas de cálculo mediante
un editor que se utiliza a través del navegador web. Esto facilita la edición de un documento
online entre varias personas simultáneamente desde sus respectivos navegadores.

Es posible importar y exportar archivos en Google Docs de una forma muy sencilla. Para
utilizar un archivo guardado en el equipo basta con subirlo (importarlo) y continuar allí donde
se había dejado. Para trabajar con documentos sin conexión o distribuirlos como adjuntos, se
puede exportar una copia al equipo en el formato que más se adapte a tus necesidades.

Para utilizar Google Docs SÓLO SE NECESITA una conexión a Internet y un navegador estándar.

Las características más destacadas de Google Docs son:
Blogs ::: Google Docs                                                                     189
Multimedia 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.com
Google Sites es una aplicación online que permite crear un sitio web de grupo de forma
sencilla y colaborativa. Los usuarios pueden reunir en un único lugar y de una forma rápida
informació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 (organiza
las suscripciones RSS), Google Photos (albumes web con Picassa), Google Maps (Mapas para
geolocalización de fotos), Google Grupos (foros de debate e intercambio de archivos), etc.
Blogs ::: Google Docs                                                                     190
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.2 Crear y compartir un documento en Google Docs
En este tutorial se explica el procedimiento para crear y compartir un documento sencillo en
una 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 esquina
superior derecha y elige Settings Docs. A continuación define Español como idioma y Madrid
como franja horaria. Clic en Save (Guardar).

Si el interfaz de edición de documentos de que dispones NO coincide con las capturas de
pantalla que se incluyen en este manual quizás sea debido a que no tienes activada la última
versión del editor. Para ello en la barra de menús de la esquina superior derecha de la página
elige Configuración > Configuración de Docs. En la página Configuración, pestaña Edición
hay que marcar la opción Nueva versión de documentos de Google > Crea nuevos
documentos 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                                                                  191
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    3. Dentro del documento teclea el título del documento: Federico García Lorca.
    4. A continuación selecciona este fragmento de texto y en la barra de menús selecciona
       Formato > Estilo de párrafo > Título 1. El título introducido adquiere el estilo
       definido.




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                                                                    192
Multimedia 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                                                                    193
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Paso 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                                                                   194
Multimedia 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                                                                    195
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Paso 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                                                                  196
Multimedia 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                                                                    197
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Paso 8. Configurar las opciones de Compartir
En 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 colaborador
puede 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                                                                     198
Multimedia 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                                                                     199
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    32. Para cada usuario se indica si es propietario, puede editar o sólo ver. Para modificar
        el tipo de permiso sobre el documento o eliminar el usuario despliega el combo que
        acompaña a la línea correspondiente al email de ese usuario. Si deseas eliminar el
        usuario elige la opción Ninguno.




    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                                                                    200
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    36. Para cerrar el editor del documento y volver al gestor de archivos de GDocs basta con
        cerrar la pestaña que contiene el editor pero asegurándose de que el botón Guardado
        aparece deshabilitado en la esquina superior de la ventana del navegador. De esta
        forma nos cercioraremos de que se han guardado todos los cambios en el servidor.
    37. De regreso al administrador de archivos de Google Docs verás que se ha creado una
        entrada del documento creado.




11.3 Gestión de archivos en Google Docs

11.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                                                                 201
Multimedia 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                                                                     202
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Desde la barra de menús (Archivo, Editar, Diapositiva, Insertar, etc) se pueden
        realizar todas las operaciones de edición sobre la presentación abierta.
    11. En la barra de herramientas encontrarás acceso a las operaciones más utilizadas:
        añadir, duplicar o eliminar diapositiva; insertar imagen o texto, etc.
    12. Si deseas ver la presentación pulsa en el botón Iniciar presentación.
    13. No olvides pulsar en el botón Guardar para salvar los cambios introducidos si el
        sistema no lo ha hecho ya.
    14. Para compartir un documento haz clic en el botón Compartir y luego selecciona
        Invitar a usuarios. El procedimiento es similar al explicado en el apartado anterior.




    15. Para regresar al gestor de documentos cierra la pestaña que contiene el editor.
    16.

11.3.2 Obtener el enlace para compartir

Se puede invitar a participar como colaborador o como lector a un usuario eligiendo el
documento y seleccionando Compartir > Invitar a usuarios.

Otra posibilidad es activar la opción de que cualquier usuario anónimo (sin disponer de cuenta
en Google) pueda acceder directamente a nuestro documento con solo disponer de su URL o
dirección en internet. Le enviaríamos esta URL pegada en un mensaje de correo electrónico y
Blogs ::: Google Docs                                                                      203
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

el usuario accedería a este documento pulsando en el enlace sin necesidad de introducir
ninguna 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 Docs
Desde el administrador de archivos se pueden realizar distintas operaciones con los archivos.
Blogs ::: Google Docs                                                                     204
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




En la columna izquierda del administrador de archivos se muestran las categorías y carpetas
en que se organizan todos los archivos accesibles para el usuario actual a través del
administrador de archivos. Es importante recordar que sólo serán accesibles a través de este
interfaz aquellos archivos de los que sea propietario y aquellos compartidos por otros para
ese usuario en concreto.

Basta hacer clic sobre una categoría o carpeta en la columna izquierda, para que se muestre
detalle de los archivos que contiene en el panel derecho.

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 plantilla

Para 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 nombre

Para cambiar de nombre una carpeta:
Selecciona la carpeta en el panel izquierdo y en el panel derecho pulsa sobre su nombre para
introducir el nuevo nombre.
Blogs ::: Google Docs                                                                       205
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Para eliminar un archivo:
Marcar la casilla del documento y pulsar en el botón Suprimir. El documento se moverá a la
carpeta 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 carpeta
destino. Otra posibilidad es arrastrar un archivo desde el panel derecho hasta soltarlo sobre la
carpeta 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ás
acciones > Ocultar/Mostrar. El archivo oculto se guardará en la carpeta Ocultos que aparece
en la columna izquierda del administrador de archivos.
Blogs ::: Google Docs                                                                    206
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Para ver el Historial de Revisiones de un documento existen dos procedimientos
alternativos 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 distintas
versiones históricas del documento utilizando los botones Más antigua y Más reciente.
Observa que al visualizar una versión se muestra la hora en que se guardó y el usuario que lo
hizo. Para sustituir una versión por la actual o más reciente se pulsa en el enlace Recuperar
ésta.




Al hacer clic derecho sobre un archivo en el gestor de archivos se muestran las principales
opciones de procesamiento.




11.3.4 Exportación de archivos
A partir de cualquier archivo de Google Docs se puede obtener una copia para manejar en el
disco duro local fuera de línea o bien para enviar como adjunto en un correo electrónico a
personas 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                                                                  207
Multimedia 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 carpeta
destino donde se guardan los archivos descargados. Para saber dónde lo hace o bien forzar a
que pregunte siempre la carpeta destino al descargar el archivo selecciona Herramientas >
Opciones. En la pestaña Principal y en la sección Descargas marca opción Guardar archivos
en para elegir la carpeta destino donde se guardarán todas las descargas o bien marca la
opción Preguntarme siempre dónde guardar los archivos.
Blogs ::: Google Docs                                                                     208
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.4 Crear un documento a partir de una plantilla
Google Docs proporciona un amplio catálogo de plantillas que facilitan la creación de nuevos
documentos 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                                                                  209
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.5 Formularios
11.5.1 ¿Qué son los formularios?
Google Docs ofrece la posibilidad de diseñar un formulario de preguntas, enviar la URL de
acceso a los usuarios que deseemos para que lo rellenen y luego recoger sus respuestas en
forma de tabla y gráficos de datos.

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                                                 210
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Pregunta 2:




Pregunta 3:




Pregunta 4:
Blogs ::: Google Docs                                                                    211
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    7. Si al editar una pregunta marcas la casilla Hacer esta pregunta obligatoria entonces
       el usuario será advertido de esta circunstancia si deja en blanco esta pregunta.
    8. Tras editar cualquier pregunta haz clic en el botón Finalizado para cerrar su edición.
    9. Para modificar el aspecto gráfico del formulario haz clic en el botón superior Tema:
       tema elegido. Clic en el tema que desees para ver el aspecto final y luego pulsa en el
       botón Aplicar.




    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                                                                     212
Multimedia 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                                                                    213
Multimedia 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 Blogger
Existen 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                                                                     214
Multimedia 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                                                                    215
Multimedia 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                                                                    216
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


11.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                                                                   217
Multimedia 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                                                                       218
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

            Página web. Proporciona la URL de una página HTML que muestra el contenido de
             la hoja de cálculo. Se podría utilizar para crear un enlace en una entrada de
             nuestro blog.
            Código HTML para incrustar en una página. Proporciona el código HTML que
             insertar en el artículo de tu blog.
            CSV, TXT, PDF, … Proporciona un enlace para la descarga de la hoja de cálculo
             en uno de los formatos elegido. Este enlace se podría utilizar para crear un enlace
             en un artículo del blog.




    5. En este caso elige Código HTML para incrustar en una página. Selecciona el código
       que ofrece debajo, clic derecho y elige Copiar.




    6. Crea una nueva entrada en tu blog para pegar este código en el código HTML de la
       misma. Clic en el botón Publicar entrada y accede al blog para ver su aspecto.


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                                                                    219
Multimedia 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 Wordpress
En 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 un
documento de Google.

Por este motivo para integrar un documento de GDocs en un blog de Wordpress se utiliza el
enlace a su URL. Esto se puede aplicar a documentos de texto, presentaciones, hojas de
cálculo, formularios, etc. Se escribe un texto y en él se define un enlace de tal forma que
cuando el usuario hace clic en él es redirigido a esa dirección del documento alojado en
Google Docs.

    1. En el gestor de archivos de GDocs haz clic sobre el título de un documento de texto.
Blogs ::: Google Docs                                                                 220
Multimedia 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                                                                  221
Multimedia 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                                           222
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




            12. Derechos de autor
Blogs ::: Derechos de autor                                                               223
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



12.1 Introducción
En la elaboración de artículos en nuestro blog podemos partir de activos (textos, imágenes,
audios y vídeos) propios o bien utilizar aquellos procedentes de otras personas o entidades.
Por otra parte cuando se publica un material en internet puede resultar interesante
establecer las condiciones de uso.


12.2 Los derechos de autor
Los materiales multimedia tanto en formato cdrom como en internet están sujetos a la misma
legislación sobre derechos de autor que el resto de obras: libros, pinturas, música, etc. Esto
significa que si decidimos incorporar recursos ajenos (léase imágenes, audios, vídeos, etc) a
nuestro espacio web debemos conocer y respetar las condiciones de uso que han definido los
autores de estos materiales. Y esto es especialmente significativo cuando el material que
hemos elaborado supera el contexto de uso particular y se pretende publicar en internet. Es
entonces cuando existe posibilidad de ser utilizado por otras personas incluso en clara
competencia con el material original.

En ocasiones cuando accedemos a un espacio web, su autor explicita la posibilidad de
reutilización a cambio de citar la procedencia (derecho de cita) o bien de que no se
fragmente su obra (derecho de obra no derivada).

Sin embargo cuando esto no se indica o bien se muestra una licencia de copyright (derechos
reservados) conviene ser cauteloso. La apropiación indiscriminada de materiales ajenos para
elaborar un material propio no se puede justificar desde la ausencia de ánimo de lucro que
caracteriza las iniciativas donde participemos. Esta justificación no es suficiente y se hace
necesario en estos casos contactar con el autor o autores para obtener su permiso y en caso
favorable citar siempre la fuente de procedencia.


12.3 Licencias Creative Commons
Creative Commons (http://es.creativecommons.org/) es una organización que ofrece a
cualquier usuario la posibilidad de elegir las condiciones en que desea compartir un trabajo
publicado 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 se
pueden elegir:
Blogs ::: Derechos de autor                                                                 224
Multimedia 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                                                             225
Multimedia 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                                                          226
Multimedia 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                                                               227
Multimedia 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                                                              228
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




12.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                                                             229
Multimedia 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                                                              230
Multimedia 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                                                                  231
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado

    15. Si deseas modificar de posición arriba/abajo del gadget basta con pulsar y arrastrar
        uno respecto al otro sobre la edición de la barra lateral.




    16. Para editar de nuevo el contenido de este cuadro haz clic en el botón Abrir que se
        muestra en la esquina superior derecha del widget.




    17. Para ver el resultado final haz clic en el enlace disponible en el título del blog. En la
        barra lateral se mostrará un gadget con el icono del tipo de licencia elegido.




    18. Cuando el lector hace clic en el icono o en el enlace textual se mostrará la página de
        Creative Commons con las condiciones de la licencia elegida.
Blogs ::: Derechos de autor                                           232
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
Módulo 2. Imagen
Imagen ::: Conceptos básicos de imagen digital                        234
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                  1. Conceptos básicos
                      de imagen digital
Imagen ::: Conceptos básicos de imagen digital                                            235
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Antes de estudiar los procedimientos más habituales de optimización y tratamiento de
imágenes es conveniente repasar algunas ideas clave relacionadas con la imagen digital.


1.1 El píxel
El píxel es la unidad mínima de visualización de una imagen digital. Si aplicamos el zoom
sobre ella observaremos que está formada por una parrilla de puntos o píxeles. Las cámaras
digitales y los escáneres capturan las imágenes en forma de cuadrícula de píxeles.




1.2 Resolución de imagen
Es el grado de detalle o calidad de una imagen digital ya sea escaneada, fotografiada o
impresa. 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 de
mostrar. 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 una
cámara de 8 MP es aquella capaz de tomar una fotografía con 8 millones de píxeles.



1.3 Profundidad de color
La profundidad de color se refiere al número de bits necesarios para codificar y guardar la
información de color de cada píxel en una imagen. Un bit es una posición de memoria que
puede tener el valor 0 ó 1. Cuanto mayor sea la profundidad de color en bits, la imagen
dispondrá de una paleta de colores más amplia. Se utiliza 1-bit para imágenes en
blanco/negro, sin grises (0=color negro, 1= color blanco), 2-bits = 4 colores (00=color negro,
Imagen ::: Conceptos básicos de imagen digital                                               236
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


01=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 color
Llamamos modo de color al sistema de coordenadas que nos permiten describir el color de
cada 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                                             237
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


        hasta 16,7 millones de colores. Ejemplo: El valor R:255, G:0, B:0 representa al color
        rojo puro.




       Modo HSB. Cada color surge de los valores de estos tres parámetros: Hue (Tono) que
        es el valor del color: rojo, azul, verde, etc. En GIMP se expresa en grados y oscila
        entre 0 y 360. Saturation (Saturación) que se refiere a la pureza del color y va del 0%
        al 100%. Brightness (Brillo) referencia la intensidad de luz del color, es decir, la
        cantidad de negro o blanco que contiene estando su valor entre 0 (negro) y 100
        (blanco). Ejemplo: El color rojo puro tiene un código RGB como (255,0,0) y también
        un código HSB (0,100,100). En la mayoría de programas de tratamiento de imágenes
        se puede elegir un color introduciendo su código RGB –es la opción más frecuente- o
        alternativamente su código HSB. En ambos casos la imagen maneja una paleta de
        colores de 24 bits.




       Modo CMYK. Cada color se forma por combinación de cuatro canales. Cada canal se
        corresponde con un color primario de impresión: Cyan (Ciano), Magent (Magenta),
        Yellow (Amarillo) y BlacK (Negro). Cada canal puede tener como valor entre 0 y 255.
        Se trata de imágenes con una profundidad de color de 32 bits.
Imagen ::: Conceptos básicos de imagen digital                                            238
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



1.5 Formatos de imagen
Las imagénes digitales se pueden guardar en distintos formatos. Cada uno se corresponde con
una 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                                                 239
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




Nota:

        Para visualizar la extensión de los archivos desde el explorador de Windows sigue los
siguientes pasos:
        1. Desde el escritorio elige Inicio > Mi PC
        2. En la barra de menús selecciona Herramientas > Opciones de carpeta
        3. Pulsa en la pestaña Ver.
        4. En la lista Configuración avanzada localiza en la parte más inferior de la lista el
            elemento: “Ocultar las extensiones de archivo para tipos de archivo
            conocidos”.
        5. Asegúrate de que la casilla del item mencionado NO está activada.
        6. Pulsa en Aceptar para guardar los cambios.

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 entre
las carpetas de tu disco duro.

En la siguiente tabla se recogen las características diferenciales más significativas de los tres
formatos de imagen recomendados para publicar una imagen en la web.

              JPG                              GIF                                 PNG
Número de colores: 24 bits        Hasta 256 colores                   Número de colores: 24 bits
color o 8 bits B/N                                                    color
Muy alto grado de                 Formato de compresión               Mayor compresión que el
compresión.                                                           formato GIF (+10%)
Posible pérdida de                Sin pérdida de información          Sin pérdida de información
información                       salvo reducción de colores
Admite carga progresiva           Admite carga progresiva.            Admite carga progresiva
No admite fondos                  Admite fondos transparentes         Admite fondos transparentes
transparentes
No permite animación              Permite animación                   No permite animación



1.6 Consejos para la optimización de imágenes
En este apartado se exponen algunos consejos sobre el tratamiento de imágenes para el
diseñ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                                        240
Multimedia 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ámetros
utilizando 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                                           241
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                2. Empezar con GIMP
Imagen ::: Empezar con GIMP                                                             242
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


2.1 ¿Qué es GIMP?
GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para la
manipulación de imágenes. Es una aplicación adecuada para la edición y composición de
imágenes así como para el retoque fotográfico. Esta herramienta es gratuita y representa una
excelente opción frente a otros programas comerciales como Adobe PhotoShop o Paint Shop
Pro.



2.2 Instalación de GIMP
Windows

Para instalar GIMP sobre Windows puedes descargar y ejecutar el archivo instalador gimp-
2.6.8-i686-setup.exe.

En el sitio web oficial del proyecto GIMP podrás encontrar la versión más reciente o que se
adapta a tu sistema: http://www.gimp.org/

Si deseas utilizar la versión portable para Windows descarga y descomprime el siguiente
archivo a una carpeta de tu disco duro o pendrive: GIMP_Portable_2.6.8.paf.exe

Ubuntu

Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. En
el buscador introduce el término GIMP y pulsa en el icono de la lupa para buscar el ítem
correspondiente a esta aplicación. Clic en el botón Instalar que acompaña al ítem Editor de
imágenes GIMP.




Introduce las credenciales de administrador y al cabo de unos instantes dispondrás del
programa GIMP instalado.
Imagen ::: Empezar con GIMP                                                               243
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




2.3 Inicio de GIMP
Windows

    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                                                             244
Multimedia 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 selecciona
Ventanas > Diálogos empotrables > …

Para restaurar estos paneles a la disposición inicial selecciona Editar > Preferencias >
Gestión de la ventana y pulsar en el botón Restaurar las posiciones de ventana guardadas a
los valores predeterminados. Clic en Aceptar y luego en Reiniciar. Si se cierra GIMP y se
vuelve a abrir se mostrarán los paneles por defecto.



2.5 Crear una nueva imagen
    1. Elige Archivo > Nuevo.
Imagen ::: Empezar con GIMP                                                             245
Multimedia 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                                                             246
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




2.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                                                               247
Multimedia 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                                                              248
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    5. Pulsa sobre el botón “+” situado al lado de la etiqueta Seleccione el tipo de archivo
       (Por extensión). El formato de archivo GIMP XCF image (xcf) es un formato
       específico de GIMP. Como veremos más adelante también es posible guardar la
       imagen en formatos GIF, PNG o JPG.




    6. Clic en el botón “-“ Seleccione el tipo de archivo para contraer el panel de elección
       de formato. Observa que ahora el formato elegido aparece a continuación de esta
       etiqueta.
    7. Para terminar pulsa en el botón Guardar.
Imagen ::: Optimización de imágenes                     249
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor




                         3. Optimización de
                                  imágenes
Imagen ::: Optimización de imágenes                                                       250
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor


3.1 Conversión de formatos
El propósito de esta actividad es familiarizarse con el uso de GIMP para convertir una imagen
de 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 estos
formatos.

    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                                                        251
Multimedia 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                                                 252
Multimedia 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                                                    253
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor


Guardar 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                                                      254
Multimedia 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                                                  255
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor




    5. En el cuadro de diálogo Guardar como PNG puedes definir algunos de los siguientes
       parámetros:
            Entrelazado (Adam7). Incluye una copia tosca de la imagen al comienzo de la
               cadena de datos de tal forma que cuando el usuario la descarga desde
               Internet accede rápidamente a su contenido y conforme se va descargando va
               ganando calidad.
            Nivel de compresión: arrastra el deslizador al extremo derecho para definir
               una compresión de valor 9.
Imagen ::: Optimización de imágenes                                                     256
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor

    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                                                      257
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor


3.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                                                   258
Multimedia 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                                  259
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                        4. Dimensiones
                                        de una imagen
Imagen ::: Dimensiones de una imagen                                                     260
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



4.1 Reducir el tamaño de una imagen
Uno de los principales factores que determinan el peso de un archivo gráfico es el tamaño de
la imagen que contiene, es decir, el número de píxeles en anchura y altura. Se recomienda
utilizar 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. Es
aconsejable reducir las dimensiones de la imagen previamente con GIMP u otro editor de
imágenes, crear un nuevo archivo gráfico más ligero y luego integrarlo en la página.

    1. Extrae a una carpeta de tu disco duro el archivo tranvia.jpg contenido en el ZIP que
       se adjunta a continuación: tranvia.zip. Sus características técnicas son: 800x600
       píxeles de tamaño, profundidad de color 24 bits (16,7 millones de colores), resolución
       72 ppp, formato JPG y tamaño del archivo 516 Kb.
    2. Haz doble clic sobre el acceso directo de GIMP situado en el escritorio:




    3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir
       imagen. Navega para situarte en la carpeta que contiene ese archivo. En la lista de
       archivos situada en el centro desplázate con la barra de desplazamiento vertical
       hasta localizar el archivo tranvia.jpg .Clic sobre este archivo. Observa que en el
       recuadro Vista previa se muestra la imagen y sus propiedades.
Imagen ::: Dimensiones de una imagen                                                    261
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


    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                                                    262
Multimedia 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                                                       263
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    17. Cierra esta imagen y repite los pasos 3-16 crear otras dos imágenes que sean
        respectivamente el 30% y 10% de la imagen original partiendo siempre del archivo
        inicial: tranvia.jpg
    18. Abre la carpeta destino y encontrarás en ella los archivos JPG: tranvia.jpg,
        tranvia50.jpg, tranvia30.jpg y tranvia10.jpg que has creado. Si el tamaño de la
        imagen es menor, el archivo que la contiene tendrá menor peso. Como puedes
        comprobar en el ejemplo no es necesario utilizar imágenes de gran tamaño en las
        páginas web. Eso no sólo redundará en una mayor calidad estética sino que hará más
        rápida la navegación facilitando la descarga de archivos gráficos más ligeros.




                    100%                                  50 %           30 %          10 %
                 800x600 píx.                         400x300 píx.    240x180 píx.   80x60 píx.




4.2 Modificar el tamaño del lienzo
En ocasiones es necesario disponer de más lienzo en blanco dentro de una imagen para
añ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                                                   264
Multimedia 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                                                        265
Multimedia 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                                                           266
Multimedia 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                                                  267
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    16. Se muestra el cuadro de título Exportar archivo donde se informa de que el formato
        JPG no conserva las capas por lo que aplanará la imagen para guardarla a
        continuación. Pulsa en el botón Exportar.




    17. En la ventana siguiente: Guardar como JPEG define una calidad del 100% y pulsa en
        el botón Guardar.
Imagen ::: Dimensiones de una imagen                                                    268
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



4.3 Recortado de imágenes
En este apartado se plantea obtener una nueva imagen a partir de la selección y recortado de
un á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 una
estética marcada por la desproporción entre las dimensiones de anchura y altura. Es el caso
de 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                                                   269
Multimedia 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                                        270
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     5. Montaje de imágenes
Imagen ::: Montaje de imágenes                                                             271
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Las herramientas para seleccionar, copiar y pegar facilitan el montaje de imágenes. En esta
práctica se ejemplifican las posibilidades de las distintas herramientas de selección. Estas se
aplican para eliminar ciertas partes de una imagen combinando seleccionar y cortar.

    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                                                            272
Multimedia 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                                                             273
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Con la varita seleccionada, haz clic sobre un punto del área azul de cielo en la imagen
        de la vaca. A continuación selecciona Editar > Limpiar. No olvides realizar esta
        operación también sobre la zona azul que aparece debajo del personaje.




    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                                                           274
Multimedia 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                           275
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor




                 6. Efectos especiales
Imagen ::: Efectos especiales                                                              276
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor



6.1 Filtros
El término “Filtro” proviene de la fotografía tradicional y aludía a una serie de cristales que
se situaban delante del objetivo de la cámara para conseguir efectos especiales. Los filtros
que proporciona GIMP permiten aplicar a una imagen original un sinfín de efectos de retoque
y modificaciones. En esta práctica se explica cómo aplicar un filtro y algunos ejemplos.

    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                                                                277
Multimedia 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 lente




Distorsiones > Página doblada        Artísticos > Aplicar lienzo   Decorativos > Diapositiva




    Decorativos > Esquinas           Decorativos > Foto antigua    Luces y sombras > Sombra
        redondeadas                                                          base



    8. Para guardar la nueva imagen creada, en la barra de menú de esa imagen selecciona
       Archivo > Guardar como …
Imagen ::: Efectos especiales                                                          278
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor


    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 especiales
GIMP proporciona herramientas sencillas para el diseño de un banner de texto. Éste se puede
utilizar 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                                                         279
Multimedia 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                                                          280
Multimedia 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                                                            281
Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor


    13. En el cuadro de diálogo de Opciones admite los parámetros por defecto y pulsa en el
        botón Aceptar.
    14. Al cabo de unos instantes se ha creado un atractivo rótulo.




    15. Para deshacer la aplicación de este efecto, en la ventana de la imagen elige Editar >
        Deshacer.
    16. Repite los pasos 12-15 para probar otros efectos especiales sobre el texto. A
        continuación se proponen algunos.




           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                                                    282
Multimedia 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                          283
Multimedia 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                                              284
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



7.1 Introducción
A menudo es necesario optimizar una colección de fotografías extraídas de la cámara digital
con intención de ajustar sus dimensiones, resolución, formato, etc. para publicarlas en la web
o compartirlas en la red local del centro.

Esto se puede realizar con GIMP, imagen a imagen, aplicando los procedimientos descritos con
anterioridad. Sin embargo cuando se trata de un número elevado de fotos es necesario
realizar un procesamiento por lotes que realice la conversión de forma automática y rápida.
GIMP dispone de un lenguaje de scripts donde es posible automatizar estas tareas. Sin
embargo el diseño y manejo de scripts no resulta intuitivo ni fácil.

En su lugar se propone utilizar el plugin DBP (David's Batch Processor) para GIMP. Este
complemento permite ejecutar de forma automática operaciones en una lista de archivos de
imagen, como por ejemplo, el redimensionamiento. DBP proporciona un entorno gráfico para
crear una lista de imágenes con intención de definir y aplicar operaciones como la corrección
del color, redimensionamiento, recorte, suavizado, cambio de nombre o guardar en otros
formatos. DBP sólo procesa imágenes en modo color RGB mostrando un error cuando se trata
de procesar imágenes en modo color indexado. Por otra parte DBP nunca sobreescribe la
imagen original por lo que es necesario definir la tarea de renombrar o mover a otra carpeta
cada archivo resultante.


7.2 Instalación del plugin DBP de GIMP en
Windows
El plugin DBP no se incluye en la instalación por defecto de GIMP. Es necesario descargarlo e
instalarlo 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                                               285
Multimedia 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                                              286
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



7.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 David's 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                                             287
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    6. En la pestaña Input de David's Batch Processor se habrán añadido las imágenes. Para
       eliminar alguna entrada basta con seleccionarla y pulsar en el botón Remove files
       (Eliminar archivos). Para eliminar la lista completa pulsa en el botón Clear List
       (Borrar lista).

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                                   288
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Paso 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                                              289
Multimedia 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                                            290
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Paso 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                                   291
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                                              8. Flickr:
                                       galería de fotos
Imagen ::: Flickr: galería de fotos                                                      292
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



8.1 Introducción
Flickr (http://www.flickr.com) es un servicio Web 2.0 donde puedes administrar y compartir
tus fotos en línea. Las características más destacadas de este servicio son:

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

La exploración de todas las posibilidades de Flickr excede el propósito de este curso. Se
propone centrarse en la utilización de estas imágenes en línea en 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 Flickr
se 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                                                    293
Multimedia 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                                                    294
Multimedia 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                                                      295
Multimedia 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                                                      296
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



8.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                                                  297
Multimedia 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                                                     298
Multimedia 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                                                   299
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


8.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                                                      300
Multimedia 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 previa


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.



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                                                    301
Multimedia 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                                                     302
Multimedia 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                                                      303
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


8.6 Publicación                        de        presentación            Flickr         en
Wordpress
    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                                                       304
Multimedia 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                                305
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                                       9. Picasa Web,
                                      álbums de fotos
Imagen ::: Picasa Web, álbums de fotos                                                    306
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



9.1 ¿Qué es Picasa Web?
Picasa Web (http://picasaweb.google.com/)         es un servicio Web 2.0 asociado a las
credenciales de usuario Google donde puedes administrar y compartir tus fotos en línea. Las
caracterí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 instala
en el equipo para manejar y editar nuestros archivos de fotos en local y por otra parte Picasa
Web que es la aplicación web que nos permite almacenarlas en un servidor remoto para
compartirlas con los demás. La exploración de todas las posibilidades de ambas aplicaciones
excede el propósito de este curso. Por ello se propone incidir especialmente en la integración
de estas imágenes en línea en los artículos de tu blog.

Para utilizar Picasa Web es necesario disponer de una cuenta en Google. Si ya dispones de
credenciales para tu blog de Blogger conviene que utlices las mismas. Existen dos formas
alternativas para acceder a Picasa Web:

       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 Blogs
con Blogger verás que ya dispones de algunas fotos subidas en tu cuenta. Esto es debido a que
cuando subes imágenes en los artículos de tu blog en Blogger, éstas se guardan
automáticamente en un álbum de Picasa Web con el nombre asignado al blog. Desde Picasa
Web puedes administrar estas fotos pero hazlo con cautela porque si eliminas una fotografía
desde aquí puede ocurrir que ésta no se vea luego en el correspondiente artículo de tu blog.
Imagen ::: Picasa Web, álbums de fotos                                              307
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



9.2 Subir fotografías a Picasa Web I
A continuación se explica el procedimiento para subir fotos a tu cuenta de Picasa Web
utilizando 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                                                   308
Multimedia 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                                                   309
Multimedia 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                                                 310
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



9.3 Subir fotografías a Picasa Web II
En este apartado vamos a explicar el procedimiento para crear un álbum y subir las imágenes
a 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                                                311
Multimedia 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                                                  312
Multimedia 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                                                   313
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    11. Para subir este álbum haz clic derecho sobre él y elige la opción Subir a los Álbumes
        web …




    12. Introduce las credenciales de acceso a tu cuenta en Picasa Web y pulsa en el botón
        Acceder.
Imagen ::: Picasa Web, álbums de fotos                                               314
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    13. Se crea el nuevo álbum en Picasa Web y se ofrecen, entre otros, los siguientes
        parámetros de configuración:
            a. Tamaño para subir. En este caso vamos a elegir Pequeño: 640 píxeles (blogs
               y páginas web) porque será el destino final de publicación de algunas de
               estas imágenes.
            b. Visibilidad para este álbum. En este caso elegiremos Público.
Imagen ::: Picasa Web, álbums de fotos                                                     315
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




    14. Clic en el botón Subir. Se inicia un proceso de subida progresiva de las distintas
        imágenes que se muestra en el Administrador de subidas.




    15. Al finalizar el proceso con éxito se mostrará un mensaje de proceso finalizado. Clic en
        el botón Ver online y cierra la ventana del Administrador de subidas.
Imagen ::: Picasa Web, álbums de fotos                                                  316
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




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




9.4 Publicación de una imagen Picasa en el blog
9.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                                                  317
Multimedia 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                                                     318
Multimedia 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                                                 319
Multimedia 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                                                 320
Multimedia 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                                                  321
Multimedia 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                                               322
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




9.6 Publicación                        de        presentación         Picasa        en
Wordpress
    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                                                  323
Multimedia 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                                                     324
Multimedia 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                        325
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                                          10. Slide.com:
                                         presentaciones
                                                 de fotos
Imagen ::: Slide.com : presentaciones de fotos                                             326
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



10.1 ¿Qué es Slide.com?
Slide.com (http://www.slide.com) es un servicio web 2.0 que nos permite subir una
colección de imágenes y luego obtener en línea una atractiva presentación que las muestra de
forma secuencial y con efectos especiales. Esta presentación tendrá una URL que podemos
compartir con otras personas. También es posible integrarla dentro de una página web o
artículo de un blog. Este servicio puede resultar interesante para publicar las fotos de los
distintos 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                                            327
Multimedia 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                                         328
Multimedia 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                                           329
Multimedia 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                                        330
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado



10.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                                         331
Multimedia 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                                         332
Multimedia 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                                             333
Multimedia 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                        334
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                         11. Slideshare:
                                         presentaciones
                                                 en línea
Imagen ::: Slideshare, presentaciones en línea                                           335
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



11.1 ¿Qué es Slideshare.net?
Slideshare (http://www.Slideshare.net) es un servicio de alojamiento y publicación en línea
de presentaciones realizadas con herramientas como Powerpoint u OpenOffice. Puedes
utilizarlo para subir tus presentaciones y compartirlas. También puedes buscar y utilizar las
realizadas por otras personas. En este curso se propone Slideshare como una interesante
opción para publicar en la web nuestras propias presentaciones y luego poder integrarlas en
el código HTML de una página de tu blog.

Conviene registrarse previamente para crear tu cuenta en Slideshare. Para ello haz clic en el
enlace Signup y completa el formulario indicando email, usuario y contraseña. A partir de ese
momento 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                                           336
Multimedia 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                                            337
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    14. Clic en la imagen que muestra la presentación que acabamos de subir. De esta forma
        se accede a la visualización de esta presentación.




Notas:

        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                                         338
Multimedia 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                                       339
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Nota:

       Esta integración HTML también se puede realizar con presentaciones publicadas por
        otras personas. Al situarse en su página también se ofrece el código Embed para
        copiar y pegar en nuestra página web.
Imagen ::: Slideshare, presentaciones en línea                                         340
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



11.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                                           341
Multimedia 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                                                342
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                    12. Google Maps
Imagen ::: Google Maps                                                                    343
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



12.1 ¿Qué es Google Maps?
Google Maps (http://maps.google.es/) proporciona herramientas para la integración de
mapas geográficos en nuestro sitio web o blog. De esta forma es posible proporcionar a los
lectores 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 recursos
multimedia: 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                                                                 344
Multimedia 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                                                                  345
Multimedia 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                                                                 346
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    16. Tras pulsar en Listo se visualizará el mapa tal y como lo verá un visitante. Puedes
        navegar por él y comprobar si la información que se muestra en los distintos
        marcadores es correcta y se visualiza adecuadamente al pulsar sobre cada uno de los
        marcadores. Para cambiar algún dato sería necesario pulsar en el botón Editar.




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                                                                347
Multimedia 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                                                                  348
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




12.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                                                                   349
Multimedia 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                                                351
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado




                                        1. Introducción
Audio ::: Introducción                                                                   352
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


1.1 Conceptos básicos del sonido digital
Frecuencia.
Es el número de vibraciones por segundo que da origen al sonido analógico. El espectro de un
sonido se caracteriza por su rango de frecuencias. Ésta se mide en Hertzios (Hz). El oído
humano capta sólo aquellos sonidos comprendidos en el rango de frecuencias 20 Hz y 20.000
Hz.

Tasa de muestreo (sample rate).
Un audio digital es una secuencia de ceros y unos que se obtiene del muestreo de la señal
analógica. La tasa de muestreo o sample rate define cada cuánto tiempo se tomará el valor
de la señal analógica para generar el audio digital. Esta tasa se mide en Hertzios (Hz). Por
ejemplo: 44100 Hz. nos indica que en un segundo se tomaron 44100 muestras de la señal
analógica de audio para crear el audio digital correspondiente. Un audio tendrá más calidad
cuanto mayor sea su tasa de muestreo. Algunas frecuencias estándares son 44100 Hz., 22050
Hz., y 11025 Hz.

Resolución (bit resolution)
Es el número de bits utilizados para almacenar cada muestra de la señal analógica. Una
resolución de 8-bits proporciona 256 (28) niveles de amplitud, mientras que una resolución de
16-bits alcanza 65536 (216). Un audio digital tendrá más calidad cuanto mayor sea su
resolució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 de
ese 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 : 8
bits/bytes : 1024 bytes/Kbytes : 1024 Kbytes/Mbytes = 2,81 MBytes ó Mb). Por ejemplo en los
audios en formato MP3 se suele trabajar con bitrates de 128 kbps (kilobits por segundo). El
audio 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 a
la descarga por Internet.

CBR/VBR
Constant/Variable Bitrate. CBR indica que el audio ha sido codificado manteniendo el bitrate
constante a lo largo del clip de audio mientras que VBR varía entre un rango máximo y
mínimo en función de la tasa de transferencia.

Códec.
Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el
número de bytes que ocupa un archivo de audio. Los archivos codificados con un codec
específico requieren el mismo códec para ser decodificados y reproducidos. El códec más
utilizado en audio es el MP3.

Decibelio.
Unidad de medida del volumen o intensidad de un sonido. El silencio o ausencia de sonido se
cuantifica como 0 dB y el umbral del dolor para el oído humano se sitúa en torno a los 130-
140 dB.
Audio ::: Introducción                                                                 353
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


1.2 Formatos de archivos de audio
Las audios digitales se pueden guardar en distintos formatos. Cada uno se corresponde con
una extensión específica del archivo que lo contiene. Existen muchos tipos de formatos de
audio 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 y
universales: 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 por
lo que se comentan aparte sus características.
Audio ::: Introducción                                                                    354
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado


Formato MIDI

       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 audio
Para optimizar el peso del archivo de audio será necesario utilizar un editor para reducir
alguno 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 necesarios
para realizar estas tareas sobre un audio original utilizando el editor Audacity.
Audio ::: Primeros pasos con Audacity                                 355
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                              2. Primeros pasos
                                   con Audacity
Audio ::: Primeros pasos con Audacity                                                    356
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




2.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 Windows
Paso 1. Instalación de Audacity

Descarga 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á un
icono de acceso directo en el escritorio.
Otra posibilidad es descargar y descomprimir en una carpeta de tu disco duro o pendrive la
versión portable para Windows: audacity-win-unicode-1.3.12.zip. Esta versión no necesita
instalación.
En el sitio web oficial del proyecto Audacity podrás encontrar la versión más reciente o que
se adapta a tu sistema: http://audacity.sourceforge.net/

Paso 2. Instalación de los códecs LAME y FFmpeg

Para poder realizar con Audacity la importación y exportación de audio a distintos formatos,
por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser
interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo.
No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de
licencias de uso.

    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                                                   357
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




2.3 Instalación del programa en Ubuntu
Paso 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 FFmpeg

Para poder realizar con Audacity la importación y exportación de audio a distintos formatos,
por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser
interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo.
No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de
licencias de uso.

    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                                                   358
Multimedia 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                                                     359
Multimedia 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                                                      360
Multimedia 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                                                   361
Multimedia 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                                                       362
Multimedia 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                          363
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                       3. Reproducción de
                       audio con Audacity
Audio ::: Reproducción de audio con Audacity                                                 364
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


3.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                                         365
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


3.3 Propiedades de un archivo de audio
Para conocer las propiedades de un archivo de audio o de vídeo se propone el uso del
software 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.exe




3.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                                           366
Multimedia 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                                             367
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



3.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                                                368
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Nota:

        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                                      369
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                        4.Optimización
                                             de audios
Audio ::: Optimización de audios                                                           370
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.1 Conversión de formato WAV a MP3
En esta actividad se detalla el procedimiento para convertir un archivo de audio del formato
WAV al MP3. Cómo se explicó en el primer capítulo, el formato *.WAV puede almacenar el
sonido en calidad pura y es ideal para guardar audios originales. Sin embargo para publicar un
audio es preferible transformarlo al formato *.MP3 ya que se reduce considerablemente el
peso 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                                                       371
Multimedia 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                                                        372
Multimedia 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 MP3
En ocasiones puede interesar reducir aún más el peso del archivo MP3 que se origina durante
el 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                                                          373
Multimedia 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 mono
En la mayoría de los casos no es necesario disponer de una locución o sonido en estéreo. Su
versión en mono satisface dignamente el propósito de la aplicación. Esta operación supone
reducir el tamaño del archivo. En este apartado se describen los pasos para realizarlo usando
Audacity.

    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                                                         374
Multimedia 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                                                       375
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    7. Haz clic sobre el botón “X” cerrar situado en el encabezado de la onda del canal
       Derecho. (También se podría hacer eliminando el canal Izquierdo) . De los dos
       cuadros que muestran la onda sonora será el situado más abajo. Con esta operación se
       elimina la onda sonora del canal derecho.




    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                                                       376
Multimedia 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                                                          377
Multimedia 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 WAV
Cuando 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                                                         378
Multimedia 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                                                        379
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    12. Desde el explorador de archivos visualiza el detalle de la lista de archivos que has
        creado. Comprueba la reducción de peso que tienen los distintos formatos de
        compresión WAV.
Audio ::: La grabación de audio                                       380
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                        5. La grabación
                                               de audio
Audio ::: La grabación de audio                                                            381
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.1 Crear una grabación de voz
En el diseño de una aplicación educativa puede resultar interesante añadir discursos sonoros
con carácter explicativo o de refuerzo. En este ejemplo se describe el proceso para crear un
archivo 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                                                            382
Multimedia 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                                                         383
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    21. Introduce como nombre de archivo, por ejemplo, locución_32 y pulsa en el botón
        Guardar.


5.2 Grabar audio de un CD
Aunque hay otros programas que facilitan la extracción directa de música de un CD, con
Audacity 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                                                          384
Multimedia 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                                              385
Multimedia 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                                                         386
Multimedia 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 radio
En esta práctica vamos a utilizar Audacity para grabar un fragmento de audio extraído de una
emisió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                                                          387
Multimedia 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 MIDI
En esta práctica vamos a utilizar Audacity para grabar un fragmento de audio a partir de la
reproducción de un archivo MIDI. Esta operación no suele aplicarse para optimizar un archivo
MIDI ya que éste es un formato muy ligero sino para incorporar esta fuente de música al panel
de 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                                                         388
Multimedia 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                                                       389
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Notas:
    Como se indica en el primer apartado de este capítulo, recuerda que la tasa y
       resolución de muestreo se definen en Archivo > Preferencias > Calidad. Esto se hace
       previamente a la grabación.
    Recuerda que Audacity no permite importar ni editar archivos MIDI.
Audio ::: Montajes de audio                                           390
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                6. Montajes de audio
Audio ::: Montajes de audio                                                                391
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


6.1 Seleccionar un fragmento de onda
La 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 con
intención de eliminarlo o bien conservarlo descartando el resto no seleccionado. Por otra
parte la aplicación de un efecto siempre se realiza sobre un tramo de onda seleccionada
previamente.

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                                                               392
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    Veamos por ejemplo el procedimiento para seleccionar el fragmento musical comprendido
entre 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                                                                 393
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

       Editar > Seleccionar > Desde el principio hasta el cursor: Al hacer un clic sobre la
        onda para fijar la posición de la línea de cursor y luego utilizar esta opción, se
        selecciona la porción comprendida entre el principio de la grabación y la posición de
        la línea de cursor.
       Editar > Seleccionar > Desde el cursor hasta el final: Al hacer clic sobre la onda
        para fijar la posición de la línea de cursor y luego aplicar este comando, se selecciona
        el tramo comprendido entre la línea de cursor y el final de la grabación.

Otra posibilidad es realizar una selección aproximada sobre la onda utilizando la herramienta
Selección y luego hacer clic sobre los valores numéricos hhmmss (h=horas, m=minutos,
s=segundos) de INICIO y FIN que aparecen en la barra de selección inferior. De esta forma se
introducen por teclado estos valores permitiendo un ajuste con una precisión de milésimas de
segundo.




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                                                              394
Multimedia 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                                                              395
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


6.5 Crear un loop de audio
El archivo de un audio de duración media o larga suele tener un peso elevado para
reproducirse previa descarga a través de Internet, incluso si se trata de un archivo MP3. A
veces la situación admite emplear como recurso alternativo un audio más corto pero que
reproducido en bucle con “n” repeticiones transmite la sensación de un acompañamiento más
largo. Esto es especialmente útil en sonidos de fondo. En esta práctica vamos a crear un loop
a 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                                                               396
Multimedia 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 audio
Con 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 play
se 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                                                            397
Multimedia 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                                                               398
Multimedia 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                                             399
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                              7. Aplicar efectos
Audio ::: Aplicar efectos                                                                   400
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Audacity proporciona múltiples efectos que se pueden aplicar a un fragmento de audio
digital: 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                                                              401
Multimedia 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                                                              402
Multimedia 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                                                                   403
Multimedia 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                                                                    404
Multimedia 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                                                                 405
Multimedia 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                                406
Multimedia 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                                                       407
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.1 CDex en Windows
8.1.1 ¿Qué es CDex?
CDEX (http://cdexos.sourceforge.net/) es un programa gratuito para Windows que nos va
permitir extraer directamente un fragmento musical de un CD de audio o bien de una fuente
de sonido conectada al ordenador para guardarlo en un archivo en formato WAV o MP3.

8.1.2 Instalación de CDex
Descarga y ejecuta el instalador de CDex para Windows: cdex_170b2_enu.exe. El programa
se 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 la
versió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 se
adapta 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                                                     408
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     6. Para iniciar la captura de la pista/s elegida/s pulsa en alguno de los botones que
        aparecen en la barra derecha.




        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                                                    409
Multimedia 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                                                   410
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2 Sound Juicer en Ubuntu
8.2.1 ¿Qué es Sound Juicer?
Sound Juicer es un programa que suele venir instalado por defecto en Ubuntu y que se
utiliza para reproducir las pistas de audio de un CD y para extraerlas a archivos OGG y MP3.

8.2.2 Instalación de Sound Juicer
Para 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 es
necesario instalar previamente el paquete gstreamer0.10-plugins-ugly-multiverse. Para ello
sigue 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 Juicer
Para 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                                                      411
Multimedia 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                                                 412
Multimedia 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                             413
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                 9. Integración de
                                  audio en el blog
Audio ::: Integración de audio en Blogger                             414
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                            9.1 Integración de
                             audio en Blogger
Audio ::: Integración de audio en Blogger                                                   415
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

En este apartado se explica el procedimiento para integrar un audio en un artículo de tu blog
utilizando 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 puede
añadir fácilmente a un artículo para que el lector al interactuar con él pueda escuchar un
audio 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                                                 416
Multimedia 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                                                  417
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    12. Repite el paso anterior para subir el archivo del reproductor player.swf. El archivo de
        texto brahms.txt y la imagen brahms.jpg no se subirán porque se utilizarán para
        elaborar la entrada en el blog.




    13. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a
        ella.


9.1.2 Generar el código para incrustar
En este paso vamos a utilizar un asistente para generar el código HTML necesario para
incrustar (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                                             418
Multimedia 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                                                  419
Multimedia 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                                                  420
Multimedia 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                                                421
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    16. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    17. Regresa a la página de Generador de código de Pixelout y en el cuadro del código
        haz clic derecho para elegir Seleccionar todo. Repite clic derecho sobre la selección
        para hacer clic en Copiar.
    18. Sitúate en la edición HTML del artículo del blog al final del mismo. Clic derecho y
        selecciona Pegar. Esta acción pegará el código HTML generado anteriormente.




    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                                                 422
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.1.4 Los                  parámetros                  de        configuración           de
PixelOut
El reproductor de PixelOut admite personalizar su interfaz definiendo distintos valores en las
variables que aparecen en el parámetro flashvars. Fíjate que esta cadena utiliza el formato
variable=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                                              423
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


       righticonhover=0xHHHHHH Right icon color (hover). Color del icono derecho al situar
        el ratón sobre él.
       text=0xHHHHHH Text color . Color del texto.
       slider=0xHHHHHH Slider color . Color del deslizador.
       loader=0xHHHHHH Loader bar color . Color de la barra de carga.
       track=0xHHHHHH Progress track color . Color de la barra de progreso de la pista.
       border=0xHHHHHH Progress track border color. Color del borde de la barra de
        progreso de pista.
Audio ::: Integración de audio en Wordpress                           424
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                       9.2 Integración de
                      audio en Wordpress
Audio ::: Integración de audio en Wordpress                                               425
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



9.2.1 Subida de archivos a Google Sites
Actualmente Wordpress.com NO permite de forma gratuita subir y guardar archivos MP3 en
su servidor para luego publicarlos en las entradas de tu blog. Por este motivo es necesario
disponer de un espacio adicional de alojamiento de archivos de audio MP3. En este curso se
propone utilizar el espacio gratuito proporcionado por Google Sites para aquellos usuarios con
identidad digital en Google.


    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. En este caso no utilizaremos el archivo
       player.swf que se reserva para la integración en un blog de Blogger.




    2. Accede a la web de Google: http://www.google.es. Clic en el botón Acceder.




    3. Introduce las credenciales de tu cuenta Google (correo electrónico y contraseña) y
       pulsa en el botón Acceder.




    4. En el menú de opciones de la barra horizontal superior izquierda pulsa en Más > Sites.
Audio ::: Integración de audio en Wordpress                                                 426
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. En el listado de Mis sitios haz clic en el enlace Mi Sitio para acceder al sitio por
       defecto     asociado    a    la   cuenta.    Su     URL     de   acceso     público    es
       http://sites.google.com/site/<nombre_usuario>. En este caso vamos a guardar en
       este espacio el archivo de audio MP3 que vamos necesitar para luego enlazarlos desde
       el blog.
    6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los
       archivos se propone crear una carpeta de nombre audio donde guardar los archivos
       pdf. Clic en el botón Crear página.




    7. Elige como plantilla la opción Archivador.
Audio ::: Integración de audio en Wordpress                                              427
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    8. En Nombre introduce audios. Observa que la carpeta contenedora de archivos se
       creará en la ruta: /site/<nombre_usuario>/audios. Clic en el botón Crear página.




    9. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir
       archivo.




    10. En el cuadro de diálogo Añadir archivo pulsa en el botón Examinar para localizar y
        subir el archivo del audio MP3 danzahungara.mp3. Puedes introducir opcionalmente
        una descripción del archivo. Clic en el botón Subir.




    11. Al cabo de unos instantes se mostrará una entrada al archivo de audio alojado en el
        servidor.
Audio ::: Integración de audio en Wordpress                                             428
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    12. Sobre el enlace Descargar haz clic derecho y selecciona la opción Copiar la ruta del
        enlace. De esta forma se copiará el enlace.




    13. Abre el Bloc de Notas mediante Inicio > Todos los programas > Accesorios > Bloc de
        Notas y dentro de este programa elige Edición > Pegar.




    14. La dirección URL del archivo de audio será del tipo:

       https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3?attredi
rects=0&d=1

        donde debes eliminar la coletilla a partir del signo de interrogación ? dejando
exclusivamente la URL directa a ese archivo de audio:

        https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3

Recuerda que esta dirección será utilizada más adelante para integrar este audio en las
entradas de tu blog en Wordpress.com
Audio ::: Integración de audio en Wordpress                                                429
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



9.2.2 Crear el artículo en Wordpress
    1. Abre una nueva pestaña del navegador web y accede a la administración de tu blog en
       Wordpress.
    2. En la columna izquierda selecciona Entradas > Añadir.




    3. Utiliza el explorador de archivos para abrir (doble clic) el archivo de texto
       brahms.txt. Se abrirá el Bloc de Notas mostrando su contenido.
    4. 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.
    5. Regresa al navegador web que muestra el editor de Nueva entrada de Wordpress.
       Teclea el título: Brahms.
    6. 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.




    7. En la barra de herramientas del editor haz clic en el botón Añadir Imagen.
Audio ::: Integración de audio en Wordpress                                               430
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    8. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el
       botón Elegir archivos para localizar y señalar el archivo brahms.jpg que hemos
       obtenido en un paso anterior.




    9. Una vez completado el proceso de subida de la imagen al servidor se mostrará en la
       parte inferior una miniatura de la imagen. Configura los siguientes parámetros de la
       imagen:
            Título de la imagen: Brahms
            URL del enlace. Haz clic en el botón Ninguna para eliminar el enlace de la
               imagen.
            Alineación. Selecciona la opción Izquierda.
            Tamaño. Elige la opción Full Size o completa.

    10. Para insertar la imagen en la entrada pulsa en el botón Insertar en la entrada.
Audio ::: Integración de audio en Wordpress                                                431
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    11. De regreso al editor elimina las etiquetas [imagen] y [audio]. Se utilizan para indicar
        la posición de estos elementos en el artículo pero carecen de utilidad cuando se
        añadan estos elementos al artículo.


9.2.3 Reproductor de audio en Wordpress
        1. Clic en la pestaña HTML para mostrar el código HTML del artículo.




        2. Regresa al Bloc de Notas que tenías abierto del paso anterior para reescribir la
           siguiente etiqueta:

         [audio https://sites.google.com/site/<usuario>/audios/danzahungara.mp3]

        Observa que esta etiqueta contiene la URL donde está archivado el audio MP3 en
        Google Sites.
Audio ::: Integración de audio en Wordpress                                             432
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



        3. Selecciona esta etiqueta y elige Edición > Copiar.
        4. Clic derecho sobre el editor de la entrada y elige Pegar.
        5. Haz clic en el botón Publicar.




        6. Para ver el resultado final haz clic en el botón Ver entrada.




9.2.4 Los parámetros de configuración
El reproductor admite personalizar su interfaz definiendo distintos valores en sus distintos
parámetros.




Propiedades de color:

       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.
       righticonhover=0xHHHHHH Right icon color (hover). Color del icono derecho al situar
        el ratón sobre él.
Audio ::: Integración de audio en Wordpress                                            433
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


       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.

Otros valores:

       animation=no (el reproductor se ofrece abierto por defecto)
       remaining=yes (muestra el tiempo restante en lugar del tiempo transcurrido)
       loop=yes (reproduce en bucle)
       initialvolume=80 (0 – 100, 60 es el volumen por defecto)
       width=180 (la anchura por defecto es de 290 píxeles)


Para utilizar estos parámetros se añaden a la etiqueta [audio … utilizando el signo “|” sin
dejar espacios en blanco a partir de la extensión mp3 del nombre del archivo.

Ejemplo:

[https://sites.google.com/site/<usuario>/audios/danzahungara.mp3|width=260|loop=yes]
Audio ::: Repositorios Web 2.0 de audio                               434
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                10. Repositorios
                               Web 2.0 de audio
Audio ::: Repositorios Web 2.0 de audio                                                    435
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

En la Web 2.0 existen espacios que ofrecen la posibilidad a los usuarios de subir y compartir
audios en formato MP3 que luego podemos integrar en los artículos de nuestro blog. Hay
multitud de espacios que ofrecen un esquema parecido de funcionamiento: subir archivos de
audio, copiar el código y pegarlo en el código HTML del artículo. En este apartado se
describen a modo de ejemplo: Goear y SoundCloud pero se anima al lector a buscar otros por
Internet porque la oferta es amplia y variada.



10.1 Goear

10.1.1 ¿Qué es GoEar?
GoEar (http://www.goear.com/) es un servicio Web 2.0 que permite subir y guardar en su
servidor archivos de audio. A cada recurso sonoro se le puede asignar información textual:
título de la canción y descripción. Esto facilita su búsqueda. Cada pista de audio dispondrá de
una página propia donde se proporciona un código HTML para insertar su reproductor en un
artículo de nuestro blog.




10.1.2 Subir tu audio mp3 a GoEar

    1. Descarga y descomprime el archivo africa.zip. Como resultado obtendrás el archivo
       de audio MP3: africa.mp3.
    2. Para subir un archivo de audio a GoEar es necesario disponer de una cuenta de acceso
       a este servicio. Para obtener una cuenta haz clic en Register y completa el formulario
    3. Desde la portada de GoEar haz clic en Login e introduce tus credenciales.
    4. Clic en Upload (Subir) para subir el archivo MP3.




    5. Rellena los distintos datos del audio: Título, Autor, Género y Descripción.
    6. Clic en el botón Examinar para localizar el audio MP3 guardado en tu equipo.
Audio ::: Repositorios Web 2.0 de audio                                                   436
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    7. Para finalizar pulsa en el botón Upload (Subir).
    8. Al cabo de unos segundos si la subida se ha producido con éxito se mostrará un
       mensaje y un enlace donde puedes hacer clic para escucharla: clicking here.




    9. Se muestra el reproductor de audio de GoEar reproduciendo el MP3 subido. Si deseas
       compartir con otros usuarios este MP3 puedes copiar y pegar en un email el enlace
       que se proporciona en el cuadro de texto Share it! (Compártelo). Como se verá más
       adelante el código HTML que se proporciona en el cuadro de texto This song in your
       site (Esta canción en tu sitio) se puede utilizar para insertar este audio en tu página
       web o artículo de blog.




10.1.3 Publicación de un audio de GoEar en Blogger
    1. Abre el navegador y visita la web de GoEar: http://www.goear.com/
    2. Utiliza el buscador para situarte en la reproducción del audio que desees insertar en
       tu página HTML
Audio ::: Repositorios Web 2.0 de audio                                                     437
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada.




    4. Clic derecho sobre el cuadro This song in your site (Esta canción en tu sitio) y elige la
       opción Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.




    5. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en NUEVA
       ENTRADA. Introduce como título “Música africana” y en el editor del artículo haz
       clic en el enlace Edición de HTML.




    6. Sobre el editor haz clic derecho y selecciona Pegar.




    7. Clic en el botón PUBLICAR ENTRADA. Al visualizar la entrada en el frontend del blog
       se mostrará la consola de Goear permitiendo escuchar el audio subido.
Audio ::: Repositorios Web 2.0 de audio                                                 438
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




10.1.4 Publicación de un audio de GoEar en Wordpress
Wordpress.com no admite la integración de código embed. Sin embargo es posible aplicar un
truco para averiguar la dirección URL del audio MP3 subido a Goear y luego insertar ese
archivo de audio a una entrada de Wordpress.com


    1. Abre el navegador Mozilla Firefox y visita la web de GoEar: http://www.goear.com/.
       Con intención de facilitar la búsqueda vacía la caché del navegador web mediante:
       Herramientas > Limpiar el historial reciente. En el cuadro de diálogo Limpiar el
       historial reciente visualiza los Detalles y asegúrate de que está marcado el ítem
       Caché. Clic en el botón Limpiar ahora.




    2. Utiliza el buscador para situarte en la reproducción del audio que desees insertar en
       tu página HTML
Audio ::: Repositorios Web 2.0 de audio                                               439
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada. Es
       importante que la canción se descargue por completo para que se almacene en la
       carpeta caché del navegador.




    4. En la barra de dirección del navegador Firefox teclea como dirección about:cache y
       pulsa la tecla enter para visualizar el contenido de la caché almacenada en el
       navegador web.




    5. Desde la página que muestra los contenidos de la caché haz clic en el enlace List
       Cache Entries (Listado de Entradas de la Caché) en el apartado Disk cache device
       (caché de disco). Esta acción muestra la lista de archivos almacenados en la caché.




    6. Elige Edición > Buscar. Introduce el término mp3 y pulsa en el botón Siguiente para
       buscar en el listado el archivo MP3 cacheado.
Audio ::: Repositorios Web 2.0 de audio                                                             440
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    7. Esta búsqueda permite disponer de la URL del archivo del tipo:

        http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188.
        mp3

    8. Clic derecho sobre esta dirección para elegir la opción Copiar la ruta del enlace.
    9. En el interfaz de gestión de contenidos de tu blog en Wordpress haz clic en Entrada >
        Añadir. Introduce como título “Música africana” y en el editor del artículo haz clic
        en la pestaña HTML
    10. Sobre el editor haz clic derecho y selecciona Pegar. Completa la etiqueta para que
        tenga la forma:

        [audio http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188.mp3]




    11. Clic en el botón Publicar. Al visualizar la entrada en el frontend del blog se mostrará
        el reproductor de Wordpress mostrando el audio alojado en Goear.




10.2 SoundCloud

10.2.1 ¿Qué es SoundCloud?
SoundCloud (http://soundcloud.com) es un servicio Web 2.0 gratuito para subir archivos de
audio. Cada cuenta gratuita dispone de una capacidad máxima de 120 minutos de audio.
Ofrece un interesante y fácil interfaz web para organizar estos archivos y compartirlos en
público o sólo con ciertos usuarios. También facilita la integración en nuestro blog de cada
archivo.
Audio ::: Repositorios Web 2.0 de audio                                                   441
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




10.2.2 Subir tu audio mp3 a SoundCloud
    1. Descarga y descomprime el archivo dreadloc.zip. Como resultado obtendrás el
       archivo de audio MP3: dreadloc.mp3.
    2. Para subir un archivo de audio a SoundCloud es necesario disponer de una cuenta de
       acceso a este servicio.
    3. Desde la portada de SoundCloud haz clic en Login In e introduce tus credenciales.
    4. Si el proceso de autentificación ha tenido éxito te mostrará el escritorio (DashBoard)
       con todos los archivos subidos en tu cuenta.
    5. Clic en Upload & Send (Subir y enviar) para iniciar el proceso de subida de un archivo
       MP3.




    6. Clic en el botón Choose files (elegir archivos) para localizar el archivo dreadloc.mp3.
    7. Una vez completa la subida del archivo se ofrece la oportunidad de incorporar los
       metadatos asociados a ese audio. En el apartado Track info (Información de la pista
       de audio) añade Ambiente Reggae al nombre (Track name) y descripción de ese
       audio (Track description).




    8. En el apartado Who is this track for? (¿Para quién es esta pista?) define la pista como
       pública.
Audio ::: Repositorios Web 2.0 de audio                                             442
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    9. Para concluir haz clic en el botón Save Track (Guardar pista).




10.2.3 Publicación de un audio de SoundCloud en Blogger
    1. Para localizar una pista ya subida, una vez que te has autentificado, elige You >
       Tracks(X) (Tú > Pistas(X)). Se muestra el listado de todos los audios subidos.
    2. En la consola de reproducción del audio “Ambiente Reggae” haz clic en el enlace
       Share (Compartir)




    3. En el código <object …> haz clic derecho y elige Copiar.
Audio ::: Repositorios Web 2.0 de audio                                               443
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    4. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en NUEVA
       ENTRADA. Introduce como título “Ambiente Reggae” y en el editor del artículo haz
       clic en el enlace Edición de HTML.




    5. Sobre el editor haz clic derecho y selecciona Pegar.




    6. Clic en el botón PUBLICAR ENTRADA. Al visualizar la entrada en el frontend del blog
       se mostrará la consola de SoundCloud permitiendo escuchar el audio subido.




Nota: También es posible integrar en el blog un reproductor soundCloud con el audio
compartido por otro usuario.


10.2.4 Publicación de un audio de SoundCloud en Wordpress
    1. Para localizar una pista ya subida, una vez que te has autentificado, elige You >
       Tracks(X) (Tú > Pistas(X)). Se muestra el listado de todos los audios subidos.
    2. En la consola de reproducción del audio “Ambiente Reggae” haz clic en el enlace
       Share (Compartir)
Audio ::: Repositorios Web 2.0 de audio                                                 444
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    3. Clic en el icono de Wordpress.




    4. Se muestra el cuadro de diálogo Share to Wordpress.com (Compartir en
       Wordpress.com). Clic derecho sobre el código que se proporciona y elige Copiar.




    5. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en Entradas
       > Añadir. Introduce como título “Ambiente Reggae” y en el editor del artículo haz
       clic en la pestaña HTML.
Audio ::: Repositorios Web 2.0 de audio                                                   445
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    6. Sobre el editor haz clic derecho y selecciona Pegar.
    7. Clic en el botón Publicar. Al visualizar la entrada en el frontend del blog se mostrará
       la consola de SoundCloud permitiendo escuchar el audio subido.




Nota: También es posible integrar en el blog un reproductor soundCloud con el audio
compartido por otro usuario.
Módulo 4.Vídeo
Vídeo y animaciones ::: Introducción                                  447
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                        1. Introducción
Vídeo y animaciones ::: Introducción                                                      448
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


1.1 Conceptos básicos de vídeo digital
Dimensiones.
Es el tamaño del video (ancho x alto) expresado en píxeles cuando se visualiza al 100%, sin
agrandar ni reducir. Los reproductores pueden mostrar un video a pantalla completa o con
una ampliación del 200%, 300%, etc. En estos casos el video pierde calidad de imagen y esta
pérdida depende del formato de archivo. Un video AVI puede tener cualquier ancho y alto
mientras que los estándares de VideoCD son 352 x 288 y de DVD 720 x 576.

Codec.
Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el
número de bytes que ocupa un archivo de video. Los archivos codificados con un códec
específico requieren el mismo códec para ser decodificados y reproducidos. Algunos de los
códecs más utilizados para el formato AVI son: DivX, XviD, CinePak, Intel Indeo 5, DV, etc.

Velocidad de transmisión (bitrate)
El bitrate define la cantidad de espacio físico (en bits) que ocupa un segundo de duración de
ese video. El video tendrá más calidad cuanto mayor sea su bitrate y el archivo que lo
contiene tendrá mayor peso. El bitrate puede ser fijo o variable. El bitrate variable consigue
mayor calidad de imagen porque recoge más calidad en escenas muy cargadas o con mucho
movimiento y ahorra en aquellas más estáticas.

Fotogramas por segundo.
Un video resulta de la exposición imágenes o fotogramas uno detrás de otro. Un parámetro de
la calidad del video es el número de fotogramas por segundo que muestra durante su
reproducción. Este valor oscila entre 15 y 30. Por ejemplo los vídeos en DVD en Europa
exhiben 25 fotogramas por segundo (25 fps).

Fotogramas Clave.
Cuando se aplica un códec de compresión a un video, se suele producir cierta pérdida de la
información de sus fotogramas. Algunos fotogramas (los fotogramas clave) se almacenan
completamente en el archivo comprimido, mientras que el resto sólo se guardan parcialmente.
En la descompresión, estos fotogramas intermedios se reconstruyen a partir de los fotogramas
clave.

Sistemas de televisión.
     NTSC (National Television Standards Comité = Comité Nacional de Estándares de
       Televisión). Cada fotograma está formado por 525 líneas y reproduce 30 fotogramas
       por segundo. Se utiliza en América del Norte, Centroamérica, Japón, etc.
     PAL (Phase Alternation Line = Línea Alternada en Fase): El vídeo PAL tiene 625 líneas
       por fotograma y 25 fotogramas por segundo. Es el sistema más extendido actualmente
       en Europa.
     SECAM (Séquentiel Couleur à Mémoire = Color secuencial con memoria). Muestra 625
       líneas y 25 fotogramas por segundo. De origen francés, ha perdido mercado en Europa
       a favor del sistema PAL.

Proporción o ratio de aspecto.
Es la proporción entre la anchura y altura de un video. Cuando se reproduce un video se suele
mantener por defecto esta proporción para evitar deformación de las imágenes. Por este
motivo cuando se elige la visualización a pantalla completa, aparecen franjas negras arriba y
abajo. Es habitual una relación 4:3 para los videos domésticos (352x288 píxeles, por
ejemplo) mientras que en DVD se suele trabajar con ratios de 16:9.
Vídeo y animaciones ::: Introducción                                                  449
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


1.2 Formatos de archivos de video
Los videos digitales se pueden guardar en archivos de distintos formatos. Cada uno se
corresponde con una extensión específica del archivo que lo contiene. Existen muchos tipos
de formatos de video. Aquí se citan algunos de los más utilizados. Asimismo cada tipo de
archivo admite en cada momento un códec de compresión distinto.

AVI (Audio Video Interleaved = Audio y Video Intercalado)
    Es el formato estándar para almacenar video digital.
    Cuando se captura video desde una cámara digital al ordenador, se suele almacenar
       en este formato con el códec DV (Digital Video).
    El archivo AVI puede contener video con una calidad excelente. Sin embargo el peso
       del archivo resulta siempre muy elevado.
    Admite distintos códecs de compresión como CinePak, Intel Indeo 5, DV, etc. Los
       códecs con más capacidad de compresión y una calidad aceptable son DivX y XviD.
    El formato AVI puede ser visualizado con la mayoría de reproductores: Windows Media,
       QuickTime, etc. siempre y cuando se encuentren instalados en el equipo los
       adecuados códecs para cada tipo de reproductor.
    Es ideal para guardar videos originales que han sido capturados de la cámara digital
       (codificados con DV).
    No es recomendable publicarlos en Internet en este formato por su enorme peso.
    Los códecs CinePak, Intel Indeo, DV, etc. no ofrecen una gran compresión. Los códecs
       DivX y XviD por el contrario consiguen una óptima compresión aunque se suelen
       destinar sobre todo a la codificación de películas de larga duración.

MPEG (Moving Pictures Expert Group = Grupo de Expertos de Películas)
    Es un formato estándar para la compresión de video digital.
    Son archivos de extensión *.MPG ó *.MPEG.
    Admite distintos tipos de códecs de compresión: MPEG-1 (calidad CD), MPEG-2
       (calidad DVD), MPEG-3 (orientado al audio MP3) y MPEG-4 (más orientado a la web).
    Se reproducen con Windows Media Player y QuickTime.

MOV (http://www.apple.com/es/quicktime/)
   Es el formato de video y audio clásico desarrollado por Apple.
   Utiliza un códec propio que evoluciona en versiones con bastante rapidez.
   Este tipo de archivos también pueden tener extensión *.QT
   Se recomienda utilizar el reproductor de QuickTime. Existe una versión gratuita del
      mismo que se puede descargar de Internet.
   Es ideal para publicar videos en Internet por su razonable calidad/peso.
   Admite streaming.

WMV (http://www.microsoft.com/windows/windowsmedia/es/)
   Ha sido desarrollado por Microsoft.
   Utiliza el códec MPEG-4 para la compresión de video.
   También puede tener extensión *.ASF
   Sólo se puede visualizar con una versión actualizada de Windows Media 7 o superior.
      Esta aplicación viene integrada dentro de Windows.
   Es ideal para publicar videos en Internet por razonable calidad/peso.
   Admite streaming.


RM (http://spain.real.com/)
    Es la propuesta de Real Networks para archivos de video.
    Utiliza un códec propio para comprimir el audio.
    Este tipo de archivos tiene extensión *.RM y *.RAM.
    Se visualiza con un reproductor específico: Real Player. Existe una versión gratuita
       del mismo que se puede descargar de Internet.
Vídeo y animaciones ::: Introducción                                                        450
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

       Se puede utilizar para publicar videos en Internet por su aceptable calidad/peso.
       Admite streaming.

MP4 (http://www.apple.com/quicktime/technologies/mpeg4/)
    Es un nuevo formato de vídeo desarrollado por Apple.
    Se basa en el estándar MPEG-4 utilizando el códec H.264 AVC para vídeo y el códec
       AAC o MP3 para audio.
    Son archivos de extensión *.MP4.
    Es un formato de vídeo de gran popularidad y expansión debido a que se utiliza en los
       reproductores personales iPod y en el software de reproducción QuickTime+iTunes de
       Apple.
    En el ordenador se puede reproducir con VLC Media Player, QuickTime, etc.
    El repositorio de vídeos Youtube utiliza el formato MP4 para la descarga de los vídeos
       en alta calidad HQ.
    El archivo *.MP4 es un contenedor dentro del cual además de audio y vídeo
       sincronizados también se pueden almacenar imágenes fijas, subtítulos, información
       de capítulos, etc.
    Admite streaming.

FLV (http://www.adobe.com)
    Es un formato que utiliza el reproductor Adobe Flash para visualizar vídeo en Internet.
    Utiliza el códec Sorenson Spark y el códec On2 VP6. Ambos permiten una alta calidad
        visual con bitrates reducidos.
    Son archivos de extensión *.FLV.
    Se pueden reproducir desde distintos reproductores locales: MPlayer, VLC media
        player, Riva, Xine, et.
    Opción recomendada para la web por su accesibilidad. Al visualizarse a través del
        reproductor de Flash es accesible desde la mayoría de los sistemas operativos y
        navegadores web.
    Los repositorios de vídeo más conocidos en Internet utilizan este formato para la
        difusión de vídeos: YouTube, Google Video, iFilm, etc.
    Permite configurar distintos parámetros del vídeo para conseguir una aceptable
        calidad/peso.
    Admite streaming. Junto con el formato MP4 son las opciones más aconsejables para
        la difusión de vídeos por Internet.



1.3 ¿Qué es el streaming?
En la navegación por Internet es necesario descargar previamente el archivo (página HTML,
imagen JPG, audio MP3, etc.) desde el servidor remoto al cliente local para luego visualizarlo
en la pantalla de este último.

La tecnología de streaming se utiliza para optimizar la descarga y reproducción de archivos de
audio y video que suelen tener un cierto peso.

El streaming funciona de la siguiente forma:

       Conexión con el servidor. El reproductor cliente conecta con el servidor remoto y
        éste comienza a enviarle el archivo.
       Buffer. El cliente comienza a recibir el fichero y construye un buffer o almacén
        donde empieza a guardarlo.
       Inicio de la reproducción. Cuando el buffer se ha llenado con una pequeña fracción
        inicial del archivo original, el reproductor cliente comienza a mostrarlo mientras
        continúa en segundo plano con el resto de la descarga.
       Caídas de la velocidad de conexión. Si la conexión experimenta ligeros descensos de
        velocidad durante la reproducción, el cliente podría seguir mostrando el contenido
Vídeo y animaciones ::: Introducción                                                         451
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

         consumiendo la información almacenada en el buffer. Si llega a consumir todo el
         buffer se detendría hasta que se volviera a llenar.

El streaming puede ser de dos tipos dependiendo de la tecnología instalada en el servidor:

        Descarga progresiva. Se produce en servidores web que disponen de Internet
         Information Server (IIS), Apache, Tomcat, etc. El archivo de vídeo o audio solicitado
         por el cliente es liberado por el servidor como cualquier otro archivo utilizando el
         protocolo HTTP. Sin embargo, si el archivo ha sido especialmente empaquetado para
         streaming, al ser leído por el reproductor cliente, se iniciará en streaming en cuanto
         se llene el buffer.

        Transmisión por secuencias. Se produce en servidores multimedia que disponen de
         un software especial para gestionar más óptimamente el streaming de audio y vídeo:
         Windows Media Server, Flash Communication Server, etc. La utilización de un servidor
         multimedia ofrece múltiples ventajas frente al servidor web. Las más destacadas son:

         a. Mayor rapidez en la visualización de este tipo de contenidos.
         b. La comunicación entre servidor/cliente se puede realizar por protocolos
            alternativos al HTTP. Tiene el inconveniente del bloqueo impuesto por Firewalls
            pero tiene la ventaja de una mayor rapidez.
         c. Mejor gestión del procesador y ancho de banda de la máquina del servidor ante
            peticiones simultáneas de varios clientes del mismo archivo de audio o vídeo.
         d. Control predefinido sobre la descarga que pueden realizar los clientes:
            autentificada, filtrada por IP, sin almacenarla en la caché del cliente, etc.
         e. Mayor garantía de una reproducción ininterrumpida gracias al establecimiento de
            una conexión de control inteligente entre servidor y cliente.
         f. Posibilidad de distribución de transmisiones de audio y vídeo en directo.



1.4 Optimización de archivos de video
Para optimizar el peso del archivo de video será necesario editarlo para establecer alguno o
algunos de los siguientes parámetros:

En el Audio:

    1) El códec de compresión de audio utilizado: MPEG Layer 1, MPEG Layer 2, MP3, etc.
    2) Resolución. Establecer resoluciones más pequeñas: 32-bits, 16-bits, 8-bits, 4-bits, etc.
    3) Tasa de muestreo. Definir valores inferiores: 44100 Hz., 22050 Hz., 11025 Hz, etc.
    4) Velocidad de transmisión (bitrate). Configurar bitrates más bajos: 128 Kbps, 96 Kbps,
       64 Kbps, etc.
    5) Calidad estéreo/mono. Reducir la calidad de “stereo” a “mono”

En el Video:

    1) El códec de compresión de video utilizado: MPEG-1, MPEG-2, MPEG-4, Intel Indeo,
       Cinepak, DivX, etc.
    2) Método de BitRate. Utilizar un bitrate variable VBR puede optimizar la calidad del
       video y repercutir en el peso final del archivo frente a un bitrate constante CBR.
    3) Velocidad de transmisión (bitrate). Configurar bitrates más bajos: 1000 Kbps, 768
       kbps, 360 Kbps, etc.
    4) Dimensiones. Cuanto más pequeña sea la altura y anchura en píxeles de los
       fotogramas de un video, menos tamaño ocupará su archivo.
    5) Velocidad de fotogramas. Se puede reducir el número de fotogramas por segundo
       que mostrará el video: 30, 24, 20, 16, etc.
Vídeo y animaciones ::: Introducción                                                      452
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    6) Fotogramas Clave. Durante la compresión también se puede indicar cada cuánto se
       guardará un fotograma completo (fotograma clave): 24, 48, 96, 128, etc. Cuanto
       mayor sea esta cadencia más bajo será el peso del archivo resultante.

Otros elementos que inciden en la optimización:

    1) Duración. Cuanto más corto es un video, menos peso ocupa su archivo. En ocasiones
       puede resultar interesante fraccionar un archivo de video en sus escenas para facilitar
       su descarga.
    2) Formato de archivo. Los archivos *.WMV, *.MOV, *.RM y *.FLV son los más adecuados
       para publicar un video en Internet por su adecuada relación calidad/peso y porque
       admiten streaming. Los archivos *.AVI con códecs de compresión baja son ideales para
       guardar los videos originales. Los archivos *.AVI con códecs DiVX-XviD son apropiados
       para videos de películas de cierta duración. Los archivos *.MPG con códec MPEG-1 se
       utilizan para crear Video-CDs. Los archivos *.MPG con códec MPEG-2 se utilizan como
       fuente para montar un DVD.




1.5 Dispositivos de captura de video
Los dispositivos de captura de video permiten transferir al disco duro del ordenador un video
ya grabado o una emisión en directo. Los más frecuentes son:
     Una cámara DV (Video Digital) conectada al puerto IEEE 1394 del equipo. Con este
        dispositivo se obtiene la mejor calidad porque la información de audio y video ya está
        en formato digital llegando simplemente al ordenador a través del mencionado puerto.




                               Conexión IEEE 1394 para videocámara digital

       Una cámara web conectada a un puerto USB y un micrófono conectado a la entrada
        MIC de la tarjeta de sonido.
Vídeo y animaciones ::: Introducción                                                  453
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                             Conexiones Cámara-USB y Micrófono-Tarjeta Audio

       Una tarjeta sintonizadora de TV conectada a la señal de antena.
       Una cámara o reproductor VHS conectado a una tarjeta de captura analógica. Este
        proceso supone la conversión de video analógico a video digital.

Para disponer de una información más completa de cómo conectar y configurar un dispositivo
de captura, consulta la documentación que acompaña a cada hardware.
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player         454
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                 2. Reproducción
                                    de vídeos con
                                VLC Media Player
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player                            455
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


2.1 ¿Qué es VLC Media Player?
VLC Media Player es un reproductor multimedia, gratuito y multiplataforma. Sus
características más destacadas son:

       Soporta un gran número de formatos de audio y vídeo sin necesidad de instalar códecs
        adicionales: MPEG-1, MPEG-2, MPEG-4, DivX, MP3,OGG, MOV, RAM, AVI, FLV, etc.
       Es una opción muy interesante frente a otros programas comerciales para reproducir
        CDs de música, películas en soporte DVD o VídeoCD, etc.
       Se puede utilizar como servidor de streaming en una red local o de banda ancha.

VLC Media Player es una aplicación local para reproducir archivos multimedia del disco duro o
en soporte CD/DVD. No se trata de un plugin para el navegador web. Se ha incluido en este
curso por su facilidad para visualizar todo tipo de formatos y en especial DivX, FLV y
películas en DVD.




2.2 Instalación de VLC Media Player en Windows
       Descarga y ejecuta el instalador del reproductor VLC Media para Windows: vlc-1.1.4-
        win32.exe
       Si deseas utilizar la versión portable para Windows descarga y descomprime el
        siguiente archivo a una carpeta de tu disco duro o pendrive:
        VLCPortable_1.1.2_Rev_2.paf.exe
       Otra posibilidad es consultar su sitio web oficial: http://www.videolan.org y
        descargar si procede la última versión.



2.3 Instalación de VLC Media Player en Ubuntu
       Desde el escritorio selecciona Aplicaciones > Centro de software de Ubuntu. En el
        cuadro de diálogo Añadir o quitar aplicaciones introduce el término de búsqueda
        VLC. Marca la entrada Reproductor de medios VLC y pulsa en el botón Instalar.
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player                        456
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




       Una vez instalado selecciona Aplicaciones > Sonido y vídeo > VLC media player y
        arrastra este icono hasta el escritorio para disponer de un acceso directo.




2.4 Reproducción de un vídeo FLV con VLC
Una vez instalado el reproductor VLC Media Player puedes comprobar su correcto
funcionamiento.

1. Descarga y descomprime el archivo flv.zip a una carpeta de tu equipo.
2. A continuación haz doble clic sobre el icono VLC Media Player situado en el escritorio
   para iniciar este programa o bien en el ejecutable situado dentro de la carpeta de
   instalación de la versión portable.




3. Se muestra la consola de reproducción de VLC Media Player.




4. Selecciona Medio > Abrir Archivo. En el cuadro de diálogo Elegir uno o más archivos
   para abrir sitúate en la carpeta donde has descargado el vídeo.
Vídeo y animaciones ::: Reproducción de vídeos con VLC Player                             457
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

5. Clic sobre el archivo dteatro.flv y pulsa en el botón Abrir. Se reproducirá el contenido de
   este archivo de vídeo.




6. Puedes descargar y descomprimir el archivo dteatro_divx.zip. Obtendrás el
   correspondiente vídeo en formato *.avi codificado con DivX. Ábrelo con VLC Media Player
   y verás que también lo reproduce.


Puedes experimentar otras posibilidades de VLC Media Player:

       Medio > Abrir Archivo Avanzado para visualizar otros formatos de vídeo: .mov, .wmv,
        … No admite el formato de RealPlayer.
       Medio > Abrir disco permite reproducir una película en formato DVD o Video-CD.
       Medio > Abrir Directorio para indicar una carpeta del equipo cuyos archivos serán
        reproducidos de forma secuencial.

Nota:
       En Windows el reproductor por defecto suele ser Windows Media Player mientras
que en Ubuntu suele ser Totem.
Vídeo y animaciones ::: Descarga de archivos de video                 458
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                  3. Descarga de
                               archivos de vídeo
Vídeo y animaciones ::: Descarga de archivos de video                                    459
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

En este tema se exponen distintos procedimientos para descargar archivos de vídeo que se
están visualizando dentro de una página web. De esta forma se pueden reutilizar en local o
bien en la intranet logrando una visualización más ágil sin las limitaciones del acceso a
Internet.


3.1 Descarga de vídeos Youtube con Firefox
3.1.1 ¿Qué es Video DownloadHelper?
Video DownloadHelper es una extensión del navegador Firefox que permite descargar y
guardar en local un video, audio o imagen que se muestra dentro de una página web. Este
complemento realiza un chequeo de la página web buscando los archivos multimedia que
contiene y ofreciendo al usuario la posibilidad de guardarlo pulsando en su botón en la barra
de herramientas del navegador. Funciona con muchos sitios web que ofrecen repositorios de
vídeos: Youtube, Google Vídeo, Current TV, etc.




3.1.2 Instalación de la extensión Video DownloadHelper
    1. Abre el navegador Firefox.
    2. Selecciona Herramientas > Complementos.




    3. En el panel Complementos, pestaña Obtener complementos, introduce el término
       de búsqueda Video DownloadHelper y pulsa la tecla enter o bien haz clic sobre el
       icono de lupa para iniciar la búsqueda.




    4. En este panel se mostrará la entrada correspondiente al complemento buscado. Clic
       en el botón Añadir a Firefox …
Vídeo y animaciones ::: Descarga de archivos de video                                      460
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. En el cuadro de diálogo Instalación de software pulsa en el botón Instalar ahora.




    6. En el panel Extensiones ahora se muestra la extensión instalada. Clic en el botón
       Reiniciar Firefox. De esta forma la extensión de activará al reiniciar el programa. Al
       iniciarse de nuevo debes cerrar la ventana de complementos.




3.1.3 Descarga desde YouTube
Cuando un usuario sube a Youtube un vídeo puede hacerlo en distintos formatos pero el
sistema lo transforma al vuelo en formato FLV (Flash Video) para servir su contenido en
streaming utilizando una consola personalizada en tecnología Adobe Flash. Por este motivo el
visitante sólo necesita disponer del plugin de Adobe Flash instalado en su navegador web para
poder visualizar el vídeo. A continuación se explica el procedimiento para descargar ese
vídeo en formato FLV desde Youtube:

    1. Abre el navegador web Firefox
    2. Visita la web de Youtube en: http://www.youtube.com
    3. Introduce como término de búsqueda “Picasso” y pulsa en el botón Buscar
Vídeo y animaciones ::: Descarga de archivos de video                                   461
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. En la página de resultados se mostrarán los vídeos cuyas etiquetas contengan la
       palabra o palabras introducidas.
    5. Pulsa, por ejemplo, sobre el enlace Pablo Picasso con la descripción “Picasso
       painting live …” (Picasso pintando en directo). Su URL directa es:
       http://www.youtube.com/watch?v=7vgAYTC9bRY




    6. Clic en el botón Reproducir para visualizarlo. Cuando Video DownloadHelper detecta
       un video descargable en la página actual se ilumina o anima. Haz clic en este botón y
       selecciona la entrada que muestra el icono de Youtube junto al nombre de la página.




    7. En el cuadro de diálogo Guardar selecciona en la lista Guardar en la carpeta destino
       e introduce como nombre del archivo FLV, por ejemplo, picasso.flv. También puedes
       dejar el nombre por efecto.




    8. Clic en el botón Guardar.
    9. Al cabo de unos instantes se habrá descargado el archivo de vídeo.
Vídeo y animaciones ::: Descarga de archivos de video                                       462
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Para reproducirlo en local inicia VLC Media Player, selecciona Medio > Abrir archivo
        … para navegar hasta la carpeta anterior y selecciona el archivo picasso.flv. Otra
        posibilidad es utilizar el explorador de archivos y carpetas para arrastrar el icono del
        vídeo sobre la ventana abierta de VLC Media Player.




Nota:
        Para ver a pantalla completa o reducida haz doble clic sobre la ventana. También es
        posible redimensionar la ventana pulsando y arrastrando en la esquina inferior
        derecha de la ventana del reproductor.
Vídeo y animaciones ::: Descarga de archivos de video                                       463
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



3.2 Sitios web para descarga de vídeos
Actualmente Youtube es el líder en portales con servicio de vídeo en línea. Sin embargo cada
vez proliferan más los sitios web de este tipo donde es posible subir y visualizar contenidos de
vídeo. En algunos de ellos también se pueden descargar vídeos al disco duro local para
visualizarlo con los alumnos en aulas sin conexión a internet y también asegurando la
actividad frente a las limitaciones de una conexión modesta.

En algunos casos se puede aplicar el plugin Video DownloadHelper de Mozilla Firefox y en
otros casos en el mismo sitio se ofrece como alternativa la descarga directa del archivo de
video.

A continuación se citan algunos de los servicios de vídeos más conocidos, el formato de vídeo
utilizado y el procedimiento sugerido para la descarga de activos:

    1. YouTube
       http://www.youtube.com
       FLV
       Firefox

    2. Mediateca de EducaMadrid.
       http://mediateca.educa.madrid.org/
       FLV
       Firefox

    3. TeacherTube
       http://www.teachertube.com/
       FLV
       Descarga directa a partir de la ruta ofrecida en la etiqueta para Wordpress.

    4. Google Vídeo
       http://video.google.es/
       FLV y MP4
       Firefox para FLV y Descarga directa para MP4-Ipod

    5. Revver
       http://revver.com/
       MOV
       Firefox

    6. Metacafe
       http://www.metacafe.com/
       FLV
       Firefox

    7. MySpace
       http://myspace.com/
       FLV
       Firefox

    8. Dailymotion
       http://www.dailymotion.com/
       FLV
       Firefox

    9. Guba
       http://www.guba.com/
       FLV
       Firefox
Vídeo y animaciones ::: Descarga de archivos de video                 464
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    10. Sharkle.com
        http://www.sharkle.com/
        FLV
        Firefox

    11. Lulu TV
        http://www.lulu.tv
        FLV
        Firefox

    12. Hiphopdeal
        http://www.hiphopdeal.com/
        FLV
        Descarga directa

    13. Vsocial
        http://vsocial.com/
        FLV
        Firefox

    14. Current TV
        http://www.current.tv/
        FLV
        Firefox

    15. Mobuzz TV
        http://dosisdiaria.mobuzz.tv/
        WMV-MOV-FLV-MP4 Ipod
        Descarga directa

    16. Colombia aprende
        http://www.colombiaaprende.edu.co/html/mediateca
        MOV
        Firefox

    17. Universidad de Sevilla.
        http://www.sav.us.es/producciondevideo/videoenred.asp
        RM
        Descarga directa

    18. TV educativa del CNICE
        http://tv_mav.cnice.mec.es/
        MPG, FLV, WMV, MOV
        Descarga directa

    19. TV educativa de la UNED
        http://www.uned.es/cemav/tv.htm
        WMV
        Descarga directa

    20. Vive, TV educativa de Venezuela
        http://www.vive.gob.ve/
        WMV-FLV-OGG-MOV-RM
        Descarga directa

    21. Ciencias Galilei
        http://www.acienciasgalilei.com/videos/video.htm
        WMV
        Descarga directa
Vídeo ::: Captura de vídeo                                            465
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                      4. Captura de vídeo
Vídeo ::: Captura de vídeo                                                               466
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

En este apartado se explica el procedimiento para capturar vídeo de una cámara digital DV
utilizando Windows Movie Maker en equipos Windows o bien Kino en equipos Ubuntu.


4.1 Windows Movie Maker
4.1.1 Instalación de Windows Movie Maker
Se trata de una aplicación integrada dentro de Windows XP Service Pack 2, Windows Vista o
Windows 7. Por ello sólo es posible utilizarlo si tenemos instalado en el ordenador esta
versión del sistema operativo.

Si dispones de Windows XP instalado en tu equipo, comprueba si incluye Service Pack 2:

     1. Desde el escritorio de Windows elige: Inicio > Panel de Control > Sistema.
     2. En la solapa General deberá aparecer la etiqueta: “Service Pack 2”.




     3. Si este texto no aparece aquí deberás visitar la web de Microsoft para descargar el
        SP2 e instalarlo a continuación: http://www.microsoft.com/spain/windowsxp/sp2/ .


4.1.2 Abrir Windows Movie Maker
     1. Desde el escritorio de Windows, pulsa en el botón Inicio, luego en el botón Todos los
        programas y por último en Windows Movie Maker.




Otra posibilidad es crear un icono de acceso directo en el escritorio:

     1. Desde el escritorio de Windows, haz clic en Inicio, luego en Todos los programas.
     2. Mantén pulsada la tecla Ctrl y sin soltarla pulsa y arrastra hasta el escritorio de
        Windows el elemento Windows Movie Maker.
     3. En el escritorio se ha creado el acceso directo a este programa. Para acceder a él en
        sucesivas ocasiones haz doble clic sobre el icono que has creado.
Vídeo ::: Captura de vídeo                                                                467
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.1.3 Capturar video de cámara DV
    1. Abre el programa Windows Movie Maker.
    2. Conecta la cámara DV al puerto IEEE 1394 del ordenador. Enciende la cámara y activa
       en ella el modo VCR para reproducir el video tomado.
    3. En el panel Tareas de película haz clic en la entrada Capturar desde dispositivo de
       video. Si no está visible este panel, haz clic en el botón Tareas de la barra de
       herramientas.




    4. Si dispones de más de un dispositivo de captura de video, se mostrará el cuadro de
       diálogo Dispositivo de captura de vídeo. En la lista Dispositivos disponibles, haz clic
       en la cámara DV. Si sólo tienes instalado este dispositivo, esta ventana no aparecerá.
    5. En el cuadro Introduzca un nombre de archivo para el vídeo capturado, escribe el
       nombre del archivo de vídeo capturado. Por ejemplo: MiVideo001. En el cuadro
       Seleccione una ubicación para guardar el vídeo capturado, selecciona la ubicación
       en la que desea guardar el vídeo o haz clic en Examinar… para seleccionar una nueva
       ubicación. Windows Movie Maker guarda por defecto las capturas en la carpeta Mis
       vídeos situada dentro de la carpeta Mis documentos. Dejamos esta opción por
       defecto y pulsamos en Siguiente>
Vídeo ::: Captura de vídeo                                                             468
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    6. En el cuadro Configuración de vídeo, selecciona la configuración de vídeo que deseas
       utilizar para capturar el vídeo y audio. En este caso vamos a seleccionar la opción
       Mejor calidad para reproducir en mi equipo (recomendado) porque ofrece una
       razonable relación calidad/peso de archivo para publicar posteriormente. Clic en
       Siguiente>
Vídeo ::: Captura de vídeo                                                               469
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Nota:

    Para guardar el video con la máxima calidad posible debes elegir la opción Formato de
    dispositivo digital (AVI DV). El archivo generado tendrá una calidad máxima aunque cada
    minuto guardado ocupará entre 190 y 210 Mb. Este formato es más idóneo para guardarlo
    en un dispositivo de cinta o para tomarlo como partida para luego obtener otros formatos
    más ligeros e idóneos para la web.
    Para probar otras calidades de captura, selecciona Otras opciones y en la lista
    desplegable elige otras configuraciones.

    7. En el cuadro Método de captura, puedes elegir dos tipos de captura:
            Capturar toda la cinta automáticamente. Se rebobina automáticamente la
               cinta de la cámara hasta el principio y se captura su contenido completo. Esta
               captura finaliza cuando se alcanza el final de la cinta o cuando pulses el
               botón Finalizar.
            Capturar partes de la cinta manualmente. En este caso podrás navegar
               manualmente por la cinta hasta situarte en el punto deseado para iniciar la
               captura.
       En este caso vamos a seleccionar manualmente un fragmento de grabación para
       capturar. Por ello activa la segunda opción, asegúrate de que está elegida la casilla
       Mostrar vista previa durante la captura y pulsa en el botón Siguiente>




    8. En la ventana Capturar vídeo se muestra una Vista previa. Utiliza los controles de
       reproducción situados debajo: Reproducir, Pausa, Stop, Ir al principio, Retroceso
       rápido, Avance rápido e Ir al Final. Con ellos podrás situarte al inicio del fragmento
       de video que deseas grabar.
Vídeo ::: Captura de vídeo                                                                470
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    9. Una vez situado en el inicio deseado, en la consola Controles de cámara DV, haz clic
        en el botón Reproducir. Verás su contenido en la ventana Vista previa.
    10. Asegúrate de que la casilla Crear clips cuando finalice el asistente está activado. Si
        deseas detener la captura automáticamente después de transcurridos XX minutos
        entonces debes activar la opción Capturar límite de tiempo (hh:mm) e introduce
        este valor. Por ejemplo: 00:01, para capturar sólo un minuto. Si eliges Silenciar
        altavoces no se reproducirá el audio por los altavoces durante la captura pero sí se
        incluirá en la captura.
    11. A continuación pulsa en el botón Iniciar captura. Observa que durante el proceso de
        captura se muestra el tiempo de Video capturado y el Tamaño del archivo de vídeo
        que se va formando.
    12. Si no has elegido captura con límite de tiempo, para detener la captura elige Detener
        captura.
    13. Para terminar clic en el botón Finish (Terminar).
    14. Tras unos segundos de espera se muestra el clip o clips de video que componen la
        captura. Están situados dentro de una colección con el mismo nombre que el
        proporcionado inicialmente. En este caso MiVideo001.
Vídeo ::: Captura de vídeo                                                                  471
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    15. El contenido de esta nueva colección se guardar en un único archivo *.AVI ó *.WMV
        situado en la carpeta Mis Vídeos dentro de la carpeta Mis documentos.
    16. Si deseas eliminar una colección, pulsa en el botón Colecciones de la barra de
        herramientas; en el panel izquierdo selecciona la colección elegida y pulsa la tecla
        Supr. También debes utilizar el Explorador de archivos de Windows para situarte en
        la carpeta Mis documentos > Mís vídeos , elegir el archivo del mismo nombre que
        contiene los recursos de video de esta colección y pulsar la tecla Supr.

4.1.4 Recortar y pegar clips de vídeo
    17. Asegúrate de que en el panel inferior está activada la vista Escala de tiempo. Si no es
        así pulsa en el botón Mostrar escala de tiempo que aparece en este panel.
    18. Desde el panel de Contenidos que muestra los elementos de la colección arrastra y
        suelta los clips de vídeo sobre la pista de Video. Para eliminar un clip de la Escala de
        tiempo, selecciónalo previamente y pulsa la tecla Supr.
    19. Quizás sea necesario pulsar reiteradamente el icono de la lupa “+” para visualizar la
        escala de tiempo a un tamaño adecuado.
    20. Pulsa y arrastra hacia la izquierda el selector de recorte del clip de vídeo situado en
        la pista Video para definir la duración adecuada de cada clip
Vídeo ::: Captura de vídeo                                                                472
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    21. Coloca sobre la línea de tiempo los clips de video uno detrás de otro para
        confeccionar la película.

4.1.5 Exportar al archivo de vídeo
    22. Para guardar la película final, haz clic en la entrada Guardar en el equipo situada en
        el Panel de película o bien elige Archivo > Guardar archivo de película … > Mi PC
    23. Se muestra el Asistente para guardar película donde debes introducir el nombre de
        la película, por ejemplo: mivideo , y la carpeta donde se guardará el archivo.
        Dejando la opción por defecto se almacenará en la carpeta Mis documentos > Mis
        vídeos. Clic en el botón Siguiente >




                                                                              ç

    24. En la cuadro Configuración de película, haz clic en Mostrar más opciones para
        visualizar las distintos configuraciones de publicación. Activa Otras opciones y en la
        lista desplegable elige Vídeo para banda ancha (340 Kbps). Observa que en la
        esquina inferior izquierda de este cuadro se muestran los Detalles de la
        configuración elegida en cada caso: Tipo de archivo, velocidad de bits, tamaño de la
        pantalla, relación de aspecto y fotogramas por segundo. Clic en Siguiente.
Vídeo ::: Captura de vídeo                                                              473
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    25. Cuando se haya completado con éxito la publicación se mostrará un nuevo cuadro.
        Marca la casilla Reproducir película al pulsar Finalizar para que ésta se muestre en
        el reproductor de Windows Media inmediatamente después de haber pulsado el botón
        Finalizar.




    26. Recuerda que el archivo de video se ha guardado con el nombre que has definido
        dentro de la carpeta Mis documentos > Mis vídeos.
Vídeo ::: Captura de vídeo                                                                474
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2 Kino en Ubuntu

Kino es un editor de vídeo digital para Linux que permite capturar vídeo de una cámara DV,
recortar los clips creados, añadir algunos efectos y exportar a un formato de vídeo: MPEG-1,
MPEG-2, VCD, SVCD o DVD. En Ubuntu también se podría utilizar para la captura el editor de
vídeo Pitivi.

4.2.1 Instalación de Kino
    1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de
       Ubuntu
    2. En este panel introduce kino en la casilla de búsqueda y pulsa la tecla enter.
    3. Marca la casilla de activación en la entrada Kino-Editar vídeos DV y pulsa en el botón
       Aplicar cambios.
    4. Una vez instalado cierra todas las ventanas de la instalación.
    5. Si deseas disponer de un icono de acceso directo de Kino sobre el escritorio
       selecciona Aplicaciones > Sonido y Vídeo > Kino y arrástralo hasta el escritorio.




4.2.2 Configuración de permisos del puerto raw1394
    Es necesario activar los permisos oportunos en el puerto raw1394 para que Kino pueda
    utilizar este puerto en la captura de vídeo. Esta operación sólo se realiza una vez.

    1.   Selecciona Aplicaciones > Accesorios > Terminal
    2.   Teclea sudo chmod 666 /dev/raw1394
    3.   Te solicitará la contraseña de root. Introduce esta password.
    4.   Cierra la ventana de terminal.

4.2.3 Instalación del paquete mjpegtools
    Para que Kino pueda realizar la exportación de vídeo al formato MPEG es necesario
    instalar en nuestro sistema el paquete mjpegtools. Esta operación sólo se realiza una vez.

    1. Elige Sistema > Administración > Gestor de paquetes Synaptic
    2. Pulsa el botón Buscar e introduce mjpegtools y pulsa en el botón Buscar.
    3. Marca mediante doble clic el paquete mjpegtools aceptando la instalación de los
       paquetes dependientes.
    4. Clic en el botón Aplicar
    5. En el cuadro de diálogo de Resumen selecciona Para ser instalado y luego pulsa en el
       botón Aplicar.
    6. Una vez finalizada la instalación cierra el gestor de paquetes.
Vídeo ::: Captura de vídeo                                                                475
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2.4 Abrir Kino
    1. Selecciona Aplicaciones > Sonido y Vídeo > Kino o bien doble clic sobre el icono
       situado en el escritorio




    2. Las principales partes del interfaz de Kino son:
       1. Barra de menú: con acceso a las distintas opciones del programa.
       2. Barra de herramientas donde se encuentran accesibles los botones de las
           acciones de uso más habitual.
       3. StoryBoard. En este cuadro se situarán los clips de película o imágenes
           capturados o importados.
       4. Visor. Mostrará la reproducción del clip de película seleccionado en el panel
           StoryBoard.
       5. Barra de tareas. Cada botón de esta barra permite realizar las tareas más
           habituales durante la edición de una película.
       6. Barra de reproducción. Incluye los controles habituales para la reproducción del
           clip de vídeo elegido en el panel Storyboard o bien para manejar la cámara DV
           durante el proceso de captura.
       7. Barra de estado. Muestra información de interés durante la edición del vídeo.
Vídeo ::: Captura de vídeo                                                              476
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2.5 Capturar video de cámara DV
    1. Conecta la cámara DV al puerto IEEE 1394 del ordenador. Enciende la cámara y activa
       en ella el modo VCR para reproducir el video tomado.
    2. En la barra de tareas pulsa en el botón o pestaña Captura.
    3. Kino guarda por defecto el video capturado en un archivo de nombre capture y
       extensión    .dv    en     la   carpeta    personal   del   usuario   del    sistema:
       /home/<usuario>/capture.dv . Si deseas modificar el nombre o la ruta pulsa en el
       botón Examinar situado a la derecha del cuadro de texto Fichero.
    4. Utiliza los controles de reproducción (al principio, hacia atrás, reproducir, pausa,
       stop, hacia delante o al final) de la propia cámara o de la barra de control de
       reproducción de Kino para desplazarse por la cinta grabada de la cámara y situarse en
       el punto de inicio de la captura.




    5. Inicia la reproducción desde la cámara y cuando aparezca en el visor de Kino pulsa en
       el botón Captura para iniciarla. Durante este proceso se mostrará en la esquina
       inferior izquierda de la barra de estado el mensaje: Capturando /home/<usuario>/…
    6. Para finalizar la captura pulsa en el botón Detener. Transcurridos unos segundos se
       creará el archivo *.dv en la carpeta indicada del equipo y este archivo estará
       disponible desde el panel Storyboard de Kino.

4.2.6 Recortar un clip de vídeo
    1. En el panel Storyboard pulsa sobre el clip de video para seleccionarlo.
    2. Sobre el panel de tareas derecho haz clic en el botón Recortar.
    3. Utiliza los controles de reproducción para visualizar el clip de vídeo
Vídeo ::: Captura de vídeo                                                              477
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Durante la reproducción, en el instante que estimes oportuno, debes pulsar en el
       botón Ajustar el punto de entrada a la posición inicial para definir el punto inicial
       del clip de vídeo. Idem con el botón Ajustar el punto de salida a la posición inicial
       para establecer el punto final del clip de vídeo.




    5. Otra posibilidad para definir el fragmento de clip de película es arrastrar los
       marcadores de entrada y salida sobre la línea de tiempo. Si necesitas mayor exactitud
       puedes definir los valores numéricos de estos puntos introduciéndolos por teclado o
       bien pulsando en los botones de incremento/decremento adjuntos.
    6. Para verificar el fragmento seleccionado puedes reproducir el clip de película
       activando previamente el botón de reproducción continua del fragmento.




    7. Para aplicar el recorte elegido pulsa en el botón Aplicar.
Vídeo ::: Captura de vídeo                                                               478
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


4.2.7 Exportar el archivo de vídeo
    1. El video final se construirá a partir de la secuencia de clips de película situados de
       arriba hacia abajo en el panel Storyboard.
    2. Para exportar el vídeo final pulsa en el botón Exportar en la barra de tareas.
    3. Clic en la pestaña MPEG.
    4. En el cuadro de texto Fichero pulsa en el botón Examinar para introducir un nombre
       de archivo. Por ejemplo: mivideo. Este archivo se guarda por defecto en la carpeta
       del usuario actual: /home/<usuario>/




    5. Despliega la lista Formato de fichero y elige 0 – MPEG1 Genérico o bien 3 – MPEG2
       Genérico. A continuación pulsa en el botón Exportar.
    6. Al cabo de unos instantes se habrá creado el archivo mivideo.mpeg en la carpeta
       indicada.

4.2.8 Reproducir el vídeo final
    1. Elige Aplicaciones > Sonido y vídeo > VLC Media Player
    2. Abre la carpeta donde se ha creado el archivo mpeg.
    3. Arrastra y suelta este archivo de video sobre la consola de reproducción de VLC Media
       Player.




    4. Al cabo de unos instantes comenzará la reproducción del vídeo a través de VLC media
       player.
Vídeo y animaciones ::: Edición de video                              479
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                        5. Edición de vídeo
Vídeo y animaciones ::: Edición de video                                                    480
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.1 Introducción
En Windows para la edición de vídeo se puede utilizar por su simplicidad el programa que ya
viene integrado en el sistema: Windows Movie Maker. En Ubuntu un programa de
prestaciones similares podría ser Pitivi que ya viene instalado a partir de la versión Ubuntu 10.
La edición de video utilizando los programas referenciados excede la extensión y propósito de
este curso.

Por ese motivo se propone la utilización de un sencillo programa para crear un vídeo con una
secuencia de fotografías. En Windows se plantea utilizar PhotoStory 3 y en Ubuntu
Imagination.



5.2 PhotoStory (Fotos Narradas) en Windows
5.2.1 Instalación de Photostory
En este apartado se propone el uso de Photo Story 3 (Fotos Narradas) para crear vídeos
*.WMV a partir de imágenes y audios. Es una aplicación adecuada para compartir las
fotografías tomadas durante una salida, fiesta o evento cultural.

Para instalar este programa descarga y ejecuta el asistente de instalación PhotoStory.exe.
Esta versión ha sido pensada para Windows XP SP2 pero también funciona en Windows Vista y
7.

5.2.2 Creación de una narración de fotos
La creación de una narración con Photo Story consta de los siguientes pasos:
     1. Importar y organizar imágenes.
     2. Agregar título a las imágenes.
     3. Agregar narraciones a las imágenes.
     4. Personalizar movimiento de cada imagen.
     5. Agregar música de fondo.
     6. Guardar la narración.

Paso 1. Importar y organizar imágenes

1.1 Importar imágenes
     1. Descarga y descomprime el archivo paisajes.zip en una carpeta de tu equipo. Como
         resultado de esta extracción dispondrás de varias fotos en formato JPG con
         fotografías de paisajes asturianos.
     2. Abre Photo Story.
     3. En la pantalla inicial del asistente selecciona Iniciar una narración nueva y haz clic
         en Siguiente.
Notas:
     Photo Story guarda todos los detalles de una narración incluídas las imágenes y audios
        importados en un archivo de proyecto de extensión propia: *.WP3. Si desearas abrir y
        editar un proyecto deberías elegir la opción Editar un proyecto y pulsa en Siguiente>.
     Para reproducir una narración guardada selecciona Reproducir una narración y haz
        clic en Siguiente >.
Vídeo y animaciones ::: Edición de video                                                 481
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     4. En el cuadro de diálogo Importar y organizar imágenes pulsa en el botón Importar
        imágenes …




     5. Se muestra el Explorador de archivos. En el panel izquierdo haz clic sobre la carpeta
        paisajes. Al seleccionarlo en el panel derecho se mostrará su contenido.
     6. Clic sobre el primer archivo de imagen mantén pulsada la tecla <Mayus> y sin
        soltarla, haz clic sobre el último archivo de imagen. De esta forma seleccionarás
        todas las fotografías que se utilizarán en la película. Clic en Aceptar.
     7. Al cabo de unos instantes se mostrará la colección de imágenes disponibles.
Vídeo y animaciones ::: Edición de video                                                   482
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

1.2 Quitar bordes negros

     8. Photo Story creará una película en formato 4:3. Si las fotos importadas, por sus
        dimensiones originales, NO se ajustan a esta proporcionalidad se añadirán por
        defecto bordes negros. Estos bordes se mostrarán en el monitor de visualización al
        elegir una miniatura en la lista.




     9. Para eliminar estos bordes y ajustarlas a la proporción 4:3 de publicación final, haz
        clic sobre la primera miniatura de imagen de la lista. A continuación pulsa en el
        botón Quitar bordes negros.




     10. En el cuadro Quitando bordes negros, Photo Story propone una opción de recorte
         de la primera imagen. En la ventana Antes puedes pulsar y arrastrar el área de
         visualización para definir manualmente el recorte. En la ventana Después se
         mostrará el aspecto que tendría la imagen tras aplicar el recorte definido. Clic en el
         botón Sí para confirmar la operación. Observa que el borde negro ha desaparecido.
Vídeo y animaciones ::: Edición de video                                                  483
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




Nota:
        Para abandonar el asistente de recorte pulsa en el botón Cancelar. Para no aplicar
        recorte a la imagen pulsa en el botón No. En este caso se propone quitar los bordes
        negros a todas las fotografías.

     11. Sólo si es necesario Photo Story propone la eliminación de bordes oscuros mediante
         recorte fotografía a fotografía. En cada caso haz clic sobre el botón Sí o bien pulsa
         en el botón Sí a todo para que realice esta operación en todas las fotos en un solo
         paso. Tras concluir la revisión de toda la lista se muestra un mensaje de
         confirmación. Pulsa en Aceptar.




     12. Tras este proceso la lista de miniaturas mostrará un icono de edición debajo de cada
         imagen sobre la que se haya aplicado el recorte necesario para quitar los bordes
         negros. Este icono indica que la imagen ha sido modificada respecto al original.




     13. Si fuese necesario quitar el recorte o bien definir un encuadre distinto, haz clic
         derecho sobre la miniatura correspondiente y elige Edición > Recortar. En el panel
         que se muestra con esa imagen, pestaña Girar y recortar, desactiva la opción
         Recortar para eliminar el recorte o pulsa directamente en el botón Restablecer para
Vídeo y animaciones ::: Edición de video                                               484
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

         recuperar la imagen original. También puedes arrastrar la marca de recorte para
         definir un nuevo encuadre. Para guardar los cambios pulsa en Guardar. Para salir
         descartando los cambios pulsa en Cerrar y luego confirma seleccionando No.




1.3 Manejar la lista de imágenes.

     14. Para moverse por la lista de miniaturas utiliza los botones de flechas
         Retroceder/Avanzar situados a la derecha de esta lista o bien en las respectivas
         esquinas inferiores del monitor. Haz clic sobre una imagen de la lista para
         seleccionarla y visualizarla en el monitor. Para eliminar una imagen de la lista,
         selecciónala previamente y pulsa en el botón Eliminar ubicado en esta botonera
         derecha.




     15. Para modificar el orden en que se mostrarán las imágenes, pulsa sobre una imagen y
         arrástrala sobre la lista para situarla por adelante o detrás en la lista.
Vídeo y animaciones ::: Edición de video                                                    485
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

1.4 Aplicar efectos

     16. Haz clic sobre la primera imagen de la lista para seleccionarla. Ésta se visualizará en
         el monitor.
     17. Pulsa en Edición … situado en la botonera inferior del Monitor.




     18. Selecciona la pestaña Agregar efecto. En la lista Efecto: elige, por ejemplo,
         Resplandor difuso. No te resistas a probar el resto del catálogo. En la Vista Previa
         que acompaña podrás observar el aspecto tras aplicar cada uno de estos efetos.
     19. Para confirmar la aplicación del efecto elegido pulsa en el botón Guardar.
     20. Utiliza los botones de flechas Retroceder/Avanzar que aparecen en este panel para
         situarse en la siguiente fotografía de la lista sin necesidad de cerrar esta ventana.




     21. Repite la secuencia de pasos 19-22 para eliminar el efecto aplicado sobre una imagen
         seleccionando en la lista de efectos : (ninguno) y luego pulsa en Guardar. Recuerda
Vídeo y animaciones ::: Edición de video                                               486
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

         que si pulsa Restablecer se perderán todos los cambios aplicados a la imagen:
         recortes, giros, autocorrecciones, etc.

1.5 Guardar proyecto …

     22. Una vez terminada la edición de imágenes conviene guardar el proyecto. Para ello
         pulsa en el botón Guardar proyecto … situado debajo de la lista de imágenes.




     23. En el cuadro Guardar como introduce un nombre de archivo. Por ejemplo: fotos.
         Photo Story añade automáticamente la extensión de archivo *.WP3. Este archivo se
         guardará por defecto en la carpeta Mis documentos > Mis vídeos.
     24. Clic en Guardar para terminar. Repite los pasos 25-27 cada vez que desees guardar
         los cambios. De esta forma podrás abrirlo en otro momento y continuar en el punto
         donde lo dejaste.
     25. Una vez importadas y organizadas las imágenes podemos continuar con la edición de
         nuestra narración. Para ello pulsa en el botón Siguiente > . Para retroceder a la
         anterior fase pulsa en < Atrás.

Paso 2. Agregar títulos a las imágenes


    1. En la fase Agregar títulos a las imágenes se podrán añadir textos explicativos a las
       imágenes si se estima oportuno. Sobre la lista de miniaturas haz clic en la primera
       imagen para seleccionarla.
Vídeo y animaciones ::: Edición de video                                                 487
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    2. En el cuadro de texto introduce el título de la imagen: “Paisajes asturianos”.
    3. Para situar el texto sobre la imagen pulsa en el botón Centrar horizontalmente.




    4. Haz clic en el botón Alinear en la parte inferior.




    5. Para modificar las propiedades de la fuente de letra, haz clic en el botón Seleccionar
       fuente.



    6. En el cuadro Fuente selecciona Tamaño 14 y Color: Blanco. Pulsa en Aceptar.




    7. Durante esta fase otra posibilidad es editar el efecto de imagen aplicado. Para ello
       basta con desplegar la lista de efectos situada en la base del monitor y elegir uno de
       ellos o bien la entrada (ninguno).
Vídeo y animaciones ::: Edición de video                                                   488
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    Nota:
    En lugar de añadir un título general para la película en la primera imagen (“Paisajes
    asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la
    información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre
    cada una de las miniaturas de la lista y repetir la secuencia de pasos 2-6 de este apartado.
    No se ha propuesto agregar un título a cada imagen porque Photo Story no implementa
    por defecto movimiento a una imagen cuando se le incorpora un título. No obstante
    puedes probar a hacerlo y la película resultante mostrará una diapositiva detrás de otra
    sin animación de zoom en cada imagen.




         Nº     Texto
         1      Cubos de la memoria (LLanes)
         2      Elogio al horizonte (Gijón)
         3      Faro (Cudillero)
         4      Hórreo asturiano (Pueblo de Asturias-Gijón)
         5      Iglesia Santiago Apostol (Castropol)
         6      Molino de río (Villaviciosa)
         7      Santa María del Naranco (Oviedo)
         8      Acantilados (Cabo Peñas)


    8. Para pasar a la siguiente fase pulsa en el botón Siguiente > situado en la parte
       inferior de la ventana.
Vídeo y animaciones ::: Edición de video                                      489
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Paso 3. Agregar narraciones a las imágenes

En esta fase se puede añadir una narración de voz a cada imagen.




3.1 Ajustar el volumen del micrófono y altavoces

    1. Antes de comenzar a grabar conviene probar la configuración del volumen del
       micrófono y altavoces. Para ello pulsa en el botón Micrófono.




    2. Se muestra la ventana de inicio del asistente. Clic en Siguiente
Vídeo y animaciones ::: Edición de video                                                490
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    3. Prueba de micrófono. Lee el párrafo que se sugiere en voz alta frente al micrófono.
       De este modo se ajustará automáticamente el volumen del micrófono. Clic en
       Siguiente >.




    4. Prueba del altavoz. Lee sobre el micrófono el texto que se sugiere y escúchalo por el
       altavoz gracias al pequeño retardo con que se reproduce. Si se produjese algún acople
       o zumbido baja el deslizador de volumen de la columna Reproducción.




    5. Finalización del asistente … Clic en Finalizar.
Vídeo y animaciones ::: Edición de video                                                491
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




3.2 Grabar una narración

    6. Haz clic en la primera miniatura de imagen de la lista para seleccionarla. A
       continuación pulsa en el botón Grabar Narración.




    7. Habla en voz alta frente al micrófono: “Paisajes asturianos”. Para terminar pulsa en
       el botón Detener grabación.




    8. A la derecha de la botonera de grabación se muestra la duración del audio grabado:
Vídeo y animaciones ::: Edición de video                                                      492
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    9. Para visualizar cómo queda pulsa en el botón Vista previa… situado debajo de la
        botonera de grabación.
    10. Cuando se añade una narración a una imagen, en la lista de miniaturas, mostrará un
        icono en forma de globo de texto en su esquina inferior izquierda.




Notas:

        Se puede incorporar un audio a cada fotografía siguiendo la información contenida en
         la tabla descriptiva siguiente. Para ello basta con hacer clic sobre cada una de las
         miniaturas de la lista y repetir la secuencia de pasos 6 y 7 de este apartado.




         Nº     Texto
         1      Cubos de la memoria (LLanes)
         2      Elogio al horizonte (Gijón)
         3      Faro (Cudillero)
         4      Hórreo asturiano (Pueblo de Asturias-Gijón)
         5      Iglesia Santiago Apostol (Castropol)
         6      Molino de río (Villaviciosa)
         7      Santa María del Naranco (Oviedo)
         8      Acantilados (Cabo Peñas)


        Para eliminar el audio grabado haz clic en el botón Eliminar narración y confirma el
         borrado




    11. Clic en Guardar proyecto para asegurarnos de no perderlo.
    12. Para pasar a la siguiente fase de producción pulsa en el botón inferior Siguiente>.
Vídeo y animaciones ::: Edición de video                                                 493
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Paso 4. Personalizar movimientos de imagen


4.1 Movimiento de una imagen

    1. Asegúrate de que estás situado en el paso Agregue narraciones a sus imágenes y
       personalice el movimiento del programa.
    2. En la lista de miniaturas haz clic en la segunda imagen.
    3. Pulsa en el botón Personalizar movimiento … situado debajo del monitor. Con ello
       podrás definir un movimiento de imagen distinto o bien corregir el que ha asignado
       Photo Story por defecto. En muchas ocasiones no es necesario realizar este ajuste
       por lo que se podría pasar directamente a la siguiente fase de elaboración.




   4. En el cuadro de diálogo Personalizar movimiento … selecciona la pestaña
       Movimiento y duración. Como podrás comprobar Photo Story ha definido por defecto
       una posición inicial y final del movimiento. En el ejemplo recogido en la siguiente
       figura, la animación consistirá en un movimiento de apertura de zoom desde el
       encuadre señalado en la ventana Posición inicial hasta el encuadre señalado en
       Posición final. Este movimiento de zoom lo crea Photo Story automáticamente a
       partir de los encuadres definidos en el fotograma inicial y final así como el tiempo
       establecido. La duración de este movimiento se puede obtener restando los tiempos
       que aparecen en la esquina inferior izquierda de cada vista previa. En este ejemplo:
       00:00:10,0-00:00:05,0 = 5 segundos.
Notas:
    Cuando en la posición inicial se define un encuadre más pequeño que en la posición
       final, el movimiento será un zoom de alejamiento en la transición del encuadre inicial
       al final.
    Si en la posición inicial se define un encuadre más grande que en la posición final, el
       movimiento será un zoom de acercamiento.
    Si en ambas posiciones se define un encuadre del mismo tamaño pero en diferente
       posición, el movimiento consistirá en una traslación sobre la imagen.
    Si en ambas posiciones se define un encuadre del mismo tamaño y posición, no se
       apreciará movimiento en esa imagen.
Vídeo y animaciones ::: Edición de video                                                  494
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. En la mayoría de los casos la animación definida por defecto es aceptable. Sin
       embargo en algunas ocasiones es necesario corregir el encuadre inicial (del que parte
       el movimiento) o el final (hacia el que va). Para ello activa la casilla Especifique la
       posición inicial y final del movimiento.




    6. En la Posición inicial coloca el puntero del ratón sobre el centro del encuadre y
       cuando el puntero tome el aspecto de una cruz de doble flecha, pulsa y arrastra para
       colocar el encuadre en otra posición sobre la fotografía. En este caso trata de centrar
       el encuadre respecto al monumento.
Vídeo y animaciones ::: Edición de video                                                    495
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    7. Si marcas la opción Establecer que la posición inicial coincida con la posición final
       de la imagen anterior entonces el tamaño y posición del encuadre coincidirá con el
       utilizado en la posición final de la imagen anterior. En este caso no es necesario.
    8. Si marcas la opción Establecer que la posición final sea la misma que la posición
       inicial entonces el tamaño y posición del encuadre será el mismo tanto en la posición
       inicial como final. Si lo dejas así esta imagen no tendrá animación durante su
       visualización. En este caso tampoco es necesario.
    9. Para aumentar o disminuir de tamaño del encuadre, tanto en la posición inicial como
       final, pulsa y arrastra con el ratón sobre un selector de recorte situado en una
       esquina.




    10. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón
        Vista previa …
    11. Si eliges la opción Establecer la duración automáticamente, Photo Story ajustará la
        duración del movimiento en función del tamaño del encuadre tanto en la posición
        inicial como la posición final. Este valor oscilará entre 5 y 8 segundos. Sin embargo si
        deseas definir la duración manualmente, selecciona la opción Número de segundos
        para mostrar la imagen y en el contador numérico define la duración en segundos.
Vídeo y animaciones ::: Edición de video                                                     496
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    12. Para recuperar el encuadre definido por defecto por Photo Story pulsa en el botón
        Restablecer.
    13. Para guardar los cambios pulsa en el botón Guardar.
    14. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta
        ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente. Utiliza
        distintos tipos de transiciones. Observa que si al modificar una transición, tratas de ir
        a la siguiente imagen, Photo Story te pedirá confirmación para guardar los cambios
        introducidos.




4.2 Transición de una imagen a otra.

    15. Desde la ventana Personalizar movimiento haz clic sobre la pestaña Transición.




    16. Photo Story define por defecto una transición Fundido en el paso de una imagen a
        otra. En la parte superior del panel Transición observa que la casilla Iniciar imagen
        actual usando una transición está activada. Si la desactivas el paso de una imagen a
        otra se realizará sin transiciones. Debajo podrás observar una vista previa de la
        Imagen anterior y de la Imagen actual. En el centro se puede visualizar
        dinámicamente el efecto de Transición elegido en la evolución desde la imagen
        anterior a la imagen actualmente seleccionada.
    17. Para modificar el modo de transición pulsa sobre otra en la lista de Transiciones. Por
        ejemplo: Estrella, hacia fuera. Observa que la transición elegida en cada caso
        muestra un recuadro gris más ancho que el resto.
Vídeo y animaciones ::: Edición de video                                                  497
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    18. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón
        Vista previa …
    19. Si eliges la opción Establecer duración de la transición automáticamente, Photo
        Story ajustará la duración de la misma. Sin embargo si deseas definir la duración
        manualmente, selecciona la opción Número de segundos para mostrar la transición
        y en el contador numérico define la duración en segundos.
    20. Para recuperar la transición definida por defecto por Photo Story pulsa en el botón
        Restablecer.
    21. Para guardar los cambios pulsa en el botón Guardar.
    22. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta
        ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente.
        Utilízalos para definir distintas transiciones sobre cada imagen.




    23. Una vez terminada la edición de transiciones, observa que en la lista de miniaturas se
        marcan con un icono de dos rectángulos entrelazados aquellas imágenes que tienen
        una transición distinta al Fundido.




    24. Haz clic en el botón Siguiente para pasar a la siguiente fase de creación de la
        película.
Vídeo y animaciones ::: Edición de video                                                 498
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Paso 5. Agregar música de fondo

    1. En la lista de miniaturas haz clic sobre la primera imagen para añadir música de fondo
       a partir de ésta.




    2. Clic en Seleccionar música … si deseas integrar la música contenida en un archivo
       *.MP3, *.WAV o bien *.WMA (Windows Media Audio). En este caso vamos a añadir
       como música de fondo una composición musical creada desde Photo Story. Para ello
       pulsa en el botón Crear música …
    3. En el cuadro de diálogo Crear música selecciona siguiendo el siguiente orden de
       concreción creciente: Género, Estilo, Grupos y Ambientes. Por ejemplo: Banda
       sonora-Cueva misteriosa-Sitar-Aventurero. Arrastra el deslizador del Ritmo para
       aumentar/disminuir el ritmo o bien elige Intensidad (Baja, Normal y Alta). Una vez
       definidas las propiedades de la música, haz clic en Reproducir para escuchar el
       resultado antes de aplicarlo a la película.
Vídeo y animaciones ::: Edición de video                                                  499
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Una vez elegida la música, clic en Aceptar.
    5. En la lista de miniaturas ahora se indica con el icono de nota musical sobre la base
       de la imagen donde comienza la música de fondo y sobre la lista el alcance e
       información de la banda sonora definida.




    6. Para modular el volumen de reproducción de esta música arrastra el deslizador
       Volumen: que aparece en este panel hasta una posición intermedia entre Bajo y Alto.


        Notas:

           Se pueden incluir distintas músicas en una misma película. Para ello selecciona
            otra imagen en la lista de miniaturas y repite la secuencia de pasos 3-4. A partir
            de esta nueva imagen hasta el final se añadirá la nueva música.
           Para ver cómo queda el resultado final pulsa en el botón Vista previa … Observa
            cómo Photo Story ajusta la melodía a la duración de la película asegurando un
            final rítmico o en desvanecimiento de volumen adecuados.
           Para eliminar una música de fondo, haz clic sobre la imagen donde comienza y
            pulsa en el botón Eliminar música … que aparece en este panel.
Vídeo y animaciones ::: Edición de video                                             500
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    7. Pulsa en el botón Guardar proyecto … para guardar los cambios producidos en el
       proyecto *.WP3.
    8. Para continuar con la edición, haz clic en el botón Siguiente>




Paso 6. Guardar la narración

En esta fase se genera la película o narración final y se guardar en formato *.WMV

    1. En la lista Actividades pulsa sobre Guardar la narración para reproducirla en el
       equipo.
Vídeo y animaciones ::: Edición de video                                                501
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    2. En el área Nombre de archivo, Photo Story propone el nombre de proyecto como
       nombre de archivo WMV para la publicación final. En el caso que nos ocupa:
       fotos.wmv. Por defecto lo sitúa dentro de la carpeta Mis documentos > Mis vídeos.
       Si deseas modificar el nombre del archivo modifícalo en el cuadro de texto
       conservando la ruta a esta carpeta. Si deseas cambiar la carpeta destino, haz clic en
       el botón Examinar … y localiza otra ubicación.
    3. Para definir la Configuración de calidad del archivo de video final WMV pulsa en el
       botón Configuración …




    4. En el cuadro de diálogo Configuración selecciona un Perfil en la lista. Por ejemplo:
       Perfil para equipos: 2 (640x480 Píxeles). En la sección Detalles se muestran los
       detalles que cumplirá el archivo producido en relación con Tipo de archivo,
       Velocidad de bits, Tamaño de pantalla, Relación de aspecto y Fotogramas por
       segundo. La elección del perfil se debe realizar en función del destino que tendrá el
       video final: Internet, red local, equipo local, etc. y de la calidad inicial de las
Vídeo y animaciones ::: Edición de video                                                502
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

         fotografías utilizadas. Si por ejemplo partimos de imágenes de dimensiones 640x480
         píxeles, la calidad del vídeo no puede superar estas dimensiones.
    5.   Para concluir pulsa en Aceptar.
    6.   Antes de iniciar la exportación debes guardar el proyecto pulsando desde aquí el
         botón Guardar proyecto …
    7.   Una vez definidos los distintos parámetros de calidad del vídeo, pulsa en el botón
         Siguiente.
    8.   Tras unos segundos de espera se mostrará el mensaje de Finalización.
    9.   En la pregunta ¿Qué desea hacer a continuación? puedes responder Ver la narración
         o bien pulsa en el botón Salir.




Notas:
    Si has seguido los pasos indicados la película se encontrará en la carpeta Mis
       documentos > Mis vídeos con el nombre fotos.wmv.
    Desde la pantalla de Finalización puedes pulsar en < Atrás para regresar a la pantalla
       anterior Guardar la narración. Desde ellas puedes generar otros archivos WMV con
       distintas calidades (cada una con un nombre distinto) siguiendo la secuencia de pasos
       1-6 indicada en este apartado.
Vídeo y animaciones ::: Edición de video                                                503
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


5.3 Imagination en Ubuntu
5.3.1 Instalación de Imagination
Imagination es un programa ligero y amigable que permite crear presentaciones de
diapositivas a partir de fotografías. Solo necesita el codificador ffmpeg y produce un vídeo
que se puede estampar en un DVD con otra aplicación. Dispone de 50 efectos de transición
aprox. También soporta la exportación del video al formato FLV.

Para instalar este programa desde el escritorio de Ubuntu selecciona Aplicaciones > Centro
de software de Ubuntu. En el buscador introduce el término imagination y en el ítem de
instalación correspondiente pulsa en el botón Instalar.




5.3.2 Creación de una narración de fotos
La creación de una narración con Imagination consta de los siguientes pasos:
     1. Importar y organizar imágenes.
     2. Agregar textos a las imágenes.
     3. Personalizar movimiento de cada imagen.
     4. Agregar música de fondo.
     5. Exportar a un archivo de vídeo FLV

Paso 1. Importar y organizar imágenes

1.1 Importar imágenes
     1. Descarga y descomprime el archivo paisajes.zip en una carpeta de tu equipo. Como
        resultado de esta extracción dispondrás de varias fotos en formato JPG con
        fotografías de paisajes asturianos.
     2. Abre Imagination mediante Aplicaciones > Sonido y vídeo > Imagination.
     3. Haz clic en el botón Importar imágenes o bien en la barra de menús selecciona
        Presentación > Importar imágenes.




     4. En el cuadro de diálogo Importar diapositivas … busca la carpeta donde has
        descomprimido las imágenes. Haz clic en la primera imagen, pulsa la tecla Mayus y
        luego haz clic en la última imagen. De esta forma se realiza una selección múltiple.
Vídeo y animaciones ::: Edición de video                                                   504
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     5. Se muestra la secuencia de imágenes importadas.




1.2 Manejar la lista de imágenes.

     6. Para moverse por la lista de imágenes utiliza los botones de flechas Ir al primero |
        Anterior | Siguiente | Ir al último situados en la barra de herramientas superior.
        Haz clic sobre una imagen de la lista para seleccionarla y visualizarla en el monitor.
     7. Para eliminar una imagen de la lista, selecciónala previamente en el listado inferior y
        pulsa la tecla Supr o bien elige Diapositiva > Eliminar.




     8. En todo momento se puede comprobar el aspecto que va tomando la presentación de
        diapositivas pulsando en el botón de flecha verde o play.
     9. Para modificar el orden de las imágenes puedes arrastrar y soltar las miniaturas de
        un lado para otro en este listado.
Vídeo y animaciones ::: Edición de video                                                  505
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




1.3 Guardar presentación.

     10. Conviene guardar el proyecto. Para ello selecciona Presentación > Guardar
         proyecto como …
     11. En el cuadro de diálogo Guardar un proyecto de presentación … introduce el
         nombre de la presentación. Por ejemplo: miPresentacion y haz clic en el botón
         Guardar. Se genera un archivo que contiene toda la información necesaria para
         generar la presentación de imágenes. Conviene repetir estos pasos cuando se deseen
         guardar los cambios realizados.

Paso 2. Agregar textos a las imágenes

     12. Para agregar un texto a una imagen, selecciona previamente la imagen en el listado
         para que se visualice en el visor. A continuación sobre el panel Texto de las
         diapositivas introduce el texto “Paisajes asturianos”.




     13. Pulsa en el botón que especifica el Tipo y tamaño de la fuente. Elige como tipo de
         fuente Sans Bold y como tamaño 36 píxeles.
     14. Haz clic en el botón Posición del subtítulo para elegir la alineación horizontal y
         vertical de entre las nueve posiciones diferentes. Ejemplo: inferior-centrado.
     15. Se puede definir un tipo de Animación para el texto y una Velocidad de la
         animación. En este caso no elegiremos ninguna.

    Nota:
    En lugar de añadir un título general para la película en la primera imagen (“Paisajes
    asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la
    información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre
    cada una de las miniaturas de la lista y repetir la secuencia de pasos de este apartado.
    No se propone agregar un título a cada imagen. No obstante puedes probar a hacerlo y la
    película resultante mostrará una diapositiva detrás de otra donde cada una exhibirá el
    texto explicativo correspondiente.
Vídeo y animaciones ::: Edición de video                                                 506
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




         Nº     Texto
         1      Cubos de la memoria (LLanes)
         2      Elogio al horizonte (Gijón)
         3      Faro (Cudillero)
         4      Hórreo asturiano (Pueblo de Asturias-Gijón)
         5      Iglesia Santiago Apostol (Castropol)
         6      Molino de río (Villaviciosa)
         7      Santa María del Naranco (Oviedo)
         8      Acantilados (Cabo Peñas)

     16. No olvides guardar el proyecto haciendo clic en el botón Guardar la presentación …
         para asegurarnos de no perderlo.




Paso 3. Personalizar movimientos de imagen

3.1 Movimiento de una imagen

     17. Para cada imagen se puede definir una animación que consiste en un movimiento de
         zoom. Selecciona la segunda fotografía del listado en esta presentación y en el panel
         Movimiento de las diapositivas arrastra el deslizador del Zoom para definir un zoom
         de 1.5 y pulsa en el botón Añadir y a continuación en el botón Actualizar. Esta
         acción añade una diapositiva nueva a continuación de la diapositiva original donde la
         imagen se muestra aumentada en el zoom indicado.
     18. Al generar la presentación de diapositivas, el programa Imagination generará
         automáticamente el movimiento de transición de una diapositiva a otra. A cada
         imagen se le pueden añadir tantas diapositivas como se desee con distintos valores
         de magnificación. La navegación sobre cada diapositiva asociada a cada imagen se
         realiza utilizando los botones de flechas que aparecen en el apartado Detener punto.
     19. En cada estado de zoom de una imagen se puede definir su tiempo de duración en el
         combo Duración.
Vídeo y animaciones ::: Edición de video                                                   507
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

3.2 Transición de una imagen a otra.

     20. Para definir la transición en el paso de una imagen a la siguiente, selecciona la
         imagen y despliega el combo Tipo de transición para elegir un tipo. Otra opción es
         pulsar en el botón Aleatorio.
     21. Una vez definido un tipo de transición se puede establecer la velocidad de transición.
     22. Otra opción es definir la Duración de la diapositiva en segundos. Por ejemplo: 4
         segundos en cada diapositiva.




Paso 4. Agregar música de fondo

     23. Descarga y descomprime el archivo fondo_musica.zip. Como resultado obtendrás el
         archivo fondo_musica.ogg. Imagination no importa directamente audio en formato
         MP3 por cuestiones legales.
     24. Clic en el botón Importar música o bien seleccionando en el menú Presentación >
         Importar música.




     25. Elige el archivo fondo_musica.ogg y pulsa en el botón Abrir.




     26. Se pueden añadir distintos archivos de audio para crear la banda sonora de fondo.
         Con los botones situados en la parte inferior de este listado de audios se puede
         modificar el orden de reproducción de esos audios y también eliminar los audios
         seleccionados.
Vídeo y animaciones ::: Edición de video                                                 508
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




     27. Pulsa en el botón Guardar la presentación de diapositivas.




Paso 5. Exportar a un archivo de vídeo FLV

     28. Elige Presentación > Exportar > FLV (Flash Video).
     29. En el cuadro de diálogo Exportar FLV introduce el Nombre de la presentación de
         diapositivas, por ejemplo, miPresentacion. Elige el Tamaño del vídeo (Normal o
         Panorámico) y dentro de cada uno el tamaño estándar adecuado a ese ratio. También
         puedes elegir la Calidad del vídeo (baja,media o alta). Para terminar pulsa en el
         botón Aceptar.




     30. Al cabo de unos instantes se habrá generado el archivo de vídeo FLV que contiene la
         secuencia de diapositivas. El archivo FLV se puede reproducir utilizando el programa
         VLC Media Player.
Vídeo y animaciones ::: Conversión de formatos de vídeo               509
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                              6. Conversión de
                             formatos de vídeo
Vídeo y animaciones ::: Conversión de formatos de vídeo                                   510
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



6.1 Propiedades de un vídeo con MediaInfo
MediaInfo es un programa gratuito que permite visualizar las propiedades y metadatos de un
archivo de audio o vídeo.

6.1.1 Información de un archivo multimedia que proporciona MediaInfo?

       Metadatos generales del archivo: título, autor, director, album, número de pista,
        fecha, duración, etc
       Vídeo: códec, bitrate, fotogramas por segundo, aspecto, etc.
       Audio: codec, velocidad de muestreo, canales, idioma, bitrate, etc.
       Texto: idioma de subtítulos.
       Capítulos: número y lista de capítulos.

Cuando el reproductor que estamos utilizando no es capaz de visualizar un archivo de audio o
de vídeo por un problema de códecs, MediaInfo es una interesante aplicación porque permite
obtener toda la información de ese archivo. Incluso proporciona una dirección en Internet
donde es posible encontrar un reproductor o códec con que se pueda visualizar.

6.1.2 Formatos de archivo leídos MediaInfo

       Video: MKV, OGM, AVI, DivX, WMV, QuickTime, Real, MPEG-1, MPEG-2, MPEG-4, DVD
        (VOB)...
       Audio: OGG, MP3, WAV, RA, AC3, DTS, AAC, M4A, AU, AIFF...
       Subtítulos: SRT, SSA, ASS, SAMI...

6.1.3 ¿Para qué se utiliza MediaInfo?

       Leer múltiples formatos de archivo de vídeo y de audio.
       Mostrar la información técnica y de metadatos en forma de texto, árbol, html, …
       Exportar esta información como texto.
       Integración de MediaInfo en el explorador de archivos de Windows

6.1.4 Instalación de MediaInfo en Windows
Para conocer las propiedades de un archivo de audio o de vídeo se propone el uso del
software gratuito MediaInfo (http://mediainfo.sourceforge.net/es).

    1. Descarga y descomprime a tu disco duro o pendrive el archivo
       MediaInfo_GUI_0.7.20_Windows_i386.zip. Es una versión que no necesita
       instalación. En la web oficial podrás acceder a una versión instalable en el equipo.
    2. Accede al interior de esta carpeta y haz doble clic sobre el archivo ejecutable
       MediaInfo.exe




6.1.5 Instalación de MediaInfo en Ubuntu
    1. Selecciona Aplicaciones > Centro de software de Ubuntu
    2. Introduce el término mediainfo en el buscador de aplicaciones.
    3. Clic en el botón Instalar del ítem Mediainfo supplies …
Vídeo y animaciones ::: Conversión de formatos de vídeo                                511
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Para acceder al programa elige Aplicaciones > Sonido y vídeo > MediaInfo

6.1.6 Uso de MediaInfo
    1. Descarga y descomprime el archivo flv.zip a la carpeta del disco duro. Repite el
       mismo proceso para el archivo dteatro_divx.zip. Como resultado de esta tarea
       dispondrás en la menciona carpeta de los archivos: dteatro.flv y dteatro_divx.avi
    2. Inicia el programa y luego selecciona Archivo > Abrir archivo para localizar y abrir
       uno de los archivos multimedia descargados anteriormente, p.e., dteatro.flv.
    3. Se mostrará la ventana de MediaInfo donde se puede leer la infomación relativa al
       archivo abierto.




    4. Repite los pasos 2 y 3 para el archivo dteatro_div.avi.
Vídeo y animaciones ::: Conversión de formatos de vídeo                                  512
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. Observa que al abrir un archivo de vídeo con MediaInfo se ofrece un botón de
       SitioWeb con enlace a una web donde se pueden obtener los códecs o reproductor
       necesarios para reproducir ese archivo en nuestro equipo.



6.2 Conversión de formatos de vídeo con WinFF
6.2.1 ¿Qué es WinFF?
WinFF es un convertidor gratuito de formatos de vídeo para sistemas windows, linux y mac.
Permite convertir un vídeo de un formato a otro de una forma fácil, rápida y en un solo paso.
Este programa ofrece al usuario un interfaz gráfico aunque en realidad la tarea de conversión
se traslada automáticamente a una línea de comandos para que la ejecute ffmpeg, otro
programa muy efectivo pero que sólo se puede utilizar mediante línea de comandos. De esta
forma WinFF nos evita tener que conocer y escribir la sintaxis de ffmpeg en una ventana de
terminal.

6.2.2 Instalación de WinFF en Windows

       Descarga y ejecuta el instalador de WinFF para Windows: winff-1.3.1-setup.exe. El
        programa se instalará en la carpeta de Archivos de programa y se creará un icono de
        acceso directo en el escritorio.
       En el sitio web oficial del proyecto WinFF podrás encontrar la versión más reciente o
        que se adapta a tu sistema: http://winff.org/

6.2.3 Instalación de WinFF en Ubuntu

    1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de
       Ubuntu.
    2. Introduce el término WinFF en el cuadro de búsqueda y haz clic en el icono de lupa
       que le acompaña.
    3. Haz clic en el botón Instalar del ítem de instalación WinFF
Vídeo y animaciones ::: Conversión de formatos de vídeo                                  513
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




6.2.4 Conversión de un vídeo a distintos formatos
    1. Descarga y descomprime el archivo wmp.zip a la carpeta personal. Como resultado
       de la extracción obtendrás el archivo de vídeo: dteatro.wmv.
    2. Abre WinFF.
    3. En la ventana de WinFF pulsa en el botón Añadir y navega para localizar, señalar y
       abrir el archivo dteatro.wmv. Otra posibilidad es utilizar el explorador de archivos y
       arrastrar el icono de este archivo de vídeo desde su carpeta para soltarlo sobre la
       ventana de WinFF. Esta aplicación admite la conversión por lotes de un listado de
       archivos de vídeo con sólo añadirlos a esta lista.
    4. En este caso vamos a convertir el archivo de vídeo fuente al formato FLV de Video
       Flash. En la lista desplegable Convertir a… selecciona la opción WebSites. A
       continuación despliega la lista Elegir variante para seleccionar Flash Vídeo (flv) for
       Web use Fullscreen . Si pulsas en el botón Ajustes se mostrará en la parte inferior
       distintos parámetros de la conversión que se pueden personalizar. En este caso NO es
       necesario.
    5. En el cuadro Carpeta destino se indica la carpeta donde se guardará el archivo de
       vídeo final.
    6. Para iniciar la conversión pulsa en el botón Convertir.
Vídeo y animaciones ::: Conversión de formatos de vídeo                                     514
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




6.2.5 Reproducir el vídeo FLV
    1. Abre el reproductor: Aplicaciones > Sonido y Vídeo > VLC media player. Este
       reproductor es una excelente aplicación para visualizar vídeos FLV de Flash.
    2. Selecciona Archivo > Abrir rápido Archivo para navegar a la carpeta donde se
       encuentra almacenado el nuevo archivo. Selecciónalo y pulsa en el botón Abrir. Otra
       posibilidad es utilizar el explorador de archivos y arrastrar el icono de este archivo de
       vídeo desde su carpeta para soltarlo sobre la ventana de VLC Media Player.
Vídeo y animaciones ::: El DVD como fuente de vídeo                   515
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                       7. El DVD como
                                      fuente de vídeo
Vídeo y animaciones ::: El DVD como fuente de vídeo                                      516
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


7.1 Extracción con ATG en Windows
7.1.1 Introducción
En este apartado se propone un procedimiento para convertir el vídeo de un DVD a un archivo
AVI con códec DivX o XviD. A partir de este AVI es posible extraer un fragmento y convertirlo
en un formato más propio de publicación web: FLV, WMV, MOV o RAM. Otra posibilidad es la
grabación del archivo AVI resultante en un CD-ROM utilizando un programa de grabación de
CDs. Esta segunda opción es habitual en la realización de copias de seguridad de DVDs. En el
mercado actual casi todos los reproductores DVD incorporan la prestación de la lectura de CDs
y DVDs con archivos AVI DivX y XviD.

Nota importante:

El software e instrucciones recogidas en este capítulo se proponen como método para realizar
copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no
comercial. En cualquier caso esta información NO se expone para ser usada como herramienta
para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del
archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y
propiedad intelectual legalmente establecidos.


7.1.2 Software necesario
DVD Decrypter.

La conversión de una película de DVD en otro formato no se puede realizar a partir de la
unidad lectora de DVDs. El elevado número de accesos que esta operación necesita podrían
dañar esta unidad por sobrecalentamiento. Por este motivo siempre es necesario copiar el
contenido del DVD al disco duro. Esta copia de archivos no se puede realizar mediante copiar
y pegar usando el Explorador de Windows porque a menudo se encuentran encriptados. Es
necesario un programa que desencripte los archivos del DVD y los copie al disco duro. En esta
operación no supone ninguna pérdida en la calidad del vídeo.

En la actualidad existen algunos programas que realizan esta tarea. Por su facilidad y
compatibilidad se propone DVD Decrypter. Se puede descargar de forma gratuita del sitio
Free-Codecs.com (http://www.free-codecs.com/)

Versión portable. Descarga y descomprime el archivo DVDDecrypter.exe en una carpeta de
tu disco duro o pendrive. Se trata de una versión portable del programa que se inicia al
ejecutar el archivo DVDDecrypter.exe que aparece dentro de esa carpeta.


Auto Gordian Knot

Auto Gordian Knot (http://www.autogk.me.uk/) es un paquete de programas que automatiza
muchas de las operaciones necesarias para realizar la conversión DVD-AVI. Auto Gordian Knot
es un programa gratuito que se descarga de su web oficial.

Versión instalable. Descarga e instala el programa en tu equipo a partir del instalador:
AutoGordianKnot.2.55.Setup.exe.

Versión portable. Otra opción alternativa es la versión portable. Descarga y descomprime el
archivo AutoGordianKnot_2.55.exe en una carpeta de tu disco duro o pendrive. En este caso
el programa se inicia al ejecutar el archivo AutoGK.exe que aparece dentro de esa carpeta.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                       517
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


7.1.3 Pasos para convertir DVD a AVI
    1.   Copiar el DVD al disco duro con DVD Decrypter.
    2.   Cargar los archivos originales.
    3.   Seleccionar pista de audio y subtítulos.
    4.   Definir tamaño del fichero.
    5.   Configurar parámetros avanzados.
    6.   Crear película.

A continuación se explican con detalle cada uno de estos pasos.


Paso 1. Copiar el DVD al disco duro

    1. Introduce el disco DVD en la unidad lectora.
    2. Inicia del programa DVD Decrypter.
    3. En la lista Source (Origen) selecciona la unidad lectora donde has introducido el DVD.
       En el marco derecho aparecerán todos los archivos que contiene.




Notas:
    Unidad lectora de DVD no detectada. A veces el DVD Decrypter no detecta la unidad
       de DVD y en consecuencia no está disponible en la lista Source. Esto suele deberse a
       que no están instalados los drivers ASPI correspondientes a esa unidad DVD. ASPI
       significa Advanced SCSI Programming Interface y es el software que gestiona la
       comunicación entre el ordenador y el dispositivo lector. Para resolver este problema
       basta con descargar los drivers ASPI de Windows, descomprimir el ZIP y ejecutar el
       programa aspiinst.exe que contiene. Estos drivers se pueden descargar desde la web
       oficial de Adaptec (http://www.adaptec.com). La denominación exacta de este
       software es: Windows ASPI drivers version v4.71.2 y se pueden aplicar a todos los
       sistemas Windows a partir de la versión 98.
    Disco DVD bloqueado. En alguna ocasión será necesario, antes de ejecutar DVD
       Decrypter, introducir el disco en el lector y a continuación abrir el reproductor de
       que dispongamos para visualizar DVDs (por ejemplo WindDVD o PowerDVD). De esta
       forma conseguiremos liberar las claves de los archivos protegidos. Cerramos el
       reproductor y abrimos DVD Decrypter.

    4. DVD Decrypter tiene dos modos de trabajo: modo File (Archivo) donde trabaja con los
       archivos del DVD y modo IFO donde trabaja con los contenidos del DVD (capítulos,
       pistas, extras, etc). En este caso es necesario trabajar en modo IFO para lo cual en la
       barra de menú de DVD Decrypter selecciona Mode > IFO
Vídeo y animaciones ::: El DVD como fuente de vídeo                                     518
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




        Al activar este modo se mostrarán los contenidos del DVD: (Chapter 1, 2, … =
        Capítulo 1, 2, …) en lugar de los archivos.




    5. Al activar el modo IFO, DVD Decrypter selecciona automáticamente la pista de mayor
       duración que es la que suele contener la película. El resto de pistas se corresponden
       con los créditos, tomas falsas y extras que acompañan. En la pestaña Input (Entrada)
       comprueba que está seleccionada la película (la pista de mayor duración) y que
       debajo se encuentran seleccionados todos los capítulos (Chapter 1, 2, 3, …).
    6. En el marco Destination (Destino) haz clic sobre el icono de carpeta con lupa para
       definir la carpeta del disco duro donde se guardarán los contenidos del DVD. Por
       ejemplo en la carpeta C:video o bien D:video si dispones de un segundo disco duro
       o partición.
    7. Es importante realizar la siguiente comprobación. En la barra de menús de DVD
       Decrypter selecciona Tools > Settings (Herramientas > Configuración). En la pestaña
       IFO Mode (Modo IFO) dentro de la sección Create Additional Files (Crear Archivos
       Adicionales), comprueba que la casilla Stream Information (Información de Stream)
       está activada. Esto producirá en el disco duro un fichero de texto con toda la
       información del DVD necesaria para que AutoGK concluya con éxito.




    8. Desde la ventana principal de DVD Decrypter, pulsa en la pestaña Stream Processing
       (Procesamiento del Flujo). Se puede activar la casilla Enable Stream Processing
       (Permitir Procesamiento del Flujo) y desmarcar, por ejemplo, el audio en inglés para
       que sólo se copie el audio en español. Para extraer del DVD sólo el vídeo o sólo el
       audio, activa la casilla Enable Stream Processing, seleccionaríamos sólo la pista
       deseada y en el área Stream: N/A que aparece en el panel inferior activamos la
       opción Demux. Si eliges un audio AC3, se creará un archivo de audio AC3; si eliges un
       vídeo, se creará un MPEG-2 sin audio; si eliges una pista de subtítulos (Subtitle) se
Vídeo y animaciones ::: El DVD como fuente de vídeo                                  519
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

        crearán dos archivos: IFO y VOB (son subtítulos en modo imagen que luego se puede
        pasar a texto con la aplicación SubRip). En un principio se recomienda dejar
        activadas todas las pistas.




    9. En la pestaña Stream Processing se muestran los principales datos del DVD:
         Dimensiones del vídeo: 720x576
         Proporción: 16:9
         Sistema de vídeo: PAL.
         Número de la pista de audio en Español: 0x81 (pista 2 en el orden de
            arriba/abajo).
    10. Para iniciar el proceso pulsa en el botón Decrypt (Desencriptar).




    11. Una vez finalizado el proceso se mostrará el mensaje Operation Successfully
        Completed! (Operación Completada con Éxito). Pulsa en el botón Aceptar.




    12. Cierra la ventana del programa DVD Decrypter.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                     520
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Paso 2. Cargar los archivos originales

    1. Abre Auto Gordian Knot.




    2. Como podrás observar AutoGK es un programa que simplifica en 4 pasos (steps) la
       conversión DVD-AVI:
        Step 1: Select input source and output file (Paso 1: Elegir fuente de entrada y
          archivo de salida).
        Step 2: Select audio track and subtitle track. (Paso 2: Elegir pista de audio y
          pista de subtítulos).
        Step 3: Select output size (Paso 3: Elegir tamaño de salida).
        Step 4 (optional): advanced parameters (Paso 4 –opcional-: parámetros
          avanzados).

    3. En la sección Step 1: Select input source and output file (Paso 1: Elegir fuente de
       entrada y archivo de salida) En “Input directory” localiza el archivo *.VOB que has
       capturado del DVD anteriormente.




    4. En el cuadro de texto Input directory (Carpeta de entrada), pulsa en el icono situado
       a la derecha que muestra una flecha verde sobre una carpeta.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                          521
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    5. Se muestra el cuadro de diálogo Buscar carpeta. En él debes localizar el archivo
       video situada en el disco duro donde has guardado los archivos importados con DVD
       Decrypter. Clic en el botón Aceptar. Observa que cuando AutoGK detecta los archivos
       de DVD situados en esta carpeta, en el cuadro inferior de esta sección muestra la
       información del vídeo. En este caso: PAL – 720x576 – 16:9 – 25 fps
    6. En el cuadro de diálogo Output file: (Archivo de Salida), se completa
       automáticamente con el mismo nombre de archivo y la extensión *.avi. Para
       modificar la carpeta de destino y el nombre de archivo pulsa en el icono que muestra
       la flecha verde sobre una carpeta.
    7. Se muestra el cuadro de diálogo Guardar como. En la lista Guardar en: define la
       carpeta destino donde se guardará el archivo AVI final. Por ejemplo dentro de la
       carpeta video. En la casilla Nombre introduce un nombre de archivo para este AVI.
       Por ejemplo: video. AutoGK añadirá automáticamente la extensión AVI. Pulsa en el
       botón Aceptar para concluir.

Paso 3. Seleccionar pista de audio y subtítulos

    1. En la sección Step 2: Select audio track and subtitle track. (Paso 2: Elegir pista de
       audio y pista de subtítulos), podrás seleccionar el audio/audios y también los
       subtítulos.




    2. En la lista Audio track(s) (Pistas de Audio), selecciona la pista o pistas de audio que
       deseas exportar al archivo de vídeo final. Pueden existir varias procedentes del DVD.
       Las pistas disponibles en esta lista dependerán de las ofrecidas por el DVD original y
       del tipo de importación realizada con DVD Decrypter. Si no deseas incorporar no
       marques ninguna pista.
    3. En la lista Subtitle track(s) (Pista de Subtítulos) elige No Subtitles (Ningún Subtítulo).
       En este cuadro podrías elegir una de las pistas de subtítulos disponibles.


Paso 4. Definir el tamaño del fichero

    1. En la sección Step 3: Select output size (Paso 3: Elegir tamaño de salida), podemos
       seleccionar el tamaño final que ocupará el archivo. Cuanto mayor sea, mejor será la
       calidad del archivo final.




    2. Activa la opción Predefined size (Tamaño predefinido) y en la lista desplegable
       selecciona la entrada 1 CD (700 Mb) o bien 2 CDs(1400 Mb). En este caso se
       recomienda esta segunda opción ya que suele ofrecer una relación peso/calidad muy
       interesante. Al final obtendremos tantos ficheros como CDs hayamos marcado. Esto
       permitirá grabar en CD los archivos resultantes de esta conversión.
    3. Si seleccionas la opción Custom size (MB) (Tamaño personalizado (MB)), podrás
       definir el tamaño que tendrá la película final. AutoGK creará un archivo AVI con este
       tamaño y si es superior a 700 Mb, también producirá los archivos resultantes de haber
Vídeo y animaciones ::: El DVD como fuente de vídeo                                        522
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

       fragmentado éste en trozos de peso igual o inferior a 700 Mb. Esto facilitará la copia
       en soporte CD.
    4. Si seleccionas la opción Target Quality (in percentage) (Calidad Destino (en
       porcentaje)), podrás seleccionar el % de calidad que tendrá el archivo final con
       independencia del peso del archivo.

Paso 5. Configurar parámetros avanzados

    1. En la sección Step 4 (optional): advanced parameters (Paso 4 –opcional-: parámetros
       avanzados), podremos configurar opcionalmente algunos parámetros de la película
       final. Pulsa en el botón Advanced Settings (Configuración avanzada).




En el botón “Advanced Settings” se accede a la configuración de los parámetros avanzados

    2. En el cuadro Advanced Options (Opciones Avanzadas) se puede configurar:




       Output resolution settings (Configuración Resolución Vídeo). Permite definir la
        anchura o resolución horizontal del vídeo (la vertical será calculada automáticamente
        en función de la proporción de la película). Si se selecciona Auto width (Anchura
        automática), AutoGK calculará la resolución más óptima en función de un test de
        compresibilidad. Es la opción recomendada. Si se elige Minimum width (Anchura
        mínima) o bien Maximum width (Anchura máxima) y en el contador derecho se define
        una anchura –por ejemplo, 640 píxeles- entonces la resolución horizontal que utilizará
        AutoGK para crear la película final será como mínimo o como máximo
        respectivamente el valor indicado. Si marcas la opción Fixed width (Anchura Fija), la
        película tendrá exactamente como resolución horizontal la cantidad de píxeles
        indicada.
       Output audio type (Tipo de Audio de Salida). Permite definir el tipo de audio que
        deseamos en la película: AC3, VBR MP3 (bitrate variable) o bien CBR MP3. En la
        mayoría de los casos la opción recomendada es Auto. Si eliges la opción Auto
        (Automática), para archivos de 700 Mb o menos, el audio será: VBR MP3 a 128 Kbps.
        Sin embargo para archivos superiores a 700 Mb, el formato de audio será AC3. Si
        hemos incluído dos pistas de audio y aquí hemos configurado un tipo concreto de
        audio, ambos tendrán ese formato: ambas AC3 o bien ambas MP3. Si existen dos
        pistas de audio y aquí elegimos Auto, entonces la primera tendrá formato AC3 y la
        segunda MP3 VBR 128 Kbps.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                        523
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

       Códec. Se puede usar cualquiera de los dos: DivX y XviD. Es necesario que el códec
        elegido esté instalado en el equipo. Recuerda que al instalar Auto Gordian Knot el
        códec de XviD ya se instala directamente porque viene incluído en el paquete
        mientras que DivX (versión Create) es necesario descargarlo e instalarlo aparte.
       Subtitle Options (Opciones de SubTítulos). Este apartado sólo es necesario
        configurarlo si hemos incluído subtítulos en la película final. Si marcas la opción
        Display only forced subtitles (Mostrar solamente subtítulos forzados) sólo se
        mostrarán los subtítulos forzados, es decir, aquellos que se muestran siempre en la
        película aunque no tengamos activados los subtítulos. Ejemplo: Traducción al español
        o inglés del discurso de un personaje que habla en un tercer idioma y cuyo contenido
        se considera importante para el desarrollo de la acción. En el paso 2 tendríamos que
        haber selccionado la pista de subtítulos en el idioma adecuado. La opción Use
        external subtitles se refiere a la posibilidad de cargar los subtítulos de un archivo
        externo pero no funciona bien en todos los reproductores por lo que conviene no
        activarlo.

    3. Si pulsas en el botón Preview (Vista previa), tras cierta espera, podrás ver una vista
       previa del aspecto final del vídeo pero sin el audio.




Paso 6. Crear película

    1. Cuando se ha finalizado la configuración de todos los parámetros, haz clic en el botón
       Add Job (Añadir Tarea).




    2. En la Cola de Tareas (Job queue) aparecerá una nueva entrada con información del
       nombre del archivo AVI final, su carpeta de ubicación y una casilla de verificación
       activada.




    3. Una vez introducida esta tarea en la Cola de Tareas podemos cerrar AutoGK y
       continuar en otro momento con la conversión definida. Otra posibilidad es abrir otro
       DVD para añadir una segunda tarea de conversión a la lista. En cualquier caso la
       codificación no comenzará hasta que no se lo indiquemos.
    4. Para comenzar con la creación de la película AVI final pulsa en el botón Start (Inicio).




    5. AutoGK irá abriendo y cerrando programas según lo vaya necesitando para realizar las
       distintas partes del proceso: creación del proyecto con DGIndex, test de
       compresibilidad, compresión con VirtualDubMod, audio con BeSweet, etc. En la
Vídeo y animaciones ::: El DVD como fuente de vídeo                                         524
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

        ventana de eventos (Log Window) irán apareciendo los mensajes de lo que se está
        haciendo. En los primeros pasos habrá que fijarse en la barra de tareas porque al
        desplegar alguna de estas aplicaciones será necesario aceptar las condiciones de la
        licencia de uso para que el proceso pueda continuar.




    6. Una vez pulsado en el botón Start (Inicio) el proceso ya está automatizado y es
       necesario que se realice sin pausas. Si durante el transcurso del mismo pulsas en el
       botón Abort (Detener) habría que empezar desde el principio en la siguiente tentativa.
    7. La duración de la conversión dependerá de la duración del DVD original y de las
       características del equipo (procesador, memoria RAM, disco duro, etc.). A título
       orientativo, por ejemplo, un DVD con una película de 2 horas de duración, en un
       Pentium IV-2Ghz con 1Gb de RAM puede tardar alrededor de 5 horas. Por ello es
       necesario armarse de un poco de paciencia. Si vas a dejar el ordenador trabajando
       solo, una opción interesante es marcar la casilla Shutdown when done (Apagar
       cuando termine). De esta forma el equipo se apagará cuando finalicen todos las
       tareas almacenadas en la Cola de Tareas.
    8. La tarea terminará cuando en la Log Window (Ventana de eventos) aparezca el
       mensaje de tarea finalizada: [dd/mm/aaaa hh:hh:ss] Job finished. Total time: X
       hours XX minutes X seconds.
    9. Cierra la ventana de Auto Gordian Knot.

Paso 7. Ver película

    1. Cuando ha finalizado la conversión, utiliza el Explorador de Windows para situarte
       en la carpeta donde has creado el archivo AVI final. En el ejemplo anterior era la
       carpeta video situada en el directorio raíz del disco duro C: ó D:
    2. Con intención de ahorrar espacio en disco y una vez terminado con éxito el proceso
       de conversión DVD-AVI, conviene eliminar la carpeta temporal auto_gk que se ha
       creado en la misma carpeta donde se ha guardado este AVI. También conviene borrar
       los archivos *.VOB que se han generado con DVD Decrypter.
    3. Para visualizar el video arrástralo y suéltalo sobre una ventana de VLC Media Player.
       Este reproductor puede leer archivo AVI codificados con Xvid.

Nota:

    La mayoría de los reproductores de DVD actuales reconocen el formato DivX y XviD.
    Comprueba en la documentación del tuyo si es compatible con estos formatos. Algunos
    modelos suelen mostrar incluso en su carcasa exterior el logo de DivX para indicar esta
    característica. Si es así, basta con grabar el archivo AVI desde el disco duro del ordenador
    a un CD-ROM como si se tratase de un CD de datos utilizando un programa tipo Nero
    Burning o similar. Al introducir este disco en el reproductor DVD se visualizará en pantalla.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                      525
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


7.2 Extracción con dvd::rip en Ubuntu
7.2.1 Introducción
En este apartado se propone un procedimiento para convertir el vídeo de un DVD a un archivo
AVI con códec XviD. A partir de este AVI es posible extraer un fragmento y convertirlo en un
formato más propio de publicación web: FLV, WMV, MOV o RAM. Otra posibilidad es la
grabación del archivo AVI resultante en un CD-ROM utilizando un programa de grabación de
CDs. Esta segunda opción es habitual en la realización de copias de seguridad de DVDs. En el
mercado actual casi todos los reproductores DVD incorporan la prestación de la lectura de CDs
y DVDs con archivos AVI DivX y XviD.

Nota importante:

El software e instrucciones recogidas en este capítulo se proponen como método para realizar
copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no
comercial. En cualquier caso esta información NO se expone para ser usada como herramienta
para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del
archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y
propiedad intelectual legalmente establecidos.

7.2.2 Software necesario
dvd::rip

Es un programa que permite ripear un DVD de vídeo, es decir, obtener un archivo o archivos
de vídeo en el disco duro a partir de los contenidos de este soporte.

Para instalar dvd::rip en Ubuntu:

    1. Desde el escritorio selecciona Aplicaciones > Centro de software de Ubuntu
    2. En la casilla Buscar introduce el término rip.
    3. Pulsa en el botón Instalar del programa dvd::rip

mplayer

dvd::rip utiliza por defecto el programa mplayer para reproducir los fragmentos de DVD y
archivos generados. Para instalarlo sigue una rutina similar a la anterior: Aplicaciones >
Centro de software de Ubuntu.


Códecs para DVD encriptados

La mayoría de los DVDs comerciales están encriptados. Para poder leerlos sin problemas
desde dvd::rip, mplayer o incluso VLC Media Player es necesario instalar una librería
adicional. Para ello sigue estos pasos:

    1. Abre un terminal de consola mediante Aplicaciones > Accesorios > Terminal.
    2. Teclea la siguiente orden:

        sudo apt-get install libdvdread3 debhelper fakeroot

    3. Se solicita la contraseña de root y el CD de instalación de Ubuntu.
    4. A continuación ejecuta el siguiente comando:

        sudo /usr/share/doc/libdvdread3/install-css.sh
Vídeo y animaciones ::: El DVD como fuente de vídeo                                     526
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


7.2.3 Configuración de dvd::rip
    1. Inicia el programa mediante Aplicaciones > Sonido y vídeo > dvd::rip
    2. La primera vez que se inicia este programa se muestra el cuadro de diálogo de
       Preferencias. Estas opciones se podrán modificar en todo momento desde el
       programa a Editar > Preferencias.
    3. En la pestaña Configuraciones básicas se muestran las distintas opciones por defecto
       del programa. Será necesario utilizar el explorador de archivos para crear la carpeta
       dvdrip-data dentro del directorio /home/<usuario>/. En esta carpeta será donde se
       guarden los archivos de la conversión. Tras la creación de esta carpeta pulsa en el
       botón Comprobar todo para obtener el OK.




    4. En la pestaña Comandos comprueba que el Comando de reproducción de DVD y el
       Comando de reproducción de archivo es el programa mplayer que hemos instalado
       para reproducir los DVDs y archivos creados.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                     527
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    5. Para cerrar la configuración pulsa en el botón Aceptar.

7.2.4 Convertir DVD a AVI con dvd::rip
    1.   Introduce el DVD en la unidad del ordenador.
    2.   Inicia el programa mediante Aplicaciones > Sonido y vídeo > dvd::rip
    3.   Selecciona Archivo > Nuevo proyecto
    4.   En la pestaña Almacenamiento introduce el nombre del proyecto de captura.
         Ejemplo: cortos2007. En este caso interesa elegir un nombre significativo con el
         contenido del vídeo.




    5. Pulsa en el botón + Crear proyecto.
    6. Se muestra el cuadro de diálogo Guardar proyecto y en Nombre: aparece el nombre
       del proyecto. Clic en el botón Aceptar.
    7. En la pestaña Almacenamiento y en la sección Elegir un modo de extracción marca
       la opción Copiar los datos del DVD al disco duro antes de codificar. Conviene activar
       esta opción para copiar el contenido del DVD al disco duro antes de iniciar la
       codificación. Esto agilizará el proceso y protegerá la unidad lectora de DVD.




    8. Clic en la pestaña Extraer Tìtulo. Pulsa el botón Leer tabla de contenidos del DVD
       para leer las pistas del DVD que se mostrarán en el listado inferior.
Vídeo y animaciones ::: El DVD como fuente de vídeo                                        528
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    9. Para visualizar una pista márcala en el listado y a continuación pulsa en el botón Ver
        título(s)/capítulo(s) seleccionados.
    10. Para comenzar la extracción de la pista al disco duro del equipo, selecciona la pista
        que deseas y luego pulsa en el botón Extraer título(s)/capítulo(s) seleccionados.
    11. Si deseas tener información de la evolución de la extracción pulsa en la pestaña
        Registro.




    12. En la pestaña Codificar comprueba los siguientes parámetros que normalmente suelen
        venir definidos por defecto:
             Opciones de contenedor > Selecciona contenedor: AVI
             Opciones de vídeo > Códec de vídeo: xvid
             Opciones de vídeo > Tasa de vídeo: 25.000
             Opciones de vídeo > Hacer dos pasadas: Sí
             Cálculo de tasa de bits de vídeo > 2x700
             Opciones del audio > Seleccionar pista: elegir la pista de audio del idioma
                adecuado si hubiera varias.
             Opciones de audio > MP3: Tasa de bits de 128 kbit/s y 48000 Hz.

    13. Para iniciar el procedimiento de codificación pulsa en el botón Codificar.
    14. Si deseas ver cómo evoluciona proceso activa la pestaña Registro.
    15. Una vez concluido el proceso el archivo AVI resultante de la transformación se
        encontrará en la carpeta: /home/<usuario>/<nombre_proyecto>/avi/. Para
        visualizarlo haz clic derecho sobre este archivo y elige Abrir con MPlayer o bien Abrir
        con VLC Media Player. Desde el programa dvd::rip puedes reproducir el archivo AVI
        pulsando en el botón Ver de la pestaña Codificar.
Vídeo ::: Insertar un vídeo en Blogger                                529
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                      8. Insertar un vídeo
                                en el blog
Vídeo ::: Insertar un vídeo en Blogger                                530
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                 8.1 Insertar un vídeo
                            en Blogger
Vídeo ::: Insertar un vídeo en Blogger                                                     531
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.1.1 Insertar un vídeo en Blogger
    1. Descarga y descomprime el archivo turismoRural.zip. Como resultado obtendrás un
       archivo de vídeo turismoRural.mov que puedes visualizar en tu equipo utilizando VLC
       Media Player.
    2. Abre una nueva pestaña del navegador web y accede a la URL de inicio de Blogger:
       https://www.blogger.com/start?hl=es
    3. 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.
    4. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio.
    5. En este panel aparecerán los distintos blogs que gestionas en Blogger.
    6. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición
       del blog donde deseas publicar el artículo.




    7. Descarga y descomprime el archivo turismoRural.zip. Como resultado obtendrás un
       archivo de vídeo turismoRural.mov que puedes visualizar en tu equipo utilizando VLC
       Media Player.
    8. Introduce el título de la nueva entrada: Turismo rural.
    9. En la barra de herramientas del editor haz clic en el botón Añadir vídeo.




    10. Se mostrará el cuadro de diálogo Añade un vídeo en tu entrada de blog para subir el
        vídeo desde nuestro equipo. Clic en el botón Examinar para localizar y señalar el
        archivo turismoRural.mov que hemos obtenido en un paso anterior.
Vídeo ::: Insertar un vídeo en Blogger                                                     532
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    11. Como se indica en este cuadro de diálogo se pueden subir vídeos en formatos AVI,
        MPEG, MOV (QuickTime), RM (Real) y WMV (Windows Media). El tamaño máximo del
        archivo de vídeo subido será de 100 MB.
    12. Teclea el Título del vídeo y marca la casilla de verificación de condiciones.
    13. En la parte inferior activa la casilla de aceptación de condiciones y pulsa en el botón
        SUBIR VÍDEO.
    14. Durante los segundos invertidos en la subida del archivo de vídeo al servidor se
        mostrará dentro del editor un reproductor multimedia con información al respecto:
        Uploading vídeo … (Subiendo vídeo). Your video will appear here when finished (Tu
        video aparecerá aquí cuando haya terminado).




    15. Si el proceso de subida se realiza con éxito se mostrará el reproductor con un botón
        PLAY en el centro.
Vídeo ::: Insertar un vídeo en Blogger                                                     533
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    16. Para terminar pulsa en el botón PUBLICAR ENTRADA.




    17. A continuación haz clic en el enlace Ver blog para ver el resultado final. Al pulsar en
        el botón Play se reproducirá el vídeo subido.




Nota:
        Este sistema de publicación de vídeos en Blogger nos ofrece por ahora poco control
        sobre la edición y eliminación de los vídeos subidos. Es uno de los temas pendientes
        de mejorar en Blogger.
Vídeo ::: Insertar un vídeo en Blogger                                                  534
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.1.2 El formato Flash Vídeo (FLV)
En la actualidad Blogger no admite al autor de un blog subir directamente un archivo en
formato FLV (Flash Video http://www.adobe.com). Sin embargo es un hecho que este
formato ha experimentado un gran auge como medio para publicar contenidos de vídeo en
Internet. Varias son las razones que justifican este fenómeno:

       El cliente sólo necesita tener instalado el plugin o reproductor de Adobe Flash en su
        navegador web.
       Es accesible desde la mayoría de los sistemas operativos (Windows, Linux, Mac, etc) y
        navegadores web (IExplorer, Firefox, NetScape, Safari, Opera, etc). Esto garantiza un
        acceso universal al contenido.
       La consola de reproducción se puede incluir fácilmente en una página web y al estar
        diseñado con Adobe Flash admite un skin con un alto grado de personalización: fondos,
        colores, botones, logo del centro o empresa, comportamiento, etc
       Se puede reproducir en distintos reproductores locales: MPlayer, VLC media player,
        Riva, Xine, et.
       Los repositorios de vídeo más conocidos en Internet han apostado por este formato
        para la difusión de vídeos: YouTube, GoogleVideo, iFilm, etc.
       El formato FLV utiliza los códecs Sorenson Spark y On2 VP6 que permiten una alta
        calidad visual con bitrates reducidos.
       Es un formato que admite streaming, es decir, tras unos segundos iniciales de
        almacenamiento en el buffer, comienza su visualización y esta se produce de forma
        ininterrumpida mientras se completa en segundo plano la descarga del resto del vídeo.



8.1.3 Publicación de vídeo FLV en Blogger
En este apartado se expone cómo integrar vídeos FLV en una entrada del blog utilizando el
reproductor      flash      multimedia     desarrollado      por      Jeroen       Wijering
(http://www.longtailvideo.com/). Se utiliza en muchos sitios web ya que permite la
configuración de múltiples parámetros y admite la reproducción de archivos flv simples y de
listas de reproducción. En este caso vamos a utilizarlo para reproducir un vídeo FLV que
alojamos previamente en Google Sites.

8.1.3.1 Introducción

    1. Descarga y descomprime el archivo flvplayer.zip en una carpeta del disco local.
    2. Desde el explorador de archivos abre la carpeta flvplayer y haz doble clic en el
       archivo index.html. Con esto se abrirá el navegador mostrando el contenido de un
       video FLV.
    3. La consola de reproducción para un archivo flv permite iniciar y detener el vídeo así
       como arrastrar la barra de progreso de la pista y del volumen. En la reproducción de
       listas de vídeos FLV también se proporcionan botones para saltar al siguiente o
       anterior de la lista. También se ofrece un botón que permite visualizar el vídeo en
       modo pantalla completa.
Vídeo ::: Insertar un vídeo en Blogger                                                      535
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Regresa al explorador de archivos en la carpeta flvplayer. Dentro de esta carpeta se
       puedes encontrar los siguientes archivos:
        La página HTML que permite el acceso a todo el conjunto: index.html
        El reproductor de vídeo de Jeroen Wijering creado en tecnología Adobe Flash:
          flvplayer.swf
        El video FLV que se reproduce: video.flv
        La imagen previa en formato GIF que se muestra antes de iniciar la reproducción
          del vídeo y que tiene la misma dimensión del vídeo: captura.jpg




8.1.3.2 Subida de archivos a Google Sites
    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>. En este caso vamos a guardar en
       este espacio los archivos que vamos necesitar para luego enlazarlos desde el blog.
    6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los
       archivos se propone crear una carpeta de nombre video 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 video. Observa que la carpeta contenedora de archivos se
       creará en la ruta: /site/<nombre_usuario>/video. Clic en el botón Crear página.
Vídeo ::: Insertar un vídeo en Blogger                                                    536
Multimedia 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 para pulsar en el botón Examinar y localizar el archivo de imagen
       captura.jpg. Clic en el botón Subir.




    10. Repite el paso anterior para subir el archivo del reproductor flvplayer.swf y el
        archivo de vídeo video.flv. El vídeo tardará un poco en subir porque tiene cierto peso.




    11. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a
        ella.

8.1.3.3 Generar el código para incrustar
    1. Regresa a la carpeta donde se encuentran los activos descargados y haz clic derecho
       sobre el archivo index.html para seleccionar Abrir con … > Bloc de notas.
Vídeo ::: Insertar un vídeo en Blogger                                                        537
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    2. El código que integra el reproductor y el vídeo en la página es:

        <embed src="flvplayer.swf" width="384" height="308" allowfullscreen="true"
              flashvars="file=video.flv&image=captura.jpg&width=384&height=308">
        </embed>

        En la variable file se indica la referencia a la ubicación del archivo de vídeo flv que se
        reproduce. Puedes modificar este valor para reproducir un vídeo con otro nombre
        distinto. En las variables height y width se indican la altura y anchura en píxeles con
        que se visualizará el reproductor. El vídeo tiene unas dimensiones originales de
        384x288 píxeles. Puede comprobarlo utilizando MediaInfo tal y como se explicaba en
        un apartado anterior. La botonera ocupa 20 píxeles de altura. Sumados a los 288 del
        vídeo hacen un total de 308 píxeles para el total del reproductor.

    3. A continuación modificamos este código para que el reproductor (flvplayer.swf), la
       imagen (captura.jpg) y el video (video.flv) sean los que has subido a tu espacio en
       Google Sites. Para ello regresa a la página de Google Sites y haz clic derecho sobre el
       enlace correspondiente al reproductor flvplayer.swf y elige la opción Copiar la ruta
       del enlace.




    4. Sitúate en el Bloc de Notas, selecciona el valor del parámetro src, es decir, el
       contenido comprendido entre las comillas y a continuación selecciona Editar >Pegar.
       Elimina la coletilla attredirects=0 de la URL pegada.
Vídeo ::: Insertar un vídeo en Blogger                                                     538
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. Repite el paso anterior para sustituir la ruta a video.flv y a la imagen captura.jpg. El
       resultado final podría ser un código similar a éste:

        <embed src="http://sites.google.com/site/fernandoposada/video/flvplayer.swf"
        width="384" height="308" allowfullscreen="true"
        flashvars="file=http://sites.google.com/site/fernandoposada/video/video.flv&image=
        http://sites.google.com/site/fernandoposada/video/captura.jpg&width=384&height=
        308">
        </embed>

    6. Selecciona este código <embed> … </embed> y elige Editar > Copiar.

8.1.3.4 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. Teclea el título: Los medios de transporte.
    7. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    8. 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.
Vídeo ::: Insertar un vídeo en Blogger                                              539
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    9. Para terminar pulsa en el botón PUBLICAR ENTRADA.




    10. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo ::: Insertar un vídeo en Wordpress                              540
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                 8.2 Insertar un vídeo
                         en Wordpress
Vídeo ::: Insertar un vídeo en Wordpress                                                 541
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2.1 Vídeos en Wordpress
En un blog de Wordpress, a diferencia de Blogger, no se pueden subir de forma gratuita
directamente vídeos para integrar en una entrada del mismo. Se requiere contratar el servicio
de pago VideoPress Upgrade. Este sistema no será tratado en este curso por razones obvias.

Sin embargo en una entrada de un blog de Wordpress se pueden insertar de forma gratuita
vídeos alojados en servicios externos. En este capítulo vamos a tratar algunos de ellos.



8.2.2 Blip.tv
    1. Visita la web de Blip.tv (http://blip.tv/)
    2. Utiliza el buscador para localizar el vídeo que te interesa. Otra opción es crear una
       cuenta y subir tu propio vídeo. Sitúate en el vídeo para su visualización.




    3. En la columna lateral derecha que acompaña al vídeo se ofrece una barra en color
       naranja. Haz clic en el combo Share y selecciona la opción Embed. A continuación
       haz clic en el combo Show Player y selecciona la opción Wordpress.com. Clic en el
       botón Go.
Vídeo ::: Insertar un vídeo en Wordpress                                             542
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    4. Selecciona el código que se ofrece debajo, haz clic derecho y elige Copiar.




    5. Sobre el editor HTML de entradas de Wordpress.com haz clic derecho y selecciona
       Pegar.




    6. Clic en el botón Publicar/Actualizar y a continuación haz clic en el enlace Vista
       previa para ver el aspecto del vídeo insertado en el artículo.
Vídeo ::: Insertar un vídeo en Wordpress                                                  543
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2.3 DailyMotion
    1. Visita la web de DailyMotion (http://www.dailymotion.com/es)
    2. Busca el vídeo que deseas insertar en un articulo de tu blog Wordpress. Fíjate en la
       URL o dirección de esa página del tipo:

   http://www.dailymotion.com/video/xcfw1n_el-viento-de-marte-medido-gracias-a_tech


    3. En esta dirección aparece el identificador ID de este vídeo en DailyMotion. En este
       ejemplo el identificador es: xcfw1n
    4. En el código HTML de la entrada de tu blog en Wordpress.com introduce la siguiente
       etiqueta:

        [dailymotion id=xcfw1n]




    5. Clic en el botón Publicar y luego en el enlace Ver artículo.
Vídeo ::: Insertar un vídeo en Wordpress                                                  544
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2.4 Otros servicios de vídeo

8.2.4.1 Flickr Video
        1. Localiza un vídeo en Flickr (http://www.flickr.com/explore/video/)
        2. Copia el identificador ID del vídeo que figura en la última parte de su URL:
           Ejemplo: http://www.flickr.com/photos/chaddles/2402990826
        3. En el código HTML del artículo de Wordpress pega la etiqueta:

             [flickr video=http://www.flickr.com/photos/chaddles/2402990826]

             o bien

             [flickr video=2402990826]

             Para que no se muestre la información inicial al principio del vídeo:

             [flickr video=2402990826 show_info=no]

             Para definir la altura y anchura en píxeles del reproductor:

             [flickr video=2402990826 w=200 h=150]

8.2.4.2 LiveVideo
        1. Localiza un vídeo en LiveVideo (http://www.livevideo.com/)
        2. Copia el identificador ID del vídeo que figura en su URL.
           Ejemplo:

        http://www.livevideo.com/video/F25406F905A64843B19E7CDC3CFD04A4/cool-mac.aspx

        3. En el código HTML del artículo de Wordpress pega la etiqueta:

             [livevideo id=F25406F905A64843B19E7CDC3CFD04A4]

8.2.4.3 PodTech
        1.   Localiza un vídeo en PodTech (http://www.podtech.net/)
        2.   Haz clic en el botón naranja Share (Compartir).
        3.   Marca la casilla Embedding in Wordpress.com y haz clic en el botón Copy.
        4.   Pega en el código HTML del artículo de Wordpress la etiqueta copiada.

8.2.4.4 Viddler
        1. Localiza un vídeo en Viddler (http://www.viddler.com/)
        2. Haz clic en el botón Embed This (Insertar Esto).
        3. Marca la opción Wordpress.com, selecciona el código y haz clic derecho para
           Copiar.
        4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada

8.2.4.5 Videolog
        1.   Localiza un vídeo en Videolog (http://videolog.tv/)
        2.   Haz clic en el botón Wordpress.
        3.   Selecciona el código y haz clic derecho para Copiar.
        4.   Pega en el código HTML del artículo de Wordpress la etiqueta copiada.
Vídeo ::: Insertar un vídeo en Wordpress                                                  545
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


8.2.5 VodPod: importación de vídeos para
Wordpress
VodPod (http://vodpod.com) es un servicio intermedio que permite incorporar a un artículo
de Wordpress.com un video alojado en cualquier servicio de vídeos: Youtube, Revver, Vimeo,
etc. Sólo es necesario que el vídeo esté en formato Flash Vídeo (FLV) y que el servicio que lo
aloja ofrezca el código embed. Gracias a VodPod es posible salvar la limitación que ofrece
Wordpress.com de no admitir las etiquetas <embed …> en la edición de sus artículos y no
poder con ello insertar vídeos de estos servidores.

        1. Visita la web de VodPod y registrate como usuario. Identíficate con tu usuario y
           contraseña.
        2. Visita la página http://vodpod.com/wordpress/ utilizando el navegador Mozilla
           Firefox.
        3. En tu navegador Mozilla Firefox debes tener visible la barra de marcadores
           mediante Ver > Barras de herramientas > Barras de herramientas de
           marcadores.
        4. Arrastra el botón Post to Wordpress para soltarlo sobre la barra de marcadores
           del navegador.




        5. A continuación accede a la página de un servicio de vídeo. Por ejemplo: Revver
           (http://www.revver.com). Localiza el vídeo que deseas insertar y pulsa en el
           marcador Post to WordPress.
        6. Se mostrará un cuadro de diálogo emergente donde debes introducir la URL de tu
           blog, el usuario y contraseña para editar en ese blog. Clic en Publish.
        7. Se cerrará esta ventana y se mostrará el editor de entradas con un nuevo artículo
           conteniendo el código correspondiente a ese vídeo.
        8. Tras publicar y ver la vista previa de ese artículo, observarás que el vídeo se ha
           integrado en el artículo.
Vídeo y animaciones ::: Youtube, video en streaming                   546
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                                9. Youtube:
                         video en streaming
Vídeo y animaciones ::: Youtube, video en streaming                                        547
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.1 ¿Qué es Youtube?
                        YouTube (http://www.youtube.com) es un servicio de búsqueda y
                        alojamiento de vídeos que ofrece la posibilidad de asignar tags o
                        etiquetas a los mismos para facilitar su localización.

                       En poco tiempo este sitio web se ha convertido en el mayor repositorio
de vídeos en Internet. Cualquier usuario puede registrarse de forma gratuita y subir sus vídeos.
Estos pueden ajustarse a cualquier temática siempre y cuando no sea pornográfica y no
incumplan las leyes vigentes sobre copyright y pertinencia de contenidos.


9.2 Acceso autentificado a Youtube
Para subir tus propios vídeos es necesario registrarse como usuario en Youtube. Sin embargo
si ya dispones de credenciales Google puedes utilizarlas para acceder a este servicio con ellas.
Básicamente existen dos formas de acceder al espacio autentificado de Youtube:

       Acceso directo. Abre el navegador y visita la URL de Youtube: www.youtube.com.
        Haz clic en el enlace Acceder que aparece en la esquina superior derecha y debes
        introducir tu dirección de correo electrónico usuario@gmail.com (no el usuario) y tu
        contraseña de Google.
       Acceso desde Blogger. Haz clic en el enlace Mi cuenta que se muestra en la esquina
        superior derecha una vez que te has autentificado. En la página Mi cuenta haz clic en
        el entrada al servicio Youtube.



9.3 Publicación de un vídeo en YouTube
YouTube puede aceptar casi cualquier formato de vídeo para las subidas: WMV, .AVI, .MOV
y .MPG. Sin embargo se ha comprobado que la configuración que ofrece mejores resultados
para la mayoría de los usuarios es la que se indica a continuación.

       Códec del vídeo: H.264, MPEG-2 o MPEG-4 preferiblemente
       Resolución recomendada: 1280 x 720 (16 x 9 HD) o bien 640 x 480 (4:3 SD) aunque
        admite también resoluciones inferiores como 480x360.
       Formato de audio: MP3 o AAC preferiblemente en estéreo con 44,1 kHz de bitrate.
       Fotogramas por segundo: 24-25 fps
       Tamaño de archivo máximo: 2 GB

Los pasos para subir un vídeo son:

    1. Descarga y descomprime el archivo paisajesAsturias.zip en tu disco duro. Como
       resultado obtendrás el archivo de vídeo paisajesAsturias.wmv
    2. Accede de forma autentificada a Youtube directamente o a través de Blogger. En
       ambos casos se mostrará la página de Youtube con tu nombre de usuario en la esquina
       superior derecha.
    3. Haz clic en el enlace Subir.
Vídeo y animaciones ::: Youtube, video en streaming                                       548
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    4. Pulsa en el botón Subir vídeo. Si dispones de cámara web en el equipo otra opción es
       pulsar en el botón Grabar de cámara web para crear el vídeo utilizando este
       dispositivo.
    5. Se abre un cuadro de diálogo donde debes seleccionar el vídeo a subir. En cuanto
       pulsas el botón Aceptar comienza la subida al servidor.
    6. Mientras se sube el archivo puedes completar los siguientes datos del vídeo
            Título. Por ejemplo: Paisajes asturianos.
            Descripción. Texto breve que describe el vídeo. Ejemplo: Algunas fotografías
                sobre paisajes asturianos.
            Etiquetas. Facilitan la búsqueda del vídeo. Se introduce una o varias
                etiquetas separadas por espacios. Ejemplo: asturias paisajes. Estos son los
                campos obligatorios para poder subir un vídeo. En el resto se pueden dejar las
                opciones por defecto.
            Categoría. Selecciona una categoría o tema. Ejemplo: Viajes y eventos.
            Privacidad. Es posible elegir entre Comparte tu vídeo con el mundo (opción
                recomendada) o bien Privado.




    7. Clic en el botón Guardar cambios. Se mostrará una entrada en el listado de vídeos
       subidos.




    8. Una vez finalizada la subida haz clic en el enlace Mis Vídeos. A la sección Mis Vídeos
       siempre puedes ir desde el menú horizontal superior pulsando en el nombre de
       usuario y seleccionando la opción Mis vídeos.
Vídeo y animaciones ::: Youtube, video en streaming                                      549
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    Nota:

    Después de subir el archivo al servidor puede ocurrir que tengas que esperar unos minutos
    para que se complete la conversión del vídeo. YouTube procesa el formato original del
    archivo para transformarlo en formato Video Flash.




    9. Observa que se ha creado una entrada nueva con el vídeo. Para visualizar su
       contenido haz clic en el botón Reproducir.




    10. Desde este panel se puede pulsar en sus distintos botones para realizar diversas
        tareas:
             Reproducir. Para visualizar el vídeo tal y como lo verán el resto de usuarios
                de Youtube.
             Editar. Permite personalizar distintos parámetros avanzados de reproducción
                del vídeo.
             Anotaciones. Es una herramienta ideal para crear anotaciones sobre la línea
                de tiempo del propio vídeo: bocadillos, notas, regiones destacadas,
                indicaciones de pausa, etc.
             Cambiar Audio. Facilita modificar la pista original de audio por otra del
                listado que propone Youtube. Otra posibilidad es pulsar en el enlace Título y
                Subtítulos y se puede subir un archivo de subtítulos.
             Insight. Al hacer clic en este botón se mostrarán distintos datos estadísticos
                sobre la visualización del vídeo.
             Eliminar. Se utiliza para eliminar el vídeo de Youtube y liberar con ello el
                espacio disponible para la cuenta en el servidor.
             Descargar MP4. Al pulsar en este botón se descargará la película en formato
                de alta calidad MP4.
Vídeo y animaciones ::: Youtube, video en streaming                                         550
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    11. Clic en el botón Editar. Se mostrará la página Información y configuración de ese
        vídeo. En ella se ofrecen distintas secciones:
             Información del vídeo. Contiene el título, descripción, etiquetas y categoría
                que se introdujeron al principio. Desde aquí se pueden modificar.
             Miniatura del vídeo. Permite elegir la imagen estática que representará el
                vídeo.
             Fecha y mapa. Permite definir la fecha en que fue grabado y sobre una
                mapa de Google Maps geolocalizar el recurso indicando el lugar geográfico
                concreto donde se tomó.
             Opciones para compartir y emitir vídeos. En este apartado se puede elegir
                entre …
                        Privacidad.
                             - Compartir el vídeo con el mundo (opción recomendada).
                             - Privado (visible para un máximo de 25 personas).

                           Comentarios
                              - Permitir comentarios automáticamente. Opción por defecto.
                              - Permitir comentarios de amigos automáticamente y demás
                                comentarios sólo con aprobación
                              - Permitir todos los comentarios únicamente con aprobación
                              - No permitir comentarios

                           Comentar votación.
                              - Sí, permitir a los usuarios votar sobre los comentarios. Opción
                                por defecto.
                              - No permitir las votaciones a los comentarios.

                           Respuestas en vídeo.
                             - Sí, permitir que se añadan respuestas en vídeo
                                 automáticamente. Permitir que otros usuarios de YouTube
                                 puedan relacionar automáticamente sus vídeos con el mío.
                             - Sí, permitir respuestas una vez que las haya aprobado. Es la
                                 opción por defecto.
                             - No, no permitir respuestas en vídeo. No permitir relacionar
                                 este video con otros.

                           Puntuaciones.
                              - Sí, permitir que otras personas puntúen este vídeo. Permitir
                                 que este video pueda ser puntuado por los usuarios. Es la
                                 opción por defecto.
                              - No, no permitir que se puntúe este vídeo. No permitir que
                                 este video pueda ser votado.

                           Inserción.
                              - Sí, los sitios externos pueden insertar y reproducir este vídeo.
                                  Es la opción por defecto.
                              - No, los sitios externos NO pueden insertar ni reproducir este
                                  vídeo.

                           Distribución.
                              - Sí, hacer que este vídeo esté disponible en móviles y TV
                              - No, este vídeo no debería estar disponible en móviles ni en TV.

    12. Para guardar los cambios pulsa en el botón Guardar cambios.
Vídeo y animaciones ::: Youtube, video en streaming                                       551
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


9.4 Insertar video de Youtube en Blogger
9.4.1 Elegir el video en Youtube

    1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com.
       Introduce tus credenciales para autentificarte. En este caso se propone insertar un
       vídeo propio pero también se puede insertar un vídeo ajeno que se localiza utilizando
       el buscador de Youtube.
    2. Clic en la sección <Usuario> | Mis Vídeos (Mis vídeos). Otra posibilidad es utilizar el
       buscador de Youtube para localizar un vídeo subido por otro usuario.
    3. Clic en la imagen de un vídeo del listado o bien sobre el botón Reproducir. Se
       visualiza una página mostrando la reproducción del vídeo.
    4. A la derecha del cuadro que contiene el código Insertar pulsa en el botón
       Personalizar. En el cuadro que se muestra puedes elegir algunas opciones:
            Incluir vídeos relacionados. Si marcas esta casilla se mostrarán los vídeos
                relacionados con éste al finalizar su reproducción.
            Mostrar borde. Incluye un marco de color alrededor del reproductor.
            Activar cookies de acción retardada. Si activas las cookies de acción
                retardada entonces el reproductor creará en el ordenador del visitante este
                tipo de cookies. Por defecto no las crea cuando el reproductor está incrustado
                en una página.




    5. También puedes elegir la gama de colores del reproductor que más se ajusta a la
       página donde se incrustará así como el tamaño del reproductor.
    6. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción
       copiará el código embed/insertar en el portapapeles.
Vídeo y animaciones ::: Youtube, video en streaming                                        552
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



9.4.2 Insertar el vídeo en una entrada de 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. Teclea el título: Paisajes de Asturias
    7. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    8. 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.




    9. Para terminar pulsa en el botón PUBLICAR ENTRADA.




    10. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo y animaciones ::: Youtube, video en streaming                                      553
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.5 Insertar video de Youtube en Wordpress
9.5.1 Elegir el video en Youtube

    1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com.
    2. Identifícate con tus credenciales para localizar un vídeo propio o utiliza el buscador
       para localizar un vídeo ajeno.
    3. Una vez situado en la reproducción del vídeo que te interesa, haz clic en el botón
       Compartir. Se mostrará un cuadro de diálogo con la URL de la página que contiene
       este video.




    4. Selecciona la URL del vídeo. Es de la forma:

         http://www.youtube.com/watch?v=CkRS3wDg1xU

    5. Clic derecho sobre esta URL y elige Copiar.

9.5.2 Insertar el vídeo en una entrada de Wordpress

    6.   Desde el Escritorio de Wordpress.com selecciona Entradas > Añadir.
    7.   Teclea el título: Picasso.
    8.   Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    9.   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á la URL del vídeo copiada anteriormente.
Vídeo y animaciones ::: Youtube, video en streaming                                  554
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    10. A partir de esta URL añade la etiqueta [youtube= … para completar, en el caso del
        ejemplo que nos ocupa, lo siguiente:

        [youtube=http://www.youtube.com/watch?v=CkRS3wDg1xU]




    11. Pulsa en el botón Publicar y luego en el enlace Vista previa.




9.5.3 Ejemplos de parámetros de integración de Youtube en WP

       Para especificar la altura y anchura de forma explícita:
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=320&h=240]

       Para especificar sólo la anchura:
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=320]

       Para reproducir el vídeo en High Definition-Alta Definición (HD):
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&hd=1]
Vídeo y animaciones ::: Youtube, video en streaming                                       555
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



       Para reproducir el vídeo en HD con altura y anchura específicos:
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=480&h=360&hd=1]

       Para ocultar los vídeos relacionados que aparecen una vez finalizada la reproducción
        del vídeo:
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&rel=0]

       Para mostrar el cuadro de búsqueda en Youtube:
        [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&showsearch=1]



9.6 Insertar una lista de vídeos Youtube en
Blogger
9.6.1 Crear una lista de vídeos en Youtube
YouTube ofrece la posibilidad de crear listas de reproducción de vídeos alojados en este
servicio. Estos pueden ser propios o ajenos. En el siguiente ejemplo se recoge el
procedimiento para construir una lista de reproducción y luego insertarlo en un artículo de tu
blog.

    1. Accede a Youtube con tus credenciales de usuario.
    2. En la barra de menú horizontal superior elige Usuario > Listas de reproducción.




    3. Elige Nuevo > Lista de reproducción.
Vídeo y animaciones ::: Youtube, video en streaming                                     556
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    4. Introduce el título de la nueva lista de reproducción. Por ejemplo: Picasso en
       Youtube. En este caso vamos a crear una lista de vídeos sobre el pintor Picasso. Clic
       en el botón




    5. Completa los datos de la lista de reproducción: Título, Descripción, Etiquetas y
       Configuración de Privacidad. Marca la opción Público o Privado para indicar la
       privacidad de la lista de reproducción. Se recomienda utilizar la opción por defecto:
       Público.
    6. Clic en el botón Guardar cambios.
Vídeo y animaciones ::: Youtube, video en streaming                                       557
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    7. A continuación utiliza el buscador de YouTube situado en la parte superior de la
       página para buscar vídeos sobre Picasso. Introduce el término “Picasso” y pulsa en el
       botón Buscar.




    8. Haz clic sobre el título de uno de los vídeos para visualizarlo.
    9. En la barra de opciones que aparece debajo del reproductor haz clic sobre el enlace
       Listas de reproducción. Se visualiza una lista desplegable con las listas de
       reproducción creadas. Elige la entrada correspondiente a la lista “Picasso en
       Youtube”. Clic en el botón Añadir.




    10. Repite los pasos anteriores para añadir dos o tres vídeos más sobre Picasso. No es
        necesario utilizar de nuevo el buscador porque en la lista Videos Relacionados se
        muestran algunos vídeos que están relacionados con el actual.

    11. En la barra de menú horizontal superior elige Usuario > Listas de reproducción.




    12. En el panel izquierdo debajo de la entrada Listas de reproducción se mostrarán todas
        las listas creadas. Al seleccionar una de ellas, en el panel derecho, se mostrará el
        listado de vídeos que la forman. Para eliminar un vídeo de la lista márcalo en la
        casilla de verificación que se ofrece en la primera columna y a continuación pulsa en
        el botón Suprimir.
Vídeo y animaciones ::: Youtube, video en streaming                                        558
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.6.2 Insertar la lista de vídeos en una entrada de Blogger.

    1. En la columna izquierda donde aparecen las listas de reproducción haz clic en el lista
       de reproducción creada.
    2. Clic en el botón Compartir donde se muestra la URL de la lista de reproducción o bien
       el código embed.




    3. Clic derecho en el cuadro de texto Insertar código y elige Seleccionar todo. A
       continuación haz clic derecho y elige Copiar.
    4. Abre una nueva pestaña del navegador web y accede a la URL de inicio de Blogger:
       https://www.blogger.com/start?hl=es
    5. 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.
    6. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio.
    7. En este panel aparecerán los distintos blogs que gestionas en Blogger.
    8. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición
       del blog donde deseas publicar el artículo.
Vídeo y animaciones ::: Youtube, video en streaming                                    559
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    9. Teclea el título: Videos de Picasso.
    10. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    11. 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.




    12. Para terminar pulsa en el botón PUBLICAR ENTRADA.




    13. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo y animaciones ::: Youtube, video en streaming                                      560
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Nota:
        Las listas de reproducción NO se integran en un artículo de Wordpress.com ni siquiera
        utilizando el servicio VodPod.com



9.7 Añadir un vídeo de Youtube a un gadget de
Blogger
Los vídeos de Youtube se pueden publicar en una entrada de nuestro blog de Blogger como
hemos visto en un apartado anterior. Otra posibilidad es incorporar vídeos de Youtube en un
gadget de la barra lateral del blog para que estén siempre disponibles al lector. Se puede
incorporar un vídeo individual en un gadget del tipo HTML/Javascript o bien un canal de
Youtube o los vídeos relacionados con una lista de etiquetas en un gadget del tipo Barra de
Vídeo.

9.7.1 Añadir un vídeo de Youtube a un gadget del blog.
    1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com.
    2. Utiliza el buscador para situarte en el vídeo que deseas insertar en tu blog.      Se
       visualiza una página mostrando la reproducción del vídeo.




    3. A la derecha del cuadro que contiene el código Insertar pulsa en el botón
       Personalizar. En el cuadro que se muestra puedes elegir algunas opciones:
           Incluir vídeos relacionados. Si marcas esta casilla se mostrarán los vídeos
              relacionados con éste al finalizar su reproducción.
           Mostrar borde. Incluye un marco de color alrededor del reproductor.
           Activar cookies de acción retardada. Si activas las cookies de acción
              retardada entonces el reproductor creará en el ordenador del visitante este
              tipo de cookies. Por defecto no las crea cuando el reproductor está incrustado
              en una página.
Vídeo y animaciones ::: Youtube, video en streaming                                      561
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. También puedes elegir la gama de colores del reproductor que más se ajusta a la
       página donde se incrustará así como el tamaño del reproductor. En este caso vamos a
       elegir un tamaño del reproductor de 320x265 píxeles.
    5. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción
       copiará el código embed/insertar en el portapapeles.
    6. Desde el interfaz de gestión de Blogger elige Diseño > Elementos de la página.
    7. Clic en el enlace Añadir un gadget.
    8. Pulsa en el botón “+” para añadir el gadget HTML/Javascript.




    9. En la página Configurar HTML/Javascript introduce el Título del gadget. Por
       ejemplo: Vídeo destacado.
Vídeo y animaciones ::: Youtube, video en streaming                                         562
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    10. Clic derecho sobre el cuadro de Contenido y elige Pegar. Para que el reproductor no
        sobrepase los límites de la barra lateral en algunas de las plantillas utilizadas quizás
        sea necesario reducir las dimensiones 320x265 píxeles que aparecen en este código
        por 192x159.
    11. Para terminar pulsa en el botón GUARDAR.
    12. Clic en el enlace Ver blog para observar el resultado final.




9.7.2 Los canales en Youtube
Es     una    página      asociada      al     usuario    con     una  URL      del     tipo:
http://www.youtube.com/user/<nombre_usuario> a la que cualquier visitante puede acceder
de forma pública y que contiene el perfil del usuario, sus vídeos, favoritos, etc. El usuario
propietario de un canal accede a la administración del mismo pulsando en el nombre de
usuario que aparece en la esquina superior derecha. Desde su gestión se pueden configurar
múltiples aspectos de este canal: títulos, colores, módulos, etc.




Algunos ejemplos de canales Youtube:

       RTVE: http://www.youtube.com/user/rtve
       Europa Press: http://www.youtube.com/user/europapress
       Antena 3: http://www.youtube.com/user/antena3
       La Sexta: http://www.youtube.com/user/misextatv
       Cuatro: http://www.youtube.com/user/cuatro



9.7.3 Añadir un canal temático de Youtube a un gadget del blog.
    1. Desde el interfaz de gestión de Blogger elige Diseño > Elementos de la página.
    2. Clic en el enlace Añadir un gadget.
    3. Pulsa en el botón “+” para añadir el gadget Barra de vídeo
Vídeo y animaciones ::: Youtube, video en streaming                                        563
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. En la página Configurar Barra de Vídeo introduce el Título del gadget. Por ejemplo:
       Canal RTVE.
    5. En esta página se pueden configurar los siguientes parámetros:
        Youtube. Permite elegir las opciones de Vídeos más vistos, Vídeos mejor
           valorados y Vídeos recientes. En este caso marcaremos Vídeos recientes.
        Canales. Introduce aquí rtve que el identificador Youtube del canal de RTVE
           fácilmente deducible de su URL: http://www.youtube.com/user/rtve
        Palabras clave. Puedes introducir etiquetas para que sólo se muestren los vídeos
           que tengan asociadas estas palabras. En este caso tecleamos noticias.




    6. En la parte inferior se muestra una vista previa en función de las opciones elegidas.
    7. Pulsa en el botón GUARDAR.
    8. Clic en el enlace Ver blog para observar el resultado final.
Vídeo y animaciones ::: Youtube, video en streaming                                    564
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


9.8 Añadir un vídeo de Youtube a un widget de
Wordpress
Los vídeos de Youtube se pueden publicar en una entrada de nuestro blog de Wordpress como
hemos visto en un apartado anterior. Otra posibilidad es incorporar vídeos de Youtube en un
widget de la barra lateral del blog para que estén siempre disponibles al lector. Se puede
incorporar una colección de vídeos en un widget del tipo VopPod Vídeos.

    1. Visita la web de VodPod (http://vodpod.com/). Clic en Login para introducir tus
       credenciales (usuario y contraseña) y pulsa el botón Login.
    2. Clic en el enlace Your videos (Tus vídeos). Clic en el botón New collection (Nueva
       colección).




    3. En el cuadro de texto Name your collection (Nombre de tu colección) teclea el
       identificador, por ejemplo, Canal Picasso. Clic en el botón Create (Crear).




    4. Abre una nueva pestaña en el navegador web mediante Archivo > Nueva pestaña.
       Visita la web de Youtube: http://www.youtube.com y utiliza el buscador para
       localizar un vídeo de Picasso.
    5. Clic en el botón Insertar para mostrar el cuadro de código embed asociado a ese
       vídeo.




    6. Clic derecho sobre este código y selecciona Copiar.
    7. Regresa a la pestaña donde se encuentra Vodpod y pulsa en el botón Add Video
       (Añadir Vídeo).




    8. En el cuadro de diálogo que se muestra haz clic derecho sobre el cuadro de texto y
       elige Pegar para pegar el código embed copiado anteriormente.
Vídeo y animaciones ::: Youtube, video en streaming                                        565
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    9. Clic en el botón Continue (Continuar). Confirma la elección pulsando en el botón Yes,
        This is the video (Sí, este es el vídeo).
    10. En el siguiente cuadro de diálogo introduce el título del vídeo en Title, las etiquetas
        de búsqueda en Tags y comentarios opcionales en Comments.




    11. Despliega el combo Add to Collection (Añadir a la colección) para elegir la colección
        deseada. Ejemplo: Canal Picasso. Clic en el botón Save (Guardar).
    12. Repite los pasos anteriores para añadir a la colección de VodPod un par de vídeos de
        Youtube sobre Picasso.
    13. Regresa a VodPod y haz clic en Home y luego en Your vídeos (Tus vídeos).
    14. Para filtrar los vídeos de esta colección despliega el combo Collection y elige el
        nombre de la misma.
Vídeo y animaciones ::: Youtube, video en streaming                                      566
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    15. En el listado se muestran los vídeos de esta lista. En el pie de la página de VodPod
        haz clic en el enlace Widgets. Otra posibilidad es pulsar en el enlace Home > Sharing




    16. Despliega en combo Share on (Compartir en …) y elige Wordpress.com




    17. En el área Advanced Setup (Configuración avanzada) selecciona como Sytle (Estilo),
        por ejemplo, Social – Standard y como Source Collection (Colección Fuente) la
        colección de vídeos creada con anterioridad: Canal Picasso.




    18. Selecciona y haz clic derecho para Copiar el código que se proporciona.
Vídeo y animaciones ::: Youtube, video en streaming                                         567
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    19. Abre una pestaña nueva en el navegador web y accede al interfaz de administración
        de tu blog Wordpress. Para añadir el widget a tu blog selecciona Apariencia >
        Widgets.




    20. Arrastra el widget VodPod Videos de la columna izquierda de widgets disponibles a la
        columna derecha de widgets visibles.




    21. Al soltar el widget se abrirá su panel de configuración.
    22. Clic derecho y elige Pegar para pegar el código en la ventana de configuración del
        widget.
    23. Clic en el botón Guardar.




    24. Al visualizar el frontend del blog se mostrará un widget con los vídeos de la colección.
Vídeo y animaciones ::: Youtube, video en streaming                                      568
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.9 OverStream: Videos subtitulados de Youtube

9.9.1 ¿Qué es Overstream?




Overstream (http://www.overstream.net) es un espacio donde puedes personalizar un vídeo
en línea alojado en sitios como Youtube, Google Video, MySpace Video, etc. incorporándole
comentarios y subtítulos. Mientras el vídeo se guarda en su repositorio original, Overstream
ofrece un visor propio a través del cual se visualiza ese vídeo en sincronía con los textos
introducidos.

Desde Youtube se pueden añadir títulos, subtítulos y anotaciones a tus propios vídeos pero no
a los vídeos subidos por otros usuarios. Con Overstream se puede subtitular cualquier video
alojado, por ejemplo, en Youtube.

Los vídeos subtitulados se pueden compartir con los demás e integrar dentro de una página
web o entrada de tu blog.

9.9.2 Crear un vídeo subtitulado
    1. Visita la web de Overstream y regístrate para disponer de un nombre de usuario y
       contraseña. Una vez que dispongas de ella introdúcelas para entrar en sesión.
Vídeo y animaciones ::: Youtube, video en streaming                                     569
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    2. En otra pestaña del navegador utiliza el buscador de Youtube para localizar el vídeo
       en línea que deseas subtitular. Una vez situado en él, selecciona la dirección en la
       barra del navegador, clic derecho y elige Copiar.
       Ejemplo: http://www.youtube.com/watch?v=z_RAEESmsrs




    3. Regresa a OverStream. Pulsa en el enlace Create overstream (Crear subtítulos).
    4. Se muestra el cuadro de diálogo Vídeo URL (dirección del vídeo). En la casilla Enter
       Vídeo URL (Introduce URL del vídeo) haz clic derecho y selecciona Pegar para pegar
       la dirección copiada con anterioridad. Clic en el botón Ok.




    5. Tras unos segundos de espera en el visor se cargará la película. Los pasos para crear
       los subtítulos serían (ver imagen):
Vídeo y animaciones ::: Youtube, video en streaming                                        570
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




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




    6. Tras guardar el proyecto se mostrará el mensaje Overstream “título” created in the
       database (Overstream “título” creado en la base de datos).
Vídeo y animaciones ::: Youtube, video en streaming                                    571
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    7. Pulsa sobre la pestaña Overstream Properties (Propiedades del Overstream). En esta
       página conviene configurar los siguientes parámetros: Access Level (Nivel de acceso)
       como Public, Subtitle Language (Idioma de Subtítulos) como Spanish, Tags
       (Etiquetas) separados por comas, Rating (Votación) y User Comments (Comentarios)
       activarlos o desactivarlos.




    8. Para guardar los cambios introducidos en los parámetros de configuración pulsa en el
       botón Save Overstream Properties (Guardar propiedades del OverStream)
    9. Clic en el enlace My Overstream. Observa que aparece la entrada correspondiente a
       los subtítulos recién creados. Para actualizar su contenido pulsa en el enlace Edit.
       Para ver el resultado final pulsa en el enlace Play.
Vídeo y animaciones ::: Youtube, video en streaming                                      572
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Debajo del reproductor se muestra un cuadro de texto con el código Embed.




    11. Clic derecho y selecciona Copiar para copiar este código HTML al portapapeles.

9.9.3 Insertar un video Overstream en una entrada de Blogger
    1. Crear una NUEVA ENTRADA en Blogger y define como título “El Sistema Solar”.
    2. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    3. 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 copiado anteriormente.




    4. Para terminar pulsa en el botón PUBLICAR ENTRADA.
    5. A continuación haz clic en el enlace Ver blog para ver el resultado final
Vídeo y animaciones ::: Youtube, video en streaming                                       573
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




9.9.4 Insertar un video Overstream en una entrada de Wordpress
    1. Visita la web de OverStream (http://www.overstream.net), introduce tus
       credenciales de usuario y accede al overstream que deseas insertar en un artículo de
       tu blog de Wordpress.
    2. Clic derecho sobre el cuadro de texto del código Embed y selecciona Copiar.




    3. Haz clic en el botón Post to Wordpress




    4. En el cuadro de diálogo Post to your Blog haz clic en el enlace (Click if you're having
       trouble) (Clic si tienes problemas). Sobre el cuadro de texto haz clic derecho y elige
       Pegar. Clic en el enlace preview (vista previa).
Vídeo y animaciones ::: Youtube, video en streaming                                     574
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    5. Introduce la URL of your blog (URL de tu blog), Username (Usuario) y Password para
       realizar la publicación directa sobre tu blog de Wordpress.
    6. Teclea el título del nuevo artículo que contendrá el vídeo Title y el texto del mismo
       en Body. Clic en el botón Publish.
    7. Clic en el botón View your blog (Ver tu blog). Se mostrará un artículo de tu blog
       conteniendo el video overstream. Es posible posteriormente reeditar esta entrada y
       modificar su texto.
Vídeo y animaciones ::: Servicios de vídeo                            575
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




             10. Servicios de vídeo
Vídeo y animaciones ::: Servicios de vídeo                                                576
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


10.1 Introducción
En la Web 2.0 existen multitud de espacios donde es posible almacenar vídeos para su
posterior difusión y publicación en nuestro blog. La reproducción mediante streaming que
proporcionan estos espacios facilitan su visionado a través de Internet. Actualmente el líder
en este sector es Youtube pero también existen otras alternativas interesantes: Revver,
Vimeo o Metacafe.

La integración de un vídeo de estos servidores en el artículo de un blog de Blogger siempre se
realiza copiando y pegando el código Embed que se ofrece en la visualización de cada vídeo.



10.2 Copiar el código embed del vídeo

    1. Visita la web de uno de estos servicios:

                Revver: http://www.revver.com
                Vimeo: http://www.vimeo.com
                Metacafe: http://www.metacafe.com

    2. Utiliza el buscador para localizar el vídeo que te interesa. Sitúate en su página para
       visionarlo.
    3. El siguiente paso es copiar el código embed. En cada servicio web se hace de una
       forma distinta:

    Revver:




        3.1 Clic en el botón More Options (Más opciones)
        3.2 Asegúrate de que en la lista Select a format (Selecciona un formato) está
        seleccionada la entrada Flash Embed.
        3.3 Clic derecho sobre el cuadro de código y elige Seleccionar todo. Haz clic derecho
        de nuevo y elige Copiar.
Vídeo y animaciones ::: Servicios de vídeo                                           577
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    Vimeo:




        3.1 Clic en el botón </> Embed que aparece dentro del reproductor.




        3.2 En el cuadro Embed this video (Incrusta este vídeo) haz clic derecho sobre el
        código y selecciona la opción Copiar.




Metacafe:




        3.1 Clic en el botón <> Incrustar. Clic derecho en la casilla Embeddable Player y
        selecciona Seleccionar todo y luego Copiar.
Vídeo y animaciones ::: Servicios de vídeo                                                578
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




10.3 Insertar el vídeo en Blogger
    1. Crear una NUEVA ENTRADA en Blogger y define como título “Mis vídeos”.
    2. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo.
    3. 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 copiado anteriormente.
    4. Para terminar pulsa en el botón PUBLICAR ENTRADA.
       A continuación haz clic en el enlace Ver blog para ver el resultado final


10.4 Insertar el vídeo en Wordpress
    1. Clic en el botón Post to Blog que se encuentra en la barra de marcadores de Mozilla
       Firefox.
    2. Haz clic en el botón Post to Wordpress
    3. En el cuadro de diálogo Post to your Blog haz clic en el enlace (Click if you're having
       trouble) (Clic si tienes problemas). Sobre el cuadro de texto haz clic derecho y elige
       Pegar para pegar el código. Clic en el enlace preview (vista previa)
    4. Introduce la URL of your blog (URL de tu blog), Username (Usuario) y Password para
       realizar la publicación directa sobre tu blog de Wordpress.
    5. Teclea el título del nuevo artículo que contendrá el vídeo Title y el texto del mismo
       en Body. Clic en el botón Publish.
    6. Clic en el botón View your blog (Ver tu blog). Se mostrará un artículo de tu blog
       conteniendo el video overstream. Es posible posteriormente reeditar esta entrada y
       modificar su texto.

             Revver                                 Vimeo                         Metacafe
Vídeo y animaciones ::: Servicios de vídeo                                                  579
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Nota:

        Wordpress.com contempla la integración de vídeos de Vimeo utilizando una etiqueta
        específica sin ser necesaria la utilización de un procedimiento general que
        proporciona VodPod. Si la URL directa de un vídeo en Vimeo es del tipo:

        http://vimeo.com/240975

        Entonces se puede añadir al código HTML de una entrada la siguiente etiqueta:

        [vimeo http://vimeo.com/240975]

        O bien

        [vimeo 240975]

        La anchura y altura por defecto del reproductor insertado es 400x300 píxeles. Sin
        embargo en la etiqueta se pueden especificar otras dimensiones:

        [vimeo http://vimeo.com/240975 w=500&h=400]
Anexo I. Canales de suscripción                                       580
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                       Anexo 1.
          Canales de suscripción
Anexo I. Canales de suscripción                                                             581
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



1.1 ¿Qué es un canal de suscripción?
Un canal de suscripción de un sitio web permite que los usuarios se puedan vincular al canal
y a partir de ese momento recibir notificación de las nuevas entradas que se van publicando
en ese sitio web sin necesidad navegar hasta él.

Su funcionamiento se basa en un archivo XML diseñado con una sintaxis especial de etiquetas
y que está ubicado en una dirección concreta del sitio web. Se actualiza cada vez que se
publica una nueva entrada de tal forma que contiene los titulares de las últimas noticias
publicadas. Este archivo puede ser leído por los usuarios utilizando el propio navegador web
o bien un programa específico. En ambos casos, cada vez que se inicia el programa
(navegador o lector de feeds), chequea de forma automática el contenido de los canales
suscritos y muestra al lector las novedades si las hubiera.

La suscripción de noticias nos va a permitir conocer los últimos artículos y comentarios
publicados en nuestros blogs favoritos. Esta adhesión puede realizarse a varios blogs
concentrando la lectura de todos ellos en una misma herramienta.

En la actualidad los dos principales formatos XML de canales de suscripción utilizados en los
blogs son: RSS y Atom. Se diferencian en la sintaxis que utilizan para la difusión de noticias
pero su funcionamiento es similar.



1.2 Suscripción con el navegador Firefox 3+
Un marcador dinámico de Firefox permite suscribirse a un canal de noticias de un sitio web y
recibir las nuevas noticias sin necesidad de visitarlo. Gracias a los marcadores dinámicos el
contenido viene al usuario. En lugar de tener que revisar los cambios y modificaciones de la
página web, el marcador dinámico ofrece las actualizaciones tan rápido como están
disponibles.

    1. Abre Mozilla Firefox
    2. Navega hasta la portada o página principal de tu blog en Blogger o Wordpress.
    3. Utiliza la barra de scroll vertical para situarte al pie de esta página principal.

Blogger
    4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se
       ofrece el formato Atom para la suscripción.




Wordpress
    5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato
       RSS para la suscripción.




Ambos
    6. Se muestra una página con un resumen de los últimos artículos publicados en el blog
       ordenados comenzando por el más reciente. Si deseas leer en detalle uno de estos
Anexo I. Canales de suscripción                                                            582
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

        artículos haz clic sobre el enlace de su título para acceder al artículo en el blog
        original.




    7. Cuando se accede desde Firefox a la página de titulares de un canal de feeds, en la
        parte superior de la misma página se ofrece la oportunidad de crear un marcador
        dinámico a ese canal.
    8. Asegúrate de que la opción Marcadores dinámicos está seleccionada en la lista
        Suscribirse a este canal usando.
    9. Clic en el botón Suscribirse ahora.
    10. En el cuadro de diálogo Suscribirse con los marcadores dinámicos puedes modificar
        el Nombre del canal aunque conviene dejar el que viene por defecto. En la lista
        desplegable Carpeta conviene que selecciones Barra de herramientas de
        marcadores para que de esta forma el marcador dinámico aparezca en la barra de
        marcadores de Firefox y sea visible y accesible directamente.




    11. Pulsa en el botón Suscribirse.
    12. Observa que esta acción ha creado en la barra de marcadores de Firefox un marcador
        con el nombre del canal. Si pulsas sobre él se mostrarán las noticias de este canal.
        Pulsa sobre la noticia deseada para acceder a su página. Si eliges la opción Abrir todo
        en pestañas se mostrará cada noticia en una pestaña independiente.
Anexo I. Canales de suscripción                                                           583
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    13. Si la barra de marcadores no está visible entonces activa su visualización mediante
        Ver > Barra de herramientas > Barra de herramientas de marcadores




Blogger
    14. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del
        blog y también a los comentarios de un artículo concreto. Sin embargo para la
        suscripción a estos canales NO se ofrece un enlace directo en la página principal o
        página de un artículo siendo necesario utilizar las prestaciones de la barra de
        dirección del navegador web.

                Si estás situado en la portada principal (se muestran varios artículos en la
                 misma página), Firefox detecta que en esa página se está ofreciendo de forma
                 oculta el canal de suscripción en formatos Atom y RSS. Por este motivo en el
                 extremo derecho de la barra de direcciones aparece el icono característico de
                 los canales feed. Haz clic en este icono y elige el formato de suscripción.




                Si haces clic en el título de una entrada accedes a una página donde sólo se
                 muestra ese artículo y dependiendo de la configuración definida quizás
Anexo I. Canales de suscripción                                                             584
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

                 también los comentarios. Firefox vuelve a detectar que en esa página se
                 están ofreciendo de forma oculta el canal de suscripción en formatos Atom y
                 RSS para las entradas del blog pero también el canal de suscripción en
                 formato Atom para los comentarios que se realicen a esa entrada.




    En cualquiera de estos casos se accede a una página de Marcadores dinámicos desde
    donde es posible suscribirse utilizando el procedimiento explicado.



1.3 Suscripción con el navegador IExplorer 7+
    1. Abre Internet Explorer 7
    2. Navega hasta la portada o página principal de tu blog en Blogger.
    3. Utiliza la barra de scroll vertical para situarte al pie de esta página principal.

Blogger
    4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se
       ofrece el formato Atom para la suscripción.




Wordpress
    5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato
       RSS para la suscripción.




Ambos

    6. Se muestra una página los últimos artículos publicados en el blog ordenados
       comenzando por el más reciente. Si deseas leer en detalle uno de estos artículos haz
       clic sobre el enlace de su título para acceder al artículo en el blog original.
    7. Clic en el enlace Suscribirse a esta fuente.
Anexo I. Canales de suscripción                                                            585
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    8. En el cuadro de diálogo Suscribirse a esta fuente comprueba o modifica si lo deseas
       el Nombre del canal y pulsa en el botón Suscribirse. Esta suscripción se guarda por
       defecto en la carpeta de Fuentes.




Blogger
    9. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del
       blog y también a los comentarios de un artículo concreto. Sin embargo para la
       suscripción a estos canales NO se ofrece un enlace directo en la página principal o
       página de un artículo siendo necesario utilizar las prestaciones de la barra de
       dirección del navegador web.

                Si estás situado en la portada principal (se muestran varios artículos en la
                 misma página), Internet Explorer detecta que en esa página se está
                 ofreciendo de forma oculta el canal de suscripción en formatos Atom y RSS.
                 Por este motivo en la barra de herramientas del navegador aparece iluminado
                 el icono característico de los canales feed. Haz clic en este icono y elige el
                 formato de suscripción.
Anexo I. Canales de suscripción                                                          586
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                Si haces clic en el título de una entrada accedes a una página donde sólo se
                 muestra ese artículo y dependiendo de la configuración definida quizás
                 también los comentarios. Internet Explorer vuelve a detectar que en esa
                 página se están ofreciendo de forma oculta el canal de suscripción en
                 formatos Atom y RSS para las entradas del blog pero también el canal de
                 suscripción en formato Atom para los comentarios que se realicen a esa
                 entrada.




    En cualquiera de estos casos se accede a una página de Suscripción de fuentes desde
    donde es posible suscribirse utilizando el procedimiento explicado.

    10. En Internet Explorer una forma de acceder a los canales que nos hemos suscrito es
        seleccionar: Ver > Barra del explorador > Fuentes. Esta acción mostrará el panel de
        Fuentes disponibles. Al hacer clic en una de ellas en el panel derecho se mostrará el
        listado de noticias que contiene.
Anexo I. Canales de suscripción                                                        587
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Nota:
        Con las credenciales de una cuenta de Google se puede acceder al servicio Google
        Reader (http://www.google.com/reader/) que permite gestionar la suscripción y
        lectura de canales de feeds utilizando el interfaz web que proporcionan. También se
        pueden compartir con otros amigos.



1.4 Enlaces de suscripción a tu blog Blogger
Con intención de facilitar la suscripción a tu blog de los lectores que lo deseen se puede
incorporar a la barra lateral un gadget o módulo que proporcione en todo momento los
enlaces correspondientes de suscripción.

    1. Desde el interfaz de administración de tu blog selecciona las pestañas Diseño >
       Elementos de la página.
    2. En el esquema de la barra lateral haz clic en el enlace Añadir un gadget.




    3. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Enlaces de
       suscripción.




    4. Por defecto se ofrece como título de este gadget: Suscribirse a. En este caso
       aceptaremos este título y pulsa en el botón GUARDAR.




    5. Para ver el resultado final haz clic en el enlace Ver blog. En la columna lateral se
       mostrará el nuevo gadget ofreciendo enlaces para la suscripción a entradas y a
       comentarios incluyendo su incorporación en servicios Web 2.0 que integran la
       suscripción a canales feed.
Anexo I. Canales de suscripción                                                           588
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




1.5 Enlaces de suscripción a tu blog Wordpress
Con intención de facilitar la suscripción a tu blog de los lectores que lo deseen se puede
incorporar a la barra lateral un widget o módulo que proporcione en todo momento los
enlaces correspondientes de suscripción.

    1. Desde el interfaz de administración de tu blog selecciona Apariencia > Widgets




    2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la
       columna derecha de widgets visibles un módulo con el título Enlaces RSS.




    3. Al soltarlo se abre este cuadro permitiendo configurar sus distintos parámetros:
            Título: Suscribirse a
            Feeds to Display (Feeds a Mostrar): Entradas.
            Formato: Enlace de texto.
Anexo I. Canales de suscripción                                                         589
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Clic en el botón Guardar.
    5. Para ver el resultado final visita el frontend del blog. En la columna lateral se
       mostrará el nuevo gadget ofreciendo enlaces para la suscripción a entradas y a
       comentarios incluyendo su incorporación en servicios Web 2.0 que integran la
       suscripción a canales feed.




1.6 Añadir un feed externo a tu blog
En un blog se puede añadir un gadget que muestre los titulares de un canal de feeds externo.
De esta forma podemos ofrecer en nuestro blog novedades gestionadas por terceras personas
que se actualizan sin nuestra mediación.

1.6.1 Buscar un canal de feeds
    1. Visita la página web de los canales RSS del diario digital El País. Su URL es:
       http://www.elpais.com/rss/
    2. Clic en el título de uno de los múltiples canales RSS que ofrece este diario. Por
       ejemplo: Titulares de portada o Lo último.




    3. Se muestra un cuadro de diálogo con la URL de ese canal. Pulsa y arrastra para
       seleccionar la dirección completa. Sobre ella haz clic derecho y elige Copiar.

1.6.2 Añadir un canal feed externo a Blogger
    4. Desde el interfaz de administración de tu blog selecciona las pestañas Diseño >
       Elementos de la página.
    5. En el esquema de la barra lateral haz clic en el enlace Añadir un gadget.
Anexo I. Canales de suscripción                                                          590
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    6. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Feed.




    7. En el cuadro de diálogo Configurar feed haz clic derecho sobre el cuadro de texto
       URL del feed y elige la opción Pegar.




    8. Clic en el botón CONTINUAR.
    9. En el Título puedes introducir un título más personalizado aunque conviene dejar el
        título extraído del canal.
    10. Define el número de artículos a mostrar así como si se incluirán o no las fechas y/o
        autores de los elementos. En la parte inferior se mostrará una vista previa del
        resultado en función de la configuración establecida.




    11. Para terminar pulsa en el botón GUARDAR.
    12. Haz clic en el enlace Ver blog para visualizar el aspecto que tendrá el nuevo gadget
        añadido. Al hacer clic en un titular se mostrará ese artículo en concreto en el sitio
        web del periódico.
Anexo I. Canales de suscripción                                                          591
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




1.6.3 Añadir un canal feed externo a Wordpress
    1. Desde el interfaz de administración de tu blog selecciona las pestañas Apariencia >
       Widgets




    2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la
       columna derecha de widgets visibles un módulo con el título RSS
    3. Al soltarlo se abre este cuadro permitiendo configurar sus distintos parámetros. En el
       cuadro diálogo RSS haz clic derecho en el cuadro de texto Introduce la URL del feed
       RSS aquí:
Anexo I. Canales de suscripción                                                       592
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

    4. Introduce un título del feed y define el resto de parámetros. Clic en el botón
       Guardar.
    5. Al visualizar el blog podemos ver el aspecto que tendrá el nuevo widget añadido. Al
       hacer clic en un titular se mostrará ese artículo en concreto en el sitio web del
       periódico.
Anexo II. Delicious, marcadores sociales                              593
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                     Anexo 2. Delicious,
                     marcadores sociales
Anexo II. Delicious, marcadores sociales                                                   594
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.1 ¿Qué son los marcadores sociales?
Los marcadores son enlaces a sitios y páginas web que guardamos para facilitar su posterior
localización y acceso. Se llaman también “favoritos”. Tanto el navegador IExplorer como el
Firefox disponen de un sistema de creación de marcadores o favoritos para guardarlos y
utilizarlos en nuestro equipo habitual. Sin embargo estos marcadores también se pueden
guardar en Internet. De esta forma es posible acceder a ellos desde cualquier ordenador y
compartirlos con otros usuarios. El calificativo de “social” se debe a que se pueden compartir
con otras personas pudiéndose crear redes sociales o grupos. Cuando un usuario crea un
marcador le asigna libremente unas etiquetas o tags. La clasificación que se genera a partir
de estas etiquetas constituye lo que algunos llaman folksonomía.



2.2. ¿Qué es Delicious?
Delicious (http://delicious.com/) es el servicio Web 2.0 más popular donde se pueden
guardar los marcadores o favoritos. Es necesario registrarse como usuario e instalar una
extensión en el navegador (Firefox o Internet Explorer) para disponer de una consola de
botones en la barra de herramientas que facilite la creación y edición de estos marcadores.
Mientras se navega si encuentras una página que te interese, no la guardas en los favoritos
del navegador, sino que la envías a Delicious y se guarda allí. Esto facilita la utilización de
estos marcadores desde cualquier ordenador y compartirlos con otros usuarios.




2.3 Registrarse en Delicious
        1. Visita la página de Delicious: http://delicious.com
        2. Si no dispones de credenciales (usuario y contraseña) y deseas registrarte haz clic
           en el botón Join Now (Conectarse ahora)




        3. En la pantalla Enter Details (Introducir detalles) completa tus datos personales en
           la página Enter Details (Introduce detalles) y pulsa en el botón Register.



2.4 Instalación de los botones en el navegador
Después de registrarse se accede a la página Add Buttons (Añadir botones). Se puede saltar
este paso pulsando en el botón Skip Step 2. La instalación de estos botones en el navegador
se puede posponer para más adelante a través de la ayuda Help de Delicious.

En este caso vamos a continuar con la instalación de botones porque suponemos que te
encuentras en tu equipo personal. En función del navegador web que se utilice se propondrá
la instalación de la extensión. Clic en el botón Add buttons.
Anexo II. Delicious, marcadores sociales                                                  595
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Si estás utilizando Firefox:

        1. En el cuadro de diálogo Instalación de software pulsa en el botón Instalar ahora.




        2. En el cuadro de diálogo Complementos haz clic en el botón Reiniciar Firefox
           para completar la instalación.




        3. Automáticamente se pasará al paso 3: Import existing bookmarks (Importar
           marcadores existentes).

Si estás utilizando Internet Explorer:

        1. En el cuadro de Advertencia de seguridad de Descarga de archivos haz clic en el
           botón Ejecutar para iniciar el instalador del complemento. Una vez descargado
           confirma pulsando de nuevo en el botón Ejecutar.
        2. Sigue el asistente de instalación. Tendrás que cerrar todas las ventanas de
           Internet Explorer para poder finalizar la instalación.
        3. Clic en el botón Close para cerrar el asistente de instalación.
        4. Se abre el navegador IExplorer mostrando el paso 3 del asistente para importar
           favoritos.

En cualquiera de los casos si seguimos el asistente de 3 pasos propuesto por Delicious, tras
finalizar el paso 2, se salta al paso 3 donde se propone importar los favoritos del navegador.

La instalación descrita ha creado en la barra de herramientas del navegador web 3 botones:
Anexo II. Delicious, marcadores sociales                                                    596
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Firefox:




Internet Explorer:




Estos botones se utilizan para:

    1. Delicious. Ir a la web de Delicious
    2. Bookmarks. Muestra/oculta el panel lateral de Delicious
    3. Tags. Permite introducir las etiquetas para la página actual.




Si es la primera vez que utilizas Delicious se recomienda saltar el paso 3 de importar favoritos
para finalizar con el asistente.

Nota:

Para acceder al instalador de los botones en otro momento utiliza las siguientes URL:

                Internet Explorer: http://delicious.com/help/installie
                Firefox: http://delicious.com/help/installff



2.5 Guardar un marcador a un artículo de un blog
    1. Abre el navegador y sitúate en el artículo del blog cuyo marcador deseas guardar.
    2. Clic en el botón Tag para iniciar el etiquetado y guardar el marcador.
Anexo II. Delicious, marcadores sociales                                                  597
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



    3. Si no te has autentificado todavía en el servicio Delicious se mostrará un cuadro de
       diálogo Delicious account (cuenta Delicious). Te indica que debes autentificarte en
       Delicious para poder crear el marcador de esta página. Pulsa en el botón Sign in
       (Entrar).




    4. Se abrirá una nueva ventana donde debes introducir tu usuario y contraseña de
       Delicious.



        Si deseas desconectarte de Delicious cuando cierres el navegador desmarca la casilla
        Keep me signed in (Mantenerme conectado) antes de pulsar en el botón Sign In. Otra
        posibilidad es visitar la página de Delicious pulsando en el botón Delicious del
        navegador y una vez allí hacer clic sobre el enlace Sign Out para salir de sesión.

    5. Para autentificarte pulsa en el botón Sign In (Entrar).
    6. De regreso a la ventana del navegador anterior, vuelve a pulsar en el botón Tag de la
       barra de herramientas. Se muestra un cuadro de diálogo Save a Bookmark (Guardar
       un Marcador). Introduce o modifica el Title (Título), Notes (Notas) y Tags (Etiquetas).
       Las etiquetas debes introducirlas separadas por espacios en blanco. Tambiéjn puedes
       indicar si compartes o no este enlace desmarcando o marcando la casilla do not share
       (no compartir). Para terminar pulsa en el botón Save (Guardar).
Anexo II. Delicious, marcadores sociales                                                   598
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.6 Importar favoritos del navegador a Delicious
Esta tarea se puede realizar si queremos importar a Delicious los favoritos que tenemos en el
navegador. Si no los estábamos utilizando los favoritos del navegador es preferible no realizar
esta tarea.

Para importar los favoritos del navegador a Delicious SI …

        a) Estás en el paso 3 de configuración de tu cuenta.
        b) Estás autentificado, no dispones todavía de marcadores y seleccionas BookMarks >
        My BookMarks > Import Bookmarks (Marcadores > Mis marcadores > Importar
        Marcadores)
        c) Estás autentificado y seleccionas Settings > Import/Upload Bookmarks
        (Configuración > Importar/Subir Marcadores).




        1. Clic en el botón Import Now para enviar a tu cuenta Delicious los favoritos que
           en ese momento tiene tu navegador local.
        2. A continuación se mostrará un mensaje notificando que el proceso de importación
           se ha realizado con éxito.
        3. Clic en el botón Your Bookmarks para acceder al listado de marcadores
           importados.
Anexo II. Delicious, marcadores sociales                                               599
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.7 Editar marcadores Delicious desde página web
        1. Abre el navegador web
        2. Clic en el botón Delicious para ir directamente a la página de Delicious.




        3. Si el navegador no conserva la sesión te pedirá que introduzcas el nombre de
           usuario y la contraseña de Delicious.




        4. Si deseas desconectarte de Delicious cuando cierres el navegador desmarca la
           casilla Keep me signed in (Mantenerme conectado) antes de pulsar en el botón
           Sign In. Haz clic en este botón.
        5. Tras la autentificación el navegador se situará en la dirección:
           http://delicious.com/<usuario> mostrando la lista de marcadores registrados.
           Para visitar un enlace basta con hacer clic en su título.




        6. En la entrada correspondiente a cada marcador se pueden realizar las siguientes
           operaciones:
Anexo II. Delicious, marcadores sociales                                                     600
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                SHARE (Compartir). Si pulsas en este botón se mostrará un mensaje de
                 confirmación a la pregunta Share this link?. Si eliges Yes compartirás este
                 enlace con el resto de la comunidad de usuarios Delicious. El icono del
                 “candado” que se muestra a la izquierda del título del marcador
                 desaparecerá. Este enlace será accesible por cualquier visitante anónimo (sin
                 autentificar) que acceda a la dirección: http://delicious.com/<tu_usuario>.
                 Para volver a no compartir en enlace hay que editar (EDIT) el marcador y
                 activar la casilla Do not Share. A la derecha del título se muestra un
                 cuadrado de fondo azul indicando el número de usuarios que comparten ese
                 mismo enlace. Si haces clic en él accederás a este listado de usuarios.
                EDIT (Editar). Al hacer clic en el enlace de esta entrada se accederá a la ficha
                 del marcador donde es posible modificar su URL, título, notas, etiquetas o
                 tags, compartir (share), etc. Para guardar los cambios pulsa en Save
                 (Guardar)




                DELETE (Borrar). Si pulsas en este enlace y confirmas con Yes a la pregunta
                 Delete this bookmark? (Borrar este enlace) eliminarás este marcador del
                 listado.


2.8 Editar los marcadores Delicious desde el
propio navegador
    1. Abre el navegador web.
    2. Clic en el botón Bookmarks (Marcadores) para abrir la barra lateral izquierda de
       Delicious en el navegador.




    3. En el lateral izquierdo del navegador se mostrará la barra de Delicious.
Anexo II. Delicious, marcadores sociales                                              601
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Si el navegador no conserva la sesión de Delicious es necesario pulsar en el enlace
       Sign in (Entrar) que aparece en la parte inferior de este panel. En el navegador se
       mostrará la página de petición de Username (nombre de usuario) y Password
       (contraseña). Introduce estos datos y pulsa en el botón Sign In. Como resultado de
       esta autentificación ahora en la base del panel se mostrará el mensaje
       “<Nombre_usuario> on Delicious”.




    5. Para navegar hasta uno de mis favoritos basta con hacer clic sobre el marcador
       correspondiente en el panel Bookmarks.




    6. Haciendo CLIC DERECHO sobre la entrada correspondiente a un marcador se pueden
       realizar las operaciones más básicas de uso y edición de marcadores:
Anexo II. Delicious, marcadores sociales                                                  602
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




                Open (Abrir la web referenciada en la misma ventana), Open in New Window
                 (Abrir en nueva ventana) y Open in New Tab (Abrir en nueva pestaña).
                New Bookmark (Nuevo Marcador). Si eliges esta opción se mostrará un cuadro
                 de diálogo donde podrás introducir los datos del marcador y guardarlos en
                 Delicious pulsando en el botón Save (Guardar).
                Delete (Borrar). Si seleccionas esta opción se mostrará un mensaje de
                 confirmación . Si haces clic en Aceptar se eliminará el marcador.
                More about this Bookmark (Información acerca de este marcador). Mostrará
                 una página con información de este marcador en Delicious: en mis
                 marcadores, qué usuarios también lo han registrado, etiquetas asociadas, etc.
                Properties (Propiedades). Mostrará los datos del marcador. Se pueden
                 modificar y guardar los cambios pulsando al final en el botón Save.


2.9 Añadir un marcador en un navegador sin
botones Delicious
Si queremos añadir un marcador a nuestra cuenta Delicious, y no nos encontramos en nuestro
ordenador, no es necesario instalar los botones. Desde la página de Delicious se podría hacer
manualmente siguiendo estos pasos:

    1. En el navegador web sitúate en la página cuya dirección deseas conservar.
    2. Clic derecho sobre su URL o dirección y selecciona Seleccionar todo y luego clic
       derecho para elegir Copiar. De esta forma hemos copiado la URL de esta página.
    3. Visita la página web de Delicious: http://delicious.com
    4. Clic en el botón Sign In (Entrar)




    5. Introduce el Username (Nombre de usuario) y Password (Contraseña) de Delicious,
       desmarca la opción Keep me signed in (Mantenerme autentificado) para que la sesión
       termine al cerrar el navegador y pulsa en el botón Sign In (Entrar)
Anexo II. Delicious, marcadores sociales                                                     603
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    6. Una vez autentificado haz clic en el enlace Save a new bookmark (Guardar un nuevo
       marcador).




    7. Clic derecho sobre la casilla URL y elige Pegar. Clic en el botón Next (Siguiente).




    8. En la ficha del marcador puedes introducir su URL, título, notas, etiquetas o tags,
       compartir (share), etc. Para terminar pulsa en el botón Save (Guardar).
Anexo II. Delicious, marcadores sociales                                                     604
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.10 Búsquedas por etiquetas en Mis Marcadores
Para buscar en Mis Marcadores:

    1. Abre el navegador, sitúate en Delicious e inicia una sesión de usuario introduciendo tu
       usuario y contraseña.
    2. Para situarte en tu lista de marcadores selecciona Bookmarks > My Bookmarks




    3. La búsqueda de marcadores por etiquetas es sencilla. Basta con teclear la etiqueta y
       al pulsar en la flecha azul situada a su derecha el listado se filtrará mostrando sólo los
       marcadores que contengan esa etiqueta.




    4. Se pueden ir añadiendo más etiquetas a este encabezado para afinar la búsqueda. En
       este caso se mostrarán los marcadores que contengan todas y cada una de las
       etiquetas introducidas.
    5. Para eliminar una etiqueta del filtro pulsa en el botón X situado a la derecha de la
       etiqueta en el encabezado.




Otra posibilidad de búsqueda es pulsar directamente sobre una etiqueta de las situadas en el
listado All Tags. Este listado se muestra en la columna derecha de la página. Observa que al
seleccionar una etiqueta, ésta se añade al encabezado de filtrado y el listado de marcadores
que se muestra corresponde a todos aquellos que contienen la mencionada etiqueta.
Anexo II. Delicious, marcadores sociales                                                   605
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

En el listado de All Tags se muestran todas las etiquetas. En la parte superior de las mismas
también aparecen las etiquetas relacionadas Related Tags. Se denomina etiquetas
relacionadas a aquellas que se han introducido en un mismo marcador. Por ejemplo: si hemos
etiquetado un marcador con cuatro etiquetas: cursos formación profesorado distancia,
entonces Delicious considera que estos cuatro marcadores están relacionados. Al elegir uno
cualquiera en el listado All Tags el resto de etiquetas se mostrarán en el apartado Related
Tags. Si elijo una etiqueta relacionada ésta se añadirá al filtrado permitiendo una búsqueda
más fina.

Otra posibilidad de búsqueda por etiquetas es seleccionar Tags > My tags en la barra de
herramientas de la página de Delicious y luego pulsar en una de las etiquetas. Esto mostrará
el listado de marcadores filtrados por esa etiqueta.




Otra opción para buscar por etiquetas es utilizar la barra lateral de Delicious en el navegador
web. Para ello teclea el tag en el cuadro Search (Buscar) o bien elige una etiqueta en el
marco Tags (Etiquetas). Haz clic en una etiqueta y en el marco BookMarks (Marcadores) se
mostrarán los marcadores que contienen esa etiqueta.




2.11 Búsquedas de marcadores populares o
recientes
    1. Desde la barra de herramientas selecciona Bookmarks > Popular para buscar los
       marcadores más catalogados por los usuarios de Delicious.
    2. Si seleccionas Bookmarks > Recent podrás acceder a los últimos marcadores añadidos
       y compartidos por usuarios de la comunidad.
Anexo II. Delicious, marcadores sociales                                                     606
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.12 Configurar mi red social
Tu red social es una forma fácil de acceder a los marcadores guardados por otros usuarios.

    1. Selecciona People > My NetWork (Comunidad > Mi Red Social).




    2. Clic en el botón o enlace Add a user to Network (Añadir un usuario a la red).
    3. Introduce el nombre de usuario y pulsa en el botón Add (Añadir).




    4. De esta forma en esta sección se mostrarán los marcadores de los usuarios que hemos
       añadido a nuestra red social.


2.13 Suscripciones a marcadores por etiquetas
Otra opción interesante es la posibilidad de suscribirse a una etiqueta o tag que nos interese y
recibir notificación de los marcadores existentes o nuevos que contengan esa etiqueta.

    1. Selecciona Tags > My Subscriptions (Etiquetas > Mis suscripciones)




    2. Clic en el botón Add a subscription (Añadir una suscripción). Introduce una etiqueta y
       pulsa en el botón Add (Añadir). Si marcas la opción From a specific user (De un
       usuario específico) podrás introducir el nombre de un usuario y limitar la suscripción a
       los marcadores creados por el usuario indicado.




    3. En esta sección se mostrarán los marcadores sociales almacenados en Delicious que
       contengan la etiqueta introducida.
Anexo II. Delicious, marcadores sociales                                                   607
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



2.14 Aplicaciones de Delicious en Blogger
En este apartado se describen los distintos procedimientos para integrar en tu blog de Blogger
los marcadores sociales gestionados desde Delicious.

2.14.1 Network Badges (Distintivo de red).
Esta aplicación de Delicious permite mostrar detalles de tu cuenta Delicious dentro de tu blog
o página web. Su integración se realiza configurando las distintas opciones del distintivo para
luego copiar y pegar el código HTML en un gadget del blog.

    1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging >
       Network Badges. (Configuración > Blogging > Network Bagdes)
    2. En la página Network Badges configura las distintas opciones de visualización:
            Icon: icono
            Show: mostrar Username (nombre de usuario), Bookmark count (contador de
               marcadores), Fan count (contador de seguidores), etc.
    3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto del distintivo
       de acuerdo con la configuración establecida.




    4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
       Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.




    5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
       de la página.
    6. Clic en el enlace Añadir un gadget.
    7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.




    8. En el cuadro de diálogo Configurar HTML/Javascript introduce “Enlaces favoritos” o
       similar como Título, haz clic derecho sobre el cuadro Contenido y elige Pegar.
    9. Clic en el botón GUARDAR.
Anexo II. Delicious, marcadores sociales                                                 608
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Clic en el enlace Ver blog para visualizar el aspecto final de este distintivo de
        Delicious.




2.14.2 Linkrolls (Listas de enlaces).

Las listas de enlaces o linkrolls es una forma de mostrar en tu blog o página web los últimos
favoritos que has catalogado en tu cuenta de Delicious. Primero es necesario configurar los
parámetros de visualización de este gadget y luego se copia y pega el código HTML que
proporciona Delicious para hacer posible esta integración en tu blog.

    1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Link
       Rolls. (Configuración > Blogging > Listas de enlaces)
    2. En la página Link Rolls configura las distintas opciones de visualización:
            Title. En este caso puedes introducir como título Enlaces favoritos.
            Tags (Etiquetas). Si introduces etiquetas separadas por comas sólo se
                visualizarán los marcadores que tengan estas etiquetas.
            Icon (Icono). Puedes elegir el icono que acompañará al listado.
            Quantity (Cantidad). Establece el número de los últimos marcadores que
                aparecerán en el listado. Por defecto este valor es 5.
            Bullet (Viñeta). En este apartado se puede seleccionar el tipo de viñeta con
                que se mostrará cada marcador en el listado.
            Sort (Orden). Permite establecer una ordenación en el listado de marcadores
                que se muestran: Most recent (Más recientes) o Alphabetically
                (Alfabéticamente).
            Show (Mostrar). Permite mostrar Tags (Etiquetas), Notes (Anotaciones
                realizadas en los marcadores), Username (nombre del usuario) y Add to
                Network (afiliarse a la red).

    3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto resultante
       del listado de marcadores de acuerdo con la configuración establecida.
Anexo II. Delicious, marcadores sociales                                                609
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
       Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.




    5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
       de la página.
    6. Clic en el enlace Añadir un gadget.
    7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.




    8. En el cuadro de diálogo Configurar HTML/Javascript en este ocasión es mejor no
       introducir título para evitar redundancias. A continuación haz clic derecho sobre el
       cuadro Contenido y elige Pegar.
    9. Clic en el botón GUARDAR.
Anexo II. Delicious, marcadores sociales                                                610
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de
        marcadores soportado por Delicious.




2.14.3 Tagrolls (Listas de etiquetas).

Tagrolls o listas de etiquetas representan una forma excelente de mostrar las etiquetas de
Delicious como parte de tu sitio web o blog. Al igual que en ocasiones anteriores el
procedimiento de integración es sumamente fácil y consiste en configurar los parámetros de
visualización y a continuación copiar y pegar el código HTML en un gadget del blog.

    1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Tag
       Rolls. (Configuración > Blogging > Listas de etiquetas)
    2. En la página Tag Rolls configura las distintas opciones de visualización:
            Title. En este caso puedes introducir como título Mis etiquetas Delicious.
            Icon (Icono). Puedes elegir si se incluirá el icono de Delicious o no.
            Quantity (Cantidad). Permite definir el número máximo de etiquetas que
                incluirá en el listado. Se mostrarán las etiquetas de mayor frecuencia.
            Font (Fuentes). Permite definir el límite mínimo y máximo del tamaño de
                fuente y el color (código hexadecimal de color, como por ejemplo, ff0000
                sería el rojo). Estos valores se refieren a la etiqueta menos abundante
                incluida en el listado y la etiqueta con más coincidencias.
            Sort (Orden). Permite establecer una ordenación en el listado de etiquetas
                que se muestran: Alphabetically (Alfabéticamente) o Count (Contador).
            Flow (Aspecto). En este caso elegiremos Cloud (Nube) para definir que el
                listado de etiquetas tenga el aspecto de una nube de etiquetas. Otra
                posibilidad es elegir List (Lista).
Anexo II. Delicious, marcadores sociales                                                611
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


                Show (Mostrar). Permite mostrar Tag Counts (contadores de etiquetas),
                 Username (nombre del usuario) y Add to Network (enlace de afiliarse a la
                 red).

    3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto resultante
       del listado de marcadores de acuerdo con la configuración establecida.




    4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige
       Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar.




    5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos
       de la página.
    6. Clic en el enlace Añadir un gadget.
    7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript.




    8. En el cuadro de diálogo Configurar HTML/Javascript en este ocasión es mejor no
       introducir título para evitar redundancias. A continuación haz clic derecho sobre el
       cuadro Contenido y elige Pegar.
    9. Clic en el botón GUARDAR.
Anexo II. Delicious, marcadores sociales                                                 612
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




    10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de
        marcadores soportado por Delicious. El usuario al pulsar en un enlace de la nube será
        enviado a Delicious donde se mostrará un listado de todos los marcadores asignados a
        esa etiqueta.




2.15 Aplicación de Delicious en Wordpress
    1. Desde el interfaz de administración de tu blog selecciona Apariencia > Widgets




    2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la
       columna derecha de widgets visibles un módulo con el título del.icio.us
    3. Al soltarlo se muestra el panel de configuración de los distintos parámetros de este
       cuadro:
Anexo II. Delicious, marcadores sociales                                                    613
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado




       Widget title (título del widget). Por ejemplo: Enlaces ó Favoritos.
       Del.icio.us login. Introduce tu usuario en del.icio.us. Otra posibilidad es integrar los
        marcadores sociales de otros usuarios.
       Number of links (Número de enlaces). Define el número de enlaces.
       Tags (Etiquetas). Si introduces una o varias etiquetas separadas por comas se
        mostrarán sólo los marcadores asociados a estas etiquetas.

    4. Clic en el botón Guardar.
    5. Al visualizar el frontend del blog, en su barra lateral, se mostrará el widget con estos
       enlaces.




Nota:

        Cuando se actualizan los marcadores en del.icio.us en este widget del blog se
        mostrarán los cambios introducidos.
Glosario de términos
    Módulo 1. Blogs
Glosario de términos ::: Módulo 1 : Blogs                                                                615
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


A
   
  Administrador   
  Es  un  rol  de  usuario  que  dispone  de  todos  los  permisos  sobre  el  blog:  edición  de  artículos, 
  gestión de usuarios, configuración de opciones, etc. 
   
  Adobe Reader           
  Programa gratuito de Adobe para leer archivos PDF.  
   
  Archivo                
  En un blog es el conjunto de entradas antiguas que normalmente se ofrecen clasificadas por 
  años, meses, días, etc. 
   
  Artículo               
  Cada entrada o post de un blog.  
   
Atom 
Formato de difusión de noticias de un blog o sitio web para suscripción. 
 
  Audioblog              
  Tipo de blog donde cada entrada suele ser un audio en formato MP3 o similar. 
   
  Autor                  
  Es  un  rol  de  usuario  reconocido  en  el  blog  con  permisos  para  crear  y  publicar  sus  propios 
  artículos  pero,  a  diferencia  del  administrador,  no  puede  editar  los  artículos  de  los  demás  ni 
  configurar los parámetros del blog. 
   
B
 
    BackEnd               
    Es el área de acceso restringido del blog. En este espacio entra el autor/autores del blog para 
    gestionar su contenido. 
     
    Barra lateral         
    Es  la  parte  del  blog  que  muestra  los  gadgets  o  módulos  que  incorporan  prestaciones 
    adicionales al blog. 
     
    Bitácora              
    Término en castellano que originalmente se ha aplicado al blog para enfatizar su uso primitivo 
    como  diario  de  a  bordo.  Es  una  palabra  que  ha  sido  sustituida  por  el  término  anglosajón: 
    "blog". 
     
    Blog                  
    Sistema  para  publicar  fácilmente  contenidos  en  Internet  a  título  individual  o  colectivo.  Su 
    información se organiza en artículos ordenados cronológicamente. 
     
    Blogger               
    Servicio  que  proporciona  al  usuario  con  credenciales  de  Google  la  oportunidad  de  crear  y 
    mantener uno o varios blogs. 
     
     
Glosario de términos ::: Módulo 1 : Blogs                                                               616
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Blogosfera           
Red de blogs en internet. 
 
Blogroll             
Colección de enlaces favoritos que se ofrece en la barra lateral de un blog 
 
Blogspot             
Todos los blogs creados en Blogger tienen una URL similar: http://<usuario>.blogspot.com 
 
Borrador             
Es la entrada o artículo de un blog que no se visualiza en el frontend porque todavía no se ha 
publicado. 
 
C
  
 Cabecera              
 Parte  de  un  blog  donde  se  muestra  el  título  del  mismo  y  en  algunos  casos  una  imagen  o 
 banner representativos de fondo. 
  
Canal de suscripción 
Sistema  que  permite  a  los  lectores  de  un  blog  o  sitio  web  recibir  notificación  de  las  nuevas 
entradas  publicadas  sin  necesidad  de  navegar  hasta  él.  Para  ello  se  puede  utilizar  un 
navegador web o bien un lector específico de noticias. 
  
 CMS                   
 Content  System  Management  =  Sistema  de  Gestión  de  Contenidos.  Es  una  aplicación  que 
 suele  estar  diseñada  para  funcionar  en  un  servidor  web.  El  administrador  puede  publicar 
 contenidos  en  su  sitio  utilizando  las  prestaciones  de  esta  aplicación  a  través  de  su  interfaz 
 web.  
  
 Comentario            
 Son  aportaciones  enviadas  por  los  lectores  de  un  artículo  de  un  blog.  Se  visualizan  si  el 
 administrador los aprueba. 
  
 Creative Commons   
 Organización  que  ofrece  a  cualquier  usuario  la  posibilidad  de  elegir  las  condiciones  en  que 
 desea compartir un trabajo publicado en Internet.  
  
D
 
Del.icio.us        
Servicio Web 2.0 que permite la gestión individual y colaborativa de los marcadores a páginas 
web favoritas. 
 
E
 
Entrada             
Cada artículo o post de un blog. 
 
 
Glosario de términos ::: Módulo 1 : Blogs                                                                617
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Etiquetas            
En inglés "tags". Se utilizan para asignarlas a los artículos y facilitar su clasificación temática. 
 
F
  
Feed 
Es el canal de suscripción que ofrece un blog o sitio web. 
  
 Firefox                
 Navegador  web  alternativo  a  Internet  Explorer  con  interesantes  prestaciones: 
 multiplataforma, extensiones, diccionarios, plugins, etc. 
  
 Folksonomía            
 Sistema de clasificación de los contenidos (artículos, enlaces, etc) basado en la libre asignación 
 de etiquetas por parte del usuario 
  
 Fotolog                
 Tipo de blog donde la foto es el elemento principal de publicación. 
  
 FrontEnd               
 Es  el  área  pública  del  blog  que  muestra  los  artículos  publicados  que  pueden  ser  leídos  por 
 cualquier usuario que accede al mismo. 
  
G
   
  Gadget                
  Pequeño  recuadro  que  se  integra  en  una  página  web  a  modo  de  mosaico  y  que  se  ejecuta 
  como  una  mini‐aplicación  independiente.  Está  diseñado  para  enriquecer  la  información  o 
  servicios  de  esa  página.  En  un  blog  se  suele  mostrar  en  la  barra  lateral.  También  recibe  el 
  nombre de widget. 
   
GMail 
Servicio de correo electrónico de Google de excelentes prestaciones y en creciente capacidad 
de almacenamiento. 
   
Google Apps 
Servicio  Web  2.0  ofrecido  por  Google  a  los  usuarios  con  cuenta  de  Gmail  y  que  permite  la 
edición colaborativa de documentos utilizando herramientas ofimáticas en línea: documentos 
de texto, presentación, hojas de cálculo, etc. 
   
Google Calendar 
Servicio de agenda‐calendario individual y colectivo de Google. 
 
Google Docs 
Servicio para crear y compartir documentos. 
   
  Google Maps           
  Servicio de Google que facilita la localización geográfica de imágenes, textos y documentos. 
   
  Google Sites          
  Servicio de Google que permite crear un sitio web. 
Glosario de términos ::: Módulo 1 : Blogs                                                             618
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


 
L
 
Lector              
Es el usuario que accede al frontend del blog para leer los artículos del mismo. Si el blog está 
configurado adecuadamente podrá enviar sus comentarios. 
 
LMS                 
Learning  Management  System  =  Sistema  de  Gestión  del  Aprendizaje  y  se  utiliza  para  crear 
entornos de elearning. El LMS más utilizado en la actualidad es Moodle. 
 
M
   
  Marcadores           
  Accesos directos a las direcciones de sitios web favoritos. 
   
Marcadores dinámicos 
Tipo  de  marcadores  o  favoritos  que  utiliza  Firefox  para  afiliarse  a  un  canal  de  suscripción. 
Muestra cada cierto tiempo un enlace a cada uno de los últimos artículos de ese blog o página 
web. 
 
Marcadores sociales 
Enlaces a sitios web favoritos que se guardan para facilitar su posterior localización y acceso. 
Cuando los compartimos con otros usuarios reciben la denominación de "sociales". 
   
  Microblog            
  Tipo de blog donde los artículos están limitados en su extensión de caracteres. 
   
  Moblog               
  Tipo de blog orientado a su visualización en un teléfono móvil. 
   
  Moderación           
  Acción que realiza el administrador de un blog sobre los comentarios enviados por los lectores 
  a sus artículos. Puede aprobarlos o eliminarlos. 
 
N
 
Nube de etiquetas 
Conjunto de etiquetas que se suelen mostrar en la barra lateral de un blog donde el tamaño de 
fuente con que se muestra cada etiqueta dependerá de su frecuencia de uso. En ocasiones la 
pulsar sobre una etiqueta se muestra  el listado de  entradas a las que se les ha asignado esa 
etiqueta. 
   
O
 
Openblog              
Tipo  de  blog  que  proporciona  a  sus  visitantes  la  posibilidad  de  publicar  de  forma  abierta  o 
libre. 
 
 
Glosario de términos ::: Módulo 1 : Blogs                                                        619
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


P
 
PDF                  
Formato  de  documento  muy  extendido  en  internet.  Destinado  a  la  consulta  de  documentos 
paginados  de  cierta  extensión.  Se  pueden  leer  con  distintos  programas  gratuitos,  desde 
distintos  sistemas,  con  un  tamaño  reducido,  con  posibilidad  de  búsquedas,  presentación 
idéntica en cualquier impresora y protección anticopia frente a terceros. 
 
PDF Creator          
Aplicación  gratuita  para  generar  archivos  PDF.  Este  programa  instala  una  impresora  virtual 
que  permite  crear  un  archivo  PDF  a  partir  de  cualquier  programa  desde  el  que  se  pueda 
imprimir. 
 
Plantilla            
Conjunto de archivos HTML y CSS que determinan el estilo gráfico de un blog.  
 
Podcast              
Sistema para la difusión de audios en formato MP3. 
 
Post                 
Cada artículo o entrada de un blog. 
 
R
   
Rol                 
En Blogger se reconocen 3 tipos de roles de usuarios: administrador, autor y lector.  
   
RSS 
Formato de difusión de noticias de un blog o sitio web para suscripción. 
 
   
S
 
Slideshare           
Servicio Web 2.0 para el almacenamiento y difusión de presentaciones de diapositivas. 
 
Sumatra PDF          
Programa gratuito y portable para leer archivos PDF. 
 
Suscripción          
Permite  disponer  de  las  últimas  novedades  publicadas  en  el  navegador  web  o  lector  de 
noticias sin necesidad de acceder directamente a este sitio web. 
 
 
T
 
Trackback          
También llamados enlaces de retroceso. Permiten realizar un seguimiento de otros blogs que 
han enlazado a un artículo de nuestro blog. 
 
Glosario de términos ::: Módulo 1 : Blogs                                                              620
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Tumbleblog          
Tipo de blog poco estructurado que no se ajusta a una temática concreta. 
 
Twitter             
Formato  de  nanoblogging  o  microblogging  donde  el  usuario  publica  entradas  que  contiene 
texto y enlaces de una longitud no superior a 140 caracteres 
 
V
 
Videoblog          
Tipo de blog donde las entradas son clips de vídeo ordenados cronológicamente. 
 
W
 
Web 2.0              
Término  acuñado  por  el  americano  Dale  Dougherty  que  engloba  sitios  web  basados  en  la 
partición colaborativa de los usuarios frente a los sitios de la Web 1.0 menos interactivos. 
 
Wiki                 
Sistema para crear documentación de un proyecto de forma colaborativa. La información se 
organiza en páginas y capítulos. 
 
Wordpress            
Servicio alternativo a Blogger que permite crear y mantener un blog. 
 
Y
 
Youtube                 
Es  el  gran  líder  en  repositorios  de  vídeo  en  Internet.  Permiten  el  alojamiento  y  difusión  de 
vídeos.  Proporcionan  sporte  de  almacenamiento  y  también  de  difusción  en  streaming 
facilitando su correcta visualización a través de internet. 
Glosario de términos
   Módulo 2. Imagen
Glosario de términos ::: Módulo 2 : Imagen                                                     622
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


B
 
BMP                  
(BitMap = Mapa de bits). Formato de archivo de imagen digital de calidad. 
 
C
 
Código Embed        
Código HTML que permite insertar un objeto flash o similar dentro de una página web. 
 
F
 
Flickr                
Servicio Web 2.0 que permite administrar y compartir tus fotos en línea. 
 
G
 
GIF                    
(Graphics  Interchange  Format  =  Formato  de  Intercambio  Grafíco).  Formato  de  archivo  de 
imagen digital con una paleta de colores máxima de 256 colores. Especialmente diseñado para 
comprimir imágenes de colores sólidos. 
 
GIMP                   
GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para la 
manipulación  de  imágenes.  Es  una  aplicación  adecuada  para  la  edición  y  composición  de 
imágenes así como para el retoque fotográfico. 
 
Google Maps            
Servicio  que  proporciona  herramientas  para  la  consulta  e  integración  web  de  mapas 
geográficos y para la situación de recursos en esos mapas. 
 
I
 
Iframe                
Marco interno definido en una página HTML que muestra el contenido de otra página HTML. 
 
 
J
 
JPG‐JPEG               
(Joint  Photographic  Experts  Group  =  Grupo  de  Expertos  Fotográficos  Unidos).  Formato  de 
archivo  de  imagen  digital  con  una  paleta  de  colores  máxima  de  16  millones  de  colores. 
Especialmente diseñado para comprimir imágenes fotográficas. 
 
 
 
 
 
 
Glosario de términos ::: Módulo 2 : Imagen                                                          623
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


M
 
Modo de color         
Sistema  de  coordenadas  que  permiten  describir  el  color  de  cada  píxel  utilizando  los  valores 
numéricos. Ejemplo: Modo RGB donde cada color resulta de la combinación de tres canales: 
Rojo‐Verde‐Azul con un valor de intensidad entre 0 y 255. 
 
P
 
Picasa                  
Programa  que  se  instala  en  el  ordenador  para  el  tratamiento  y  gestión  de  las  imágenes 
almacenadas en él. 
 
Picasa Web              
Servicio Web 2.0 asociado a las credenciales de  usuario Google donde puedes administrar y 
compartir tus fotos en línea. 
 
Píxel                   
Es la unidad mínima de visualización de una imagen digital. Ésta se compone de una parrilla de 
puntos o píxeles cuando se visualiza en una pantalla o se imprime. 
 
PNG                     
(Portable  Network  Graphic  =  Gráfico  portable  para  la  red).  Formato  de  archivo  de  imagen 
digital con una paleta de colores máxima de 16 millones de colores.  
 
Profundidad de color   
Número de bits necesarios para codificar y guardar la información de color de cada pixel en 
una imagen. Por ejemplo: una profundidad de color de 8 bits permite "2 elevado a 8" colores, 
es decir, 256 colores. 
 
R
 
Resolución              
Grado de detalle o calidad de una imagen digital. Se mide en pixeles por pulgada (ppp) o en 
inglés dpi (dots per inch).  
 
S
 
Slide.com              
Servicio  Web  2.0  que  nos  permite  subir  una  colección  de  imágenes  y  luego  obtener  una 
atractiva presentación en línea que las muestra de forma secuencial y con efectos especiales. 
 
Slideshare             
Servicio de alojamiento y publicación en línea de presentaciones realizadas con Powerpoint u 
OpenOffice. Se utiliza para subir presentaciones y compartirlas con los demás. 
 
 
 
 
 
Glosario de términos ::: Módulo 2 : Imagen                                          624
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


T
 
TIF‐TIFF               
(Tagged Image File Format = Formato de Archivo de Imagen Etiquetada). Formato de archivo 
de imagen digital de calidad. 
 
X
 
XCF                 
Formato de imagen específico de GIMP. 
 
Glosario de términos
    Módulo 3. Audio
Glosario de términos ::: Módulo 3: Audio                                                          626
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


A
   
Audacity 
Software libre y de código abierto para grabar y editar audios. 
 
C
 
CDex 
Programa gratuito para extraer las pistas de un CD de audio a archivos MP3. 
 
Códec 
Acrónimo de "codificación/descodificación". Es un algoritmo especial que reduce el número de 
bytes  que  ocupa  un  archivo  de  audio.  Los  archivos  codificados  con  un  códec  específico 
requieren  el  mismo  códec  para  ser  decodificados  y  reproducidos.  El  códec  más  utilizado  en 
audio es el MP3. 
 
D
 
Decibelio 
Unidad de medida del volumen o intensidad de un sonido. El silencio se cuantifica como 0 dB y 
el umbral del dolor para el oído humano se sitúa en torno a los  130‐140 dB. 
 
E
 
Estéreo 
Audio que se reproduce por los dos canales: derecho (R) e izquierdo (L).  
 
 
F
 
Frecuencia 
Número de vibraciones por segundo que da origen al sonido analógico. Se mide en hertzios.  
 
 
G
 
Goear 
Servicio Web 2.0 que permite subir y guardar archivos de audio en su servidor. 
 
 
L
 
LAME 
Códec que se propone utilizar con Audacity para la exportación de audios a formato MP3. 
 
Listas de audio 
Listados  de  archivos  de  audio  que  permiten  la  reproducción  continuada  y  secuencial  de  los 
mismos. 
 
Glosario de términos ::: Módulo 3: Audio                                                            627
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Loop 
Fragmento musical de corta duración que reproducido en bucle transmite la sensación de un 
acompañamiento musical más largo.  
 
M
 
MediaInfo 
Programa  gratuito  que  permite  conocer  las  propiedades  o  características  técnicas  de  un 
archivo de audio o video digitales. 
 
Metadatos 
Información  adicional  de  un  archivo  de  audio  MP3  que  se  muestra  en  el  reproductor  y  que 
proporciona datos del título, artista, año, género, título del album, etc. 
 
MIDI 
(Musical       Instrument        Digital       Interface        =     Interface       Digital      para 
Instrumentos  Digitales).  Formato  de  audio  que  no  resulta  de  la  digitalización  de  un  audio 
analógico.  Contiene secuencias de intervención de los dispositivos MIDI (sintetizadores) donde 
se recoge qué instrumento suena, en qué forma lo hace y cuándo. 
 
Mono 
El sonido mono sólo está definido por un canal y al reproducirse origina un sonido semejante 
al  escuchado  con  un  solo  oído.  Carece  de  la  sensación  espacial  que  proporciona  la  audición 
estereofónica. 
 
MP3 
Formato  MPEG  1  Layer  3  de  archivo  para  audio  creado  por  el  Instituto  Fraunhofer.  Por  su 
extraordinario grado de compresión y alta calidad está liderando el mundo del audio digital. 
 
 
O
 
OGG 
Formato  de  audio  reciente  que  surge  como  alternativa  libre  y  de  código  abierto  al  formato 
MP3.  
 
 
P
 
PCM/ADPCM 
Códec de compresión de audio en formato WAV. 
 
PixelOut 
Reproductor  de audio  elaborado en tecnología Flash y que permite integrarlo en una página 
web para mostrar la reproducción de un archivo de sonido. 
 
 
 
 
 
Glosario de términos ::: Módulo 3: Audio                                                              628
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


R
 
Resolución 
El número de bits utilizados para guardar cada muestra digital de la señal analógica de audio. 
Ejemplo: 16 bits significa una calidad de "2 elevada a 16", es decir, 65536 niveles de amplitud. 
 
S
 
SoundCloud 
Espacio Web 2.0 gratuito destinado a la publicación de archivos de audio. 
 
 
T
 
Tasa de muestreo 
Define  el  intervalo  de  tiempo  tras  el  cual  se  toma  una  muestra  de  señal  análogica  de  audio 
para generar el audio digital. Así por ejemplo una tasa de muestreo de 44100 Hz significa que 
se tomaron esa cantidad de muestras en un segundo. 
 
V
 
Velocidad de transmisión 
También llamado bitrate se refiere a la cantidad de espacio físico medido en bits que ocupa un 
segundo de duración de ese audio. El bitrate puede ser constante o variable. 
 
W
 
WAV 
(WaveForm  Audio  File  =  Archivo  de  Audio  de  Formato  Onda).  Es  un  formato  de  archivo  de 
audio con excelente calidad pero con un peso considerable. 
   
Glosario de términos
    Módulo 4. Video
Glosario de términos ::: Módulo 4: Video                                                               630
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


A
   
Auto Gordian Knot 
Software para la conversión de archivos de vídeo VOB en archivos de vídeo AVI codificados con 
DivX o XviD. 
 
AVI 
(Audio Video Interleaved  = Audio y Video Intercalado). Formato de archivo de vídeo de gran 
calidad y peso.  
 
 
C
 
Códec 
Acrónimo de "codificación/descodificación". Es un sistema que permite reducir el número de 
bytes  que  ocupa  un  archivo  de  vídeo.  Los  archivos  codificados  con  un  códec  específico 
requieren el mismo códec para ser decodificados y reproducidos. Ejemplos de códecs de vídeo: 
DivX, XviD, etc. 
 
Código Embed 
Código HTML que permite insertar el visor y el vídeo elegido en un repositorio de vídeos. 
 
 
D
 
DV 
Digital  Video.  Es  la  tecnología  que  utilizan  las  cámaras  de  vídeo  al  guardar  la  grabación  en 
formato digital. 
 
DVD Decrypter 
Programa  que  extrae  los  archivos  VOB  de  un  disco  DVD  a  una  carpeta  del  disco  duro  del 
ordenador. 
 
DVD Video 
Soporte de reproducción de vídeo. Muestra una estructura especial de carpetas y ficheros (en 
algunos  casos  encriptados)  que  al  ser  reproducidos  por  programas  específicos  (VLC  Media 
Player, por ejemplo) mostrará una película organizada en capítulos. 
 
 
F
 
FLV 
Formato de archivo de vídeo de Adobe Flash para visualizar vídeos en Internet. Es el formato 
que utiliza Youtube por defecto. 
 
Fotograma Clave 
Fotogramas  del  vídeo  que  se  guardan  integramente  durante  el  proceso  de 
compresión/codificación de un archivo de vídeo. 
 
 
Glosario de términos ::: Módulo 4: Video                                                       631
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Fotogramas por segundo. 
Es  el  número  de  fotogramas  por  segundo  que  contiene  un  vídeo  durante  su  reproducción. 
Oscila entre 15 y 30 fps. 
 
Fotos Narradas 
Aplicación gratuita que se instala en Windows XP que permite crear un vídeo WMV a partir de 
una secuencia de imágenes y audios. 
 
M
 
MediaInfo 
Programa  gratuito  que  permite  conocer  las  propiedades  o  características  técnicas  de  un 
archivo de audio o video digitales. 
 
Metacafe 
Servicio Web 2.0 para la publicación y difusión de vídeos 
 
MOV 
Formato de archivo de vídeo desarrollado por Apple para reproducir con QuickTime Player. 
 
MP4 
Formato  de  archivo  de  vídeo  desarrollado  por  Apple  para  reproducir  vídeo  de  calidad  en 
streaming. Es el formato que utiliza el dispositivo iPod para reproducir vídeos. 
 
MPEG 
(Moving Pictures Expert Group = Grupo de Expertos de Películas). Formato de archivo de vídeo 
estándar para la compresión de vídeo digital. 
 
 
O
 
OverStream 
Servicio  Web  2.0  que  permite  personalizar  un  vídeo  en  línea  alojado  en  Youtube,  Google 
Vídeo, etc incorporándole comentarios y subtítulos. 
 
 
R
 
Ratio 
Proporción  entre  la  anchura  y  la  altura  de  la  ventana  de  reproducción  de  un  video. 
Habitualmente 4:3 o bien 16:9 para los DVD. 
 
Revver 
Servicio Web 2.0 para la publicación y difusión de vídeos 
 
 
RM 
Formato de archivo de vídeo de Real Networks.  
 
 
Glosario de términos ::: Módulo 4: Video                                                              632
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


S
 
Sintonizadora TV 
Tarjeta que se instala en el ordenador y que se conecta a la señal de antena o a un dispositivo 
de  vídeo  externo.  Se  utiliza  como  entrada  de  vídeo  al  ordenador  para  la  obtención  de 
contenidos. 
 
Sistema de televisión 
Sistema  de  reproducción  por  televisión  característico  de  cada  país  o  zona  geográfica:  NTSC 
(USA, CentroAmérica, Japón), PAL (Europa), SECAM (Francia), etc. 
 
Streaming 
Tecnología servidor‐cliente que permite a los visitantes visualizar un vídeo de cierta duración y 
calidad.  Tras  completarse  el  buffer  inicial  la  reproducción  se  inicia  y  se  completa  de  forma 
contínua mientras que la descarga del resto se completa en segundo plano. 
 
SuperC 
Software  gratuito  que  se  utiliza  para  convertir  un  archivo  de  vídeo  de  un  formato  en  otro. 
Admite la lectura y conversión de un amplio catálogo de formatos de vídeo. 
 
SWF 
Extensión de archivo que suele contener una animación o utilidad diseñada con el programa 
Adobe  Flash.  Este  archivo  se  suele  embeber  dentro  de  una  página  HTML  para  mostrarse  a 
través  del  navegador.  Para  su  correcta  visualización  es  necesario  que  el  navegador  web  del 
cliente disponga del plugin de Adobe Flash instalado y actualizado. 
 
 
V
 
Velocidad de transmisión 
Es la cantidad de espacio físico (en bits) que ocupa un segundo de duración de ese vídeo. 
 
Video Download Helper 
Extensión del navegador  Firegox que permite descargar y guardar en local  un vídeo, audio o 
imagen  que  se  muestra  dentro  de  una  página  web.  En  este  curso  se  propone  como 
herramienta para la descarga en local de archivos de vídeo FLV de Youtube. 
 
VideoCD 
Formato  de  CD  que  al  insertarlo  en  una  unidad  arranca  por  defecto  el  reproductor  de  vídeo 
para mostrar su contenido. 
 
Vimeo 
Servicio Web 2.0 para la publicación y difusión de vídeos. 
 
VLC Media Player 
Software  gratuito  y  universal  capaz  de  reproducir  cualquier  formato  de  archivo  de  vídeo.  Se 
dispone de versión instalable y también portable para memoria USB. 
 
 
 
Glosario de términos ::: Módulo 4: Video                                                     633
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


W
 
Windows Movie Maker 
Aplicación integrada en Windows que permite capturar el vídeo de una cámara digital de vídeo 
DV. 
 
WMV 
(Windows  Media  Video).  Formato  de  archivo  de  vídeo  desarrollado  por  Microsoft  para  la 
difusión de vídeo por Internet. 
 
Y
 
Youtube 
Servicio Web 2.0 de búsqueda y alojamiento de vídeos.  
 
Bibliografía
sobre Web 2.0
Bibliografía sobre Web 2.0                                                                635
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Bibliografía sobre Web 2.0

                          Título:
                          La Blogosfera Hispana. Pioneros de la cultura digital.
                          Autor:
                          Jose Manuel Cerezo y otros.
                          Licencia:
                          E-book bajo licencia Creative Commons “Reconocimiento-
                          NoComercial SinObraDerivada”
                          Editado por:
                          Fundación France Telecom España
                          Fecha de publicación:
                          2006
                          Reseña Bibliográfica:
Recopilación de artículos sobre distintos aspectos de la blogoesfera hispana escritos por
algunos de los expertos más conocidos. Se abarcan temas como la teoría de los blogs, impacto
de los blogs en internet, visibilidad, relaciones con las instituciones, negocios, etc.
URL de descarga:
http://www.fundacionorange.es/areas/25_publicaciones/la_blogosfera_hispana.pdf


                       Título:
                       Planeta 2.0. Inteligencia colectiva o medios fast food.
                       Autor:
                       Cristóbal Cobo y Hugo Pardo.
                       Licencia:
                       E-book bajo licencia Creative Commons “Reconocimiento-NoComercial
                       SinObraDerivada”.
                       ISBN:
                       978-84-934995-8-7
                       Fecha de publicación:
                       2007
                       Reseña Bibliográfica:
Este libro pretende desde su primer capítulo ser un aglutinador de ideas, al diseñar un breve
marco teórico para el darwinismo digital de la World Wide Web y recopilar un vasto mapa de
lecturas para aquellos interesados en comprender y profundizar en este momento evolutivo
de Internet. Este trabajo refuerza algunas ideas que pretenden proteger al lector del
alineamiento ciego con los discursos grandilocuentes y con la dicotomía wired / tired /
expired. Sin vocación de predecir el futuro, se reflexiona si se vive una fase determinante y
creativa de la inteligencia colectiva o si simplemente se trata de un escenario de medios fast
food, de consumo rápido y de carácter amateur en rápida transición hacia una nueva etapa
evolutiva.
URL de descarga:
http://www.planetaweb2.net/
Bibliografía sobre Web 2.0                                                                  636
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


                           Título:
                           Web 2.0
                           Autor:
                           Antonio Fumero y Genís Roca.
                           Editado por:
                           Fundación Orange.
                           Licencia:
                           E-book bajo licencia Creative              Commons   “Reconocimiento-
                           NoComercial SinObraDerivada”.
                           Depósito Legal:
                           M-15478-2007

Fecha de publicación:
2007
Reseña Bibliográfica:
Este libro pretende abarcar un subconjunto de Internet (la web 2.0) que, a su vez, aglutina al
de los blogs. Y es que, más allá de etiquetas, la forma de concebir la Red se ha visto
profundamente alterada con la aparición de nuevas tecnologías que han propiciado un cambio
radical en las rutinas con las que nos equipábamos a la hora de navegar. Tanto el “yo” como
las Redes Sociales han explosionado de manera paralela, figura geométrica que, por azares
del capricho digital, sufre modificaciones de singular importancia al ver sometidas sus
infinitas líneas a profundas intersecciones dando lugar a caprichosos segmentos. Fragmentos
que constituyen reflejos de distintas realidades, tantas como individuos, tantas como retazos
de vida surgen de la fusión, de la ósmosis, incluso de la emulsión de sensibilidades de
distintas densidades.
URL de descarga:
http://www.fundacionorange.es/areas/25_publicaciones/WEB_DEF_COMPLETO.pdf


                           Título:
                           El poder de las redes
                           Autor:
                           David de Ugarte.
                           Licencia:
                           Dominio público.
                           ISBN:
                           978-84-611-8873-4
                           Fecha de publicación:
                           2007
                           Reseña Bibliográfica:
                           Que estamos en un tiempo de cambios y que esos cambios tienen
que ver de alguna manera con las “redes sociales” es ya una idea común, extendida y
repetida hasta el cansancio. Sin embargo nadie parece tener muy claro qué son esas famosas
redes y sobre todo qué tienen de nuevo. A fin de cuentas, si de las redes que hablamos son
las que forman las personas al relacionarse unas con otras, la sociedad siempre fue una red. Y
si hablamos de movimientos de activistas también estuvieron siempre ahí, relacionándose
unos con otros en una especie de universo hiperactivo y paralelo. Hay sin embargo dos
elementos nuevos que todo el mundo entiende intuitivamente relacionados con esta cuestión.
Por un lado Internet y su consecuencia más directa: la eclosión de una nueva esfera de
relación social que pone en contacto a millones de personas cada día. Por otro la aparición en
los últimos años de una amplia literatura sobre redes aplicada a todos los campos, desde la
Física o la Biología hasta la Economía, con toda su inevitable secuela de libros de divulgación,
aplicaciones al marketing y juegos publicitarios.Y luego está toda una serie de movimientos
que van desde la revolución hasta la protesta cívica, pasando por una nueva suerte de
sofisticadas algaradas que nadie sabe clasificar muy bien y que llenan páginas en los
periódicos.
URL de descarga:
http://www.deugarte.com/manual-ilustrado-para-ciberactivistas
Bibliografía sobre Web 2.0                                                              637
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


                        Título:
                        La revolución de los blogs
                        Autor:
                        Jose Luis Orihuela.
                        Editado por:
                        La Esfera de los Libros, Madrid.
                        ISBN:
                        84-9734-498-7
                        EAN:
                        9788497344982
                        Fecha de publicación:
                        2006
                        Reseña Bibliográfica:
Los weblogs, blogs, cuadernos de bitácora o simplemente bitácoras son los sitios web
personales que están poniendo la Red al alcance de todo el mundo. Éste es un libro para
todos aquellos que alguna vez se han preguntado:¿Qué son los weblogs?, ¿Quiénes son y por
qué escriben los bloguers?, ¿Cómo comenzar un weblog?, ¿Cómo escribir buenos comentarios?,
¿Dónde puedo tener un weblog gratis?, ¿Cómo puedo encontrar otros bloguers en mi país?,
¿Cuáles son los mejores weblogs en español?, etc. Este libro está escrito de forma didáctica
por un reconocido bloguer. Es la primera obra orientada al gran público que examina los
principales ámbitos de impacto de los weblogs -sobre el periodismo, la empresa, la educación
o la política- con ejemplos y referencias para comprender cómo y por qué este nuevo medio
está cambiando nuestra cultura y generando otra nueva: la blogosfera.
URL con más información:
http://www.esferalibros.com/libros/librodetalle.html?libroISBN=8497344987
Direcciones Web
Módulo 1. Blogs
Direcciones Web ::: Módulo 1. Blogs                                     639
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Módulo 1. Blogs
Web 2.0

Web 2.0 en Wikipedia
http://es.wikipedia.org/wiki/Web_2.0

¿Qué es la Web 2.0? de MaestrosdelWeb
http://www.maestrosdelweb.com/editorial/web2/

Mapa visual de la Web 2.0
http://internality.com/web20/

Libro "Web 2.0" de la Fundación Orange
http://www.fundacionorange.es/areas/25_publicaciones/publi_253_11.asp

Web 2.0 y Educación
http://blog.educastur.es/blog/2007/06/18/web-20-y-educacion/

Planeta Web 2.0
http://www.planetaweb2.net/

Recopilación de servicios Web 2.0
http://wwwhatsnew.com/recopilacion/

Fuente Web en Wikipedia
http://es.wikipedia.org/wiki/Fuente_web

Del.icio.us
http://delicious.com/

Google Apps
http://www.google.com/apps/

Ayuda de Google Docs
http://docs.google.com/support/?hl=es

Curso de Google Docs de Aulaclic
http://www.aulaclic.es/googledocs/


Algunos blogs populares
Microsiervos
http://www.microsiervos.com/

Genbeta
http://www.genbeta.com/

Xataka
http://www.xataka.com/

Alt1040
http://alt1040.com/
Direcciones Web ::: Módulo 1. Blogs                                                      640
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



EduBlogs
Educastur Blog
http://blog.educastur.es/

Arablogs
http://www.catedu.es/arablogs/

Planeta Educativo
http://www.catedu.es/arablogs/

Aula Blog
http://www.aulablog.com/


Servicios de Blogs
Blogger
http://www.blogger.com

Wordpress
http://www.wordpress.com

Live Journal
http://www.livejournal.com/

Blogger
Página oficial de Ayuda de Blogger:
http://www.google.com/support/blogger/?hl=es

Manual de Blogger del Observatorio Tecnológico del ITE-MEC
http://observatorio.cnice.mec.es/modules.php?op=modload&name=News&file=article&sid=383

Ayuda Blogger
http://www.ayudablogger.org/

Ayuda Blogger 2.0
http://www.ayudablogger.com/


Wordpress.com

Página oficial de Ayuda de Wordpress:
http://en.support.wordpress.com/

Foros de Ayuda de Wordpress
http://es.forums.wordpress.com/



Derechos de autor
Creative Commons
http://es.creativecommons.org/

Derechos de autor en Wikipedia
http://es.wikipedia.org/wiki/Copyright
Direcciones Web ::: Módulo 1. Blogs                                   641
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


CEDRO
http://www.cedro.org/conceptos_basicos.asp


Software
Adobe Reader
http://www.adobe.com/es/products/reader/

Sumatra PDF Portable
http://portableapps.com/apps/office/sumatra_pdf_portable

PDF Creator
http://www.pdfforge.org/products/pdfcreator
Direcciones Web
Módulo 2. Imagen
Direcciones Web ::: Módulo 2. Imagen                                                     643
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Módulo 2. Imagen
GIMP
GIMP. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/86/cd/index.htm

Manual de GIMP del Observatorio Tecnológico del ITE
http://observatorio.cnice.mec.es/modules.php?op=modload&name=News&file=article&sid=152

Manual de GIMP en Mosaic UOC (PDF)
http://mosaic.uoc.edu/pdf/manual_introduccion_gimp.pdf

Manual oficial de GIMP en español
http://docs.gimp.org/es/

GIMP
http://www.gimp.org/

GIMP en español
http://www.gimp.org.es/

GIMP portable
http://portableapps.com/apps/graphics_pictures/gimp_portable


Repositorio de imágenes gratuitas
Banco imágenes ITE
http://bancoimagenes.isftic.mepsyd.es/

Bigfoto
http://www.bigfoto.com/

DesignPacks
http://www.designpacks.com/

Flickr CC
http://www.flickr.com/creativecommons/

Free Images Co UK
http://www.freeimages.co.uk/

FreeFoto
http://www.freefoto.com/

Image After
http://imageafter.com/

MorgueFILE
http://morguefile.com/

NASA Images
http://www.nasa.gov/multimedia/imagegallery/index.html

Open Clip Art Library
http://www.openclipart.org
Direcciones Web ::: Módulo 2. Imagen                                  644
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Openphoto
http://www.openphoto.net/


Pixel Perfect Digital
http://www.pixelperfectdigital.com/free_stock_photos/

Stock.XCHNG
http://www.sxc.hu/

Wikimedia Commons
http://commons.wikimedia.org/wiki/Category:Images/

YotoPhoto
http://www.genbeta.com/web/busca-fotografias-libres-en-yotophoto


Servicios Web 2.0

Flickr
http://www.flickr.com/

Slide.com
http://www.slide.com/

Slideshare
http://www.slideshare.net/

Picasa
http://picasa.google.com/intl/es/

Google Maps
http://maps.google.es/
Direcciones Web
Módulo 3. Audio
Direcciones Web ::: Módulo 3. Audio                                                   646
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado



Módulo 3. Audio

Audacity
Multimedia. Introducción. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/84/cd/index.html

Sonido y música con el ordenador. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/60/cd/index.htm

Captura y edición de audio con software libre de Mosaic UOC (PDF)
http://mosaic.uoc.edu/pdf/Captura_y_Edicion_de_Audio_con_Herramientas_Libres_II.pdf

Manual de Audacity de GleduWiki
http://perso.gratisweb.com/jbarraga/audacity1.html

Manual de Audacity de J.Antonio Barragán
http://perso.gratisweb.com/jbarraga/audacity1.html

Audacity
http://audacity.sourceforge.net/

Audacity Portable
http://portableapps.com/apps/music_video/audacity_portable


Reproductores flash de audio
PixelOut
http://www.1pixelout.net/code/audio-player-wordpress-plugin/


CDex
CDex
http://cdexos.sourceforge.net/

Manual de CDex de Angel García
http://es.geocities.com/angelgar25/manual-cdex.htm

Sonido y música con el ordenador. Curso del ITE
http://www.isftic.mepsyd.es/formacion/materiales/60/cd/index.htm

Captura y edición de audio con software libre de Mosaic UOC (PDF)
http://mosaic.uoc.edu/pdf/Captura_y_Edicion_de_Audio_con_Herramientas_Libres_II.pdf



Repositorios de audios gratuitos
Banco audios: ITE
http://bancoimagenes.isftic.mepsyd.es/

Flash Kit
http://www.flashkit.com/
Direcciones Web ::: Módulo 3. Audio                                   647
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Free Loops
http://www.freeloops.com/

PacDV
http://www.pacdv.com/sounds/index.html

Pockect Fuel
http://www.pocketfuel.com/gallery.php


Servicios Web 2.0 de audio

GoEar
http://www.goear.com/

SoundCloud
http://soundcloud.com/
Direcciones Web
 Módulo 4. Video
Direcciones Web ::: Módulo 4. Video                                   649
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado


Módulo 4. Video
VLC Media Player
VLC Media Player
http://www.videolan.org/

VLC Media Player Portable
http://portableapps.com/apps/music_video/vlc_portable

VideoLan Wiki
http://wiki.videolan.org/Main_Page


Servicios Web 2.0 de vídeo
YouTube
http://www.youtube.com/

Mediateca de EducaMadrid
http://mediateca.educa.madrid.org/

TeacherTube
http://www.teachertube.com/

Google Vídeo
http://video.google.es/

Revver
http://revver.com/

Metacafe
http://www.metacafe.com/

MySpace
http://myspace.com/

Dailymotion
http://www.dailymotion.com/

Guba
http://www.guba.com/

Sharkle.com
http://www.markosweb.com/www/sharkle.com/

Lulu TV
http://www.lulu.tv/

Vsocial
http://vsocial.com/

Current TV
http://www.current.tv/

Colombia aprende
http://www.colombiaaprende.edu.co/html/mediateca

Universidad de Sevilla
Direcciones Web ::: Módulo 4. Video                                                  650
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

http://www.sav.us.es/producciondevideo/videoenred.asp

TV educativa del ITE
http://tv_mav.cnice.mec.es/

TV educativa de la UNED
http://www.uned.es/cemav/tv.htm

Biblioteca Virtual Cervantes
http://www.cervantesvirtual.com/videoteca/

Mediateca de Educared
http://campusuniv.campusred.net/vod-publico2/

Mediateca Universidad de Oviedo
http://mediateca.uniovi.es/

Videoteca CUDI de Méjico
http://www.udlap.mx/internet2/video/

Vive, TV educativa de Venezuela
http://www.vive.gob.ve/


Windows Movie Maker
Manual de Windows Movie Maker de TrucosWindows.net
http://www.trucoswindows.net/conteni8id-60-manual-Windows-Movie-Maker.htm

Manual Básico de Windows Movie Maker de Mosaic UOC (PDF)
http://mosaic.uoc.edu/pdf/Manual_Basico_de_Windows_Movie_Maker.pdf

Crear películas caseras con Windows Movie Maker
http://www.microsoft.com/spain/windowsxp/using/moviemaker/videos/create.mspx

Manual de captura y edición de Vídeo con WMM de AyudaDigital.com
http://www.ayudadigital.com/video/como_capturar_editar_moviemaker.htm


Fotos Narradas (PhotoStory 3)
Sitio Oficial de PhotoStory 3
http://www.microsoft.com/latam/windowsxp/fotografiadigital/photostory/default.mspx


DVD Decrypter
DVD Decrypter en Mr.Bass
http://www.mrbass.org/dvdrip/

DVD Decrypter Portable
http://appsportables.blogspot.com/2008/01/dvd-decrypter-3540-portable.html


AutoGordian
Autogordian GTK
http://www.autogk.me.uk/
Direcciones Web ::: Módulo 4. Video                                   651
Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado

Manual para convertir DVD a DivX de MundoDivX
http://www.mundodivx.com/dvdavi/autogk.php

Media Info
Media Info
http://mediainfo.sourceforge.net/es

Reproductor web FLV
Media Player de Jeroen Wijering
http://www.longtailvideo.com/players/jw-flv-player/

Wiki de JW Media Player
http://developer.longtailvideo.com/trac/

Más contenido relacionado

PDF
Introduccion a xhtml
PDF
Tutorial o oobase
PDF
Manualmoodle
PDF
Curso html
PDF
Tutorialjoomla1.7
PDF
Joomla para principiantes aprendiendo a crear y mantener sitios web juan a....
PDF
Curso power point 97
DOC
Index pag wep
Introduccion a xhtml
Tutorial o oobase
Manualmoodle
Curso html
Tutorialjoomla1.7
Joomla para principiantes aprendiendo a crear y mantener sitios web juan a....
Curso power point 97
Index pag wep

La actualidad más candente (7)

PDF
Manual guadalinex edu
PDF
Manual microsoft office word 2010
PDF
Query browser-es
PDF
PROCESADOR DE TEXTO
PDF
Enseñanza mesclada
PDF
CUANTO SABES DE HTML
PDF
Curso Completo De Html [447 Paginas En EspañOl]
Manual guadalinex edu
Manual microsoft office word 2010
Query browser-es
PROCESADOR DE TEXTO
Enseñanza mesclada
CUANTO SABES DE HTML
Curso Completo De Html [447 Paginas En EspañOl]
Publicidad

Destacado (20)

PDF
Modulo 2. Sonido Y Musica Por Ordenador. 02 Sonido En El Sistema Operativo
PDF
Modulo 1. Sonido Y Musica Por Ordenador. 04 El Estudio De Sonido. Edicion
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 10 Karaoke 2. Melody Assistant
PDF
Modulo 1. Sonido y musica por ordenador. 02 El ordenador en el aula.
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 09 Karaoke 1. Van Basco Karaoke Player
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 04 Reproductor. Real One Player
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 03 Extraccion De Audio. C Dex
PDF
Modulo 1. Sonido Y Musica Por Ordenador. 06 El Audio
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 06 Secuenciador. N Track Studio
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 07 Conversor. D Bpower Amp
PDF
Modulo 1. Sonido Y Musica Por Ordenador. 03 El Sonido Y Su Representacion
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 05 Editor De Audio. Audacity
PDF
Informe Riesgos y amenazas en cloud computing. INTECTO-CERT
PDF
Modulo 1. Sonido Y Musica Por Ordenador. 07 Almacenamiento
PDF
00 Sonido y musica por ordenador. Guia del alumno.
PDF
Modulo 1. Sonido Y Musica Por Ordenador. 05 El Midi
PDF
Modulo 2. Sonido Y Musica Por Ordenador. 08 Partituras. Note Pad 2004
PDF
Maquinaria Pesada Curriculo Intertorito S.A de C.V
PDF
50 Trucos De Google
PDF
Servicios Web 2.0
Modulo 2. Sonido Y Musica Por Ordenador. 02 Sonido En El Sistema Operativo
Modulo 1. Sonido Y Musica Por Ordenador. 04 El Estudio De Sonido. Edicion
Modulo 2. Sonido Y Musica Por Ordenador. 10 Karaoke 2. Melody Assistant
Modulo 1. Sonido y musica por ordenador. 02 El ordenador en el aula.
Modulo 2. Sonido Y Musica Por Ordenador. 09 Karaoke 1. Van Basco Karaoke Player
Modulo 2. Sonido Y Musica Por Ordenador. 04 Reproductor. Real One Player
Modulo 2. Sonido Y Musica Por Ordenador. 03 Extraccion De Audio. C Dex
Modulo 1. Sonido Y Musica Por Ordenador. 06 El Audio
Modulo 2. Sonido Y Musica Por Ordenador. 06 Secuenciador. N Track Studio
Modulo 2. Sonido Y Musica Por Ordenador. 07 Conversor. D Bpower Amp
Modulo 1. Sonido Y Musica Por Ordenador. 03 El Sonido Y Su Representacion
Modulo 2. Sonido Y Musica Por Ordenador. 05 Editor De Audio. Audacity
Informe Riesgos y amenazas en cloud computing. INTECTO-CERT
Modulo 1. Sonido Y Musica Por Ordenador. 07 Almacenamiento
00 Sonido y musica por ordenador. Guia del alumno.
Modulo 1. Sonido Y Musica Por Ordenador. 05 El Midi
Modulo 2. Sonido Y Musica Por Ordenador. 08 Partituras. Note Pad 2004
Maquinaria Pesada Curriculo Intertorito S.A de C.V
50 Trucos De Google
Servicios Web 2.0
Publicidad

Similar a Manual multimedia y web 2.0 (20)

PDF
Introduccion a xhtml
PDF
Introduccion a xhtml
PDF
5. desarrollador web profesional
PDF
Doc curso-html
PDF
Curso HTML
PDF
Curso html
PDF
Tutoriales full2012 curso completo html
PDF
FELIPE MASSONE : CURSO HTML2
PDF
Curso completo de html
PDF
Doc curso-html
PDF
Curso de html
PDF
Doc curso-html
PDF
Curso html
PDF
Curso html
PDF
Doc curso-html
PDF
Doc curso-html
PDF
Doc: Curso html
PDF
Tutorial de html
PDF
Doc curso html completo
PDF
Curso completo de html
Introduccion a xhtml
Introduccion a xhtml
5. desarrollador web profesional
Doc curso-html
Curso HTML
Curso html
Tutoriales full2012 curso completo html
FELIPE MASSONE : CURSO HTML2
Curso completo de html
Doc curso-html
Curso de html
Doc curso-html
Curso html
Curso html
Doc curso-html
Doc curso-html
Doc: Curso html
Tutorial de html
Doc curso html completo
Curso completo de html

Más de José M. Padilla (13)

PDF
Guia optimizacion motores_busqueda
PDF
00 Sonido y musica por ordenador. Caso 20
PDF
00 Sonido Y Musica Por Ordenador. Caso1
PDF
00 PHP. Paginas Web Dinamicas
PDF
16 Php. Variables Predefinidas
PDF
14 PHP. Variables
PDF
13 PHP. Un Ejemplo Con Constantes
PDF
12 PHP. Lineas de comentario
PDF
11 PHP. PHP y HTML
PDF
10 Php. Instalacion De Un Servidor De Correo
PDF
06 Php. Instalando My Sql
PDF
08 Php. Trabajar Desde El Servidor
PDF
07 Php. Instalando Php My Admin
Guia optimizacion motores_busqueda
00 Sonido y musica por ordenador. Caso 20
00 Sonido Y Musica Por Ordenador. Caso1
00 PHP. Paginas Web Dinamicas
16 Php. Variables Predefinidas
14 PHP. Variables
13 PHP. Un Ejemplo Con Constantes
12 PHP. Lineas de comentario
11 PHP. PHP y HTML
10 Php. Instalacion De Un Servidor De Correo
06 Php. Instalando My Sql
08 Php. Trabajar Desde El Servidor
07 Php. Instalando Php My Admin

Último (20)

PDF
Influencia-del-uso-de-redes-sociales.pdf
PDF
SAP Transportation Management para LSP, TM140 Col18
PPTX
Power Point Nicolás Carrasco (disertación Roblox).pptx
PDF
MANUAL TECNOLOGÍA SER MINISTERIO EDUCACIÓN
DOCX
Zarate Quispe Alex aldayir aplicaciones de internet .docx
PPTX
IA de Cine - Como MuleSoft y los Agentes estan redefiniendo la realidad
PDF
5.1 Pinch y Bijker en libro Actos, actores y artefactos de Bunch Thomas (coor...
PPTX
RAP02 - TECNICO SISTEMAS TELEINFORMATICOS.pptx
PPTX
Presentación de Redes de Datos modelo osi
PDF
Instrucciones simples, respuestas poderosas. La fórmula del prompt perfecto.
PDF
Maste clas de estructura metálica y arquitectura
PDF
Estrategia de apoyo tecnología miguel angel solis
PPTX
COMO AYUDAN LAS TIC EN LA EDUCACION SUPERIOR.pptx
PDF
Liceo departamental MICRO BIT (1) 2.pdfbbbnn
PDF
Estrategia de apoyo tecnología grado 9-3
PPTX
historia_web de la creacion de un navegador_presentacion.pptx
PDF
programa-de-estudios-2011-guc3ada-para-el-maestro-secundarias-tecnicas-tecnol...
PPTX
Sesion 1 de microsoft power point - Clase 1
PPTX
sa-cs-82-powerpoint-hardware-y-software_ver_4.pptx
PPT
El-Gobierno-Electrónico-En-El-Estado-Bolivia
Influencia-del-uso-de-redes-sociales.pdf
SAP Transportation Management para LSP, TM140 Col18
Power Point Nicolás Carrasco (disertación Roblox).pptx
MANUAL TECNOLOGÍA SER MINISTERIO EDUCACIÓN
Zarate Quispe Alex aldayir aplicaciones de internet .docx
IA de Cine - Como MuleSoft y los Agentes estan redefiniendo la realidad
5.1 Pinch y Bijker en libro Actos, actores y artefactos de Bunch Thomas (coor...
RAP02 - TECNICO SISTEMAS TELEINFORMATICOS.pptx
Presentación de Redes de Datos modelo osi
Instrucciones simples, respuestas poderosas. La fórmula del prompt perfecto.
Maste clas de estructura metálica y arquitectura
Estrategia de apoyo tecnología miguel angel solis
COMO AYUDAN LAS TIC EN LA EDUCACION SUPERIOR.pptx
Liceo departamental MICRO BIT (1) 2.pdfbbbnn
Estrategia de apoyo tecnología grado 9-3
historia_web de la creacion de un navegador_presentacion.pptx
programa-de-estudios-2011-guc3ada-para-el-maestro-secundarias-tecnicas-tecnol...
Sesion 1 de microsoft power point - Clase 1
sa-cs-82-powerpoint-hardware-y-software_ver_4.pptx
El-Gobierno-Electrónico-En-El-Estado-Bolivia

Manual multimedia y web 2.0

  • 2. Índice Temático 2 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Multimedia y Web 2.0 Presentación ......................................................................... 11 Módulo 1. Blogs ..................................................................... 13 1. ¿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 .......................................................................... 18 2. 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........................................................................... 25 3. 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 ............................................... 47 4. 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
  • 3. Índice Temático 3 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. 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 ................................................................... 95 6. 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 .................................... 136 7. 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 ................................................... 149 8. 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 .................................................................. 159 9. 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
  • 4. Índice Temático 4 Multimedia 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 ....................................................................... 168 10. 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 ......................................................... 181 11. 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 ........................................... 219 12. 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 ..................................... 228 Módulo 2. Imagen.................................................................. 233 1. 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
  • 5. Índice Temático 5 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. 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 ...................................................................... 246 3. Optimización de imágenes ........................................................................ 249 3.1 Conversión de formatos .................................................................. 250 3.2 Reducir la paleta de colores ............................................................. 257 4. 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 ................................................................... 268 5. Montaje de imágenes .............................................................................. 270 6. Efectos especiales ................................................................................. 275 6.1 Filtros ....................................................................................... 276 6.2 Textos con efectos especiales .......................................................... 278 7. 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 .......................................................... 286 8. 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 .................................... 303 9. 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 ................................... 322 10. 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
  • 6. Índice Temático 6 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. 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 ................................................. 340 12. 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 .............................................. 348 Módulo 3. Audio ................................................................... 350 1. 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 ..................................................... 354 2. 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 ................................................................. 358 3. 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 ....................................................... 368 4. 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 ........................................................... 377 5. 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 .................................................................. 387 6. 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 ................................................................... 396 7. Aplicar efectos ..................................................................................... 399 8. Extracción de audio de un CD ................................................................... 406 8.1 CDex en Windows .......................................................................... 407
  • 7. Índice Temático 7 Multimedia 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 ........................... 410 9. 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 ............................................. 432 10. 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 .................. 443 Módulo 4. Vídeo ................................................................... 446 1. 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 ........................................................ 452 2. 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 ................................................ 456 3. 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..................................................... 463 4. 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
  • 8. Índice Temático 8 Multimedia 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 ...................................................... 478 5. 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 .......................................... 503 6. 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........................................................ 514 7. 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 ............................................. 527 8. 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
  • 9. Índice Temático 9 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. 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 ............ 573 10. 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 ........................................................ 578 Anexos A1. Canales de suscripción .......................................................................... 580 1.1 ¿Qué es un canal de suscripción? ........................................................ 581 1.2 Suscripción con el navegador Firefox 3+ ............................................... 581 1.3 Suscripción con el navegador IExplorer 7+ ........................................... 584 1.4 Enlaces de suscripción a tu blog Blogger .............................................. 587 1.5 Enlaces de suscripción a tu blog Wordpress ........................................... 588 1.6 Añadir un feed externo a tu blog ....................................................... 589 1.6.1 Buscar un canal de feeds ...................................................... 589 1.6.2 Añadir un canal feed externo a Blogger ..................................... 589 1.6.3 Añadir un canal feed externo a Wordpress ................................. 591 A2. 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
  • 10. Índice Temático 10 Multimedia 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 .............................................. 612 Glosario de términos ........................................................................... 614 Bibliografía sobre Web 2.0 ................................................................... 634 Direcciones web ................................................................................. 638
  • 11. Presentación 11 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Presentación En los últimos años hemos asistido a un considerable auge de los espacios web en el entorno educativo. Hasta tal punto que hay quienes manifiestan que un centro educativo o persona no existe si no es visible en Internet. Los sitios web no sólo se corresponden con entidades dpúblicas o privadas sino también con páginas personales de carácter profesional y otras centradas en el ocio y tiempo libre. Por otra parte la producción de recursos multimedia se ha ido orientando cada vez más hacia la web en detrimento del soporte CD-ROM o DVD por razones obvias: coste, inmediatez, facilidad de actualización, difusión, etc. En la publicación de contenidos en Internet la opción más clásica ha sido la edición de páginas web en el equipo local utilizando un editor visual HTML para luego publicarlas vía FTP en un servidor. Sin embargo esta práctica está cayendo en desuso a favor del empleo de un sistema de gestión de contenidos (CMS=Content Management System) que permite fácilmente la edición en línea. Estas soluciones se imponen porque descentralizan la gestión y facilitan el trabajo colaborativo. Los CMS de uso más extendido son: Joomla/Drupal (sitio web institucional 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 resultar interesante y útil. Su propósito es la formación en los procedimientos básicos para la creación de contenidos multimedia adaptados a la web. Se trata de preparar y optimizar recursos de tipo texto, imagen, audio o vídeo con una adecuada relación peso/calidad, algo importante en Internet, y que pueden publicarse en una página HTML, un gestor de contenidos CMS, una red social o bien servir de base para construir objetos o contenidos más complejos utilizando herramientas de edición general (powerpoint, impress, flash, etc) o herramientas de autor para 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 creativo completo. En primer lugar se plantea la obtención de los recursos multimedia originales (léase fotos o vídeos de la cámara digital, pistas de audio de un CD o grabación de una locución, etc). A continuación se propone el tratamiento para darles un formato más adecuado. Estos materiales se pueden publicar en un servicio Web 2.0 para finalmente integrarlos en una entrada o gadget del blog. No es propósito del curso alcanzar un dominio muy elevado de todos y cada uno de los programas que se proponen. Sería necesario un curso específico para cada uno. En su defecto, siguiendo un enfoque práctico, se plantea una necesidad y a continuación se proporcionarán unos recursos de partida, una o varias aplicaciones de software y una secuencia detallada de pasos para obtener el contenido multimedia final. Por otra parte se ha pretendido que cada apartado sea independiente del resto para conseguir cierta modularidad. El curso se organiza en 4 módulos:  Blogs  Imagen  Audio  Video En el módulo Blogs se propone Blogger o Wordpress como servicio en el cual crear y gestionar un blog orientado a la publicación de contenidos en Internet. Se detallan los procedimientos 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 o funcionalidades adicionales en la idea de dotarlo de cierta singularidad. La publicación de archivos 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 colaborativa de documentos de texto, presentaciones, hojas de cálculo y formularios que también se pueden publicar en un blog. Por su facilidad y prestaciones adicionales, el blog es el
  • 12. Presentación 12 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado protagonista principal de este curso. Por este motivo toda la producción se orienta a la publicación final en este medio. En el apartado de Imagen se utilizará el programa GIMP. Se plantean operaciones básicas como convertir formatos de archivos, reducir la paleta de colores, modificar las dimensiones de la imagen o del lienzo, etc. También se explican procedimientos habituales tales como componer imágenes, aplicar filtros y el tratamiento de imágenes por lotes. Se proponen distintos servicios Web 2.0 como Flickr, Picasa, Slide.com, SlideShare.net, etc donde es posible subir fotografías y presentaciones susceptibles de publicación posterior en nuestro blog. En lo relativo al Audio se sugiere el empleo de Audacity para reproducir, grabar desde distintos medios y convertir a formato mp3 y ogg. Otra posibilidad es extraer el audio de una pista de CD. La edición de audio permite copiar, pegar, mezclar, aplicar efectos, etc para conseguir un audio más elaborado. Una vez que se dispone de una o varias pistas de audio se utilizarán distintas soluciones para integrar su audición en una entrada del blog. Otra opción es subir el audio a servicios Web 2.0 como GoEar o DivShare e incrustar posteriormente el reproductor que proporcionan. En el módulo sobre Vídeo se plantean los principales conceptos relacionados con el vídeo digital para luego proponer la visualización de vídeos con el reproductor universal: VLC Media Player. Se proporciona información de cómo utilizar extensiones de Mozilla Firefox (Video DownloadHelper) para descargar al disco duro del equipo archivos de vídeo desde Internet. También el procedimiento para conocer los detalles técnicos de un archivo multimedia con Media Info y convertir a otros formatos con WinFF. Otra opción es extraer el vídeo de un DVD con soluciones como AutoGordian. Se ejemplifica cómo mostrar vídeos dentro del artículo de un blog. Los repositorios de vídeos Web 2.0 como Youtube, Revver, Metacafé, Vimeo, etc ofrecen una excelente alternativa para el alojamiento y difusión en streaming de vídeos que posteriormente se pueden integrar en Blogger. Todas las aplicaciones de software que se proponen son de uso gratuito y de libre distribución. En muchos casos se ofrecen versiones portables de los programas para facilitar su uso en una memoria USB sin necesidad de instalación previa en el ordenador. El curso se puede seguir con un equipo Windows XP/Vista/7 o bien Ubuntu Linux 10. El alumno/a de este curso con interés en el diseño de materiales digitales multimedia puede encontrar aquí recetas útiles para resolver las necesidades más básicas relacionadas con la elaboración y adaptación al medio web de recursos de texto, imagen, audio y vídeo.
  • 14. Blogs ::: ¿Qué es la Web 2.0? 14 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. ¿Qué es la Web 2.0?
  • 15. Blogs ::: ¿Qué es la Web 2.0? 15 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.1 Concepto de Web 2.0 El término Web 2.0 fue acuñado por el americano Dale Dougherty de la editorial O'Reilly Media durante el desarrollo de una conferencia en el año 2004. El término surgió para referirse a nuevos sitios web que se diferenciaban de los sitios web más tradicionales englobados bajo la denominación Web 1.0. La característica diferencial es la participación colaborativa de los usuarios. Un ejemplo de sitio web 1.0 sería la Enciclopedia Británica donde los usuarios pueden consultar en línea los contenidos elaborados por un equipo de expertos. Como alternativa web 2.0 se encuentra la Wikipedia en la cual los usuarios que lo deseen pueden participar en la construcción de sus artículos. Poco tiempo después, en el año 2005, Tim O'Reilly definió y ejemplificó el concepto de Web 2.0 utilizando el mapa conceptual elaborado por Markus Angermeier. La Web 2.0 o Web social es una “denominación de origen” que se refiere a una segunda generación en la historia de los sitios web. Su denominador común es que están basados en el modelo de una comunidad de usuarios. Abarca una amplia variedad de redes sociales, blogs, wikis y servicios multimedia interconectados cuyo propósito es el intercambio ágil de información entre los usuarios y la colaboración en la producción de contenidos. Todos estos sitios utilizan la inteligencia colectiva para proporcionar servicios interactivos en la red donde el usuario tiene control para publicar sus datos y compartirlos con los demás. Se puede entender como 2.0 "todas aquellas utilidades y servicios de Internet que se sustentan en una base de datos, la cual puede ser modificada por los usuarios del servicio, ya sea en su contenido (añadiendo, cambiando o borrando información o asociando datos a la información existente), pues bien en la forma de presentarlos, o en contenido y forma simultáneamente."- (Ribes, 2007)
  • 16. Blogs ::: ¿Qué es la Web 2.0? 16 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.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.
  • 17. Blogs ::: ¿Qué es la Web 2.0? 17 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.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
  • 18. Blogs ::: ¿Qué es la Web 2.0? 18 Multimedia 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 web Como se ha indicado con anterioridad para acceder a la web 2.0 sólo necesitamos disponer de una conexión a Internet y de un navegador 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 Firefox porque 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.
  • 19. Blogs ::: ¿Qué es la Web 2.0? 19 Multimedia 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 o que se adapta a tu sistema: http://www.mozilla-europe.org/es/firefox/. Descarga e instala este programa en tu equipo. Otra posibilidad es utilizar la versión portable para Windows que puedes conseguir en: http://portableapps.com/apps/internet/firefox_portable
  • 20. Blogs ::: Iniciación a los blogs 20 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Iniciación a los blogs
  • 21. Blogs ::: Iniciación a los blogs 21 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.1 ¿Qué es un blog? Un blog es un sitio web que se actualiza periódicamente y que ofrece la lectura de información de uno o varios autores sobre temas de interés. La unidad fundamental de información de un blog es el artículo, también llamado “post” o “entrada”. Estos artículos se muestran siguiendo una ordenación cronológica inversa, es decir, se mostrará primero el artículo más reciente. En consecuencia podemos definir un blog como una recopilación de artículos ordenados cronológicamente. Para el autor/autores de un blog, se trata de un sistema que facilita la publicación de contenidos multimedia en Internet ofreciendo en todo momento el control y libertad para editar y modificar la información publicada. En cada artículo los lectores pueden escribir sus comentarios y el autor darles respuesta. De esta forma se fomenta un diálogo que autores y lectores pueden compartir. Sin embargo esta opción depende de la moderación del autor o autores del blog y por supuesto de que los lectores decidan intervenir libremente con sus aportaciones. 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/
  • 22. Blogs ::: Iniciación a los blogs 22 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.2 Anatomía de un blog Un 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 Backend La 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.
  • 23. Blogs ::: Iniciación a los blogs 23 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En 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 comentarios asociados que se sitúan al final de su contenido. El administrador del blog puede permitir o denegar el envío de comentarios a un artículo en concreto o a todos los artículos del blog. En caso favorable es muy recomendable activar la moderación de comentarios para que el administrador los supervise antes de que aparezcan publicados. Cada artículo de un blog dispone de una dirección individual y única (permalink o enlace permanente) que se puede utilizar para situarse en él directamente.
  • 24. Blogs ::: Iniciación a los blogs 24 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.3 Características de los blogs Las 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 blogs Los blogs tienen distintas variantes en función de su funcionamiento, tipo de contenido predominante, 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).
  • 25. Blogs ::: Iniciación a los blogs 25 Multimedia 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 blogs En 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 sobre cuál elegir entre los dos líderes del sector: Blogger o Wordpress. Ambos tienen ventajas e inconvenientes resultando Wordpress una opción algo más compleja. Existen también medios de comunicación, como por ejemplo el diario “El País”, que ofrecen un servicio gratuito de Blogs: http://blogs.elpais.com/ Nota importante: A partir de este momento el alumno/a del curso podrá elegir entre seguir el curso con un blog de Blogger o bien con un blog de Wordpress
  • 26. Blogs ::: Mi primer artículo 26 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Mi primer artículo
  • 27. Blogs ::: Mi primer artículo 27 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.1 Mi primer artículo en Blogger
  • 28. Blogs ::: Mi primer artículo 28 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado El propósito de este actividad es diseñar tu primera entrada en un blog de Blogger. El tema elegido es una breve pincelada del poeta Federico García Lorca. En este documento se utilizarán: título, texto, imagen y un enlace a una página externa. 3.1.1 Crear un blog en Blogger En este apartado se explican los pasos para crear un blog en el servicio Blogger. Como paso previo es necesario disponer de una cuenta Google. Es muy interesante tener esta cuenta porque asociada a ella se disponen de interesantes aplicaciones. Algunas de ellos se tratarán en este curso. 1. Abre el navegador web y visita la URL de inicio de Blogger: https://www.blogger.com/start?hl=es Si 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.
  • 29. Blogs ::: Mi primer artículo 29 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Si 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 contra Blogger nos encontraremos en el paso 2 de creación de nuestro blog.
  • 30. Blogs ::: Mi primer artículo 30 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. En el paso 2 “Asignar un nombre al blog” introduce los siguientes datos del nuevo blog:  Título del blog. Ejemplo: El blog de …  Dirección del blog (URL). Será la dirección que tendrá nuestro blog en Blogger. Esta URL es del tipo: http://<miblog>.blogspot.com Conviene elegir una dirección fácil de recordar. Antes de continuar conviene pulsar en el enlace Comprobar disponibilidad para verificar si esa dirección está libre. Si no se te ocurre una dirección puedes utilizar tu nombre de usuario en Google: http://<TuUsuarioGoogle>.blogspot.com 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.
  • 31. Blogs ::: Mi primer artículo 31 Multimedia 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.
  • 32. Blogs ::: Mi primer artículo 32 Multimedia 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.
  • 33. Blogs ::: Mi primer artículo 33 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón GUARDAR AHORA que aparece por debajo del editor de artículos. Esta acción almacenará los cambios introducidos en el servidor remoto. 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.
  • 34. Blogs ::: Mi primer artículo 34 Multimedia 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ínculo Un enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web y que 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 nueva pá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
  • 35. Blogs ::: Mi primer artículo 35 Multimedia 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 entrada En 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.
  • 36. Blogs ::: Mi primer artículo 36 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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 entrada Al pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y al final aparecerán los comentarios asociados. Si en ese momento te fijas en la barra de dirección del navegador web, podrás comprobar que ese artículo dispone de una URL que permite acceder al mismo de forma individual. Su formato suele ser: http://<tituloblog>.blogspot.com/<añopub>/<mespub>/<titulo-entrada>.html
  • 37. Blogs ::: Mi primer artículo en Wordpress 37 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.2 Mi primer artículo en Wordpress
  • 38. Blogs ::: Mi primer artículo en Wordpress 38 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado El propósito de este actividad es diseñar tu primera entrada en un blog de Wordpress. El tema elegido es una breve pincelada del poeta Federico García Lorca. En este documento se utilizarán: título, texto, imagen y un enlace a una página externa. 3.2.1 Crear un blog en Wordpress En este apartado se explican los pasos para crear un blog en el servicio Wordpress. Como paso previo 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.
  • 39. Blogs ::: Mi primer artículo en Wordpress 39 Multimedia 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)
  • 40. Blogs ::: Mi primer artículo en Wordpress 40 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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.
  • 41. Blogs ::: Mi primer artículo en Wordpress 41 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Regresa al navegador web que muestra el editor de Agregar una nueva entrada de Wordpress. Teclea el título: Federico García Lorca. 5. Haz clic dentro del editor de artículos y a continuación haz clic derecho para elegir la opción Pegar. Esta acción pegará el texto copiado del archivo de texto anterior evitando tener que teclearlo. 6. Antes de continuar conviene guardar la entrada. Para ello pulsa en el botón Guardar borrador. Esta acción almacenará los cambios introducidos en el servidor remoto.
  • 42. Blogs ::: Mi primer artículo en Wordpress 42 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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.
  • 43. Blogs ::: Mi primer artículo en Wordpress 43 Multimedia 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.
  • 44. Blogs ::: Mi primer artículo en Wordpress 44 Multimedia 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ínculo Un enlace o hipervínculo puede ser un texto o imagen que se muestra en una página web y que 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 nueva pá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
  • 45. Blogs ::: Mi primer artículo en Wordpress 45 Multimedia 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 entrada En la página donde se edita una entrada se pueden configurar distintas opciones de este artí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.
  • 46. Blogs ::: Mi primer artículo en Wordpress 46 Multimedia 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.
  • 47. Blogs ::: Mi primer artículo en Wordpress 47 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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 entrada Al pulsar sobre el título de un artículo, éste se mostrará de forma individual en la página y al final aparecerán los comentarios asociados. Si en ese momento te fijas en la barra de dirección del navegador web, podrás comprobar que ese artículo dispone de una URL que permite 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.
  • 48. Blogs ::: Mi primer artículo en Wordpress 48 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Cuando se está editando una entrada, en la parte superior del editor, se muestra este enlace permanente. Si pulsas en el botón Editar puedes cambiar la última parte de esta dirección. Otra posibilidad es pulsar en el botón conseguir URL corta que proporciona una dirección más corta de acceso directo a este artículo.
  • 49. Blogs ::: Gestión de artículos en Blogger 49 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Gestión de artículos
  • 50. Blogs ::: Gestión de artículos en Blogger 50 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1 Gestión de artículos en Blogger
  • 51. Blogs ::: Gestión de artículos en Blogger 51 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.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.
  • 52. Blogs ::: Gestión de artículos en Blogger 52 Multimedia 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ón En 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ículo Para 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.
  • 53. Blogs ::: Gestión de artículos en Blogger 53 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Si el artículo contiene alguna imagen también se solicita confirmación para eliminarla o bien conservarla. Recuerda que las imágenes subidas se guardan en la cuenta de Picasa asociada al usuario Google con que se ha creado el blog. 4.4 Publicar y despublicar Una vez que se ha publicado una entrada se puede volver a despublicar para que no sea visible por los lectores del blog. El procedimiento para volver a convertir en borrador una entrada 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.
  • 54. Blogs ::: Gestión de artículos en Blogger 54 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.5 Asignar etiquetas Las etiquetas son palabras clave que permiten organizar y clasificar los artículos por temas o autores. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectores pueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiqueta correspondiente. Otra posibilidad es asignar su propia etiqueta a cada autor del blog para poder 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.
  • 55. Blogs ::: Gestión de artículos en Blogger 55 Multimedia 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ónico En 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 embargo se 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.
  • 56. Blogs ::: Gestión de artículos en Blogger 56 Multimedia 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.
  • 57. Blogs ::: Gestión de artículos en Blogger 57 Multimedia 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.
  • 58. Blogs ::: Gestión de artículos en Blogger 58 Multimedia 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.
  • 59. Blogs ::: Gestión de artículos en Blogger 59 Multimedia 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.
  • 60. Blogs ::: Gestión de artículos en Blogger 60 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.7 Exportar e importar entradas Los artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crear copias 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. La exportación/importación de artículos produce como resultado un archivo XML que contiene información de las entradas y los comentarios. No incluye los 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 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.
  • 61. Blogs ::: Gestión de artículos en Blogger 61 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML guardado en el equipo. Importación 1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados, haz clic en la pestaña 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.
  • 62. Blogs ::: Gestión de artículos en Blogger 62 Multimedia 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.
  • 63. Blogs ::: Gestión de artículos en Wordpress 63 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Gestión de artículos en Wordpress
  • 64. Blogs ::: Gestión de artículos en Wordpress 64 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.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.
  • 65. Blogs ::: Gestión de artículos en Wordpress 65 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Si has seguido los dos primeros métodos accederás al listado de artículos del blog. Haz clic en el enlace Editar de la entrada correspondiente para acceder a su edición. También puedes hacer un simple clic sobre el enlace situado en el titulo de la Entrada. 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ón En 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.
  • 66. Blogs ::: Gestión de artículos en Wordpress 66 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2.3 Eliminar un artículo Para eliminar un artículo desde el panel del listado de entradas existen varios procedimientos alternativos: 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.
  • 67. Blogs ::: Gestión de artículos en Wordpress 67 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2.4 Publicar y despublicar Una vez que se ha publicado una entrada se puede volver a despublicar para que no sea visible por los lectores del blog. El procedimiento para volver a convertir en borrador una entrada 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 etiquetas Las etiquetas son palabras clave que permiten organizar y clasificar los artículos por palabras clave. Cuando se crea un artículo se le pueden asignar una o varias etiquetas. Los lectores pueden consultar todas las entradas correspondientes a un tema haciendo clic en la etiqueta correspondiente. 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.
  • 68. Blogs ::: Gestión de artículos en Wordpress 68 Multimedia 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.
  • 69. Blogs ::: Gestión de artículos en Wordpress 69 Multimedia 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 correo electrónico En 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 embargo se 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.
  • 70. Blogs ::: Gestión de artículos en Wordpress 70 Multimedia 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 se propone utilizar el webmail de GMail (http://www.gmail.com) y esto supone que debes tener cuenta en GMail. No obstante se puede hacer desde cualquier cuenta de correo electrónico tanto utilizando webmail como un programa cliente de correo como Outlook o similar. 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.
  • 71. Blogs ::: Gestión de artículos en Wordpress 71 Multimedia 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.
  • 72. Blogs ::: Gestión de artículos en Wordpress 72 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 13. Para insertar una imagen en el artículo final es necesario enviarla como adjunto del mensaje de correo electrónico. Clic en el enlace Adjuntar un archivo para localizar y abrir el archivo de imagen lorca.jpg. 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.
  • 73. Blogs ::: Gestión de artículos en Wordpress 73 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Algunas 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 y separada del texto. Si se envían varias imágenes adjuntas, éstas se mostrarán como una galería. Si envías como adjunto un archivo de audio MP3, éste se mostrará usando el reproductor de audio de Wordpress. Si envías otros archivos de documentos como PDF, DOC, etc entonces se mostrarán como enlaces en el artículo. Códigos especiales de publicación. Se pueden incluir en el mensaje de correo electrónico códigos especiales que configuran distintos aspectos del artículo publicado. Se pueden escribir 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 entradas Los artículos de un blog se pueden exportar a otro blog. Esto es especialmente útil para crear copias 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. La exportación/importación de artículos produce como resultado un archivo XML que contiene información de las entradas, comentarios, categorías, etiquetas, etc. Este fichero NO incluye los 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.
  • 74. Blogs ::: Gestión de artículos en Wordpress 74 Multimedia 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.
  • 75. Blogs ::: Gestión de artículos en Wordpress 75 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Clic en el botón Guardar. Al cabo de unos instantes dispondremos de este archivo XML guardado en el equipo. Importación 1. Desde el interfaz de gestión del blog donde deseas importar los artículos guardados, haz clic en la pestaña Herramientas > Importar. 2. Desde la página Importar haz clic en el sistema desde el que importarás. Es posible importar las entradas a partir de un XML de Blogger o de Wordpress. En este caso haz clic en Wordpress. 3. Desde la página Importar desde Wordpress haz clic en el botón Examinar para localizar el archivo wordpress.aaaa-mm-dd.xml que hemos guardado en nuestro equipo como resultado de un proceso de exportación anterior.
  • 76. Blogs ::: Gestión de artículos en Wordpress 76 Multimedia 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.
  • 77. Blogs ::: El editor de entradas en Blogger 77 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. El editor de entradas
  • 78. Blogs ::: El editor de entradas en Blogger 78 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.1 El editor de entradas en Blogger
  • 79. Blogs ::: El editor de entradas en Blogger 79 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.1.1 Formato de texto Blogger ofrece un editor visual que proporciona ciertas prestaciones para la edición en lí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 texto con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma durante la edición en línea siempre se dispondrá de una copia de seguridad en local. 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.
  • 80. Blogs ::: El editor de entradas en Blogger 80 Multimedia 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.
  • 81. Blogs ::: El editor de entradas en Blogger 81 Multimedia 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.
  • 82. Blogs ::: El editor de entradas en Blogger 82 Multimedia 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.
  • 83. Blogs ::: El editor de entradas en Blogger 83 Multimedia 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.
  • 84. Blogs ::: El editor de entradas en Blogger 84 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 25. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la primera referencia: Es un enlace a Google que ya incluye el término de búsqueda: http://es.wikipedia.org/wiki/Einstein 26. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha copiado al portapapeles de Windows y se ha eliminado de la ubicación actual. 27. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento. A continuación en la barra del editor pulsa en el botón Enlace. 28. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar. 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.
  • 85. Blogs ::: El editor de entradas en Blogger 85 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.1.2 Corrector ortográfico El 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 HTML El editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita la inclusió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.
  • 86. Blogs ::: El editor de entradas en Blogger 86 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 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.
  • 87. Blogs ::: El editor de entradas en Wordpress 87 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.2 El editor de entradas en Wordpress
  • 88. Blogs ::: El editor de entradas en Wordpress 88 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.2.1 Formato de texto Wordpress ofrece un editor visual que proporciona ciertas prestaciones para la edición en lí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 texto con un procesador de textos local: Word, Writer, Bloc de Notas, etc. Una vez finalizado el artículo se puede publicar en el blog copiando y pegando sobre su editor. De esta forma durante la edición en línea siempre se dispondrá de una copia de seguridad en local. 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.
  • 89. Blogs ::: El editor de entradas en Wordpress 89 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Teclea el título de la entrada: Albert Einstein. Haz clic dentro del editor de artículos y a continuación haz clic derecho para elegir la opción Pegar. Esta acción pegará el texto copiado del archivo de texto anterior evitando tener que teclearlo. Notas:  Como ocurre en la mayoría de editores visuales en línea es recomendable copiar y pegar a partir de texto plano creado con el Bloc de Notas. Otra posibilidad, para diseños más elaborados, es editar previamente la página con un editor visual HTML como Kompozer (http://kompozer.net/). Lo que NO se recomienda es pegar a partir de un documento Word porque se introduce código oculto innecesario y en ocasiones produce que no se vea adecuadamente. En este caso es preferible utilizar el Bloc de Notas como paso intermedio para pegar el contenido Word y luego volver a seleccionar y copiar para pegarlo sobre el editor final.  El texto pegado es un guión del artículo a realizar. Incluye anotaciones entre corchetes que referencian la posición de la imagen y el formato de los distintos fragmentos del texto. Es necesario borrar estas anotaciones entre corchetes y aplicar los cambios apuntados.
  • 90. Blogs ::: El editor de entradas en Wordpress 90 Multimedia 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.
  • 91. Blogs ::: El editor de entradas en Wordpress 91 Multimedia 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.
  • 92. Blogs ::: El editor de entradas en Wordpress 92 Multimedia 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.
  • 93. Blogs ::: El editor de entradas en Wordpress 93 Multimedia 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.
  • 94. Blogs ::: El editor de entradas en Wordpress 94 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 20. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece en la primera referencia: Es un enlace a Google que ya incluye el término de búsqueda: http://es.wikipedia.org/wiki/Einstein 21. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha copiado al portapapeles de Windows y se ha eliminado de la ubicación actual. 22. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento. A continuación en la barra del editor pulsa en el botón Enlace. 23. En el cuadro de diálogo Insertar/Editar enlace: haz clic derecho en la casilla URL del enlace y elige Pegar. En el Destino selecciona la opción Abrir el enlace en una nueva ventana. 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.
  • 95. Blogs ::: El editor de entradas en Wordpress 95 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.2.2 Corrector ortográfico El 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 HTML El editor del blog permite mostrar el código HTML del artículo y modificarlo. Esto facilita la inclusión de etiquetas especiales no contempladas en el entorno visual del editor. Para visualizar el artículo en modo HTML:
  • 96. Blogs ::: El editor de entradas en Wordpress 96 Multimedia 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.
  • 97. Blogs ::: Diseño del blog en Blogger 97 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Diseño del blog
  • 98. Blogs ::: Diseño del blog en Blogger 98 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.1 Diseño del blog en Blogger
  • 99. Blogs ::: Diseño del blog en Blogger 99 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Una de las ventajas de la gestión de un blog es la independencia entre el diseño y el contenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestro blog 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 apariencia visual 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.
  • 100. Blogs ::: Diseño del blog en Blogger 100 Multimedia 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 colores Una vez que hemos asignado una plantilla prediseñada a nuestro blog, Blogger ofrece la posibilidad 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.
  • 101. Blogs ::: Diseño del blog en Blogger 101 Multimedia 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ágina La 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.
  • 102. Blogs ::: Diseño del blog en Blogger 102 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Nota: Un blog de Blogger dispone por defecto de una barra de navegación superior. Como veremos más adelante se puede configurar la gama de colores de esta barra y también ocultarla. En este apartado se explican los procedimientos para configurar estos elementos estructurales 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 estructurales 6.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.
  • 103. Blogs ::: Diseño del blog en Blogger 103 Multimedia 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.
  • 104. Blogs ::: Diseño del blog en Blogger 104 Multimedia 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.
  • 105. Blogs ::: Diseño del blog en Blogger 105 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.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.
  • 106. Blogs ::: Diseño del blog en Blogger 106 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Ordenar elementos En esta sección se muestra el aspecto que tendrá cada entrada con los elementos seleccionados pero también permite arrastrar y reordenador los elementos situados después del cuerpo de la entrada. Guardar configuración Para guardar los cambios definidos en esta configuración haz clic en el botón GUARDAR. 6.1.7 Añadir gadgets a la barra lateral Una de las características más representativas de los blogs es disponer de una o dos columnas laterales donde se ordenan, de arriba hacia abajo, los distintos gadgets que proporcionan prestaciones adicionales al blog.
  • 107. Blogs ::: Diseño del blog en Blogger 107 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden mostrar datos adicionales en la misma página sin tener que abandonar esta página. 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.
  • 108. Blogs ::: Diseño del blog en Blogger 108 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 3. Para añadir un gadget a la barra lateral haz clic en su botón “+”. Por ejemplo: Cuadro de búsqueda (Nuevo). Si ya has añadido ese gadget en lugar de este botón aparecerá el texto: “Ya se ha añadido”. 4. Se muestra un panel donde puedes introducir el título del gadget y configurar sus parámetros. Estos dependerán del tipo de gadget. 5. Para terminar pulsa en el botón GUARDAR. El nuevo widget se habrá añadido a la barra lateral. 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.
  • 109. Blogs ::: Diseño del blog en Blogger 109 Multimedia 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 interesantes Se pueden añadir a tu blog los gadgets más habituales: Lista de enlaces Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a blogs). Al añadir o editar un gadget de lista de enlaces se abre una nueva ventana donde se puede configurar las propiedades de este listado:  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 cada uno de estos enlaces. Para terminar pulsa en el botón GUARDAR.
  • 110. Blogs ::: Diseño del blog en Blogger 110 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado En el blog esta gadget se mostrará en la barra lateral proporcionando los enlaces definidos. Archivo del blog Muestra los enlaces organizados cronológicamente que permite un acceso individual a los distintos artículos del blog. Al añadir o editar el gadget de Archivo del blog se pueden configurar sus distintos parámetros:  Título: es el título que encabezará ese gadget. Este parámetro es común al resto de gadget y permite personalizar el contenido del mismo.  Estilo. Se pueden elegir tres modelos: Jerarquía (por meses y años), Lista (por meses) y Menú desplegable (combo).  Opciones. Activar o desactivar opciones como Mostrar títulos de las entradas o Mostrar primero las entradas más antiguas.  Frecuencia de archivo. Permite definir el intervalo temporal en que se mostrarán organizados los enlaces a las entradas.  Formato de fecha y Vista previa.
  • 111. Blogs ::: Diseño del blog en Blogger 111 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Para terminar pulsa en el botón GUARDAR. En la barra lateral del blog se mostrarán unos enlaces clasificados de acuerdo con los criterios de configuración definidos. Etiquetas Muestra un listado de todas las etiquetas o categorías definidas en el blog. Cuando el lector hace clic en una etiqueta se mostrará una página con todos los artículos que contienen esas etiquetas. En la edición de la configuración de este gadget se puede definir el Título, Ordenación (por orden alfabético o por frecuencia) y si se muestra u oculta el número de entradas por etiqueta. Para terminar hacer clic en el botón GUARDAR.
  • 112. Blogs ::: Diseño del blog en Blogger 112 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado En la barra lateral se mostrará un gadget con las etiquetas o categorías. Enlaces de suscripción Ofrece a los lectores la posibilidad de suscribirse a los artículos y comentarios de tu blog utilizando los lectores de feed más conocidos. ç En la edición de la configuración de este gadget sólo es necesario definir el título con que se mostrará.
  • 113. Blogs ::: Diseño del blog en Blogger 113 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado El lector utilizará la opción Entradas > Atom para suscribirse a tu blog utilizando el navegador web por defecto o bien un programa específico para leer feed. Cuadro de búsqueda Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para buscar en las entradas o enlaces del blog. Al configurar este gadget se puede definir su Título y también sus pestañas para definir los ámbitos de búsqueda: en las entradas de tu blog, en las páginas enlazadas desde cualquier entrada de tu blog, en internet en general, en los gadgets que contengan enlaces, etc.
  • 114. Blogs ::: Diseño del blog en Blogger 114 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Al activar este tipo de gadget en la barra lateral se mostrará un cuadro de búsqueda que permitirá buscar en estos ámbitos utilizando el motor de Google. Es posible que algunas entradas añadidas recientemente no aparezcan todavía en los resultados de la búsqueda al no haber sido indexadas por el motor de búsquedas de Google. Otros gadgets
  • 115. Blogs ::: Diseño del blog en Blogger 115 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.1.9 Edición HTML de la plantilla El administrador de un blog puede personalizar su estilo gráfico utilizando las opciones descritas anteriormente en este documento sin disponer de apenas conocimientos de HTML o CSS. 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.
  • 116. Blogs ::: Diseño del blog en Blogger 116 Multimedia 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.
  • 117. Blogs ::: Diseño del blog en Blogger 117 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.1.10 Edición avanzada HTML de la plantilla En este apartado se explican dos ejemplos de cómo se puede utilizar la edición HTML de la plantilla para resolver dos requerimientos no contemplados inicialmente por Blogger. 6.1.10.1 Eliminar la barra de navegación de Blogger En algunas ocasiones puede resultar interesante eliminar la barra de navegación Blogger de nuestro 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.
  • 118. Blogs ::: Diseño del blog en Blogger 118 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6.1.10.2 Crear un “Leer más” en un artículo de Blogger En ocasiones resulta interesante crear una entrada que muestre un texto de introducción y oculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa en este enlace o bien en el título del artículo, entonces la entrada se muestra completa y de forma individual en la página. Este enlace “Leer más” no se contempla por defecto en Blogger pero se puede conseguir utilizando la siguiente receta. 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>
  • 119. Blogs ::: Diseño del blog en Blogger 119 Multimedia 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 PLANTILLA Paso 2: Crear una entrada Una vez que hemos modificado la plantilla ahora es necesario crear una entrada utilizando el siguiente código HTML: <span class="fullpost"> </span>. Fuera de la etiqueta span situaremos el texto del artículo que se verá siempre y dentro de las etiquetas span el texto que 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.
  • 120. Blogs ::: Diseño del blog en Blogger 120 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. En la barra de herramientas del editor haz clic en el botón Añadir Imagen para añadir la imagen mariecurie.jpg que se ha descargado en un paso anterior. Reduce el tamaño de visualización y ajusta la imagen a la izquierda del primer párrafo. 10. Selecciona la lista de elementos de su Biografía y de su Obra para pulsar a continuación el botón Lista de viñetas para asignarles este formato. 11. Dentro del editor de entradas pulsa y arrastra sobre el enlace que aparece. Es un enlace a Google que ya incluye el término de búsqueda: http://es.wikipedia.org/wiki/Marie_Curie 12. A continuación pulsa la combinación de teclas Ctrl+X para cortarla. Esta URL se ha copiado al portapapeles de Windows y se ha eliminado de la ubicación actual. 13. Pulsa y arrastra para seleccionar el texto “Wikipedia” situado al final del documento. 14. A continuación en la barra del editor pulsa en el botón Enlace. 15. En el cuadro de diálogo Escribe una URL: haz clic derecho y elige Pegar. 16. Clic en el botón Aceptar para guardar la dirección pegada. 17. Hasta aquí el artículo se ha editado como cualquier otro. A continuación vamos a situar dentro de la etiqueta span class="fullpost"> </span> el texto que se ocultará inicialmente. Clic en la pestaña Edición HTML. 18. En el código HTML del artículo añade la etiqueta <span class="fullpost"> antes de la línea Su biografía. Y luego el cierre de esta etiqueta al final del texto: </span>. 19. Clic en el botón PUBLICAR ENTRADA. Si accedes a la lectura del artículo verás que se muestra el primer párrafo y el enlace Leer más.
  • 121. Blogs ::: Diseño del blog en Blogger 121 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
  • 122. Blogs ::: Diseño del blog en Wordpress 122 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2 Diseño del blog en Wordpress
  • 123. Blogs ::: Diseño del blog en Wordpress 123 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Una de las ventajas de la gestión de un blog es la independencia entre el diseño y el contenido. Esto implica que podemos cambiar fácilmente la presentación gráfica de nuestro blog 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 un diseñ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.
  • 124. Blogs ::: Diseño del blog en Wordpress 124 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Localiza y haz clic, por ejemplo, en la imagen del tema Freshy o bien en el enlace Vista previa. Se mostrará una vista previa del blog con ese nuevo tema. 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 encabezado En función del tema elegido se podrán configurar unas opciones u otras. No todos los temas admiten personalización de todas las opciones. En el caso que nos ocupa vamos a configurar las distintas opciones del tema Kubrick (tema por defecto). Para ello busca y selecciona este tema antes de continuar. 1. Clic en Apariencia > Colores del encabezado. 2. Se muestra la página Colores del encabezado.
  • 125. Blogs ::: Diseño del blog en Wordpress 125 Multimedia 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.
  • 126. Blogs ::: Diseño del blog en Wordpress 126 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.3 Cabecera La estructura del Frontend de un blog suele tener los siguientes elementos:  Cabecera. Muestra el título del blog y en algunos casos una imagen de fondo. Cuando el lector hace clic en el enlace que proporciona se sitúa en la portada o página principal del blog.  Entradas del blog. Contiene los artículos o entradas publicadas. Aparecen ordenados cronológicamente situándose arriba el más reciente. En la página principal solo se pueden leer un número concreto de artículos. Para acceder a los anteriores se proporciona un sistema de paginación con un enlace a “Entradas anteriores”.  Barra lateral. Contiene los widgets o módulos que incorporan prestaciones adicionales al blog: búsqueda, artículos por meses, artículos por etiquetas, lista de enlaces, suscripción RSS, etc. 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.
  • 127. Blogs ::: Diseño del blog en Wordpress 127 Multimedia 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.
  • 128. Blogs ::: Diseño del blog en Wordpress 128 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.4 Añadir widgets a la barra lateral Una de las características más representativas de los blogs es disponer de una o dos columnas laterales donde se ordenan, de arriba hacia abajo, los distintos widgets que proporcionan prestaciones adicionales al blog. El término gadget o widget se utiliza para referirse a un pequeño recuadro que se integra en una página web a modo de mosaico y que se ejecuta como una mini-aplicación independiente diseñada para enriquecer la información o servicios de esa página. De esta forma se pueden mostrar datos adicionales en la misma página sin tener que abandonar esta página. El tema elegido para nuestro blog ya muestra por defecto una serie de widgets en la barra lateral. Sin embargo es posible personalizar los que se mostrarán y el orden en que aparecerán de arriba hacia abajo. Para añadir un widget: 1. Desde el interfaz de administración del blog haz clic en el enlace Apariencia > Widgets.
  • 129. Blogs ::: Diseño del blog en Wordpress 129 Multimedia 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.
  • 130. Blogs ::: Diseño del blog en Wordpress 130 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Para 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 Borrar Para cambiar el orden de los gadgets en la columna lateral: 1. Simplemente arrastra y suelta un gadget por encima o debajo del resto.
  • 131. Blogs ::: Diseño del blog en Wordpress 131 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.5 Algunos widgets interesantes Se pueden añadir a tu blog los widgets más habituales: Enlaces Añade a la barra lateral una colección de enlaces favoritos a sitios web, páginas o blogs. Es la forma de implementar el clásico elemento blogroll de un blog (recopilación de enlaces a blogs). Al añadir o editar un widget de Enlaces se pueden configurar las propiedades de este listado:  Categoría de enlaces. Despliega esta lista para seleccionar Todos los enlaces o bien sólo los enlaces pertenecientes a una categoría.  Ordenar por: permite definir el tipo de ordenación que se utilizará para mostrar el listado de enlaces: Link title (título del enlace), Link rating (valoración del enlace), Link ID (Identificador del enlace) y Aleatorio.  Mostrar la imagen, nombre, descripción y clasificación del enlace. Si se activa alguna de estas opciones se mostrará ese parámetro del enlace.  Links to show (Enlaces a mostrar). Permite especificar el número máximo de enlaces que se mostrará en el listado. Si se deja en blanco se mostrarán todos los enlaces. Para terminar pulsa en el botón Guardar. En el blog este widget se mostrará en la barra lateral proporcionando los enlaces definidos.
  • 132. Blogs ::: Diseño del blog en Wordpress 132 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Archivos Muestra 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 unos enlaces clasificados de acuerdo con los criterios de configuración definidos. Nube de etiquetas Muestra un listado de todas las etiquetas definidas en el blog. Cuando el lector hace clic en una etiqueta se mostrará una página con todos los artículos que contienen esas etiquetas. En la edición de la configuración de este widget se puede definir el Título. Para terminar hacer clic en el botón Guardar. En la barra lateral se mostrará un widget con las etiquetas.
  • 133. Blogs ::: Diseño del blog en Wordpress 133 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Enlaces de suscripción Ofrece a los lectores la posibilidad de suscribirse a las entradas/artículos y comentarios de tu blog utilizando los lectores de feed más conocidos. En la edición de este widget es posible configurar:  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 enlace Cerrar. El lector utilizará estos enlaces para suscribirse a tu blog utilizando el navegador web por defecto o bien un programa específico para leer feed. Buscar Ofrece al usuario un cuadro donde puede introducir uno o varios términos de búsqueda para buscar en las entradas del blog.
  • 134. Blogs ::: Diseño del blog en Wordpress 134 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Al configurar este widget se puede definir su Título. Clic en el botón Guardar. Al activar este tipo de widget en la barra lateral se mostrará un cuadro de búsqueda que permitirá buscar en las entradas del blog. Otros widgets Texto. Es un cuadro con texto plano o código HTML que permite añadir un servicio externo. 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, al interfaz de backend para la gestión de contenidos, a la web de Wordpress.com, etc. Este gadget 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 o artículos independientes que no se someten a la cronología de las entradas o posts. Se utilizan para situar información más o menos permanente en tu sitio web.
  • 135. Blogs ::: Diseño del blog en Wordpress 135 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado RSS. Permite insertar un cuadro en la barra lateral con las noticias de un feed RSS o Atom externo o de terceros. 6.2.6 Edición CSS del tema El administrador de un blog puede personalizar su estilo gráfico utilizando las opciones descritas anteriormente en este documento sin disponer de apenas conocimientos de HTML o CSS. 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.com Nota importante: La posibilidad de personalizar el CSS del tema siguiendo el procediiento descrito es un servicio de pago en Wordpress.com
  • 136. Blogs ::: Diseño del blog en Wordpress 136 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.7 Marca “Leer más” en un artículo de Wordpress En ocasiones resulta interesante crear una entrada que muestre un texto de introducción y oculte el resto de su contenido detrás de un enlace “Leer más”. Cuando el usuario pulsa en este enlace o bien en el título del artículo, entonces la entrada se muestra completa y de forma individual en la página. 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.
  • 137. Blogs ::: Diseño del blog en Wordpress 137 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 14. Clic en el botón Publicar. Si accedes a la lectura del artículo verás que se muestra el primer párrafo y el enlace Leer el resto de esta entrada.
  • 138. Blogs ::: Moderación de comentarios en Blogger 138 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7. Moderación de comentarios
  • 139. Blogs ::: Moderación de comentarios en Blogger 139 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7.1 Moderación de comentarios en Blogger
  • 140. Blogs ::: Moderación de comentarios en Blogger 140 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7.1.1 Configuración de comentarios El administrador o autor de un blog debe tener previsto desde un principio cómo desea gestionar 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 se mostrará formulario para su envío. Si se selecciona ocultar NO se suprimen los comentarios existentes ya que podrán volver a visualizarse en cualquier momento si se elige de nuevo mostrar. Se pueden mostrar los comentarios con carácter general y luego no permitir comentarios a un artículo en concreto. Persona que puede realizar los comentarios. En este caso se proporcionan 4 opciones:  Cualquiera. Si se elige esta opción cualquier usuario anónimo podrá enviar comentarios.  Usuarios registrados. Sólo podrán enviar comentarios los usuarios registrados con cuenta Google o bien con identidad OpenID. Es necesario introducir estas credenciales para completar el envío.  Usuarios con cuentas Google. Sólo podrán enviar comentarios los usuarios que dispongan de cuenta Google.  Sólo los miembros de este blog. Para enviar un comentario es necesario estar registrado como usuario en el blog. 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 el seguimiento de otros blogs que han enlazado a este artículo.
  • 141. Blogs ::: Moderación de comentarios en Blogger 141 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Opció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 que acompañ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 Escritorio se mostrará un icono de aviso de que existen comentarios por revisar. Se envía una notificación a la dirección de correo electrónico que se especifique cuando un lector no registrado en el blog envíe un comentario. Si esta casilla está vacía no se enviará notificación. Mostrar palabra de verificación en comentarios. Se puede mostrar u ocultar la introducción de una palabra de verificación antispam. Conviene activar esta opción si configuramos la posibilidad de que un lector anónimo pueda enviar comentarios. Los autores del blog no tendrá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 el perfil de los usuarios en los comentarios publicados. Correo electrónico de notificación de comentarios. En este listado se pueden escribir hasta 10 direcciones de correo electrónico separadas por comas. Los destinatarios recibirán notificación por correo electrónico cada vez que alguien envíe un comentario en el blog.
  • 142. Blogs ::: Moderación de comentarios en Blogger 142 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 7.1.2 Envío de comentarios En función de la configuración definida para el envío de comentarios, el formulario se mostrará en la misma página a continuación de los comentarios publicados o se ofrece un enlace 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 comentarios entonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opción Nunca entonces el comentario se publicará directamente. 7.1.3 Moderación de comentarios Si el administrador del blog ha elegido la opción Siempre para la moderación de comentarios entonces el comentario sólo se publicará después de que lo supervise. Si ha elegido la opción Nunca entonces el comentario se publicará directamente. Esta configuración se realiza en la pá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.
  • 143. Blogs ::: Moderación de comentarios en Blogger 143 Multimedia 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 comentario Para eliminar un comentario publicado: 1. Desde el interfaz de gestión del blog elige Creación de entradas > Editar entradas. 2. En la columna Comentarios del listado de artículos se muestra un enlace a los comentarios publicados de cada artículo. Clic en este enlace. Esta acción te enviará al frontend del blog mostrando los comentarios publicados. 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.
  • 144. Blogs ::: Moderación de comentarios en Blogger 144 Multimedia 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.
  • 145. Blogs ::: Moderación de comentarios en Wordpress 145 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado 7.2 Moderación de comentarios en Wordpress
  • 146. Blogs ::: Moderación de comentarios en Wordpress 146 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado 7.2.1 Configuración de comentarios El administrador de un blog debe tener previsto desde un principio cómo desea gestionar los comentarios 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 entradas 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 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
  • 147. Blogs ::: Moderación de comentarios en Wordpress 147 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado Enviarme un e-mail cuando  Alguien envía un comentario  Se ha recibido un comentario para moderar Para que un comentario aparezca  Un administrador debe aprobar el comentario  El autor del comentario debe tener un comentario previamente aprobado Moderación de comentarios  No descartar spam en mensajes antiguos  Mantener un comentario en espera si contiene más de 2 enlaces (una característica común del spam en comentarios es el gran número de enlaces).  Mantener en la cola de moderación todo comentario que incluya cualquiera de las siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples palabras o IP con saltos de línea. Atención a las coincidencias en el interior de palabras: "press" se encontrará en "WordPress". 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ónico Suscribirse a los comentarios  Mostrar a un 'suscribirse a los comentarios' 'en el formulario de comentarios Suscribirse al blog  Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios Avatares Un avatar es una imagen para identificar a un usuario y normalmente sale al lado de su nombre en los comentarios o referencias. Desde aquí puedes permitir la visualización de los avatares de los usuarios que dejen comentarios en tu blog. Visibilidad  No mostrar avatares  Mostrar avatares Puntuación máxima  G - Para todos los públicos  PG - Para mayores de 13 años  R - Para mayores de 17 años  X - Contenido adulto Avatar por defecto Para usuarios que no tiene un avatar personalizado podemos mostrar uno genérico o un logotipo basado en la dirección de correo electrónico del mismo.  Hombre misterioso  Blanco  Logo de Gravatar  Identicon (Generado)  Wavatar (Generado)  MonsterID (Generado)
  • 148. Blogs ::: Moderación de comentarios en Wordpress 148 Multimedia 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 comentarios Cuando se accede a la lectura individual de un artículo o entrada del blog, en la parte inferior se muestran los comentarios de los lectores y al final de los mismos se ofrece un formulario para 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 encuentra autentificado previamente en Wordpress entonces en este formulario no se solicitará el usuario, ni la dirección de correo ni la web. Si el administrador del blog ha desactivado la opción “Un administrador debe aprobar el comentario” 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 por todos los usuarios lectores.
  • 149. Blogs ::: Moderación de comentarios en Wordpress 149 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado 7.2.3 Moderación de comentarios Para activar la moderación de todos los comentarios que nos envíen los lectores es necesario configurar al menos los siguientes parámetros en Opciones > Comentarios > Para que un comentario 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.
  • 150. Blogs ::: Moderación de comentarios en Wordpress 150 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado Suprimir un comentario Para eliminar un comentario: 1. Desde el interfaz de gestión del blog elige Comentarios. Esta acción muestra todos los comentarios. Localiza el comentario que deseas eliminar y al situar el puntero del ratón sobre él se muestran las distintas opciones de procesamiento individual. Haz clic sobre la opción Papelera. Esta acción mueve ese comentario a la papelera pero no lo elimina definitivamente. 2. Otra forma de enviar a la papelera varios comentarios a la vez consiste en marcar sus casillas y a continuación elegir la opción Mover a la papelera en la lista desplegable Acciones en lote. 3. En la parte superior del listado se ofrecen enlaces para filtrar el listado de comentarios por Todos, Pendiente, Aprobados, Spam o Papelera. 4. Para eliminar definitivamente un comentario haz clic en el enlace Papelera y una vez dentro de la papelera puedes seleccionar entre Restaurar el comentario o bien Borrar permanentemente. Otra opción es pulsar el botón Vaciar papelera.
  • 151. Blogs ::: Moderación de comentarios en Wordpress 151 Multimedia y Web 2.0 ::: Edición 2010 ::: Formacion del profesorado Editar un comentario Wordpress permite editar el contenido de un comentario. Para ello basta con elegir la opción Editar o bien Edición rápida para acceder a una página donde es posible modificarlo. Marcar como spam Si marcas un comentario como spam éste se guarda en la carpeta Spam de los comentarios y cualquier otro comentario enviado posteriormente desde la misma IP será destinado automáticamente a esta carpeta.
  • 152. Blogs ::: Usuarios y permisos en Blogger 152 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. Usuarios y permisos
  • 153. Blogs ::: Usuarios y permisos en Blogger 153 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.1 Usuarios y permisos en Blogger
  • 154. Blogs ::: Usuarios y permisos en Blogger 154 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.1.1 Tipos de usuarios Blogger 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.
  • 155. Blogs ::: Usuarios y permisos en Blogger 155 Multimedia 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.
  • 156. Blogs ::: Usuarios y permisos en Blogger 156 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado  Únicamente autores del blog. Si activas esta opción sólo podrán leer los artículos los usuarios registrados como usuarios Si se decide restringir el acceso en modo lectura a un blog entonces al tratar de acceder a través de su URL, se mostrará un formulario para introducir las credenciales de usuario.
  • 157. Blogs ::: Usuarios y permisos en Wordpress 157 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2 Usuarios y permisos en Wordpress
  • 158. Blogs ::: Usuarios y permisos en Wordpress 158 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2.1 Tipos de usuarios Wordpress contempla en un blog 4 tipos de usuarios: administrador, editor, autor y colaborador.  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.
  • 159. Blogs ::: Usuarios y permisos en Wordpress 159 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.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.
  • 160. Blogs ::: Configuración del blog en Blogger 160 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. Configuración del blog
  • 161. Blogs ::: Configuración del blog en Blogger 161 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.1 Configuración del blog en Blogger
  • 162. Blogs ::: Configuración del blog en Blogger 162 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.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.
  • 163. Blogs ::: Configuración del blog en Blogger 163 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.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.
  • 164. Blogs ::: Configuración del blog en Blogger 164 Multimedia 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 Comentarios Ver el apartado anterior sobre Moderación de comentarios. 9.1.5 Archivo 1. Desde el interfaz de gestión de contenidos de tu blog haz clic en Configuración > Archivo. 2. En la página de Archivo se pueden configurar los siguientes datos: Frecuencia de archivo. Permite definir el intervalo con que se mostrarán los enlaces a las entrada en el gadget Archivo de la barra lateral: Diaria, Semanal o Mensualmente. ¿Habilitar páginas de entrada?. Es una opción activada por defecto. Las páginas de entrada permiten que cada artículo disponga de su página web con una URL significativa. Ejemplo: http://multimediaweb20.blogspot.com/2009/08/albert-einstein.html. En esta dirección de página se incluye información extraída del título de la entrada. Si no se activa esta opción entonces las URLs individuales de las entradas no serán amigables. Ejemplo: http://multimediaweb20.blogspot.com/2009_08_07_archive.html#1305293459555266304 9.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.
  • 165. Blogs ::: Configuración del blog en Wordpress 165 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2 Configuración del blog en Wordpress
  • 166. Blogs ::: Configuración del blog en Wordpress 166 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.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.
  • 167. Blogs ::: Configuración del blog en Wordpress 167 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2.3 Lectura 1. Desde el interfaz de gestión de tu blog elige Opciones > Lectura. 2. En esta página se definen los siguientes parámetros:  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 principio Enviarme un e-mail cuando  Alguien envía un comentario  Se ha recibido un comentario para moderar Para que un comentario aparezca  Un administrador debe aprobar el comentario  El autor del comentario debe tener un comentario previamente aprobado
  • 168. Blogs ::: Configuración del blog en Wordpress 168 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Moderación de comentarios  No descartar spam en mensajes antiguos  Mantener un comentario en espera si contiene más de XX enlaces (una característica común del spam en comentarios es el gran número de enlaces).  Mantener en la cola de moderación todo comentario que incluya cualquiera de las siguientes palabras en su contenido, nombre, URL, e-mail, o IP. Separa múltiples palabras o IP con saltos de línea. Atención a las coincidencias en el interior de palabras: "press" se encontrará en "WordPress". 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ónico Suscribirse a los comentarios  Mostrar a un 'suscribirse a los comentarios' 'en el formulario de comentarios Suscribirse al blog  Mostrar a un 'suscribirse al blog' opción en el formulario de comentarios Avatares Un avatar es una imagen que representa al usuario acompañando a su nombre en un comentario. Esta imagen es visible en aquellos blogs que lo permiten. En este apartado de la configuración del blog se puede activar que se muestren los avatares de aquellos usuarios que envien comentarios al blog. Visibilidad  No mostrar avatares  Mostrar avatares Puntuación máxima  Puntuación máxima G - Para todos los públicos  PG - Para mayores de 13 años  R - Para mayores de 17 años  X - Contenido adulto Avatar por defecto Para usuarios que no tienen un avatar personalizado podemos mostrar uno genérico o un logotipo 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.
  • 169. Blogs ::: Documentos PDF 169 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10. Documentos PDF
  • 170. Blogs ::: Documentos PDF 170 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.1 Introducción En un sitio web es frecuente poner a disposición de los usuarios documentos en formato PDF para la consulta de información. Ejemplo: los boletines oficiales. Las ventajas que ofrece este tipo de archivo son:  Se puede abrir con distintas aplicaciones de software gratuito.  Es accesible desde cualquier plataforma: Windows, Linux, Mac, etc.  El documento PDF tiene un tamaño más reducido que el original.  Admite la búsqueda fácil de información entre sus páginas.  Tiene una presentación idéntica e independiente del dispositivo de visualización (pantalla) y de impresión (impresora).  Permite proteger el contenido del documento frente a terceros. 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 Windows En Windows necesitamos un programa que nos permita abrir y leer los archivos PDF. La opción más habitual es Adobe Reader. Puedes descargar e instalar el archivo AdbeRdr903_es_ES.exe. La instalación se realiza siguiendo las opciones por defecto del asistente. Tras la instalación se creará un acceso directo en el escritorio. Haciendo clic en este icono se iniciará el programa. Desde el navegador web, cuando hagas clic en un enlace a un documento PDF se iniciará automáticamente Adobe Reader mostrando el contenido del archivo referenciado en el interior de una ventana del navegador. Si deseas consultar la web de Adobe para comprobar si existe una nueva versión del programa: http://www.adobe.es Otra alternativa al uso de Adobe Reader es disponer de un programa portable para leer documentos PDF. Es el caso del programa Sumatra PDF. Descarga y descomprime el archivo SumatraPDFPortable_1.0.1.paf.exe en una carpeta de tu disco duro o bien en tu pendrive. 10.3 Instalación de PDF Creator en Windows El programa Adobe Reader permite la lectura de documentos PDF pero no su creación. En su defecto se propone utilizar PDFCreator como aplicación de libre distribución para crear un documento PDF a partir de un archivo Word, Excel, etc: http://sourceforge.net/projects/pdfcreator/
  • 171. Blogs ::: Documentos PDF 171 Multimedia 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.
  • 172. Blogs ::: Documentos PDF 172 Multimedia 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.
  • 173. Blogs ::: Documentos PDF 173 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 6. Antes de iniciar la impresión con PDFCreator se solicitan los metadatos del nuevo archivo: título, fecha de creación, fecha de modificación, autor, asunto, palabras clave, etc. Es importante completar adecuadamente estos datos. Asegúrate de que la casilla Al terminar, abrir el documento con el programa predeterminado esta activada para ver el aspecto final del documento. 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 desde cualquier programa que permita la impresión: Microsoft Office, Internet Explorer, Mozilla Firefox, etc. Si se utiliza con un navegador web permite realizar copias de seguridad en formato PDF de las páginas web que se visitan. El proceso se iniciará de forma similar a como se describe en este apartado a partir del comando Archivo > Imprimir.
  • 174. Blogs ::: Documentos PDF 174 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.5 Lectura de archivos PDF en Ubuntu Ubuntu dispone por defecto de un programa instalado para leer y crear documentos PDF. Se trata 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 un fichero PDF del equipo se abrirá esta aplicación mostrando su contenido. De esta forma podremos leerlos.
  • 175. Blogs ::: Documentos PDF 175 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.6 Impresora virtual PDF en Ubuntu La distribución de Ubuntu proporciona por defecto una impresora virtual PDF que permite crear un documento PDF a partir de cualquier aplicación mediante Archivo > Imprimir y seleccionando 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 OpenOffice Los programas de OpenOffice como Writer (textos) o Impress (presentaciones) permiten exportar a un documento en formato PDF sin necesidad de disponer de una impresora virtual de PDF instalada en el equipo. Windows Si 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 para disponer de este completo paquete ofimático.
  • 176. Blogs ::: Documentos PDF 176 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Ubuntu En las mayoría de distribuciones de Ubuntu viene instalado OpenOffice por defecto. Se accede a una de sus aplicaciones desde el escritorio mediante: Aplicaciones > Oficina > OpenOffice.org … Ambos Una 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 …
  • 177. Blogs ::: Documentos PDF 177 Multimedia 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.
  • 178. Blogs ::: Documentos PDF 178 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.8 Publicar un PDF en Blogger El interfaz de gestión que ofrece Blogger NO permite subir directamente archivos PDF. Sin embargo, de la misma forma que existe un espacio donde se guardan las imágenes (Álbumes Web de Picasa) , existe un espacio denominado Google Sites, asociado a la cuenta de usuario Google, donde es posible subir archivos de distinto tipo para luego enlazarlos desde el blog para 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.
  • 179. Blogs ::: Documentos PDF 179 Multimedia 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.
  • 180. Blogs ::: Documentos PDF 180 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 11. Utilizando el navegador web Mozilla Firefox haz clic derecho sobre el enlace correspondiente al archivo subido y elige la opción Copiar la ruta del enlace 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.
  • 181. Blogs ::: Documentos PDF 181 Multimedia 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 Wordpress El interfaz de gestión que ofrece Wordpress permite subir directamente un archivo PDF para luego situar un enlace al mismo en una entrada del blog. En este apartado se explica el procedimientopara 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.
  • 182. Blogs ::: Documentos PDF 182 Multimedia 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.
  • 183. Blogs ::: Documentos PDF 183 Multimedia 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. ç
  • 184. Blogs ::: Documentos PDF 184 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12. Despliega el combo Destino y elige la opción Abrir el enlace en una nueva ventana. 13. Clic en el botón Insertar del cuadro de diálogo Insertar/Editar enlace. 14. Observa que se crea un enlace a este documento en el artículo. 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.
  • 185. Blogs ::: Google Docs 185 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Google Docs
  • 186. Blogs ::: Google Docs 186 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.1 ¿Qué es Google Apps? 11.1.1 Introducción Google Apps es un servicio web 2.0 ofrecido por Google a los usuarios registrados con cuenta de Gmail (http://www.gmail.com). Se puede utilizar para desarrollar una comunidad de usuarios que utilizan de forma colaborativa sus distintas aplicaciones web ofimáticas: Gmail, Google Calendar, Talk, Docs, Sites, etc. Las aplicaciones que proporciona Google Apps son de dos tipos: comunicación (Gmail, Talk, Reader y Calendar) y de colaboración/publicación (Docs y Sites) 11.1.2 ¿Por qué Google Apps? En el entorno educativo o laboral o de ocio es frecuente encontrarse con la necesidad de un soporte informático a una experiencia de colaboración entre un grupo de personas en el diseñ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 y hojas de cálculo y por otra la comunicación en tiempo real (mensajería instantánea) o diferido (emails). En este contexto Google Apps puede ser un excelente recurso para crear y soportar 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.
  • 187. Blogs ::: Google Docs 187 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.1.3 Descripción de las aplicaciones más interesantes Gmail. 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=12805 Google 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.
  • 188. Blogs ::: Google Docs 188 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Google 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.com Google Docs permite crear documentos de texto, presentaciones y hojas de cálculo mediante un editor que se utiliza a través del navegador web. Esto facilita la edición de un documento online entre varias personas simultáneamente desde sus respectivos navegadores. Es posible importar y exportar archivos en Google Docs de una forma muy sencilla. Para utilizar un archivo guardado en el equipo basta con subirlo (importarlo) y continuar allí donde se había dejado. Para trabajar con documentos sin conexión o distribuirlos como adjuntos, se puede exportar una copia al equipo en el formato que más se adapte a tus necesidades. Para utilizar Google Docs SÓLO SE NECESITA una conexión a Internet y un navegador estándar. Las características más destacadas de Google Docs son:
  • 189. Blogs ::: Google Docs 189 Multimedia 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.com Google Sites es una aplicación online que permite crear un sitio web de grupo de forma sencilla y colaborativa. Los usuarios pueden reunir en un único lugar y de una forma rápida informació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 (organiza las suscripciones RSS), Google Photos (albumes web con Picassa), Google Maps (Mapas para geolocalización de fotos), Google Grupos (foros de debate e intercambio de archivos), etc.
  • 190. Blogs ::: Google Docs 190 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.2 Crear y compartir un documento en Google Docs En este tutorial se explica el procedimiento para crear y compartir un documento sencillo en una 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 esquina superior derecha y elige Settings Docs. A continuación define Español como idioma y Madrid como franja horaria. Clic en Save (Guardar). Si el interfaz de edición de documentos de que dispones NO coincide con las capturas de pantalla que se incluyen en este manual quizás sea debido a que no tienes activada la última versión del editor. Para ello en la barra de menús de la esquina superior derecha de la página elige Configuración > Configuración de Docs. En la página Configuración, pestaña Edición hay que marcar la opción Nueva versión de documentos de Google > Crea nuevos documentos 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.
  • 191. Blogs ::: Google Docs 191 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Dentro del documento teclea el título del documento: Federico García Lorca. 4. A continuación selecciona este fragmento de texto y en la barra de menús selecciona Formato > Estilo de párrafo > Título 1. El título introducido adquiere el estilo definido. 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.
  • 192. Blogs ::: Google Docs 192 Multimedia 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.
  • 193. Blogs ::: Google Docs 193 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 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.
  • 194. Blogs ::: Google Docs 194 Multimedia 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.
  • 195. Blogs ::: Google Docs 195 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 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.
  • 196. Blogs ::: Google Docs 196 Multimedia 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.
  • 197. Blogs ::: Google Docs 197 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 8. Configurar las opciones de Compartir En 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 colaborador puede 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.
  • 198. Blogs ::: Google Docs 198 Multimedia 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.
  • 199. Blogs ::: Google Docs 199 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 32. Para cada usuario se indica si es propietario, puede editar o sólo ver. Para modificar el tipo de permiso sobre el documento o eliminar el usuario despliega el combo que acompaña a la línea correspondiente al email de ese usuario. Si deseas eliminar el usuario elige la opción Ninguno. 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.
  • 200. Blogs ::: Google Docs 200 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 36. Para cerrar el editor del documento y volver al gestor de archivos de GDocs basta con cerrar la pestaña que contiene el editor pero asegurándose de que el botón Guardado aparece deshabilitado en la esquina superior de la ventana del navegador. De esta forma nos cercioraremos de que se han guardado todos los cambios en el servidor. 37. De regreso al administrador de archivos de Google Docs verás que se ha creado una entrada del documento creado. 11.3 Gestión de archivos en Google Docs 11.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.
  • 201. Blogs ::: Google Docs 201 Multimedia 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.
  • 202. Blogs ::: Google Docs 202 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Desde la barra de menús (Archivo, Editar, Diapositiva, Insertar, etc) se pueden realizar todas las operaciones de edición sobre la presentación abierta. 11. En la barra de herramientas encontrarás acceso a las operaciones más utilizadas: añadir, duplicar o eliminar diapositiva; insertar imagen o texto, etc. 12. Si deseas ver la presentación pulsa en el botón Iniciar presentación. 13. No olvides pulsar en el botón Guardar para salvar los cambios introducidos si el sistema no lo ha hecho ya. 14. Para compartir un documento haz clic en el botón Compartir y luego selecciona Invitar a usuarios. El procedimiento es similar al explicado en el apartado anterior. 15. Para regresar al gestor de documentos cierra la pestaña que contiene el editor. 16. 11.3.2 Obtener el enlace para compartir Se puede invitar a participar como colaborador o como lector a un usuario eligiendo el documento y seleccionando Compartir > Invitar a usuarios. Otra posibilidad es activar la opción de que cualquier usuario anónimo (sin disponer de cuenta en Google) pueda acceder directamente a nuestro documento con solo disponer de su URL o dirección en internet. Le enviaríamos esta URL pegada en un mensaje de correo electrónico y
  • 203. Blogs ::: Google Docs 203 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado el usuario accedería a este documento pulsando en el enlace sin necesidad de introducir ninguna 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 Docs Desde el administrador de archivos se pueden realizar distintas operaciones con los archivos.
  • 204. Blogs ::: Google Docs 204 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En la columna izquierda del administrador de archivos se muestran las categorías y carpetas en que se organizan todos los archivos accesibles para el usuario actual a través del administrador de archivos. Es importante recordar que sólo serán accesibles a través de este interfaz aquellos archivos de los que sea propietario y aquellos compartidos por otros para ese usuario en concreto. Basta hacer clic sobre una categoría o carpeta en la columna izquierda, para que se muestre detalle de los archivos que contiene en el panel derecho. 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 plantilla Para 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 nombre Para cambiar de nombre una carpeta: Selecciona la carpeta en el panel izquierdo y en el panel derecho pulsa sobre su nombre para introducir el nuevo nombre.
  • 205. Blogs ::: Google Docs 205 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Para eliminar un archivo: Marcar la casilla del documento y pulsar en el botón Suprimir. El documento se moverá a la carpeta 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 carpeta destino. Otra posibilidad es arrastrar un archivo desde el panel derecho hasta soltarlo sobre la carpeta 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ás acciones > Ocultar/Mostrar. El archivo oculto se guardará en la carpeta Ocultos que aparece en la columna izquierda del administrador de archivos.
  • 206. Blogs ::: Google Docs 206 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Para ver el Historial de Revisiones de un documento existen dos procedimientos alternativos 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 distintas versiones históricas del documento utilizando los botones Más antigua y Más reciente. Observa que al visualizar una versión se muestra la hora en que se guardó y el usuario que lo hizo. Para sustituir una versión por la actual o más reciente se pulsa en el enlace Recuperar ésta. Al hacer clic derecho sobre un archivo en el gestor de archivos se muestran las principales opciones de procesamiento. 11.3.4 Exportación de archivos A partir de cualquier archivo de Google Docs se puede obtener una copia para manejar en el disco duro local fuera de línea o bien para enviar como adjunto en un correo electrónico a personas 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:
  • 207. Blogs ::: Google Docs 207 Multimedia 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 carpeta destino donde se guardan los archivos descargados. Para saber dónde lo hace o bien forzar a que pregunte siempre la carpeta destino al descargar el archivo selecciona Herramientas > Opciones. En la pestaña Principal y en la sección Descargas marca opción Guardar archivos en para elegir la carpeta destino donde se guardarán todas las descargas o bien marca la opción Preguntarme siempre dónde guardar los archivos.
  • 208. Blogs ::: Google Docs 208 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.4 Crear un documento a partir de una plantilla Google Docs proporciona un amplio catálogo de plantillas que facilitan la creación de nuevos documentos 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.
  • 209. Blogs ::: Google Docs 209 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.5 Formularios 11.5.1 ¿Qué son los formularios? Google Docs ofrece la posibilidad de diseñar un formulario de preguntas, enviar la URL de acceso a los usuarios que deseemos para que lo rellenen y luego recoger sus respuestas en forma de tabla y gráficos de datos. 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:
  • 210. Blogs ::: Google Docs 210 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Pregunta 2: Pregunta 3: Pregunta 4:
  • 211. Blogs ::: Google Docs 211 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Si al editar una pregunta marcas la casilla Hacer esta pregunta obligatoria entonces el usuario será advertido de esta circunstancia si deja en blanco esta pregunta. 8. Tras editar cualquier pregunta haz clic en el botón Finalizado para cerrar su edición. 9. Para modificar el aspecto gráfico del formulario haz clic en el botón superior Tema: tema elegido. Clic en el tema que desees para ver el aspecto final y luego pulsa en el botón Aplicar. 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.
  • 212. Blogs ::: Google Docs 212 Multimedia 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.
  • 213. Blogs ::: Google Docs 213 Multimedia 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 Blogger Existen 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.
  • 214. Blogs ::: Google Docs 214 Multimedia 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
  • 215. Blogs ::: Google Docs 215 Multimedia 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.
  • 216. Blogs ::: Google Docs 216 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.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.
  • 217. Blogs ::: Google Docs 217 Multimedia 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:
  • 218. Blogs ::: Google Docs 218 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Página web. Proporciona la URL de una página HTML que muestra el contenido de la hoja de cálculo. Se podría utilizar para crear un enlace en una entrada de nuestro blog.  Código HTML para incrustar en una página. Proporciona el código HTML que insertar en el artículo de tu blog.  CSV, TXT, PDF, … Proporciona un enlace para la descarga de la hoja de cálculo en uno de los formatos elegido. Este enlace se podría utilizar para crear un enlace en un artículo del blog. 5. En este caso elige Código HTML para incrustar en una página. Selecciona el código que ofrece debajo, clic derecho y elige Copiar. 6. Crea una nueva entrada en tu blog para pegar este código en el código HTML de la misma. Clic en el botón Publicar entrada y accede al blog para ver su aspecto. 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.
  • 219. Blogs ::: Google Docs 219 Multimedia 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 Wordpress En 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 un documento de Google. Por este motivo para integrar un documento de GDocs en un blog de Wordpress se utiliza el enlace a su URL. Esto se puede aplicar a documentos de texto, presentaciones, hojas de cálculo, formularios, etc. Se escribe un texto y en él se define un enlace de tal forma que cuando el usuario hace clic en él es redirigido a esa dirección del documento alojado en Google Docs. 1. En el gestor de archivos de GDocs haz clic sobre el título de un documento de texto.
  • 220. Blogs ::: Google Docs 220 Multimedia 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.
  • 221. Blogs ::: Google Docs 221 Multimedia 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.
  • 222. Blogs ::: Derechos de autor 222 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12. Derechos de autor
  • 223. Blogs ::: Derechos de autor 223 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12.1 Introducción En la elaboración de artículos en nuestro blog podemos partir de activos (textos, imágenes, audios y vídeos) propios o bien utilizar aquellos procedentes de otras personas o entidades. Por otra parte cuando se publica un material en internet puede resultar interesante establecer las condiciones de uso. 12.2 Los derechos de autor Los materiales multimedia tanto en formato cdrom como en internet están sujetos a la misma legislación sobre derechos de autor que el resto de obras: libros, pinturas, música, etc. Esto significa que si decidimos incorporar recursos ajenos (léase imágenes, audios, vídeos, etc) a nuestro espacio web debemos conocer y respetar las condiciones de uso que han definido los autores de estos materiales. Y esto es especialmente significativo cuando el material que hemos elaborado supera el contexto de uso particular y se pretende publicar en internet. Es entonces cuando existe posibilidad de ser utilizado por otras personas incluso en clara competencia con el material original. En ocasiones cuando accedemos a un espacio web, su autor explicita la posibilidad de reutilización a cambio de citar la procedencia (derecho de cita) o bien de que no se fragmente su obra (derecho de obra no derivada). Sin embargo cuando esto no se indica o bien se muestra una licencia de copyright (derechos reservados) conviene ser cauteloso. La apropiación indiscriminada de materiales ajenos para elaborar un material propio no se puede justificar desde la ausencia de ánimo de lucro que caracteriza las iniciativas donde participemos. Esta justificación no es suficiente y se hace necesario en estos casos contactar con el autor o autores para obtener su permiso y en caso favorable citar siempre la fuente de procedencia. 12.3 Licencias Creative Commons Creative Commons (http://es.creativecommons.org/) es una organización que ofrece a cualquier usuario la posibilidad de elegir las condiciones en que desea compartir un trabajo publicado 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 se pueden elegir:
  • 224. Blogs ::: Derechos de autor 224 Multimedia 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)
  • 225. Blogs ::: Derechos de autor 225 Multimedia 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.
  • 226. Blogs ::: Derechos de autor 226 Multimedia 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.
  • 227. Blogs ::: Derechos de autor 227 Multimedia 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.
  • 228. Blogs ::: Derechos de autor 228 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 12.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)
  • 229. Blogs ::: Derechos de autor 229 Multimedia 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
  • 230. Blogs ::: Derechos de autor 230 Multimedia 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.
  • 231. Blogs ::: Derechos de autor 231 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 15. Si deseas modificar de posición arriba/abajo del gadget basta con pulsar y arrastrar uno respecto al otro sobre la edición de la barra lateral. 16. Para editar de nuevo el contenido de este cuadro haz clic en el botón Abrir que se muestra en la esquina superior derecha del widget. 17. Para ver el resultado final haz clic en el enlace disponible en el título del blog. En la barra lateral se mostrará un gadget con el icono del tipo de licencia elegido. 18. Cuando el lector hace clic en el icono o en el enlace textual se mostrará la página de Creative Commons con las condiciones de la licencia elegida.
  • 232. Blogs ::: Derechos de autor 232 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado
  • 234. Imagen ::: Conceptos básicos de imagen digital 234 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. Conceptos básicos de imagen digital
  • 235. Imagen ::: Conceptos básicos de imagen digital 235 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Antes de estudiar los procedimientos más habituales de optimización y tratamiento de imágenes es conveniente repasar algunas ideas clave relacionadas con la imagen digital. 1.1 El píxel El píxel es la unidad mínima de visualización de una imagen digital. Si aplicamos el zoom sobre ella observaremos que está formada por una parrilla de puntos o píxeles. Las cámaras digitales y los escáneres capturan las imágenes en forma de cuadrícula de píxeles. 1.2 Resolución de imagen Es el grado de detalle o calidad de una imagen digital ya sea escaneada, fotografiada o impresa. 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 de mostrar. 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 una cámara de 8 MP es aquella capaz de tomar una fotografía con 8 millones de píxeles. 1.3 Profundidad de color La profundidad de color se refiere al número de bits necesarios para codificar y guardar la información de color de cada píxel en una imagen. Un bit es una posición de memoria que puede tener el valor 0 ó 1. Cuanto mayor sea la profundidad de color en bits, la imagen dispondrá de una paleta de colores más amplia. Se utiliza 1-bit para imágenes en blanco/negro, sin grises (0=color negro, 1= color blanco), 2-bits = 4 colores (00=color negro,
  • 236. Imagen ::: Conceptos básicos de imagen digital 236 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 01=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 color Llamamos modo de color al sistema de coordenadas que nos permiten describir el color de cada 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
  • 237. Imagen ::: Conceptos básicos de imagen digital 237 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado hasta 16,7 millones de colores. Ejemplo: El valor R:255, G:0, B:0 representa al color rojo puro.  Modo HSB. Cada color surge de los valores de estos tres parámetros: Hue (Tono) que es el valor del color: rojo, azul, verde, etc. En GIMP se expresa en grados y oscila entre 0 y 360. Saturation (Saturación) que se refiere a la pureza del color y va del 0% al 100%. Brightness (Brillo) referencia la intensidad de luz del color, es decir, la cantidad de negro o blanco que contiene estando su valor entre 0 (negro) y 100 (blanco). Ejemplo: El color rojo puro tiene un código RGB como (255,0,0) y también un código HSB (0,100,100). En la mayoría de programas de tratamiento de imágenes se puede elegir un color introduciendo su código RGB –es la opción más frecuente- o alternativamente su código HSB. En ambos casos la imagen maneja una paleta de colores de 24 bits.  Modo CMYK. Cada color se forma por combinación de cuatro canales. Cada canal se corresponde con un color primario de impresión: Cyan (Ciano), Magent (Magenta), Yellow (Amarillo) y BlacK (Negro). Cada canal puede tener como valor entre 0 y 255. Se trata de imágenes con una profundidad de color de 32 bits.
  • 238. Imagen ::: Conceptos básicos de imagen digital 238 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.5 Formatos de imagen Las imagénes digitales se pueden guardar en distintos formatos. Cada uno se corresponde con una 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.
  • 239. Imagen ::: Conceptos básicos de imagen digital 239 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Nota: Para visualizar la extensión de los archivos desde el explorador de Windows sigue los siguientes pasos: 1. Desde el escritorio elige Inicio > Mi PC 2. En la barra de menús selecciona Herramientas > Opciones de carpeta 3. Pulsa en la pestaña Ver. 4. En la lista Configuración avanzada localiza en la parte más inferior de la lista el elemento: “Ocultar las extensiones de archivo para tipos de archivo conocidos”. 5. Asegúrate de que la casilla del item mencionado NO está activada. 6. Pulsa en Aceptar para guardar los cambios. 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 entre las carpetas de tu disco duro. En la siguiente tabla se recogen las características diferenciales más significativas de los tres formatos de imagen recomendados para publicar una imagen en la web. JPG GIF PNG Número de colores: 24 bits Hasta 256 colores Número de colores: 24 bits color o 8 bits B/N color Muy alto grado de Formato de compresión Mayor compresión que el compresión. formato GIF (+10%) Posible pérdida de Sin pérdida de información Sin pérdida de información información salvo reducción de colores Admite carga progresiva Admite carga progresiva. Admite carga progresiva No admite fondos Admite fondos transparentes Admite fondos transparentes transparentes No permite animación Permite animación No permite animación 1.6 Consejos para la optimización de imágenes En este apartado se exponen algunos consejos sobre el tratamiento de imágenes para el diseñ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.
  • 240. Imagen ::: Conceptos básicos de imagen digital 240 Multimedia 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ámetros utilizando 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.
  • 241. Imagen ::: Empezar con GIMP 241 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2. Empezar con GIMP
  • 242. Imagen ::: Empezar con GIMP 242 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2.1 ¿Qué es GIMP? GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para la manipulación de imágenes. Es una aplicación adecuada para la edición y composición de imágenes así como para el retoque fotográfico. Esta herramienta es gratuita y representa una excelente opción frente a otros programas comerciales como Adobe PhotoShop o Paint Shop Pro. 2.2 Instalación de GIMP Windows Para instalar GIMP sobre Windows puedes descargar y ejecutar el archivo instalador gimp- 2.6.8-i686-setup.exe. En el sitio web oficial del proyecto GIMP podrás encontrar la versión más reciente o que se adapta a tu sistema: http://www.gimp.org/ Si deseas utilizar la versión portable para Windows descarga y descomprime el siguiente archivo a una carpeta de tu disco duro o pendrive: GIMP_Portable_2.6.8.paf.exe Ubuntu Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. En el buscador introduce el término GIMP y pulsa en el icono de la lupa para buscar el ítem correspondiente a esta aplicación. Clic en el botón Instalar que acompaña al ítem Editor de imágenes GIMP. Introduce las credenciales de administrador y al cabo de unos instantes dispondrás del programa GIMP instalado.
  • 243. Imagen ::: Empezar con GIMP 243 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2.3 Inicio de GIMP Windows 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:
  • 244. Imagen ::: Empezar con GIMP 244 Multimedia 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 selecciona Ventanas > Diálogos empotrables > … Para restaurar estos paneles a la disposición inicial selecciona Editar > Preferencias > Gestión de la ventana y pulsar en el botón Restaurar las posiciones de ventana guardadas a los valores predeterminados. Clic en Aceptar y luego en Reiniciar. Si se cierra GIMP y se vuelve a abrir se mostrarán los paneles por defecto. 2.5 Crear una nueva imagen 1. Elige Archivo > Nuevo.
  • 245. Imagen ::: Empezar con GIMP 245 Multimedia 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.
  • 246. Imagen ::: Empezar con GIMP 246 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 2.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.
  • 247. Imagen ::: Empezar con GIMP 247 Multimedia 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.
  • 248. Imagen ::: Empezar con GIMP 248 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 5. Pulsa sobre el botón “+” situado al lado de la etiqueta Seleccione el tipo de archivo (Por extensión). El formato de archivo GIMP XCF image (xcf) es un formato específico de GIMP. Como veremos más adelante también es posible guardar la imagen en formatos GIF, PNG o JPG. 6. Clic en el botón “-“ Seleccione el tipo de archivo para contraer el panel de elección de formato. Observa que ahora el formato elegido aparece a continuación de esta etiqueta. 7. Para terminar pulsa en el botón Guardar.
  • 249. Imagen ::: Optimización de imágenes 249 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 3. Optimización de imágenes
  • 250. Imagen ::: Optimización de imágenes 250 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 3.1 Conversión de formatos El propósito de esta actividad es familiarizarse con el uso de GIMP para convertir una imagen de 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 estos formatos. 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.
  • 251. Imagen ::: Optimización de imágenes 251 Multimedia 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.
  • 252. Imagen ::: Optimización de imágenes 252 Multimedia 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.
  • 253. Imagen ::: Optimización de imágenes 253 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor Guardar 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.
  • 254. Imagen ::: Optimización de imágenes 254 Multimedia 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.
  • 255. Imagen ::: Optimización de imágenes 255 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 5. En el cuadro de diálogo Guardar como PNG puedes definir algunos de los siguientes parámetros:  Entrelazado (Adam7). Incluye una copia tosca de la imagen al comienzo de la cadena de datos de tal forma que cuando el usuario la descarga desde Internet accede rápidamente a su contenido y conforme se va descargando va ganando calidad.  Nivel de compresión: arrastra el deslizador al extremo derecho para definir una compresión de valor 9.
  • 256. Imagen ::: Optimización de imágenes 256 Multimedia 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.
  • 257. Imagen ::: Optimización de imágenes 257 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 3.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.
  • 258. Imagen ::: Optimización de imágenes 258 Multimedia 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
  • 259. Imagen ::: Dimensiones de una imagen 259 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Dimensiones de una imagen
  • 260. Imagen ::: Dimensiones de una imagen 260 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1 Reducir el tamaño de una imagen Uno de los principales factores que determinan el peso de un archivo gráfico es el tamaño de la imagen que contiene, es decir, el número de píxeles en anchura y altura. Se recomienda utilizar 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. Es aconsejable reducir las dimensiones de la imagen previamente con GIMP u otro editor de imágenes, crear un nuevo archivo gráfico más ligero y luego integrarlo en la página. 1. Extrae a una carpeta de tu disco duro el archivo tranvia.jpg contenido en el ZIP que se adjunta a continuación: tranvia.zip. Sus características técnicas son: 800x600 píxeles de tamaño, profundidad de color 24 bits (16,7 millones de colores), resolución 72 ppp, formato JPG y tamaño del archivo 516 Kb. 2. Haz doble clic sobre el acceso directo de GIMP situado en el escritorio: 3. Una vez dentro de GIMP, elige Archivo > Abrir. Se abre el cuadro de diálogo Abrir imagen. Navega para situarte en la carpeta que contiene ese archivo. En la lista de archivos situada en el centro desplázate con la barra de desplazamiento vertical hasta localizar el archivo tranvia.jpg .Clic sobre este archivo. Observa que en el recuadro Vista previa se muestra la imagen y sus propiedades.
  • 261. Imagen ::: Dimensiones de una imagen 261 Multimedia 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
  • 262. Imagen ::: Dimensiones de una imagen 262 Multimedia 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.
  • 263. Imagen ::: Dimensiones de una imagen 263 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 17. Cierra esta imagen y repite los pasos 3-16 crear otras dos imágenes que sean respectivamente el 30% y 10% de la imagen original partiendo siempre del archivo inicial: tranvia.jpg 18. Abre la carpeta destino y encontrarás en ella los archivos JPG: tranvia.jpg, tranvia50.jpg, tranvia30.jpg y tranvia10.jpg que has creado. Si el tamaño de la imagen es menor, el archivo que la contiene tendrá menor peso. Como puedes comprobar en el ejemplo no es necesario utilizar imágenes de gran tamaño en las páginas web. Eso no sólo redundará en una mayor calidad estética sino que hará más rápida la navegación facilitando la descarga de archivos gráficos más ligeros. 100% 50 % 30 % 10 % 800x600 píx. 400x300 píx. 240x180 píx. 80x60 píx. 4.2 Modificar el tamaño del lienzo En ocasiones es necesario disponer de más lienzo en blanco dentro de una imagen para añ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:
  • 264. Imagen ::: Dimensiones de una imagen 264 Multimedia 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.
  • 265. Imagen ::: Dimensiones de una imagen 265 Multimedia 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.
  • 266. Imagen ::: Dimensiones de una imagen 266 Multimedia 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.
  • 267. Imagen ::: Dimensiones de una imagen 267 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 16. Se muestra el cuadro de título Exportar archivo donde se informa de que el formato JPG no conserva las capas por lo que aplanará la imagen para guardarla a continuación. Pulsa en el botón Exportar. 17. En la ventana siguiente: Guardar como JPEG define una calidad del 100% y pulsa en el botón Guardar.
  • 268. Imagen ::: Dimensiones de una imagen 268 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.3 Recortado de imágenes En este apartado se plantea obtener una nueva imagen a partir de la selección y recortado de un á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 una estética marcada por la desproporción entre las dimensiones de anchura y altura. Es el caso de 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.
  • 269. Imagen ::: Dimensiones de una imagen 269 Multimedia 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.
  • 270. Imagen ::: Montaje de imágenes 270 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Montaje de imágenes
  • 271. Imagen ::: Montaje de imágenes 271 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Las herramientas para seleccionar, copiar y pegar facilitan el montaje de imágenes. En esta práctica se ejemplifican las posibilidades de las distintas herramientas de selección. Estas se aplican para eliminar ciertas partes de una imagen combinando seleccionar y cortar. 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.
  • 272. Imagen ::: Montaje de imágenes 272 Multimedia 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.
  • 273. Imagen ::: Montaje de imágenes 273 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Con la varita seleccionada, haz clic sobre un punto del área azul de cielo en la imagen de la vaca. A continuación selecciona Editar > Limpiar. No olvides realizar esta operación también sobre la zona azul que aparece debajo del personaje. 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.
  • 274. Imagen ::: Montaje de imágenes 274 Multimedia 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.
  • 275. Imagen ::: Efectos especiales 275 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 6. Efectos especiales
  • 276. Imagen ::: Efectos especiales 276 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 6.1 Filtros El término “Filtro” proviene de la fotografía tradicional y aludía a una serie de cristales que se situaban delante del objetivo de la cámara para conseguir efectos especiales. Los filtros que proporciona GIMP permiten aplicar a una imagen original un sinfín de efectos de retoque y modificaciones. En esta práctica se explica cómo aplicar un filtro y algunos ejemplos. 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.
  • 277. Imagen ::: Efectos especiales 277 Multimedia 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 lente Distorsiones > Página doblada Artísticos > Aplicar lienzo Decorativos > Diapositiva Decorativos > Esquinas Decorativos > Foto antigua Luces y sombras > Sombra redondeadas base 8. Para guardar la nueva imagen creada, en la barra de menú de esa imagen selecciona Archivo > Guardar como …
  • 278. Imagen ::: Efectos especiales 278 Multimedia 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 especiales GIMP proporciona herramientas sencillas para el diseño de un banner de texto. Éste se puede utilizar 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.
  • 279. Imagen ::: Efectos especiales 279 Multimedia 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).
  • 280. Imagen ::: Efectos especiales 280 Multimedia 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.
  • 281. Imagen ::: Efectos especiales 281 Multimedia y Web 2.0 ::: Edición 2010 ::: Aula Mentor 13. En el cuadro de diálogo de Opciones admite los parámetros por defecto y pulsa en el botón Aceptar. 14. Al cabo de unos instantes se ha creado un atractivo rótulo. 15. Para deshacer la aplicación de este efecto, en la ventana de la imagen elige Editar > Deshacer. 16. Repite los pasos 12-15 para probar otros efectos especiales sobre el texto. A continuación se proponen algunos. 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.
  • 282. Imagen ::: Efectos especiales 282 Multimedia 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.
  • 283. Imagen ::: Tratamiento de imágenes por lotes 283 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.Tratamiento de imágenes por lotes
  • 284. Imagen ::: Tratamiento de imágenes por lotes 284 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.1 Introducción A menudo es necesario optimizar una colección de fotografías extraídas de la cámara digital con intención de ajustar sus dimensiones, resolución, formato, etc. para publicarlas en la web o compartirlas en la red local del centro. Esto se puede realizar con GIMP, imagen a imagen, aplicando los procedimientos descritos con anterioridad. Sin embargo cuando se trata de un número elevado de fotos es necesario realizar un procesamiento por lotes que realice la conversión de forma automática y rápida. GIMP dispone de un lenguaje de scripts donde es posible automatizar estas tareas. Sin embargo el diseño y manejo de scripts no resulta intuitivo ni fácil. En su lugar se propone utilizar el plugin DBP (David's Batch Processor) para GIMP. Este complemento permite ejecutar de forma automática operaciones en una lista de archivos de imagen, como por ejemplo, el redimensionamiento. DBP proporciona un entorno gráfico para crear una lista de imágenes con intención de definir y aplicar operaciones como la corrección del color, redimensionamiento, recorte, suavizado, cambio de nombre o guardar en otros formatos. DBP sólo procesa imágenes en modo color RGB mostrando un error cuando se trata de procesar imágenes en modo color indexado. Por otra parte DBP nunca sobreescribe la imagen original por lo que es necesario definir la tarea de renombrar o mover a otra carpeta cada archivo resultante. 7.2 Instalación del plugin DBP de GIMP en Windows El plugin DBP no se incluye en la instalación por defecto de GIMP. Es necesario descargarlo e instalarlo 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.
  • 285. Imagen ::: Tratamiento de imágenes por lotes 285 Multimedia 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.
  • 286. Imagen ::: Tratamiento de imágenes por lotes 286 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.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 David's 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.
  • 287. Imagen ::: Tratamiento de imágenes por lotes 287 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. En la pestaña Input de David's Batch Processor se habrán añadido las imágenes. Para eliminar alguna entrada basta con seleccionarla y pulsar en el botón Remove files (Eliminar archivos). Para eliminar la lista completa pulsa en el botón Clear List (Borrar lista). 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.
  • 288. Imagen ::: Tratamiento de imágenes por lotes 288 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 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.
  • 289. Imagen ::: Tratamiento de imágenes por lotes 289 Multimedia 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.
  • 290. Imagen ::: Tratamiento de imágenes por lotes 290 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 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.
  • 291. Imagen ::: Flickr: galería de fotos 291 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8. Flickr: galería de fotos
  • 292. Imagen ::: Flickr: galería de fotos 292 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.1 Introducción Flickr (http://www.flickr.com) es un servicio Web 2.0 donde puedes administrar y compartir tus fotos en línea. Las características más destacadas de este servicio son:  Subir fotos. Puedes hacerlo desde tu equipo, enviándolas por correo electrónico o utilizando el teléfono móvil con su cámara.  Organizar. Clasifica las fotos en colecciones o álbumes. A cada imagen se le puede asignar una etiqueta para facilitar su búsqueda.  Compartir. Utiliza grupos y controles de privacidad para compartir tus fotos.  Mapas. Sobre un mapa de Google Maps se puede geolocalizar el lugar donde se tomó cada foto y compartirlo con los demás.  Publicaciones. Puedes elaborar tarjetas, albumes, marcos, etc utilizando las imágenes subidas.  Mantenerse en contacto. Para enviar y recibir información sobre las actualizaciones de fotografías de familiares y amigos. La exploración de todas las posibilidades de Flickr excede el propósito de este curso. Se propone centrarse en la utilización de estas imágenes en línea en 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 Flickr se 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
  • 293. Imagen ::: Flickr: galería de fotos 293 Multimedia 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.
  • 294. Imagen ::: Flickr: galería de fotos 294 Multimedia 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.
  • 295. Imagen ::: Flickr: galería de fotos 295 Multimedia 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
  • 296. Imagen ::: Flickr: galería de fotos 296 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.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.
  • 297. Imagen ::: Flickr: galería de fotos 297 Multimedia 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.
  • 298. Imagen ::: Flickr: galería de fotos 298 Multimedia 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.
  • 299. Imagen ::: Flickr: galería de fotos 299 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.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
  • 300. Imagen ::: Flickr: galería de fotos 300 Multimedia 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 previa 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. 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.
  • 301. Imagen ::: Flickr: galería de fotos 301 Multimedia 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.
  • 302. Imagen ::: Flickr: galería de fotos 302 Multimedia 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.
  • 303. Imagen ::: Flickr: galería de fotos 303 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 8.6 Publicación de presentación Flickr en Wordpress 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.
  • 304. Imagen ::: Flickr: galería de fotos 304 Multimedia 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.
  • 305. Imagen ::: Picasa Web, álbums de fotos 305 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9. Picasa Web, álbums de fotos
  • 306. Imagen ::: Picasa Web, álbums de fotos 306 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.1 ¿Qué es Picasa Web? Picasa Web (http://picasaweb.google.com/) es un servicio Web 2.0 asociado a las credenciales de usuario Google donde puedes administrar y compartir tus fotos en línea. Las caracterí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 instala en el equipo para manejar y editar nuestros archivos de fotos en local y por otra parte Picasa Web que es la aplicación web que nos permite almacenarlas en un servidor remoto para compartirlas con los demás. La exploración de todas las posibilidades de ambas aplicaciones excede el propósito de este curso. Por ello se propone incidir especialmente en la integración de estas imágenes en línea en los artículos de tu blog. Para utilizar Picasa Web es necesario disponer de una cuenta en Google. Si ya dispones de credenciales para tu blog de Blogger conviene que utlices las mismas. Existen dos formas alternativas para acceder a Picasa Web:  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 Blogs con Blogger verás que ya dispones de algunas fotos subidas en tu cuenta. Esto es debido a que cuando subes imágenes en los artículos de tu blog en Blogger, éstas se guardan automáticamente en un álbum de Picasa Web con el nombre asignado al blog. Desde Picasa Web puedes administrar estas fotos pero hazlo con cautela porque si eliminas una fotografía desde aquí puede ocurrir que ésta no se vea luego en el correspondiente artículo de tu blog.
  • 307. Imagen ::: Picasa Web, álbums de fotos 307 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.2 Subir fotografías a Picasa Web I A continuación se explica el procedimiento para subir fotos a tu cuenta de Picasa Web utilizando 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.
  • 308. Imagen ::: Picasa Web, álbums de fotos 308 Multimedia 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:
  • 309. Imagen ::: Picasa Web, álbums de fotos 309 Multimedia 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.
  • 310. Imagen ::: Picasa Web, álbums de fotos 310 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.3 Subir fotografías a Picasa Web II En este apartado vamos a explicar el procedimiento para crear un álbum y subir las imágenes a 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.
  • 311. Imagen ::: Picasa Web, álbums de fotos 311 Multimedia 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.
  • 312. Imagen ::: Picasa Web, álbums de fotos 312 Multimedia 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.
  • 313. Imagen ::: Picasa Web, álbums de fotos 313 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 11. Para subir este álbum haz clic derecho sobre él y elige la opción Subir a los Álbumes web … 12. Introduce las credenciales de acceso a tu cuenta en Picasa Web y pulsa en el botón Acceder.
  • 314. Imagen ::: Picasa Web, álbums de fotos 314 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 13. Se crea el nuevo álbum en Picasa Web y se ofrecen, entre otros, los siguientes parámetros de configuración: a. Tamaño para subir. En este caso vamos a elegir Pequeño: 640 píxeles (blogs y páginas web) porque será el destino final de publicación de algunas de estas imágenes. b. Visibilidad para este álbum. En este caso elegiremos Público.
  • 315. Imagen ::: Picasa Web, álbums de fotos 315 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 14. Clic en el botón Subir. Se inicia un proceso de subida progresiva de las distintas imágenes que se muestra en el Administrador de subidas. 15. Al finalizar el proceso con éxito se mostrará un mensaje de proceso finalizado. Clic en el botón Ver online y cierra la ventana del Administrador de subidas.
  • 316. Imagen ::: Picasa Web, álbums de fotos 316 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 16. Se abrirá el navegador web configurado por defecto en el equipo mostrando esta galería subida a Picasa Web. 17. Cuando una imagen ha sido subida del equipo local a Picasa Web en su vista previa en Picasa 3 se mostrará un icono de una flecha verde apuntando hacia arriba para indicar esta circunstancia. 9.4 Publicación de una imagen Picasa en el blog 9.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.
  • 317. Imagen ::: Picasa Web, álbums de fotos 317 Multimedia 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.
  • 318. Imagen ::: Picasa Web, álbums de fotos 318 Multimedia 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.
  • 319. Imagen ::: Picasa Web, álbums de fotos 319 Multimedia 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.
  • 320. Imagen ::: Picasa Web, álbums de fotos 320 Multimedia 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.
  • 321. Imagen ::: Picasa Web, álbums de fotos 321 Multimedia 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.
  • 322. Imagen ::: Picasa Web, álbums de fotos 322 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 9.6 Publicación de presentación Picasa en Wordpress 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.
  • 323. Imagen ::: Picasa Web, álbums de fotos 323 Multimedia 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.
  • 324. Imagen ::: Picasa Web, álbums de fotos 324 Multimedia 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.
  • 325. Imagen ::: Slide.com : presentaciones de fotos 325 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10. Slide.com: presentaciones de fotos
  • 326. Imagen ::: Slide.com : presentaciones de fotos 326 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.1 ¿Qué es Slide.com? Slide.com (http://www.slide.com) es un servicio web 2.0 que nos permite subir una colección de imágenes y luego obtener en línea una atractiva presentación que las muestra de forma secuencial y con efectos especiales. Esta presentación tendrá una URL que podemos compartir con otras personas. También es posible integrarla dentro de una página web o artículo de un blog. Este servicio puede resultar interesante para publicar las fotos de los distintos 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.
  • 327. Imagen ::: Slide.com : presentaciones de fotos 327 Multimedia 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).
  • 328. Imagen ::: Slide.com : presentaciones de fotos 328 Multimedia 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).
  • 329. Imagen ::: Slide.com : presentaciones de fotos 329 Multimedia 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.
  • 330. Imagen ::: Slide.com : presentaciones de fotos 330 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 10.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.
  • 331. Imagen ::: Slide.com : presentaciones de fotos 331 Multimedia 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.
  • 332. Imagen ::: Slide.com : presentaciones de fotos 332 Multimedia 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.
  • 333. Imagen ::: Slide.com : presentaciones de fotos 333 Multimedia 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.
  • 334. Imagen ::: Slideshare, presentaciones en línea 334 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Slideshare: presentaciones en línea
  • 335. Imagen ::: Slideshare, presentaciones en línea 335 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.1 ¿Qué es Slideshare.net? Slideshare (http://www.Slideshare.net) es un servicio de alojamiento y publicación en línea de presentaciones realizadas con herramientas como Powerpoint u OpenOffice. Puedes utilizarlo para subir tus presentaciones y compartirlas. También puedes buscar y utilizar las realizadas por otras personas. En este curso se propone Slideshare como una interesante opción para publicar en la web nuestras propias presentaciones y luego poder integrarlas en el código HTML de una página de tu blog. Conviene registrarse previamente para crear tu cuenta en Slideshare. Para ello haz clic en el enlace Signup y completa el formulario indicando email, usuario y contraseña. A partir de ese momento 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.
  • 336. Imagen ::: Slideshare, presentaciones en línea 336 Multimedia 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.
  • 337. Imagen ::: Slideshare, presentaciones en línea 337 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 14. Clic en la imagen que muestra la presentación que acabamos de subir. De esta forma se accede a la visualización de esta presentación. Notas:  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.
  • 338. Imagen ::: Slideshare, presentaciones en línea 338 Multimedia 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.
  • 339. Imagen ::: Slideshare, presentaciones en línea 339 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota:  Esta integración HTML también se puede realizar con presentaciones publicadas por otras personas. Al situarse en su página también se ofrece el código Embed para copiar y pegar en nuestra página web.
  • 340. Imagen ::: Slideshare, presentaciones en línea 340 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11.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.
  • 341. Imagen ::: Slideshare, presentaciones en línea 341 Multimedia 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.
  • 342. Imagen ::: Google Maps 342 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Google Maps
  • 343. Imagen ::: Google Maps 343 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12.1 ¿Qué es Google Maps? Google Maps (http://maps.google.es/) proporciona herramientas para la integración de mapas geográficos en nuestro sitio web o blog. De esta forma es posible proporcionar a los lectores 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 recursos multimedia: 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.
  • 344. Imagen ::: Google Maps 344 Multimedia 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.
  • 345. Imagen ::: Google Maps 345 Multimedia 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.
  • 346. Imagen ::: Google Maps 346 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 16. Tras pulsar en Listo se visualizará el mapa tal y como lo verá un visitante. Puedes navegar por él y comprobar si la información que se muestra en los distintos marcadores es correcta y se visualiza adecuadamente al pulsar sobre cada uno de los marcadores. Para cambiar algún dato sería necesario pulsar en el botón Editar. 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.
  • 347. Imagen ::: Google Maps 347 Multimedia 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.
  • 348. Imagen ::: Google Maps 348 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12.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.
  • 349. Imagen ::: Google Maps 349 Multimedia 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.
  • 351. Audio ::: Introducción 351 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1. Introducción
  • 352. Audio ::: Introducción 352 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.1 Conceptos básicos del sonido digital Frecuencia. Es el número de vibraciones por segundo que da origen al sonido analógico. El espectro de un sonido se caracteriza por su rango de frecuencias. Ésta se mide en Hertzios (Hz). El oído humano capta sólo aquellos sonidos comprendidos en el rango de frecuencias 20 Hz y 20.000 Hz. Tasa de muestreo (sample rate). Un audio digital es una secuencia de ceros y unos que se obtiene del muestreo de la señal analógica. La tasa de muestreo o sample rate define cada cuánto tiempo se tomará el valor de la señal analógica para generar el audio digital. Esta tasa se mide en Hertzios (Hz). Por ejemplo: 44100 Hz. nos indica que en un segundo se tomaron 44100 muestras de la señal analógica de audio para crear el audio digital correspondiente. Un audio tendrá más calidad cuanto mayor sea su tasa de muestreo. Algunas frecuencias estándares son 44100 Hz., 22050 Hz., y 11025 Hz. Resolución (bit resolution) Es el número de bits utilizados para almacenar cada muestra de la señal analógica. Una resolución de 8-bits proporciona 256 (28) niveles de amplitud, mientras que una resolución de 16-bits alcanza 65536 (216). Un audio digital tendrá más calidad cuanto mayor sea su resolució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 de ese 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 : 8 bits/bytes : 1024 bytes/Kbytes : 1024 Kbytes/Mbytes = 2,81 MBytes ó Mb). Por ejemplo en los audios en formato MP3 se suele trabajar con bitrates de 128 kbps (kilobits por segundo). El audio 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 a la descarga por Internet. CBR/VBR Constant/Variable Bitrate. CBR indica que el audio ha sido codificado manteniendo el bitrate constante a lo largo del clip de audio mientras que VBR varía entre un rango máximo y mínimo en función de la tasa de transferencia. Códec. Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el número de bytes que ocupa un archivo de audio. Los archivos codificados con un codec específico requieren el mismo códec para ser decodificados y reproducidos. El códec más utilizado en audio es el MP3. Decibelio. Unidad de medida del volumen o intensidad de un sonido. El silencio o ausencia de sonido se cuantifica como 0 dB y el umbral del dolor para el oído humano se sitúa en torno a los 130- 140 dB.
  • 353. Audio ::: Introducción 353 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado 1.2 Formatos de archivos de audio Las audios digitales se pueden guardar en distintos formatos. Cada uno se corresponde con una extensión específica del archivo que lo contiene. Existen muchos tipos de formatos de audio 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 y universales: 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 por lo que se comentan aparte sus características.
  • 354. Audio ::: Introducción 354 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del profesorado Formato 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 audio Para optimizar el peso del archivo de audio será necesario utilizar un editor para reducir alguno 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 necesarios para realizar estas tareas sobre un audio original utilizando el editor Audacity.
  • 355. Audio ::: Primeros pasos con Audacity 355 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Primeros pasos con Audacity
  • 356. Audio ::: Primeros pasos con Audacity 356 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.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 Windows Paso 1. Instalación de Audacity Descarga 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á un icono de acceso directo en el escritorio. Otra posibilidad es descargar y descomprimir en una carpeta de tu disco duro o pendrive la versión portable para Windows: audacity-win-unicode-1.3.12.zip. Esta versión no necesita instalación. En el sitio web oficial del proyecto Audacity podrás encontrar la versión más reciente o que se adapta a tu sistema: http://audacity.sourceforge.net/ Paso 2. Instalación de los códecs LAME y FFmpeg Para poder realizar con Audacity la importación y exportación de audio a distintos formatos, por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo. No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de licencias de uso. 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).
  • 357. Audio ::: Primeros pasos con Audacity 357 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.3 Instalación del programa en Ubuntu Paso 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 FFmpeg Para poder realizar con Audacity la importación y exportación de audio a distintos formatos, por ejemplo MP3, es necesario instalar de forma adicional el códec LAME. También puede ser interesante instalar el códec FFmpeg para distintos formatos de streaming de audio y vídeo. No se proporcionan ya integrados en la distribución original de Audacity por cuestiones de licencias de uso. 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.
  • 358. Audio ::: Primeros pasos con Audacity 358 Multimedia 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:
  • 359. Audio ::: Primeros pasos con Audacity 359 Multimedia 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.
  • 360. Audio ::: Primeros pasos con Audacity 360 Multimedia 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.
  • 361. Audio ::: Primeros pasos con Audacity 361 Multimedia 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
  • 362. Audio ::: Primeros pasos con Audacity 362 Multimedia 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.
  • 363. Audio ::: Reproducción de audio con Audacity 363 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Reproducción de audio con Audacity
  • 364. Audio ::: Reproducción de audio con Audacity 364 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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.
  • 365. Audio ::: Reproducción de audio con Audacity 365 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.3 Propiedades de un archivo de audio Para conocer las propiedades de un archivo de audio o de vídeo se propone el uso del software 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.exe 3.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:
  • 366. Audio ::: Reproducción de audio con Audacity 366 Multimedia 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
  • 367. Audio ::: Reproducción de audio con Audacity 367 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.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.
  • 368. Audio ::: Reproducción de audio con Audacity 368 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: 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.
  • 369. Audio ::: Optimización de audios 369 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.Optimización de audios
  • 370. Audio ::: Optimización de audios 370 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1 Conversión de formato WAV a MP3 En esta actividad se detalla el procedimiento para convertir un archivo de audio del formato WAV al MP3. Cómo se explicó en el primer capítulo, el formato *.WAV puede almacenar el sonido en calidad pura y es ideal para guardar audios originales. Sin embargo para publicar un audio es preferible transformarlo al formato *.MP3 ya que se reduce considerablemente el peso 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.
  • 371. Audio ::: Optimización de audios 371 Multimedia 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.
  • 372. Audio ::: Optimización de audios 372 Multimedia 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 MP3 En ocasiones puede interesar reducir aún más el peso del archivo MP3 que se origina durante el 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.
  • 373. Audio ::: Optimización de audios 373 Multimedia 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 mono En la mayoría de los casos no es necesario disponer de una locución o sonido en estéreo. Su versión en mono satisface dignamente el propósito de la aplicación. Esta operación supone reducir el tamaño del archivo. En este apartado se describen los pasos para realizarlo usando Audacity. 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.
  • 374. Audio ::: Optimización de audios 374 Multimedia 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.
  • 375. Audio ::: Optimización de audios 375 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Haz clic sobre el botón “X” cerrar situado en el encabezado de la onda del canal Derecho. (También se podría hacer eliminando el canal Izquierdo) . De los dos cuadros que muestran la onda sonora será el situado más abajo. Con esta operación se elimina la onda sonora del canal derecho. 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.
  • 376. Audio ::: Optimización de audios 376 Multimedia 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.
  • 377. Audio ::: Optimización de audios 377 Multimedia 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 WAV Cuando 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:
  • 378. Audio ::: Optimización de audios 378 Multimedia 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
  • 379. Audio ::: Optimización de audios 379 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Desde el explorador de archivos visualiza el detalle de la lista de archivos que has creado. Comprueba la reducción de peso que tienen los distintos formatos de compresión WAV.
  • 380. Audio ::: La grabación de audio 380 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. La grabación de audio
  • 381. Audio ::: La grabación de audio 381 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.1 Crear una grabación de voz En el diseño de una aplicación educativa puede resultar interesante añadir discursos sonoros con carácter explicativo o de refuerzo. En este ejemplo se describe el proceso para crear un archivo 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.
  • 382. Audio ::: La grabación de audio 382 Multimedia 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.
  • 383. Audio ::: La grabación de audio 383 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 21. Introduce como nombre de archivo, por ejemplo, locución_32 y pulsa en el botón Guardar. 5.2 Grabar audio de un CD Aunque hay otros programas que facilitan la extracción directa de música de un CD, con Audacity 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.
  • 384. Audio ::: La grabación de audio 384 Multimedia 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.
  • 385. Audio ::: La grabación de audio 385 Multimedia 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.
  • 386. Audio ::: La grabación de audio 386 Multimedia 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 radio En esta práctica vamos a utilizar Audacity para grabar un fragmento de audio extraído de una emisió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.
  • 387. Audio ::: La grabación de audio 387 Multimedia 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 MIDI En esta práctica vamos a utilizar Audacity para grabar un fragmento de audio a partir de la reproducción de un archivo MIDI. Esta operación no suele aplicarse para optimizar un archivo MIDI ya que éste es un formato muy ligero sino para incorporar esta fuente de música al panel de 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.
  • 388. Audio ::: La grabación de audio 388 Multimedia 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.
  • 389. Audio ::: La grabación de audio 389 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Notas:  Como se indica en el primer apartado de este capítulo, recuerda que la tasa y resolución de muestreo se definen en Archivo > Preferencias > Calidad. Esto se hace previamente a la grabación.  Recuerda que Audacity no permite importar ni editar archivos MIDI.
  • 390. Audio ::: Montajes de audio 390 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Montajes de audio
  • 391. Audio ::: Montajes de audio 391 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.1 Seleccionar un fragmento de onda La 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 con intención de eliminarlo o bien conservarlo descartando el resto no seleccionado. Por otra parte la aplicación de un efecto siempre se realiza sobre un tramo de onda seleccionada previamente. 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.
  • 392. Audio ::: Montajes de audio 392 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Veamos por ejemplo el procedimiento para seleccionar el fragmento musical comprendido entre 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.
  • 393. Audio ::: Montajes de audio 393 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Editar > Seleccionar > Desde el principio hasta el cursor: Al hacer un clic sobre la onda para fijar la posición de la línea de cursor y luego utilizar esta opción, se selecciona la porción comprendida entre el principio de la grabación y la posición de la línea de cursor.  Editar > Seleccionar > Desde el cursor hasta el final: Al hacer clic sobre la onda para fijar la posición de la línea de cursor y luego aplicar este comando, se selecciona el tramo comprendido entre la línea de cursor y el final de la grabación. Otra posibilidad es realizar una selección aproximada sobre la onda utilizando la herramienta Selección y luego hacer clic sobre los valores numéricos hhmmss (h=horas, m=minutos, s=segundos) de INICIO y FIN que aparecen en la barra de selección inferior. De esta forma se introducen por teclado estos valores permitiendo un ajuste con una precisión de milésimas de segundo. 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.
  • 394. Audio ::: Montajes de audio 394 Multimedia 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
  • 395. Audio ::: Montajes de audio 395 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.5 Crear un loop de audio El archivo de un audio de duración media o larga suele tener un peso elevado para reproducirse previa descarga a través de Internet, incluso si se trata de un archivo MP3. A veces la situación admite emplear como recurso alternativo un audio más corto pero que reproducido en bucle con “n” repeticiones transmite la sensación de un acompañamiento más largo. Esto es especialmente útil en sonidos de fondo. En esta práctica vamos a crear un loop a 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:
  • 396. Audio ::: Montajes de audio 396 Multimedia 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 audio Con 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 play se 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.
  • 397. Audio ::: Montajes de audio 397 Multimedia 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.
  • 398. Audio ::: Montajes de audio 398 Multimedia 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.
  • 399. Audio ::: Aplicar efectos 399 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Aplicar efectos
  • 400. Audio ::: Aplicar efectos 400 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Audacity proporciona múltiples efectos que se pueden aplicar a un fragmento de audio digital: 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.
  • 401. Audio ::: Aplicar efectos 401 Multimedia 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.
  • 402. Audio ::: Aplicar efectos 402 Multimedia 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.
  • 403. Audio ::: Aplicar efectos 403 Multimedia 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.
  • 404. Audio ::: Aplicar efectos 404 Multimedia 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.
  • 405. Audio ::: Aplicar efectos 405 Multimedia 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.
  • 406. Audio ::: Extracción de audio de un CD 406 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Extracción de audio de un CD
  • 407. Audio ::: Extracción de audio de un CD 407 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.1 CDex en Windows 8.1.1 ¿Qué es CDex? CDEX (http://cdexos.sourceforge.net/) es un programa gratuito para Windows que nos va permitir extraer directamente un fragmento musical de un CD de audio o bien de una fuente de sonido conectada al ordenador para guardarlo en un archivo en formato WAV o MP3. 8.1.2 Instalación de CDex Descarga y ejecuta el instalador de CDex para Windows: cdex_170b2_enu.exe. El programa se 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 la versió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 se adapta 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.
  • 408. Audio ::: Extracción de audio de un CD 408 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Para iniciar la captura de la pista/s elegida/s pulsa en alguno de los botones que aparecen en la barra derecha. 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.
  • 409. Audio ::: Extracción de audio de un CD 409 Multimedia 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.
  • 410. Audio ::: Extracción de audio de un CD 410 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2 Sound Juicer en Ubuntu 8.2.1 ¿Qué es Sound Juicer? Sound Juicer es un programa que suele venir instalado por defecto en Ubuntu y que se utiliza para reproducir las pistas de audio de un CD y para extraerlas a archivos OGG y MP3. 8.2.2 Instalación de Sound Juicer Para 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 es necesario instalar previamente el paquete gstreamer0.10-plugins-ugly-multiverse. Para ello sigue 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 Juicer Para 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.
  • 411. Audio ::: Extracción de audio de un CD 411 Multimedia 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.
  • 412. Audio ::: Extracción de audio de un CD 412 Multimedia 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
  • 413. Audio ::: Integración de audio en Blogger 413 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Integración de audio en el blog
  • 414. Audio ::: Integración de audio en Blogger 414 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.1 Integración de audio en Blogger
  • 415. Audio ::: Integración de audio en Blogger 415 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En este apartado se explica el procedimiento para integrar un audio en un artículo de tu blog utilizando 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 puede añadir fácilmente a un artículo para que el lector al interactuar con él pueda escuchar un audio 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.
  • 416. Audio ::: Integración de audio en Blogger 416 Multimedia 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.
  • 417. Audio ::: Integración de audio en Blogger 417 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Repite el paso anterior para subir el archivo del reproductor player.swf. El archivo de texto brahms.txt y la imagen brahms.jpg no se subirán porque se utilizarán para elaborar la entrada en el blog. 13. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a ella. 9.1.2 Generar el código para incrustar En este paso vamos a utilizar un asistente para generar el código HTML necesario para incrustar (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.
  • 418. Audio ::: Integración de audio en Blogger 418 Multimedia 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.
  • 419. Audio ::: Integración de audio en Blogger 419 Multimedia 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.
  • 420. Audio ::: Integración de audio en Blogger 420 Multimedia 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.
  • 421. Audio ::: Integración de audio en Blogger 421 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 16. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 17. Regresa a la página de Generador de código de Pixelout y en el cuadro del código haz clic derecho para elegir Seleccionar todo. Repite clic derecho sobre la selección para hacer clic en Copiar. 18. Sitúate en la edición HTML del artículo del blog al final del mismo. Clic derecho y selecciona Pegar. Esta acción pegará el código HTML generado anteriormente. 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
  • 422. Audio ::: Integración de audio en Blogger 422 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.1.4 Los parámetros de configuración de PixelOut El reproductor de PixelOut admite personalizar su interfaz definiendo distintos valores en las variables que aparecen en el parámetro flashvars. Fíjate que esta cadena utiliza el formato variable=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.
  • 423. Audio ::: Integración de audio en Blogger 423 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  righticonhover=0xHHHHHH Right icon color (hover). Color del icono derecho al situar el ratón sobre él.  text=0xHHHHHH Text color . Color del texto.  slider=0xHHHHHH Slider color . Color del deslizador.  loader=0xHHHHHH Loader bar color . Color de la barra de carga.  track=0xHHHHHH Progress track color . Color de la barra de progreso de la pista.  border=0xHHHHHH Progress track border color. Color del borde de la barra de progreso de pista.
  • 424. Audio ::: Integración de audio en Wordpress 424 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2 Integración de audio en Wordpress
  • 425. Audio ::: Integración de audio en Wordpress 425 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2.1 Subida de archivos a Google Sites Actualmente Wordpress.com NO permite de forma gratuita subir y guardar archivos MP3 en su servidor para luego publicarlos en las entradas de tu blog. Por este motivo es necesario disponer de un espacio adicional de alojamiento de archivos de audio MP3. En este curso se propone utilizar el espacio gratuito proporcionado por Google Sites para aquellos usuarios con identidad digital en Google. 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. En este caso no utilizaremos el archivo player.swf que se reserva para la integración en un blog de Blogger. 2. Accede a la web de Google: http://www.google.es. Clic en el botón Acceder. 3. Introduce las credenciales de tu cuenta Google (correo electrónico y contraseña) y pulsa en el botón Acceder. 4. En el menú de opciones de la barra horizontal superior izquierda pulsa en Más > Sites.
  • 426. Audio ::: Integración de audio en Wordpress 426 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. En el listado de Mis sitios haz clic en el enlace Mi Sitio para acceder al sitio por defecto asociado a la cuenta. Su URL de acceso público es http://sites.google.com/site/<nombre_usuario>. En este caso vamos a guardar en este espacio el archivo de audio MP3 que vamos necesitar para luego enlazarlos desde el blog. 6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los archivos se propone crear una carpeta de nombre audio donde guardar los archivos pdf. Clic en el botón Crear página. 7. Elige como plantilla la opción Archivador.
  • 427. Audio ::: Integración de audio en Wordpress 427 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. En Nombre introduce audios. Observa que la carpeta contenedora de archivos se creará en la ruta: /site/<nombre_usuario>/audios. Clic en el botón Crear página. 9. Se creará esa carpeta y el sistema te colocará dentro de ella. Clic en el botón Añadir archivo. 10. En el cuadro de diálogo Añadir archivo pulsa en el botón Examinar para localizar y subir el archivo del audio MP3 danzahungara.mp3. Puedes introducir opcionalmente una descripción del archivo. Clic en el botón Subir. 11. Al cabo de unos instantes se mostrará una entrada al archivo de audio alojado en el servidor.
  • 428. Audio ::: Integración de audio en Wordpress 428 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Sobre el enlace Descargar haz clic derecho y selecciona la opción Copiar la ruta del enlace. De esta forma se copiará el enlace. 13. Abre el Bloc de Notas mediante Inicio > Todos los programas > Accesorios > Bloc de Notas y dentro de este programa elige Edición > Pegar. 14. La dirección URL del archivo de audio será del tipo: https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3?attredi rects=0&d=1 donde debes eliminar la coletilla a partir del signo de interrogación ? dejando exclusivamente la URL directa a ese archivo de audio: https://sites.google.com/site/<nombre_usuario>/audios/danzahungara.mp3 Recuerda que esta dirección será utilizada más adelante para integrar este audio en las entradas de tu blog en Wordpress.com
  • 429. Audio ::: Integración de audio en Wordpress 429 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.2.2 Crear el artículo en Wordpress 1. Abre una nueva pestaña del navegador web y accede a la administración de tu blog en Wordpress. 2. En la columna izquierda selecciona Entradas > Añadir. 3. Utiliza el explorador de archivos para abrir (doble clic) el archivo de texto brahms.txt. Se abrirá el Bloc de Notas mostrando su contenido. 4. 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. 5. Regresa al navegador web que muestra el editor de Nueva entrada de Wordpress. Teclea el título: Brahms. 6. 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. 7. En la barra de herramientas del editor haz clic en el botón Añadir Imagen.
  • 430. Audio ::: Integración de audio en Wordpress 430 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Se mostrará una nueva ventana para subir la imagen desde nuestro equipo. Clic en el botón Elegir archivos para localizar y señalar el archivo brahms.jpg que hemos obtenido en un paso anterior. 9. Una vez completado el proceso de subida de la imagen al servidor se mostrará en la parte inferior una miniatura de la imagen. Configura los siguientes parámetros de la imagen:  Título de la imagen: Brahms  URL del enlace. Haz clic en el botón Ninguna para eliminar el enlace de la imagen.  Alineación. Selecciona la opción Izquierda.  Tamaño. Elige la opción Full Size o completa. 10. Para insertar la imagen en la entrada pulsa en el botón Insertar en la entrada.
  • 431. Audio ::: Integración de audio en Wordpress 431 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. De regreso al editor elimina las etiquetas [imagen] y [audio]. Se utilizan para indicar la posición de estos elementos en el artículo pero carecen de utilidad cuando se añadan estos elementos al artículo. 9.2.3 Reproductor de audio en Wordpress 1. Clic en la pestaña HTML para mostrar el código HTML del artículo. 2. Regresa al Bloc de Notas que tenías abierto del paso anterior para reescribir la siguiente etiqueta: [audio https://sites.google.com/site/<usuario>/audios/danzahungara.mp3] Observa que esta etiqueta contiene la URL donde está archivado el audio MP3 en Google Sites.
  • 432. Audio ::: Integración de audio en Wordpress 432 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Selecciona esta etiqueta y elige Edición > Copiar. 4. Clic derecho sobre el editor de la entrada y elige Pegar. 5. Haz clic en el botón Publicar. 6. Para ver el resultado final haz clic en el botón Ver entrada. 9.2.4 Los parámetros de configuración El reproductor admite personalizar su interfaz definiendo distintos valores en sus distintos parámetros. Propiedades de color:  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.  righticonhover=0xHHHHHH Right icon color (hover). Color del icono derecho al situar el ratón sobre él.
  • 433. Audio ::: Integración de audio en Wordpress 433 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  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. Otros valores:  animation=no (el reproductor se ofrece abierto por defecto)  remaining=yes (muestra el tiempo restante en lugar del tiempo transcurrido)  loop=yes (reproduce en bucle)  initialvolume=80 (0 – 100, 60 es el volumen por defecto)  width=180 (la anchura por defecto es de 290 píxeles) Para utilizar estos parámetros se añaden a la etiqueta [audio … utilizando el signo “|” sin dejar espacios en blanco a partir de la extensión mp3 del nombre del archivo. Ejemplo: [https://sites.google.com/site/<usuario>/audios/danzahungara.mp3|width=260|loop=yes]
  • 434. Audio ::: Repositorios Web 2.0 de audio 434 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Repositorios Web 2.0 de audio
  • 435. Audio ::: Repositorios Web 2.0 de audio 435 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En la Web 2.0 existen espacios que ofrecen la posibilidad a los usuarios de subir y compartir audios en formato MP3 que luego podemos integrar en los artículos de nuestro blog. Hay multitud de espacios que ofrecen un esquema parecido de funcionamiento: subir archivos de audio, copiar el código y pegarlo en el código HTML del artículo. En este apartado se describen a modo de ejemplo: Goear y SoundCloud pero se anima al lector a buscar otros por Internet porque la oferta es amplia y variada. 10.1 Goear 10.1.1 ¿Qué es GoEar? GoEar (http://www.goear.com/) es un servicio Web 2.0 que permite subir y guardar en su servidor archivos de audio. A cada recurso sonoro se le puede asignar información textual: título de la canción y descripción. Esto facilita su búsqueda. Cada pista de audio dispondrá de una página propia donde se proporciona un código HTML para insertar su reproductor en un artículo de nuestro blog. 10.1.2 Subir tu audio mp3 a GoEar 1. Descarga y descomprime el archivo africa.zip. Como resultado obtendrás el archivo de audio MP3: africa.mp3. 2. Para subir un archivo de audio a GoEar es necesario disponer de una cuenta de acceso a este servicio. Para obtener una cuenta haz clic en Register y completa el formulario 3. Desde la portada de GoEar haz clic en Login e introduce tus credenciales. 4. Clic en Upload (Subir) para subir el archivo MP3. 5. Rellena los distintos datos del audio: Título, Autor, Género y Descripción. 6. Clic en el botón Examinar para localizar el audio MP3 guardado en tu equipo.
  • 436. Audio ::: Repositorios Web 2.0 de audio 436 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Para finalizar pulsa en el botón Upload (Subir). 8. Al cabo de unos segundos si la subida se ha producido con éxito se mostrará un mensaje y un enlace donde puedes hacer clic para escucharla: clicking here. 9. Se muestra el reproductor de audio de GoEar reproduciendo el MP3 subido. Si deseas compartir con otros usuarios este MP3 puedes copiar y pegar en un email el enlace que se proporciona en el cuadro de texto Share it! (Compártelo). Como se verá más adelante el código HTML que se proporciona en el cuadro de texto This song in your site (Esta canción en tu sitio) se puede utilizar para insertar este audio en tu página web o artículo de blog. 10.1.3 Publicación de un audio de GoEar en Blogger 1. Abre el navegador y visita la web de GoEar: http://www.goear.com/ 2. Utiliza el buscador para situarte en la reproducción del audio que desees insertar en tu página HTML
  • 437. Audio ::: Repositorios Web 2.0 de audio 437 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada. 4. Clic derecho sobre el cuadro This song in your site (Esta canción en tu sitio) y elige la opción Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar. 5. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en NUEVA ENTRADA. Introduce como título “Música africana” y en el editor del artículo haz clic en el enlace Edición de HTML. 6. Sobre el editor haz clic derecho y selecciona Pegar. 7. Clic en el botón PUBLICAR ENTRADA. Al visualizar la entrada en el frontend del blog se mostrará la consola de Goear permitiendo escuchar el audio subido.
  • 438. Audio ::: Repositorios Web 2.0 de audio 438 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10.1.4 Publicación de un audio de GoEar en Wordpress Wordpress.com no admite la integración de código embed. Sin embargo es posible aplicar un truco para averiguar la dirección URL del audio MP3 subido a Goear y luego insertar ese archivo de audio a una entrada de Wordpress.com 1. Abre el navegador Mozilla Firefox y visita la web de GoEar: http://www.goear.com/. Con intención de facilitar la búsqueda vacía la caché del navegador web mediante: Herramientas > Limpiar el historial reciente. En el cuadro de diálogo Limpiar el historial reciente visualiza los Detalles y asegúrate de que está marcado el ítem Caché. Clic en el botón Limpiar ahora. 2. Utiliza el buscador para situarte en la reproducción del audio que desees insertar en tu página HTML
  • 439. Audio ::: Repositorios Web 2.0 de audio 439 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Pulsa sobre el botón play del reproductor para escuchar la canción seleccionada. Es importante que la canción se descargue por completo para que se almacene en la carpeta caché del navegador. 4. En la barra de dirección del navegador Firefox teclea como dirección about:cache y pulsa la tecla enter para visualizar el contenido de la caché almacenada en el navegador web. 5. Desde la página que muestra los contenidos de la caché haz clic en el enlace List Cache Entries (Listado de Entradas de la Caché) en el apartado Disk cache device (caché de disco). Esta acción muestra la lista de archivos almacenados en la caché. 6. Elige Edición > Buscar. Introduce el término mp3 y pulsa en el botón Siguiente para buscar en el listado el archivo MP3 cacheado.
  • 440. Audio ::: Repositorios Web 2.0 de audio 440 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Esta búsqueda permite disponer de la URL del archivo del tipo: http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188. mp3 8. Clic derecho sobre esta dirección para elegir la opción Copiar la ruta del enlace. 9. En el interfaz de gestión de contenidos de tu blog en Wordpress haz clic en Entrada > Añadir. Introduce como título “Música africana” y en el editor del artículo haz clic en la pestaña HTML 10. Sobre el editor haz clic derecho y selecciona Pegar. Completa la etiqueta para que tenga la forma: [audio http://live.goear.com/sst5/mp3files/23112009/763b44efb304be2639f65d6fffd3a188.mp3] 11. Clic en el botón Publicar. Al visualizar la entrada en el frontend del blog se mostrará el reproductor de Wordpress mostrando el audio alojado en Goear. 10.2 SoundCloud 10.2.1 ¿Qué es SoundCloud? SoundCloud (http://soundcloud.com) es un servicio Web 2.0 gratuito para subir archivos de audio. Cada cuenta gratuita dispone de una capacidad máxima de 120 minutos de audio. Ofrece un interesante y fácil interfaz web para organizar estos archivos y compartirlos en público o sólo con ciertos usuarios. También facilita la integración en nuestro blog de cada archivo.
  • 441. Audio ::: Repositorios Web 2.0 de audio 441 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10.2.2 Subir tu audio mp3 a SoundCloud 1. Descarga y descomprime el archivo dreadloc.zip. Como resultado obtendrás el archivo de audio MP3: dreadloc.mp3. 2. Para subir un archivo de audio a SoundCloud es necesario disponer de una cuenta de acceso a este servicio. 3. Desde la portada de SoundCloud haz clic en Login In e introduce tus credenciales. 4. Si el proceso de autentificación ha tenido éxito te mostrará el escritorio (DashBoard) con todos los archivos subidos en tu cuenta. 5. Clic en Upload & Send (Subir y enviar) para iniciar el proceso de subida de un archivo MP3. 6. Clic en el botón Choose files (elegir archivos) para localizar el archivo dreadloc.mp3. 7. Una vez completa la subida del archivo se ofrece la oportunidad de incorporar los metadatos asociados a ese audio. En el apartado Track info (Información de la pista de audio) añade Ambiente Reggae al nombre (Track name) y descripción de ese audio (Track description). 8. En el apartado Who is this track for? (¿Para quién es esta pista?) define la pista como pública.
  • 442. Audio ::: Repositorios Web 2.0 de audio 442 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Para concluir haz clic en el botón Save Track (Guardar pista). 10.2.3 Publicación de un audio de SoundCloud en Blogger 1. Para localizar una pista ya subida, una vez que te has autentificado, elige You > Tracks(X) (Tú > Pistas(X)). Se muestra el listado de todos los audios subidos. 2. En la consola de reproducción del audio “Ambiente Reggae” haz clic en el enlace Share (Compartir) 3. En el código <object …> haz clic derecho y elige Copiar.
  • 443. Audio ::: Repositorios Web 2.0 de audio 443 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en NUEVA ENTRADA. Introduce como título “Ambiente Reggae” y en el editor del artículo haz clic en el enlace Edición de HTML. 5. Sobre el editor haz clic derecho y selecciona Pegar. 6. Clic en el botón PUBLICAR ENTRADA. Al visualizar la entrada en el frontend del blog se mostrará la consola de SoundCloud permitiendo escuchar el audio subido. Nota: También es posible integrar en el blog un reproductor soundCloud con el audio compartido por otro usuario. 10.2.4 Publicación de un audio de SoundCloud en Wordpress 1. Para localizar una pista ya subida, una vez que te has autentificado, elige You > Tracks(X) (Tú > Pistas(X)). Se muestra el listado de todos los audios subidos. 2. En la consola de reproducción del audio “Ambiente Reggae” haz clic en el enlace Share (Compartir)
  • 444. Audio ::: Repositorios Web 2.0 de audio 444 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Clic en el icono de Wordpress. 4. Se muestra el cuadro de diálogo Share to Wordpress.com (Compartir en Wordpress.com). Clic derecho sobre el código que se proporciona y elige Copiar. 5. Desde el interfaz de gestión de contenidos de tu blog en Blogger haz clic en Entradas > Añadir. Introduce como título “Ambiente Reggae” y en el editor del artículo haz clic en la pestaña HTML.
  • 445. Audio ::: Repositorios Web 2.0 de audio 445 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Sobre el editor haz clic derecho y selecciona Pegar. 7. Clic en el botón Publicar. Al visualizar la entrada en el frontend del blog se mostrará la consola de SoundCloud permitiendo escuchar el audio subido. Nota: También es posible integrar en el blog un reproductor soundCloud con el audio compartido por otro usuario.
  • 447. Vídeo y animaciones ::: Introducción 447 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1. Introducción
  • 448. Vídeo y animaciones ::: Introducción 448 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.1 Conceptos básicos de vídeo digital Dimensiones. Es el tamaño del video (ancho x alto) expresado en píxeles cuando se visualiza al 100%, sin agrandar ni reducir. Los reproductores pueden mostrar un video a pantalla completa o con una ampliación del 200%, 300%, etc. En estos casos el video pierde calidad de imagen y esta pérdida depende del formato de archivo. Un video AVI puede tener cualquier ancho y alto mientras que los estándares de VideoCD son 352 x 288 y de DVD 720 x 576. Codec. Acrónimo de "codificación/decodificación". Un códec es un algoritmo especial que reduce el número de bytes que ocupa un archivo de video. Los archivos codificados con un códec específico requieren el mismo códec para ser decodificados y reproducidos. Algunos de los códecs más utilizados para el formato AVI son: DivX, XviD, CinePak, Intel Indeo 5, DV, etc. Velocidad de transmisión (bitrate) El bitrate define la cantidad de espacio físico (en bits) que ocupa un segundo de duración de ese video. El video tendrá más calidad cuanto mayor sea su bitrate y el archivo que lo contiene tendrá mayor peso. El bitrate puede ser fijo o variable. El bitrate variable consigue mayor calidad de imagen porque recoge más calidad en escenas muy cargadas o con mucho movimiento y ahorra en aquellas más estáticas. Fotogramas por segundo. Un video resulta de la exposición imágenes o fotogramas uno detrás de otro. Un parámetro de la calidad del video es el número de fotogramas por segundo que muestra durante su reproducción. Este valor oscila entre 15 y 30. Por ejemplo los vídeos en DVD en Europa exhiben 25 fotogramas por segundo (25 fps). Fotogramas Clave. Cuando se aplica un códec de compresión a un video, se suele producir cierta pérdida de la información de sus fotogramas. Algunos fotogramas (los fotogramas clave) se almacenan completamente en el archivo comprimido, mientras que el resto sólo se guardan parcialmente. En la descompresión, estos fotogramas intermedios se reconstruyen a partir de los fotogramas clave. Sistemas de televisión.  NTSC (National Television Standards Comité = Comité Nacional de Estándares de Televisión). Cada fotograma está formado por 525 líneas y reproduce 30 fotogramas por segundo. Se utiliza en América del Norte, Centroamérica, Japón, etc.  PAL (Phase Alternation Line = Línea Alternada en Fase): El vídeo PAL tiene 625 líneas por fotograma y 25 fotogramas por segundo. Es el sistema más extendido actualmente en Europa.  SECAM (Séquentiel Couleur à Mémoire = Color secuencial con memoria). Muestra 625 líneas y 25 fotogramas por segundo. De origen francés, ha perdido mercado en Europa a favor del sistema PAL. Proporción o ratio de aspecto. Es la proporción entre la anchura y altura de un video. Cuando se reproduce un video se suele mantener por defecto esta proporción para evitar deformación de las imágenes. Por este motivo cuando se elige la visualización a pantalla completa, aparecen franjas negras arriba y abajo. Es habitual una relación 4:3 para los videos domésticos (352x288 píxeles, por ejemplo) mientras que en DVD se suele trabajar con ratios de 16:9.
  • 449. Vídeo y animaciones ::: Introducción 449 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.2 Formatos de archivos de video Los videos digitales se pueden guardar en archivos de distintos formatos. Cada uno se corresponde con una extensión específica del archivo que lo contiene. Existen muchos tipos de formatos de video. Aquí se citan algunos de los más utilizados. Asimismo cada tipo de archivo admite en cada momento un códec de compresión distinto. AVI (Audio Video Interleaved = Audio y Video Intercalado)  Es el formato estándar para almacenar video digital.  Cuando se captura video desde una cámara digital al ordenador, se suele almacenar en este formato con el códec DV (Digital Video).  El archivo AVI puede contener video con una calidad excelente. Sin embargo el peso del archivo resulta siempre muy elevado.  Admite distintos códecs de compresión como CinePak, Intel Indeo 5, DV, etc. Los códecs con más capacidad de compresión y una calidad aceptable son DivX y XviD.  El formato AVI puede ser visualizado con la mayoría de reproductores: Windows Media, QuickTime, etc. siempre y cuando se encuentren instalados en el equipo los adecuados códecs para cada tipo de reproductor.  Es ideal para guardar videos originales que han sido capturados de la cámara digital (codificados con DV).  No es recomendable publicarlos en Internet en este formato por su enorme peso.  Los códecs CinePak, Intel Indeo, DV, etc. no ofrecen una gran compresión. Los códecs DivX y XviD por el contrario consiguen una óptima compresión aunque se suelen destinar sobre todo a la codificación de películas de larga duración. MPEG (Moving Pictures Expert Group = Grupo de Expertos de Películas)  Es un formato estándar para la compresión de video digital.  Son archivos de extensión *.MPG ó *.MPEG.  Admite distintos tipos de códecs de compresión: MPEG-1 (calidad CD), MPEG-2 (calidad DVD), MPEG-3 (orientado al audio MP3) y MPEG-4 (más orientado a la web).  Se reproducen con Windows Media Player y QuickTime. MOV (http://www.apple.com/es/quicktime/)  Es el formato de video y audio clásico desarrollado por Apple.  Utiliza un códec propio que evoluciona en versiones con bastante rapidez.  Este tipo de archivos también pueden tener extensión *.QT  Se recomienda utilizar el reproductor de QuickTime. Existe una versión gratuita del mismo que se puede descargar de Internet.  Es ideal para publicar videos en Internet por su razonable calidad/peso.  Admite streaming. WMV (http://www.microsoft.com/windows/windowsmedia/es/)  Ha sido desarrollado por Microsoft.  Utiliza el códec MPEG-4 para la compresión de video.  También puede tener extensión *.ASF  Sólo se puede visualizar con una versión actualizada de Windows Media 7 o superior. Esta aplicación viene integrada dentro de Windows.  Es ideal para publicar videos en Internet por razonable calidad/peso.  Admite streaming. RM (http://spain.real.com/)  Es la propuesta de Real Networks para archivos de video.  Utiliza un códec propio para comprimir el audio.  Este tipo de archivos tiene extensión *.RM y *.RAM.  Se visualiza con un reproductor específico: Real Player. Existe una versión gratuita del mismo que se puede descargar de Internet.
  • 450. Vídeo y animaciones ::: Introducción 450 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Se puede utilizar para publicar videos en Internet por su aceptable calidad/peso.  Admite streaming. MP4 (http://www.apple.com/quicktime/technologies/mpeg4/)  Es un nuevo formato de vídeo desarrollado por Apple.  Se basa en el estándar MPEG-4 utilizando el códec H.264 AVC para vídeo y el códec AAC o MP3 para audio.  Son archivos de extensión *.MP4.  Es un formato de vídeo de gran popularidad y expansión debido a que se utiliza en los reproductores personales iPod y en el software de reproducción QuickTime+iTunes de Apple.  En el ordenador se puede reproducir con VLC Media Player, QuickTime, etc.  El repositorio de vídeos Youtube utiliza el formato MP4 para la descarga de los vídeos en alta calidad HQ.  El archivo *.MP4 es un contenedor dentro del cual además de audio y vídeo sincronizados también se pueden almacenar imágenes fijas, subtítulos, información de capítulos, etc.  Admite streaming. FLV (http://www.adobe.com)  Es un formato que utiliza el reproductor Adobe Flash para visualizar vídeo en Internet.  Utiliza el códec Sorenson Spark y el códec On2 VP6. Ambos permiten una alta calidad visual con bitrates reducidos.  Son archivos de extensión *.FLV.  Se pueden reproducir desde distintos reproductores locales: MPlayer, VLC media player, Riva, Xine, et.  Opción recomendada para la web por su accesibilidad. Al visualizarse a través del reproductor de Flash es accesible desde la mayoría de los sistemas operativos y navegadores web.  Los repositorios de vídeo más conocidos en Internet utilizan este formato para la difusión de vídeos: YouTube, Google Video, iFilm, etc.  Permite configurar distintos parámetros del vídeo para conseguir una aceptable calidad/peso.  Admite streaming. Junto con el formato MP4 son las opciones más aconsejables para la difusión de vídeos por Internet. 1.3 ¿Qué es el streaming? En la navegación por Internet es necesario descargar previamente el archivo (página HTML, imagen JPG, audio MP3, etc.) desde el servidor remoto al cliente local para luego visualizarlo en la pantalla de este último. La tecnología de streaming se utiliza para optimizar la descarga y reproducción de archivos de audio y video que suelen tener un cierto peso. El streaming funciona de la siguiente forma:  Conexión con el servidor. El reproductor cliente conecta con el servidor remoto y éste comienza a enviarle el archivo.  Buffer. El cliente comienza a recibir el fichero y construye un buffer o almacén donde empieza a guardarlo.  Inicio de la reproducción. Cuando el buffer se ha llenado con una pequeña fracción inicial del archivo original, el reproductor cliente comienza a mostrarlo mientras continúa en segundo plano con el resto de la descarga.  Caídas de la velocidad de conexión. Si la conexión experimenta ligeros descensos de velocidad durante la reproducción, el cliente podría seguir mostrando el contenido
  • 451. Vídeo y animaciones ::: Introducción 451 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado consumiendo la información almacenada en el buffer. Si llega a consumir todo el buffer se detendría hasta que se volviera a llenar. El streaming puede ser de dos tipos dependiendo de la tecnología instalada en el servidor:  Descarga progresiva. Se produce en servidores web que disponen de Internet Information Server (IIS), Apache, Tomcat, etc. El archivo de vídeo o audio solicitado por el cliente es liberado por el servidor como cualquier otro archivo utilizando el protocolo HTTP. Sin embargo, si el archivo ha sido especialmente empaquetado para streaming, al ser leído por el reproductor cliente, se iniciará en streaming en cuanto se llene el buffer.  Transmisión por secuencias. Se produce en servidores multimedia que disponen de un software especial para gestionar más óptimamente el streaming de audio y vídeo: Windows Media Server, Flash Communication Server, etc. La utilización de un servidor multimedia ofrece múltiples ventajas frente al servidor web. Las más destacadas son: a. Mayor rapidez en la visualización de este tipo de contenidos. b. La comunicación entre servidor/cliente se puede realizar por protocolos alternativos al HTTP. Tiene el inconveniente del bloqueo impuesto por Firewalls pero tiene la ventaja de una mayor rapidez. c. Mejor gestión del procesador y ancho de banda de la máquina del servidor ante peticiones simultáneas de varios clientes del mismo archivo de audio o vídeo. d. Control predefinido sobre la descarga que pueden realizar los clientes: autentificada, filtrada por IP, sin almacenarla en la caché del cliente, etc. e. Mayor garantía de una reproducción ininterrumpida gracias al establecimiento de una conexión de control inteligente entre servidor y cliente. f. Posibilidad de distribución de transmisiones de audio y vídeo en directo. 1.4 Optimización de archivos de video Para optimizar el peso del archivo de video será necesario editarlo para establecer alguno o algunos de los siguientes parámetros: En el Audio: 1) El códec de compresión de audio utilizado: MPEG Layer 1, MPEG Layer 2, MP3, etc. 2) Resolución. Establecer resoluciones más pequeñas: 32-bits, 16-bits, 8-bits, 4-bits, etc. 3) Tasa de muestreo. Definir valores inferiores: 44100 Hz., 22050 Hz., 11025 Hz, etc. 4) Velocidad de transmisión (bitrate). Configurar bitrates más bajos: 128 Kbps, 96 Kbps, 64 Kbps, etc. 5) Calidad estéreo/mono. Reducir la calidad de “stereo” a “mono” En el Video: 1) El códec de compresión de video utilizado: MPEG-1, MPEG-2, MPEG-4, Intel Indeo, Cinepak, DivX, etc. 2) Método de BitRate. Utilizar un bitrate variable VBR puede optimizar la calidad del video y repercutir en el peso final del archivo frente a un bitrate constante CBR. 3) Velocidad de transmisión (bitrate). Configurar bitrates más bajos: 1000 Kbps, 768 kbps, 360 Kbps, etc. 4) Dimensiones. Cuanto más pequeña sea la altura y anchura en píxeles de los fotogramas de un video, menos tamaño ocupará su archivo. 5) Velocidad de fotogramas. Se puede reducir el número de fotogramas por segundo que mostrará el video: 30, 24, 20, 16, etc.
  • 452. Vídeo y animaciones ::: Introducción 452 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6) Fotogramas Clave. Durante la compresión también se puede indicar cada cuánto se guardará un fotograma completo (fotograma clave): 24, 48, 96, 128, etc. Cuanto mayor sea esta cadencia más bajo será el peso del archivo resultante. Otros elementos que inciden en la optimización: 1) Duración. Cuanto más corto es un video, menos peso ocupa su archivo. En ocasiones puede resultar interesante fraccionar un archivo de video en sus escenas para facilitar su descarga. 2) Formato de archivo. Los archivos *.WMV, *.MOV, *.RM y *.FLV son los más adecuados para publicar un video en Internet por su adecuada relación calidad/peso y porque admiten streaming. Los archivos *.AVI con códecs de compresión baja son ideales para guardar los videos originales. Los archivos *.AVI con códecs DiVX-XviD son apropiados para videos de películas de cierta duración. Los archivos *.MPG con códec MPEG-1 se utilizan para crear Video-CDs. Los archivos *.MPG con códec MPEG-2 se utilizan como fuente para montar un DVD. 1.5 Dispositivos de captura de video Los dispositivos de captura de video permiten transferir al disco duro del ordenador un video ya grabado o una emisión en directo. Los más frecuentes son:  Una cámara DV (Video Digital) conectada al puerto IEEE 1394 del equipo. Con este dispositivo se obtiene la mejor calidad porque la información de audio y video ya está en formato digital llegando simplemente al ordenador a través del mencionado puerto. Conexión IEEE 1394 para videocámara digital  Una cámara web conectada a un puerto USB y un micrófono conectado a la entrada MIC de la tarjeta de sonido.
  • 453. Vídeo y animaciones ::: Introducción 453 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Conexiones Cámara-USB y Micrófono-Tarjeta Audio  Una tarjeta sintonizadora de TV conectada a la señal de antena.  Una cámara o reproductor VHS conectado a una tarjeta de captura analógica. Este proceso supone la conversión de video analógico a video digital. Para disponer de una información más completa de cómo conectar y configurar un dispositivo de captura, consulta la documentación que acompaña a cada hardware.
  • 454. Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 454 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. Reproducción de vídeos con VLC Media Player
  • 455. Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 455 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.1 ¿Qué es VLC Media Player? VLC Media Player es un reproductor multimedia, gratuito y multiplataforma. Sus características más destacadas son:  Soporta un gran número de formatos de audio y vídeo sin necesidad de instalar códecs adicionales: MPEG-1, MPEG-2, MPEG-4, DivX, MP3,OGG, MOV, RAM, AVI, FLV, etc.  Es una opción muy interesante frente a otros programas comerciales para reproducir CDs de música, películas en soporte DVD o VídeoCD, etc.  Se puede utilizar como servidor de streaming en una red local o de banda ancha. VLC Media Player es una aplicación local para reproducir archivos multimedia del disco duro o en soporte CD/DVD. No se trata de un plugin para el navegador web. Se ha incluido en este curso por su facilidad para visualizar todo tipo de formatos y en especial DivX, FLV y películas en DVD. 2.2 Instalación de VLC Media Player en Windows  Descarga y ejecuta el instalador del reproductor VLC Media para Windows: vlc-1.1.4- win32.exe  Si deseas utilizar la versión portable para Windows descarga y descomprime el siguiente archivo a una carpeta de tu disco duro o pendrive: VLCPortable_1.1.2_Rev_2.paf.exe  Otra posibilidad es consultar su sitio web oficial: http://www.videolan.org y descargar si procede la última versión. 2.3 Instalación de VLC Media Player en Ubuntu  Desde el escritorio selecciona Aplicaciones > Centro de software de Ubuntu. En el cuadro de diálogo Añadir o quitar aplicaciones introduce el término de búsqueda VLC. Marca la entrada Reproductor de medios VLC y pulsa en el botón Instalar.
  • 456. Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 456 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Una vez instalado selecciona Aplicaciones > Sonido y vídeo > VLC media player y arrastra este icono hasta el escritorio para disponer de un acceso directo. 2.4 Reproducción de un vídeo FLV con VLC Una vez instalado el reproductor VLC Media Player puedes comprobar su correcto funcionamiento. 1. Descarga y descomprime el archivo flv.zip a una carpeta de tu equipo. 2. A continuación haz doble clic sobre el icono VLC Media Player situado en el escritorio para iniciar este programa o bien en el ejecutable situado dentro de la carpeta de instalación de la versión portable. 3. Se muestra la consola de reproducción de VLC Media Player. 4. Selecciona Medio > Abrir Archivo. En el cuadro de diálogo Elegir uno o más archivos para abrir sitúate en la carpeta donde has descargado el vídeo.
  • 457. Vídeo y animaciones ::: Reproducción de vídeos con VLC Player 457 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Clic sobre el archivo dteatro.flv y pulsa en el botón Abrir. Se reproducirá el contenido de este archivo de vídeo. 6. Puedes descargar y descomprimir el archivo dteatro_divx.zip. Obtendrás el correspondiente vídeo en formato *.avi codificado con DivX. Ábrelo con VLC Media Player y verás que también lo reproduce. Puedes experimentar otras posibilidades de VLC Media Player:  Medio > Abrir Archivo Avanzado para visualizar otros formatos de vídeo: .mov, .wmv, … No admite el formato de RealPlayer.  Medio > Abrir disco permite reproducir una película en formato DVD o Video-CD.  Medio > Abrir Directorio para indicar una carpeta del equipo cuyos archivos serán reproducidos de forma secuencial. Nota: En Windows el reproductor por defecto suele ser Windows Media Player mientras que en Ubuntu suele ser Totem.
  • 458. Vídeo y animaciones ::: Descarga de archivos de video 458 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Descarga de archivos de vídeo
  • 459. Vídeo y animaciones ::: Descarga de archivos de video 459 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En este tema se exponen distintos procedimientos para descargar archivos de vídeo que se están visualizando dentro de una página web. De esta forma se pueden reutilizar en local o bien en la intranet logrando una visualización más ágil sin las limitaciones del acceso a Internet. 3.1 Descarga de vídeos Youtube con Firefox 3.1.1 ¿Qué es Video DownloadHelper? Video DownloadHelper es una extensión del navegador Firefox que permite descargar y guardar en local un video, audio o imagen que se muestra dentro de una página web. Este complemento realiza un chequeo de la página web buscando los archivos multimedia que contiene y ofreciendo al usuario la posibilidad de guardarlo pulsando en su botón en la barra de herramientas del navegador. Funciona con muchos sitios web que ofrecen repositorios de vídeos: Youtube, Google Vídeo, Current TV, etc. 3.1.2 Instalación de la extensión Video DownloadHelper 1. Abre el navegador Firefox. 2. Selecciona Herramientas > Complementos. 3. En el panel Complementos, pestaña Obtener complementos, introduce el término de búsqueda Video DownloadHelper y pulsa la tecla enter o bien haz clic sobre el icono de lupa para iniciar la búsqueda. 4. En este panel se mostrará la entrada correspondiente al complemento buscado. Clic en el botón Añadir a Firefox …
  • 460. Vídeo y animaciones ::: Descarga de archivos de video 460 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. En el cuadro de diálogo Instalación de software pulsa en el botón Instalar ahora. 6. En el panel Extensiones ahora se muestra la extensión instalada. Clic en el botón Reiniciar Firefox. De esta forma la extensión de activará al reiniciar el programa. Al iniciarse de nuevo debes cerrar la ventana de complementos. 3.1.3 Descarga desde YouTube Cuando un usuario sube a Youtube un vídeo puede hacerlo en distintos formatos pero el sistema lo transforma al vuelo en formato FLV (Flash Video) para servir su contenido en streaming utilizando una consola personalizada en tecnología Adobe Flash. Por este motivo el visitante sólo necesita disponer del plugin de Adobe Flash instalado en su navegador web para poder visualizar el vídeo. A continuación se explica el procedimiento para descargar ese vídeo en formato FLV desde Youtube: 1. Abre el navegador web Firefox 2. Visita la web de Youtube en: http://www.youtube.com 3. Introduce como término de búsqueda “Picasso” y pulsa en el botón Buscar
  • 461. Vídeo y animaciones ::: Descarga de archivos de video 461 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. En la página de resultados se mostrarán los vídeos cuyas etiquetas contengan la palabra o palabras introducidas. 5. Pulsa, por ejemplo, sobre el enlace Pablo Picasso con la descripción “Picasso painting live …” (Picasso pintando en directo). Su URL directa es: http://www.youtube.com/watch?v=7vgAYTC9bRY 6. Clic en el botón Reproducir para visualizarlo. Cuando Video DownloadHelper detecta un video descargable en la página actual se ilumina o anima. Haz clic en este botón y selecciona la entrada que muestra el icono de Youtube junto al nombre de la página. 7. En el cuadro de diálogo Guardar selecciona en la lista Guardar en la carpeta destino e introduce como nombre del archivo FLV, por ejemplo, picasso.flv. También puedes dejar el nombre por efecto. 8. Clic en el botón Guardar. 9. Al cabo de unos instantes se habrá descargado el archivo de vídeo.
  • 462. Vídeo y animaciones ::: Descarga de archivos de video 462 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Para reproducirlo en local inicia VLC Media Player, selecciona Medio > Abrir archivo … para navegar hasta la carpeta anterior y selecciona el archivo picasso.flv. Otra posibilidad es utilizar el explorador de archivos y carpetas para arrastrar el icono del vídeo sobre la ventana abierta de VLC Media Player. Nota: Para ver a pantalla completa o reducida haz doble clic sobre la ventana. También es posible redimensionar la ventana pulsando y arrastrando en la esquina inferior derecha de la ventana del reproductor.
  • 463. Vídeo y animaciones ::: Descarga de archivos de video 463 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.2 Sitios web para descarga de vídeos Actualmente Youtube es el líder en portales con servicio de vídeo en línea. Sin embargo cada vez proliferan más los sitios web de este tipo donde es posible subir y visualizar contenidos de vídeo. En algunos de ellos también se pueden descargar vídeos al disco duro local para visualizarlo con los alumnos en aulas sin conexión a internet y también asegurando la actividad frente a las limitaciones de una conexión modesta. En algunos casos se puede aplicar el plugin Video DownloadHelper de Mozilla Firefox y en otros casos en el mismo sitio se ofrece como alternativa la descarga directa del archivo de video. A continuación se citan algunos de los servicios de vídeos más conocidos, el formato de vídeo utilizado y el procedimiento sugerido para la descarga de activos: 1. YouTube http://www.youtube.com FLV Firefox 2. Mediateca de EducaMadrid. http://mediateca.educa.madrid.org/ FLV Firefox 3. TeacherTube http://www.teachertube.com/ FLV Descarga directa a partir de la ruta ofrecida en la etiqueta para Wordpress. 4. Google Vídeo http://video.google.es/ FLV y MP4 Firefox para FLV y Descarga directa para MP4-Ipod 5. Revver http://revver.com/ MOV Firefox 6. Metacafe http://www.metacafe.com/ FLV Firefox 7. MySpace http://myspace.com/ FLV Firefox 8. Dailymotion http://www.dailymotion.com/ FLV Firefox 9. Guba http://www.guba.com/ FLV Firefox
  • 464. Vídeo y animaciones ::: Descarga de archivos de video 464 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Sharkle.com http://www.sharkle.com/ FLV Firefox 11. Lulu TV http://www.lulu.tv FLV Firefox 12. Hiphopdeal http://www.hiphopdeal.com/ FLV Descarga directa 13. Vsocial http://vsocial.com/ FLV Firefox 14. Current TV http://www.current.tv/ FLV Firefox 15. Mobuzz TV http://dosisdiaria.mobuzz.tv/ WMV-MOV-FLV-MP4 Ipod Descarga directa 16. Colombia aprende http://www.colombiaaprende.edu.co/html/mediateca MOV Firefox 17. Universidad de Sevilla. http://www.sav.us.es/producciondevideo/videoenred.asp RM Descarga directa 18. TV educativa del CNICE http://tv_mav.cnice.mec.es/ MPG, FLV, WMV, MOV Descarga directa 19. TV educativa de la UNED http://www.uned.es/cemav/tv.htm WMV Descarga directa 20. Vive, TV educativa de Venezuela http://www.vive.gob.ve/ WMV-FLV-OGG-MOV-RM Descarga directa 21. Ciencias Galilei http://www.acienciasgalilei.com/videos/video.htm WMV Descarga directa
  • 465. Vídeo ::: Captura de vídeo 465 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Captura de vídeo
  • 466. Vídeo ::: Captura de vídeo 466 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En este apartado se explica el procedimiento para capturar vídeo de una cámara digital DV utilizando Windows Movie Maker en equipos Windows o bien Kino en equipos Ubuntu. 4.1 Windows Movie Maker 4.1.1 Instalación de Windows Movie Maker Se trata de una aplicación integrada dentro de Windows XP Service Pack 2, Windows Vista o Windows 7. Por ello sólo es posible utilizarlo si tenemos instalado en el ordenador esta versión del sistema operativo. Si dispones de Windows XP instalado en tu equipo, comprueba si incluye Service Pack 2: 1. Desde el escritorio de Windows elige: Inicio > Panel de Control > Sistema. 2. En la solapa General deberá aparecer la etiqueta: “Service Pack 2”. 3. Si este texto no aparece aquí deberás visitar la web de Microsoft para descargar el SP2 e instalarlo a continuación: http://www.microsoft.com/spain/windowsxp/sp2/ . 4.1.2 Abrir Windows Movie Maker 1. Desde el escritorio de Windows, pulsa en el botón Inicio, luego en el botón Todos los programas y por último en Windows Movie Maker. Otra posibilidad es crear un icono de acceso directo en el escritorio: 1. Desde el escritorio de Windows, haz clic en Inicio, luego en Todos los programas. 2. Mantén pulsada la tecla Ctrl y sin soltarla pulsa y arrastra hasta el escritorio de Windows el elemento Windows Movie Maker. 3. En el escritorio se ha creado el acceso directo a este programa. Para acceder a él en sucesivas ocasiones haz doble clic sobre el icono que has creado.
  • 467. Vídeo ::: Captura de vídeo 467 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.1.3 Capturar video de cámara DV 1. Abre el programa Windows Movie Maker. 2. Conecta la cámara DV al puerto IEEE 1394 del ordenador. Enciende la cámara y activa en ella el modo VCR para reproducir el video tomado. 3. En el panel Tareas de película haz clic en la entrada Capturar desde dispositivo de video. Si no está visible este panel, haz clic en el botón Tareas de la barra de herramientas. 4. Si dispones de más de un dispositivo de captura de video, se mostrará el cuadro de diálogo Dispositivo de captura de vídeo. En la lista Dispositivos disponibles, haz clic en la cámara DV. Si sólo tienes instalado este dispositivo, esta ventana no aparecerá. 5. En el cuadro Introduzca un nombre de archivo para el vídeo capturado, escribe el nombre del archivo de vídeo capturado. Por ejemplo: MiVideo001. En el cuadro Seleccione una ubicación para guardar el vídeo capturado, selecciona la ubicación en la que desea guardar el vídeo o haz clic en Examinar… para seleccionar una nueva ubicación. Windows Movie Maker guarda por defecto las capturas en la carpeta Mis vídeos situada dentro de la carpeta Mis documentos. Dejamos esta opción por defecto y pulsamos en Siguiente>
  • 468. Vídeo ::: Captura de vídeo 468 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. En el cuadro Configuración de vídeo, selecciona la configuración de vídeo que deseas utilizar para capturar el vídeo y audio. En este caso vamos a seleccionar la opción Mejor calidad para reproducir en mi equipo (recomendado) porque ofrece una razonable relación calidad/peso de archivo para publicar posteriormente. Clic en Siguiente>
  • 469. Vídeo ::: Captura de vídeo 469 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Para guardar el video con la máxima calidad posible debes elegir la opción Formato de dispositivo digital (AVI DV). El archivo generado tendrá una calidad máxima aunque cada minuto guardado ocupará entre 190 y 210 Mb. Este formato es más idóneo para guardarlo en un dispositivo de cinta o para tomarlo como partida para luego obtener otros formatos más ligeros e idóneos para la web. Para probar otras calidades de captura, selecciona Otras opciones y en la lista desplegable elige otras configuraciones. 7. En el cuadro Método de captura, puedes elegir dos tipos de captura:  Capturar toda la cinta automáticamente. Se rebobina automáticamente la cinta de la cámara hasta el principio y se captura su contenido completo. Esta captura finaliza cuando se alcanza el final de la cinta o cuando pulses el botón Finalizar.  Capturar partes de la cinta manualmente. En este caso podrás navegar manualmente por la cinta hasta situarte en el punto deseado para iniciar la captura. En este caso vamos a seleccionar manualmente un fragmento de grabación para capturar. Por ello activa la segunda opción, asegúrate de que está elegida la casilla Mostrar vista previa durante la captura y pulsa en el botón Siguiente> 8. En la ventana Capturar vídeo se muestra una Vista previa. Utiliza los controles de reproducción situados debajo: Reproducir, Pausa, Stop, Ir al principio, Retroceso rápido, Avance rápido e Ir al Final. Con ellos podrás situarte al inicio del fragmento de video que deseas grabar.
  • 470. Vídeo ::: Captura de vídeo 470 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Una vez situado en el inicio deseado, en la consola Controles de cámara DV, haz clic en el botón Reproducir. Verás su contenido en la ventana Vista previa. 10. Asegúrate de que la casilla Crear clips cuando finalice el asistente está activado. Si deseas detener la captura automáticamente después de transcurridos XX minutos entonces debes activar la opción Capturar límite de tiempo (hh:mm) e introduce este valor. Por ejemplo: 00:01, para capturar sólo un minuto. Si eliges Silenciar altavoces no se reproducirá el audio por los altavoces durante la captura pero sí se incluirá en la captura. 11. A continuación pulsa en el botón Iniciar captura. Observa que durante el proceso de captura se muestra el tiempo de Video capturado y el Tamaño del archivo de vídeo que se va formando. 12. Si no has elegido captura con límite de tiempo, para detener la captura elige Detener captura. 13. Para terminar clic en el botón Finish (Terminar). 14. Tras unos segundos de espera se muestra el clip o clips de video que componen la captura. Están situados dentro de una colección con el mismo nombre que el proporcionado inicialmente. En este caso MiVideo001.
  • 471. Vídeo ::: Captura de vídeo 471 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 15. El contenido de esta nueva colección se guardar en un único archivo *.AVI ó *.WMV situado en la carpeta Mis Vídeos dentro de la carpeta Mis documentos. 16. Si deseas eliminar una colección, pulsa en el botón Colecciones de la barra de herramientas; en el panel izquierdo selecciona la colección elegida y pulsa la tecla Supr. También debes utilizar el Explorador de archivos de Windows para situarte en la carpeta Mis documentos > Mís vídeos , elegir el archivo del mismo nombre que contiene los recursos de video de esta colección y pulsar la tecla Supr. 4.1.4 Recortar y pegar clips de vídeo 17. Asegúrate de que en el panel inferior está activada la vista Escala de tiempo. Si no es así pulsa en el botón Mostrar escala de tiempo que aparece en este panel. 18. Desde el panel de Contenidos que muestra los elementos de la colección arrastra y suelta los clips de vídeo sobre la pista de Video. Para eliminar un clip de la Escala de tiempo, selecciónalo previamente y pulsa la tecla Supr. 19. Quizás sea necesario pulsar reiteradamente el icono de la lupa “+” para visualizar la escala de tiempo a un tamaño adecuado. 20. Pulsa y arrastra hacia la izquierda el selector de recorte del clip de vídeo situado en la pista Video para definir la duración adecuada de cada clip
  • 472. Vídeo ::: Captura de vídeo 472 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 21. Coloca sobre la línea de tiempo los clips de video uno detrás de otro para confeccionar la película. 4.1.5 Exportar al archivo de vídeo 22. Para guardar la película final, haz clic en la entrada Guardar en el equipo situada en el Panel de película o bien elige Archivo > Guardar archivo de película … > Mi PC 23. Se muestra el Asistente para guardar película donde debes introducir el nombre de la película, por ejemplo: mivideo , y la carpeta donde se guardará el archivo. Dejando la opción por defecto se almacenará en la carpeta Mis documentos > Mis vídeos. Clic en el botón Siguiente > ç 24. En la cuadro Configuración de película, haz clic en Mostrar más opciones para visualizar las distintos configuraciones de publicación. Activa Otras opciones y en la lista desplegable elige Vídeo para banda ancha (340 Kbps). Observa que en la esquina inferior izquierda de este cuadro se muestran los Detalles de la configuración elegida en cada caso: Tipo de archivo, velocidad de bits, tamaño de la pantalla, relación de aspecto y fotogramas por segundo. Clic en Siguiente.
  • 473. Vídeo ::: Captura de vídeo 473 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 25. Cuando se haya completado con éxito la publicación se mostrará un nuevo cuadro. Marca la casilla Reproducir película al pulsar Finalizar para que ésta se muestre en el reproductor de Windows Media inmediatamente después de haber pulsado el botón Finalizar. 26. Recuerda que el archivo de video se ha guardado con el nombre que has definido dentro de la carpeta Mis documentos > Mis vídeos.
  • 474. Vídeo ::: Captura de vídeo 474 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2 Kino en Ubuntu Kino es un editor de vídeo digital para Linux que permite capturar vídeo de una cámara DV, recortar los clips creados, añadir algunos efectos y exportar a un formato de vídeo: MPEG-1, MPEG-2, VCD, SVCD o DVD. En Ubuntu también se podría utilizar para la captura el editor de vídeo Pitivi. 4.2.1 Instalación de Kino 1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu 2. En este panel introduce kino en la casilla de búsqueda y pulsa la tecla enter. 3. Marca la casilla de activación en la entrada Kino-Editar vídeos DV y pulsa en el botón Aplicar cambios. 4. Una vez instalado cierra todas las ventanas de la instalación. 5. Si deseas disponer de un icono de acceso directo de Kino sobre el escritorio selecciona Aplicaciones > Sonido y Vídeo > Kino y arrástralo hasta el escritorio. 4.2.2 Configuración de permisos del puerto raw1394 Es necesario activar los permisos oportunos en el puerto raw1394 para que Kino pueda utilizar este puerto en la captura de vídeo. Esta operación sólo se realiza una vez. 1. Selecciona Aplicaciones > Accesorios > Terminal 2. Teclea sudo chmod 666 /dev/raw1394 3. Te solicitará la contraseña de root. Introduce esta password. 4. Cierra la ventana de terminal. 4.2.3 Instalación del paquete mjpegtools Para que Kino pueda realizar la exportación de vídeo al formato MPEG es necesario instalar en nuestro sistema el paquete mjpegtools. Esta operación sólo se realiza una vez. 1. Elige Sistema > Administración > Gestor de paquetes Synaptic 2. Pulsa el botón Buscar e introduce mjpegtools y pulsa en el botón Buscar. 3. Marca mediante doble clic el paquete mjpegtools aceptando la instalación de los paquetes dependientes. 4. Clic en el botón Aplicar 5. En el cuadro de diálogo de Resumen selecciona Para ser instalado y luego pulsa en el botón Aplicar. 6. Una vez finalizada la instalación cierra el gestor de paquetes.
  • 475. Vídeo ::: Captura de vídeo 475 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2.4 Abrir Kino 1. Selecciona Aplicaciones > Sonido y Vídeo > Kino o bien doble clic sobre el icono situado en el escritorio 2. Las principales partes del interfaz de Kino son: 1. Barra de menú: con acceso a las distintas opciones del programa. 2. Barra de herramientas donde se encuentran accesibles los botones de las acciones de uso más habitual. 3. StoryBoard. En este cuadro se situarán los clips de película o imágenes capturados o importados. 4. Visor. Mostrará la reproducción del clip de película seleccionado en el panel StoryBoard. 5. Barra de tareas. Cada botón de esta barra permite realizar las tareas más habituales durante la edición de una película. 6. Barra de reproducción. Incluye los controles habituales para la reproducción del clip de vídeo elegido en el panel Storyboard o bien para manejar la cámara DV durante el proceso de captura. 7. Barra de estado. Muestra información de interés durante la edición del vídeo.
  • 476. Vídeo ::: Captura de vídeo 476 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2.5 Capturar video de cámara DV 1. Conecta la cámara DV al puerto IEEE 1394 del ordenador. Enciende la cámara y activa en ella el modo VCR para reproducir el video tomado. 2. En la barra de tareas pulsa en el botón o pestaña Captura. 3. Kino guarda por defecto el video capturado en un archivo de nombre capture y extensión .dv en la carpeta personal del usuario del sistema: /home/<usuario>/capture.dv . Si deseas modificar el nombre o la ruta pulsa en el botón Examinar situado a la derecha del cuadro de texto Fichero. 4. Utiliza los controles de reproducción (al principio, hacia atrás, reproducir, pausa, stop, hacia delante o al final) de la propia cámara o de la barra de control de reproducción de Kino para desplazarse por la cinta grabada de la cámara y situarse en el punto de inicio de la captura. 5. Inicia la reproducción desde la cámara y cuando aparezca en el visor de Kino pulsa en el botón Captura para iniciarla. Durante este proceso se mostrará en la esquina inferior izquierda de la barra de estado el mensaje: Capturando /home/<usuario>/… 6. Para finalizar la captura pulsa en el botón Detener. Transcurridos unos segundos se creará el archivo *.dv en la carpeta indicada del equipo y este archivo estará disponible desde el panel Storyboard de Kino. 4.2.6 Recortar un clip de vídeo 1. En el panel Storyboard pulsa sobre el clip de video para seleccionarlo. 2. Sobre el panel de tareas derecho haz clic en el botón Recortar. 3. Utiliza los controles de reproducción para visualizar el clip de vídeo
  • 477. Vídeo ::: Captura de vídeo 477 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Durante la reproducción, en el instante que estimes oportuno, debes pulsar en el botón Ajustar el punto de entrada a la posición inicial para definir el punto inicial del clip de vídeo. Idem con el botón Ajustar el punto de salida a la posición inicial para establecer el punto final del clip de vídeo. 5. Otra posibilidad para definir el fragmento de clip de película es arrastrar los marcadores de entrada y salida sobre la línea de tiempo. Si necesitas mayor exactitud puedes definir los valores numéricos de estos puntos introduciéndolos por teclado o bien pulsando en los botones de incremento/decremento adjuntos. 6. Para verificar el fragmento seleccionado puedes reproducir el clip de película activando previamente el botón de reproducción continua del fragmento. 7. Para aplicar el recorte elegido pulsa en el botón Aplicar.
  • 478. Vídeo ::: Captura de vídeo 478 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4.2.7 Exportar el archivo de vídeo 1. El video final se construirá a partir de la secuencia de clips de película situados de arriba hacia abajo en el panel Storyboard. 2. Para exportar el vídeo final pulsa en el botón Exportar en la barra de tareas. 3. Clic en la pestaña MPEG. 4. En el cuadro de texto Fichero pulsa en el botón Examinar para introducir un nombre de archivo. Por ejemplo: mivideo. Este archivo se guarda por defecto en la carpeta del usuario actual: /home/<usuario>/ 5. Despliega la lista Formato de fichero y elige 0 – MPEG1 Genérico o bien 3 – MPEG2 Genérico. A continuación pulsa en el botón Exportar. 6. Al cabo de unos instantes se habrá creado el archivo mivideo.mpeg en la carpeta indicada. 4.2.8 Reproducir el vídeo final 1. Elige Aplicaciones > Sonido y vídeo > VLC Media Player 2. Abre la carpeta donde se ha creado el archivo mpeg. 3. Arrastra y suelta este archivo de video sobre la consola de reproducción de VLC Media Player. 4. Al cabo de unos instantes comenzará la reproducción del vídeo a través de VLC media player.
  • 479. Vídeo y animaciones ::: Edición de video 479 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Edición de vídeo
  • 480. Vídeo y animaciones ::: Edición de video 480 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.1 Introducción En Windows para la edición de vídeo se puede utilizar por su simplicidad el programa que ya viene integrado en el sistema: Windows Movie Maker. En Ubuntu un programa de prestaciones similares podría ser Pitivi que ya viene instalado a partir de la versión Ubuntu 10. La edición de video utilizando los programas referenciados excede la extensión y propósito de este curso. Por ese motivo se propone la utilización de un sencillo programa para crear un vídeo con una secuencia de fotografías. En Windows se plantea utilizar PhotoStory 3 y en Ubuntu Imagination. 5.2 PhotoStory (Fotos Narradas) en Windows 5.2.1 Instalación de Photostory En este apartado se propone el uso de Photo Story 3 (Fotos Narradas) para crear vídeos *.WMV a partir de imágenes y audios. Es una aplicación adecuada para compartir las fotografías tomadas durante una salida, fiesta o evento cultural. Para instalar este programa descarga y ejecuta el asistente de instalación PhotoStory.exe. Esta versión ha sido pensada para Windows XP SP2 pero también funciona en Windows Vista y 7. 5.2.2 Creación de una narración de fotos La creación de una narración con Photo Story consta de los siguientes pasos: 1. Importar y organizar imágenes. 2. Agregar título a las imágenes. 3. Agregar narraciones a las imágenes. 4. Personalizar movimiento de cada imagen. 5. Agregar música de fondo. 6. Guardar la narración. Paso 1. Importar y organizar imágenes 1.1 Importar imágenes 1. Descarga y descomprime el archivo paisajes.zip en una carpeta de tu equipo. Como resultado de esta extracción dispondrás de varias fotos en formato JPG con fotografías de paisajes asturianos. 2. Abre Photo Story. 3. En la pantalla inicial del asistente selecciona Iniciar una narración nueva y haz clic en Siguiente. Notas:  Photo Story guarda todos los detalles de una narración incluídas las imágenes y audios importados en un archivo de proyecto de extensión propia: *.WP3. Si desearas abrir y editar un proyecto deberías elegir la opción Editar un proyecto y pulsa en Siguiente>.  Para reproducir una narración guardada selecciona Reproducir una narración y haz clic en Siguiente >.
  • 481. Vídeo y animaciones ::: Edición de video 481 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. En el cuadro de diálogo Importar y organizar imágenes pulsa en el botón Importar imágenes … 5. Se muestra el Explorador de archivos. En el panel izquierdo haz clic sobre la carpeta paisajes. Al seleccionarlo en el panel derecho se mostrará su contenido. 6. Clic sobre el primer archivo de imagen mantén pulsada la tecla <Mayus> y sin soltarla, haz clic sobre el último archivo de imagen. De esta forma seleccionarás todas las fotografías que se utilizarán en la película. Clic en Aceptar. 7. Al cabo de unos instantes se mostrará la colección de imágenes disponibles.
  • 482. Vídeo y animaciones ::: Edición de video 482 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.2 Quitar bordes negros 8. Photo Story creará una película en formato 4:3. Si las fotos importadas, por sus dimensiones originales, NO se ajustan a esta proporcionalidad se añadirán por defecto bordes negros. Estos bordes se mostrarán en el monitor de visualización al elegir una miniatura en la lista. 9. Para eliminar estos bordes y ajustarlas a la proporción 4:3 de publicación final, haz clic sobre la primera miniatura de imagen de la lista. A continuación pulsa en el botón Quitar bordes negros. 10. En el cuadro Quitando bordes negros, Photo Story propone una opción de recorte de la primera imagen. En la ventana Antes puedes pulsar y arrastrar el área de visualización para definir manualmente el recorte. En la ventana Después se mostrará el aspecto que tendría la imagen tras aplicar el recorte definido. Clic en el botón Sí para confirmar la operación. Observa que el borde negro ha desaparecido.
  • 483. Vídeo y animaciones ::: Edición de video 483 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Para abandonar el asistente de recorte pulsa en el botón Cancelar. Para no aplicar recorte a la imagen pulsa en el botón No. En este caso se propone quitar los bordes negros a todas las fotografías. 11. Sólo si es necesario Photo Story propone la eliminación de bordes oscuros mediante recorte fotografía a fotografía. En cada caso haz clic sobre el botón Sí o bien pulsa en el botón Sí a todo para que realice esta operación en todas las fotos en un solo paso. Tras concluir la revisión de toda la lista se muestra un mensaje de confirmación. Pulsa en Aceptar. 12. Tras este proceso la lista de miniaturas mostrará un icono de edición debajo de cada imagen sobre la que se haya aplicado el recorte necesario para quitar los bordes negros. Este icono indica que la imagen ha sido modificada respecto al original. 13. Si fuese necesario quitar el recorte o bien definir un encuadre distinto, haz clic derecho sobre la miniatura correspondiente y elige Edición > Recortar. En el panel que se muestra con esa imagen, pestaña Girar y recortar, desactiva la opción Recortar para eliminar el recorte o pulsa directamente en el botón Restablecer para
  • 484. Vídeo y animaciones ::: Edición de video 484 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado recuperar la imagen original. También puedes arrastrar la marca de recorte para definir un nuevo encuadre. Para guardar los cambios pulsa en Guardar. Para salir descartando los cambios pulsa en Cerrar y luego confirma seleccionando No. 1.3 Manejar la lista de imágenes. 14. Para moverse por la lista de miniaturas utiliza los botones de flechas Retroceder/Avanzar situados a la derecha de esta lista o bien en las respectivas esquinas inferiores del monitor. Haz clic sobre una imagen de la lista para seleccionarla y visualizarla en el monitor. Para eliminar una imagen de la lista, selecciónala previamente y pulsa en el botón Eliminar ubicado en esta botonera derecha. 15. Para modificar el orden en que se mostrarán las imágenes, pulsa sobre una imagen y arrástrala sobre la lista para situarla por adelante o detrás en la lista.
  • 485. Vídeo y animaciones ::: Edición de video 485 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.4 Aplicar efectos 16. Haz clic sobre la primera imagen de la lista para seleccionarla. Ésta se visualizará en el monitor. 17. Pulsa en Edición … situado en la botonera inferior del Monitor. 18. Selecciona la pestaña Agregar efecto. En la lista Efecto: elige, por ejemplo, Resplandor difuso. No te resistas a probar el resto del catálogo. En la Vista Previa que acompaña podrás observar el aspecto tras aplicar cada uno de estos efetos. 19. Para confirmar la aplicación del efecto elegido pulsa en el botón Guardar. 20. Utiliza los botones de flechas Retroceder/Avanzar que aparecen en este panel para situarse en la siguiente fotografía de la lista sin necesidad de cerrar esta ventana. 21. Repite la secuencia de pasos 19-22 para eliminar el efecto aplicado sobre una imagen seleccionando en la lista de efectos : (ninguno) y luego pulsa en Guardar. Recuerda
  • 486. Vídeo y animaciones ::: Edición de video 486 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado que si pulsa Restablecer se perderán todos los cambios aplicados a la imagen: recortes, giros, autocorrecciones, etc. 1.5 Guardar proyecto … 22. Una vez terminada la edición de imágenes conviene guardar el proyecto. Para ello pulsa en el botón Guardar proyecto … situado debajo de la lista de imágenes. 23. En el cuadro Guardar como introduce un nombre de archivo. Por ejemplo: fotos. Photo Story añade automáticamente la extensión de archivo *.WP3. Este archivo se guardará por defecto en la carpeta Mis documentos > Mis vídeos. 24. Clic en Guardar para terminar. Repite los pasos 25-27 cada vez que desees guardar los cambios. De esta forma podrás abrirlo en otro momento y continuar en el punto donde lo dejaste. 25. Una vez importadas y organizadas las imágenes podemos continuar con la edición de nuestra narración. Para ello pulsa en el botón Siguiente > . Para retroceder a la anterior fase pulsa en < Atrás. Paso 2. Agregar títulos a las imágenes 1. En la fase Agregar títulos a las imágenes se podrán añadir textos explicativos a las imágenes si se estima oportuno. Sobre la lista de miniaturas haz clic en la primera imagen para seleccionarla.
  • 487. Vídeo y animaciones ::: Edición de video 487 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En el cuadro de texto introduce el título de la imagen: “Paisajes asturianos”. 3. Para situar el texto sobre la imagen pulsa en el botón Centrar horizontalmente. 4. Haz clic en el botón Alinear en la parte inferior. 5. Para modificar las propiedades de la fuente de letra, haz clic en el botón Seleccionar fuente. 6. En el cuadro Fuente selecciona Tamaño 14 y Color: Blanco. Pulsa en Aceptar. 7. Durante esta fase otra posibilidad es editar el efecto de imagen aplicado. Para ello basta con desplegar la lista de efectos situada en la base del monitor y elegir uno de ellos o bien la entrada (ninguno).
  • 488. Vídeo y animaciones ::: Edición de video 488 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: En lugar de añadir un título general para la película en la primera imagen (“Paisajes asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre cada una de las miniaturas de la lista y repetir la secuencia de pasos 2-6 de este apartado. No se ha propuesto agregar un título a cada imagen porque Photo Story no implementa por defecto movimiento a una imagen cuando se le incorpora un título. No obstante puedes probar a hacerlo y la película resultante mostrará una diapositiva detrás de otra sin animación de zoom en cada imagen. Nº Texto 1 Cubos de la memoria (LLanes) 2 Elogio al horizonte (Gijón) 3 Faro (Cudillero) 4 Hórreo asturiano (Pueblo de Asturias-Gijón) 5 Iglesia Santiago Apostol (Castropol) 6 Molino de río (Villaviciosa) 7 Santa María del Naranco (Oviedo) 8 Acantilados (Cabo Peñas) 8. Para pasar a la siguiente fase pulsa en el botón Siguiente > situado en la parte inferior de la ventana.
  • 489. Vídeo y animaciones ::: Edición de video 489 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 3. Agregar narraciones a las imágenes En esta fase se puede añadir una narración de voz a cada imagen. 3.1 Ajustar el volumen del micrófono y altavoces 1. Antes de comenzar a grabar conviene probar la configuración del volumen del micrófono y altavoces. Para ello pulsa en el botón Micrófono. 2. Se muestra la ventana de inicio del asistente. Clic en Siguiente
  • 490. Vídeo y animaciones ::: Edición de video 490 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Prueba de micrófono. Lee el párrafo que se sugiere en voz alta frente al micrófono. De este modo se ajustará automáticamente el volumen del micrófono. Clic en Siguiente >. 4. Prueba del altavoz. Lee sobre el micrófono el texto que se sugiere y escúchalo por el altavoz gracias al pequeño retardo con que se reproduce. Si se produjese algún acople o zumbido baja el deslizador de volumen de la columna Reproducción. 5. Finalización del asistente … Clic en Finalizar.
  • 491. Vídeo y animaciones ::: Edición de video 491 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.2 Grabar una narración 6. Haz clic en la primera miniatura de imagen de la lista para seleccionarla. A continuación pulsa en el botón Grabar Narración. 7. Habla en voz alta frente al micrófono: “Paisajes asturianos”. Para terminar pulsa en el botón Detener grabación. 8. A la derecha de la botonera de grabación se muestra la duración del audio grabado:
  • 492. Vídeo y animaciones ::: Edición de video 492 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Para visualizar cómo queda pulsa en el botón Vista previa… situado debajo de la botonera de grabación. 10. Cuando se añade una narración a una imagen, en la lista de miniaturas, mostrará un icono en forma de globo de texto en su esquina inferior izquierda. Notas:  Se puede incorporar un audio a cada fotografía siguiendo la información contenida en la tabla descriptiva siguiente. Para ello basta con hacer clic sobre cada una de las miniaturas de la lista y repetir la secuencia de pasos 6 y 7 de este apartado. Nº Texto 1 Cubos de la memoria (LLanes) 2 Elogio al horizonte (Gijón) 3 Faro (Cudillero) 4 Hórreo asturiano (Pueblo de Asturias-Gijón) 5 Iglesia Santiago Apostol (Castropol) 6 Molino de río (Villaviciosa) 7 Santa María del Naranco (Oviedo) 8 Acantilados (Cabo Peñas)  Para eliminar el audio grabado haz clic en el botón Eliminar narración y confirma el borrado 11. Clic en Guardar proyecto para asegurarnos de no perderlo. 12. Para pasar a la siguiente fase de producción pulsa en el botón inferior Siguiente>.
  • 493. Vídeo y animaciones ::: Edición de video 493 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 4. Personalizar movimientos de imagen 4.1 Movimiento de una imagen 1. Asegúrate de que estás situado en el paso Agregue narraciones a sus imágenes y personalice el movimiento del programa. 2. En la lista de miniaturas haz clic en la segunda imagen. 3. Pulsa en el botón Personalizar movimiento … situado debajo del monitor. Con ello podrás definir un movimiento de imagen distinto o bien corregir el que ha asignado Photo Story por defecto. En muchas ocasiones no es necesario realizar este ajuste por lo que se podría pasar directamente a la siguiente fase de elaboración. 4. En el cuadro de diálogo Personalizar movimiento … selecciona la pestaña Movimiento y duración. Como podrás comprobar Photo Story ha definido por defecto una posición inicial y final del movimiento. En el ejemplo recogido en la siguiente figura, la animación consistirá en un movimiento de apertura de zoom desde el encuadre señalado en la ventana Posición inicial hasta el encuadre señalado en Posición final. Este movimiento de zoom lo crea Photo Story automáticamente a partir de los encuadres definidos en el fotograma inicial y final así como el tiempo establecido. La duración de este movimiento se puede obtener restando los tiempos que aparecen en la esquina inferior izquierda de cada vista previa. En este ejemplo: 00:00:10,0-00:00:05,0 = 5 segundos. Notas:  Cuando en la posición inicial se define un encuadre más pequeño que en la posición final, el movimiento será un zoom de alejamiento en la transición del encuadre inicial al final.  Si en la posición inicial se define un encuadre más grande que en la posición final, el movimiento será un zoom de acercamiento.  Si en ambas posiciones se define un encuadre del mismo tamaño pero en diferente posición, el movimiento consistirá en una traslación sobre la imagen.  Si en ambas posiciones se define un encuadre del mismo tamaño y posición, no se apreciará movimiento en esa imagen.
  • 494. Vídeo y animaciones ::: Edición de video 494 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. En la mayoría de los casos la animación definida por defecto es aceptable. Sin embargo en algunas ocasiones es necesario corregir el encuadre inicial (del que parte el movimiento) o el final (hacia el que va). Para ello activa la casilla Especifique la posición inicial y final del movimiento. 6. En la Posición inicial coloca el puntero del ratón sobre el centro del encuadre y cuando el puntero tome el aspecto de una cruz de doble flecha, pulsa y arrastra para colocar el encuadre en otra posición sobre la fotografía. En este caso trata de centrar el encuadre respecto al monumento.
  • 495. Vídeo y animaciones ::: Edición de video 495 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Si marcas la opción Establecer que la posición inicial coincida con la posición final de la imagen anterior entonces el tamaño y posición del encuadre coincidirá con el utilizado en la posición final de la imagen anterior. En este caso no es necesario. 8. Si marcas la opción Establecer que la posición final sea la misma que la posición inicial entonces el tamaño y posición del encuadre será el mismo tanto en la posición inicial como final. Si lo dejas así esta imagen no tendrá animación durante su visualización. En este caso tampoco es necesario. 9. Para aumentar o disminuir de tamaño del encuadre, tanto en la posición inicial como final, pulsa y arrastra con el ratón sobre un selector de recorte situado en una esquina. 10. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón Vista previa … 11. Si eliges la opción Establecer la duración automáticamente, Photo Story ajustará la duración del movimiento en función del tamaño del encuadre tanto en la posición inicial como la posición final. Este valor oscilará entre 5 y 8 segundos. Sin embargo si deseas definir la duración manualmente, selecciona la opción Número de segundos para mostrar la imagen y en el contador numérico define la duración en segundos.
  • 496. Vídeo y animaciones ::: Edición de video 496 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 12. Para recuperar el encuadre definido por defecto por Photo Story pulsa en el botón Restablecer. 13. Para guardar los cambios pulsa en el botón Guardar. 14. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente. Utiliza distintos tipos de transiciones. Observa que si al modificar una transición, tratas de ir a la siguiente imagen, Photo Story te pedirá confirmación para guardar los cambios introducidos. 4.2 Transición de una imagen a otra. 15. Desde la ventana Personalizar movimiento haz clic sobre la pestaña Transición. 16. Photo Story define por defecto una transición Fundido en el paso de una imagen a otra. En la parte superior del panel Transición observa que la casilla Iniciar imagen actual usando una transición está activada. Si la desactivas el paso de una imagen a otra se realizará sin transiciones. Debajo podrás observar una vista previa de la Imagen anterior y de la Imagen actual. En el centro se puede visualizar dinámicamente el efecto de Transición elegido en la evolución desde la imagen anterior a la imagen actualmente seleccionada. 17. Para modificar el modo de transición pulsa sobre otra en la lista de Transiciones. Por ejemplo: Estrella, hacia fuera. Observa que la transición elegida en cada caso muestra un recuadro gris más ancho que el resto.
  • 497. Vídeo y animaciones ::: Edición de video 497 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 18. Para ver cómo va quedando el movimiento de animación definido haz clic en el botón Vista previa … 19. Si eliges la opción Establecer duración de la transición automáticamente, Photo Story ajustará la duración de la misma. Sin embargo si deseas definir la duración manualmente, selecciona la opción Número de segundos para mostrar la transición y en el contador numérico define la duración en segundos. 20. Para recuperar la transición definida por defecto por Photo Story pulsa en el botón Restablecer. 21. Para guardar los cambios pulsa en el botón Guardar. 22. Para personalizar la transición en el resto de imágenes sin necesidad de cerrar esta ventana, utiliza los botones Ir a la imagen anterior e Ir a la imagen siguiente. Utilízalos para definir distintas transiciones sobre cada imagen. 23. Una vez terminada la edición de transiciones, observa que en la lista de miniaturas se marcan con un icono de dos rectángulos entrelazados aquellas imágenes que tienen una transición distinta al Fundido. 24. Haz clic en el botón Siguiente para pasar a la siguiente fase de creación de la película.
  • 498. Vídeo y animaciones ::: Edición de video 498 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 5. Agregar música de fondo 1. En la lista de miniaturas haz clic sobre la primera imagen para añadir música de fondo a partir de ésta. 2. Clic en Seleccionar música … si deseas integrar la música contenida en un archivo *.MP3, *.WAV o bien *.WMA (Windows Media Audio). En este caso vamos a añadir como música de fondo una composición musical creada desde Photo Story. Para ello pulsa en el botón Crear música … 3. En el cuadro de diálogo Crear música selecciona siguiendo el siguiente orden de concreción creciente: Género, Estilo, Grupos y Ambientes. Por ejemplo: Banda sonora-Cueva misteriosa-Sitar-Aventurero. Arrastra el deslizador del Ritmo para aumentar/disminuir el ritmo o bien elige Intensidad (Baja, Normal y Alta). Una vez definidas las propiedades de la música, haz clic en Reproducir para escuchar el resultado antes de aplicarlo a la película.
  • 499. Vídeo y animaciones ::: Edición de video 499 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Una vez elegida la música, clic en Aceptar. 5. En la lista de miniaturas ahora se indica con el icono de nota musical sobre la base de la imagen donde comienza la música de fondo y sobre la lista el alcance e información de la banda sonora definida. 6. Para modular el volumen de reproducción de esta música arrastra el deslizador Volumen: que aparece en este panel hasta una posición intermedia entre Bajo y Alto. Notas:  Se pueden incluir distintas músicas en una misma película. Para ello selecciona otra imagen en la lista de miniaturas y repite la secuencia de pasos 3-4. A partir de esta nueva imagen hasta el final se añadirá la nueva música.  Para ver cómo queda el resultado final pulsa en el botón Vista previa … Observa cómo Photo Story ajusta la melodía a la duración de la película asegurando un final rítmico o en desvanecimiento de volumen adecuados.  Para eliminar una música de fondo, haz clic sobre la imagen donde comienza y pulsa en el botón Eliminar música … que aparece en este panel.
  • 500. Vídeo y animaciones ::: Edición de video 500 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Pulsa en el botón Guardar proyecto … para guardar los cambios producidos en el proyecto *.WP3. 8. Para continuar con la edición, haz clic en el botón Siguiente> Paso 6. Guardar la narración En esta fase se genera la película o narración final y se guardar en formato *.WMV 1. En la lista Actividades pulsa sobre Guardar la narración para reproducirla en el equipo.
  • 501. Vídeo y animaciones ::: Edición de video 501 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En el área Nombre de archivo, Photo Story propone el nombre de proyecto como nombre de archivo WMV para la publicación final. En el caso que nos ocupa: fotos.wmv. Por defecto lo sitúa dentro de la carpeta Mis documentos > Mis vídeos. Si deseas modificar el nombre del archivo modifícalo en el cuadro de texto conservando la ruta a esta carpeta. Si deseas cambiar la carpeta destino, haz clic en el botón Examinar … y localiza otra ubicación. 3. Para definir la Configuración de calidad del archivo de video final WMV pulsa en el botón Configuración … 4. En el cuadro de diálogo Configuración selecciona un Perfil en la lista. Por ejemplo: Perfil para equipos: 2 (640x480 Píxeles). En la sección Detalles se muestran los detalles que cumplirá el archivo producido en relación con Tipo de archivo, Velocidad de bits, Tamaño de pantalla, Relación de aspecto y Fotogramas por segundo. La elección del perfil se debe realizar en función del destino que tendrá el video final: Internet, red local, equipo local, etc. y de la calidad inicial de las
  • 502. Vídeo y animaciones ::: Edición de video 502 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado fotografías utilizadas. Si por ejemplo partimos de imágenes de dimensiones 640x480 píxeles, la calidad del vídeo no puede superar estas dimensiones. 5. Para concluir pulsa en Aceptar. 6. Antes de iniciar la exportación debes guardar el proyecto pulsando desde aquí el botón Guardar proyecto … 7. Una vez definidos los distintos parámetros de calidad del vídeo, pulsa en el botón Siguiente. 8. Tras unos segundos de espera se mostrará el mensaje de Finalización. 9. En la pregunta ¿Qué desea hacer a continuación? puedes responder Ver la narración o bien pulsa en el botón Salir. Notas:  Si has seguido los pasos indicados la película se encontrará en la carpeta Mis documentos > Mis vídeos con el nombre fotos.wmv.  Desde la pantalla de Finalización puedes pulsar en < Atrás para regresar a la pantalla anterior Guardar la narración. Desde ellas puedes generar otros archivos WMV con distintas calidades (cada una con un nombre distinto) siguiendo la secuencia de pasos 1-6 indicada en este apartado.
  • 503. Vídeo y animaciones ::: Edición de video 503 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5.3 Imagination en Ubuntu 5.3.1 Instalación de Imagination Imagination es un programa ligero y amigable que permite crear presentaciones de diapositivas a partir de fotografías. Solo necesita el codificador ffmpeg y produce un vídeo que se puede estampar en un DVD con otra aplicación. Dispone de 50 efectos de transición aprox. También soporta la exportación del video al formato FLV. Para instalar este programa desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. En el buscador introduce el término imagination y en el ítem de instalación correspondiente pulsa en el botón Instalar. 5.3.2 Creación de una narración de fotos La creación de una narración con Imagination consta de los siguientes pasos: 1. Importar y organizar imágenes. 2. Agregar textos a las imágenes. 3. Personalizar movimiento de cada imagen. 4. Agregar música de fondo. 5. Exportar a un archivo de vídeo FLV Paso 1. Importar y organizar imágenes 1.1 Importar imágenes 1. Descarga y descomprime el archivo paisajes.zip en una carpeta de tu equipo. Como resultado de esta extracción dispondrás de varias fotos en formato JPG con fotografías de paisajes asturianos. 2. Abre Imagination mediante Aplicaciones > Sonido y vídeo > Imagination. 3. Haz clic en el botón Importar imágenes o bien en la barra de menús selecciona Presentación > Importar imágenes. 4. En el cuadro de diálogo Importar diapositivas … busca la carpeta donde has descomprimido las imágenes. Haz clic en la primera imagen, pulsa la tecla Mayus y luego haz clic en la última imagen. De esta forma se realiza una selección múltiple.
  • 504. Vídeo y animaciones ::: Edición de video 504 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Se muestra la secuencia de imágenes importadas. 1.2 Manejar la lista de imágenes. 6. Para moverse por la lista de imágenes utiliza los botones de flechas Ir al primero | Anterior | Siguiente | Ir al último situados en la barra de herramientas superior. Haz clic sobre una imagen de la lista para seleccionarla y visualizarla en el monitor. 7. Para eliminar una imagen de la lista, selecciónala previamente en el listado inferior y pulsa la tecla Supr o bien elige Diapositiva > Eliminar. 8. En todo momento se puede comprobar el aspecto que va tomando la presentación de diapositivas pulsando en el botón de flecha verde o play. 9. Para modificar el orden de las imágenes puedes arrastrar y soltar las miniaturas de un lado para otro en este listado.
  • 505. Vídeo y animaciones ::: Edición de video 505 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.3 Guardar presentación. 10. Conviene guardar el proyecto. Para ello selecciona Presentación > Guardar proyecto como … 11. En el cuadro de diálogo Guardar un proyecto de presentación … introduce el nombre de la presentación. Por ejemplo: miPresentacion y haz clic en el botón Guardar. Se genera un archivo que contiene toda la información necesaria para generar la presentación de imágenes. Conviene repetir estos pasos cuando se deseen guardar los cambios realizados. Paso 2. Agregar textos a las imágenes 12. Para agregar un texto a una imagen, selecciona previamente la imagen en el listado para que se visualice en el visor. A continuación sobre el panel Texto de las diapositivas introduce el texto “Paisajes asturianos”. 13. Pulsa en el botón que especifica el Tipo y tamaño de la fuente. Elige como tipo de fuente Sans Bold y como tamaño 36 píxeles. 14. Haz clic en el botón Posición del subtítulo para elegir la alineación horizontal y vertical de entre las nueve posiciones diferentes. Ejemplo: inferior-centrado. 15. Se puede definir un tipo de Animación para el texto y una Velocidad de la animación. En este caso no elegiremos ninguna. Nota: En lugar de añadir un título general para la película en la primera imagen (“Paisajes asturianos”), se podría haber incorporado un título explicativo en cada foto siguiendo la información que se proporciona en la tabla siguiente. Para ello basta con hacer clic sobre cada una de las miniaturas de la lista y repetir la secuencia de pasos de este apartado. No se propone agregar un título a cada imagen. No obstante puedes probar a hacerlo y la película resultante mostrará una diapositiva detrás de otra donde cada una exhibirá el texto explicativo correspondiente.
  • 506. Vídeo y animaciones ::: Edición de video 506 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nº Texto 1 Cubos de la memoria (LLanes) 2 Elogio al horizonte (Gijón) 3 Faro (Cudillero) 4 Hórreo asturiano (Pueblo de Asturias-Gijón) 5 Iglesia Santiago Apostol (Castropol) 6 Molino de río (Villaviciosa) 7 Santa María del Naranco (Oviedo) 8 Acantilados (Cabo Peñas) 16. No olvides guardar el proyecto haciendo clic en el botón Guardar la presentación … para asegurarnos de no perderlo. Paso 3. Personalizar movimientos de imagen 3.1 Movimiento de una imagen 17. Para cada imagen se puede definir una animación que consiste en un movimiento de zoom. Selecciona la segunda fotografía del listado en esta presentación y en el panel Movimiento de las diapositivas arrastra el deslizador del Zoom para definir un zoom de 1.5 y pulsa en el botón Añadir y a continuación en el botón Actualizar. Esta acción añade una diapositiva nueva a continuación de la diapositiva original donde la imagen se muestra aumentada en el zoom indicado. 18. Al generar la presentación de diapositivas, el programa Imagination generará automáticamente el movimiento de transición de una diapositiva a otra. A cada imagen se le pueden añadir tantas diapositivas como se desee con distintos valores de magnificación. La navegación sobre cada diapositiva asociada a cada imagen se realiza utilizando los botones de flechas que aparecen en el apartado Detener punto. 19. En cada estado de zoom de una imagen se puede definir su tiempo de duración en el combo Duración.
  • 507. Vídeo y animaciones ::: Edición de video 507 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3.2 Transición de una imagen a otra. 20. Para definir la transición en el paso de una imagen a la siguiente, selecciona la imagen y despliega el combo Tipo de transición para elegir un tipo. Otra opción es pulsar en el botón Aleatorio. 21. Una vez definido un tipo de transición se puede establecer la velocidad de transición. 22. Otra opción es definir la Duración de la diapositiva en segundos. Por ejemplo: 4 segundos en cada diapositiva. Paso 4. Agregar música de fondo 23. Descarga y descomprime el archivo fondo_musica.zip. Como resultado obtendrás el archivo fondo_musica.ogg. Imagination no importa directamente audio en formato MP3 por cuestiones legales. 24. Clic en el botón Importar música o bien seleccionando en el menú Presentación > Importar música. 25. Elige el archivo fondo_musica.ogg y pulsa en el botón Abrir. 26. Se pueden añadir distintos archivos de audio para crear la banda sonora de fondo. Con los botones situados en la parte inferior de este listado de audios se puede modificar el orden de reproducción de esos audios y también eliminar los audios seleccionados.
  • 508. Vídeo y animaciones ::: Edición de video 508 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 27. Pulsa en el botón Guardar la presentación de diapositivas. Paso 5. Exportar a un archivo de vídeo FLV 28. Elige Presentación > Exportar > FLV (Flash Video). 29. En el cuadro de diálogo Exportar FLV introduce el Nombre de la presentación de diapositivas, por ejemplo, miPresentacion. Elige el Tamaño del vídeo (Normal o Panorámico) y dentro de cada uno el tamaño estándar adecuado a ese ratio. También puedes elegir la Calidad del vídeo (baja,media o alta). Para terminar pulsa en el botón Aceptar. 30. Al cabo de unos instantes se habrá generado el archivo de vídeo FLV que contiene la secuencia de diapositivas. El archivo FLV se puede reproducir utilizando el programa VLC Media Player.
  • 509. Vídeo y animaciones ::: Conversión de formatos de vídeo 509 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Conversión de formatos de vídeo
  • 510. Vídeo y animaciones ::: Conversión de formatos de vídeo 510 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.1 Propiedades de un vídeo con MediaInfo MediaInfo es un programa gratuito que permite visualizar las propiedades y metadatos de un archivo de audio o vídeo. 6.1.1 Información de un archivo multimedia que proporciona MediaInfo?  Metadatos generales del archivo: título, autor, director, album, número de pista, fecha, duración, etc  Vídeo: códec, bitrate, fotogramas por segundo, aspecto, etc.  Audio: codec, velocidad de muestreo, canales, idioma, bitrate, etc.  Texto: idioma de subtítulos.  Capítulos: número y lista de capítulos. Cuando el reproductor que estamos utilizando no es capaz de visualizar un archivo de audio o de vídeo por un problema de códecs, MediaInfo es una interesante aplicación porque permite obtener toda la información de ese archivo. Incluso proporciona una dirección en Internet donde es posible encontrar un reproductor o códec con que se pueda visualizar. 6.1.2 Formatos de archivo leídos MediaInfo  Video: MKV, OGM, AVI, DivX, WMV, QuickTime, Real, MPEG-1, MPEG-2, MPEG-4, DVD (VOB)...  Audio: OGG, MP3, WAV, RA, AC3, DTS, AAC, M4A, AU, AIFF...  Subtítulos: SRT, SSA, ASS, SAMI... 6.1.3 ¿Para qué se utiliza MediaInfo?  Leer múltiples formatos de archivo de vídeo y de audio.  Mostrar la información técnica y de metadatos en forma de texto, árbol, html, …  Exportar esta información como texto.  Integración de MediaInfo en el explorador de archivos de Windows 6.1.4 Instalación de MediaInfo en Windows Para conocer las propiedades de un archivo de audio o de vídeo se propone el uso del software gratuito MediaInfo (http://mediainfo.sourceforge.net/es). 1. Descarga y descomprime a tu disco duro o pendrive el archivo MediaInfo_GUI_0.7.20_Windows_i386.zip. Es una versión que no necesita instalación. En la web oficial podrás acceder a una versión instalable en el equipo. 2. Accede al interior de esta carpeta y haz doble clic sobre el archivo ejecutable MediaInfo.exe 6.1.5 Instalación de MediaInfo en Ubuntu 1. Selecciona Aplicaciones > Centro de software de Ubuntu 2. Introduce el término mediainfo en el buscador de aplicaciones. 3. Clic en el botón Instalar del ítem Mediainfo supplies …
  • 511. Vídeo y animaciones ::: Conversión de formatos de vídeo 511 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Para acceder al programa elige Aplicaciones > Sonido y vídeo > MediaInfo 6.1.6 Uso de MediaInfo 1. Descarga y descomprime el archivo flv.zip a la carpeta del disco duro. Repite el mismo proceso para el archivo dteatro_divx.zip. Como resultado de esta tarea dispondrás en la menciona carpeta de los archivos: dteatro.flv y dteatro_divx.avi 2. Inicia el programa y luego selecciona Archivo > Abrir archivo para localizar y abrir uno de los archivos multimedia descargados anteriormente, p.e., dteatro.flv. 3. Se mostrará la ventana de MediaInfo donde se puede leer la infomación relativa al archivo abierto. 4. Repite los pasos 2 y 3 para el archivo dteatro_div.avi.
  • 512. Vídeo y animaciones ::: Conversión de formatos de vídeo 512 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Observa que al abrir un archivo de vídeo con MediaInfo se ofrece un botón de SitioWeb con enlace a una web donde se pueden obtener los códecs o reproductor necesarios para reproducir ese archivo en nuestro equipo. 6.2 Conversión de formatos de vídeo con WinFF 6.2.1 ¿Qué es WinFF? WinFF es un convertidor gratuito de formatos de vídeo para sistemas windows, linux y mac. Permite convertir un vídeo de un formato a otro de una forma fácil, rápida y en un solo paso. Este programa ofrece al usuario un interfaz gráfico aunque en realidad la tarea de conversión se traslada automáticamente a una línea de comandos para que la ejecute ffmpeg, otro programa muy efectivo pero que sólo se puede utilizar mediante línea de comandos. De esta forma WinFF nos evita tener que conocer y escribir la sintaxis de ffmpeg en una ventana de terminal. 6.2.2 Instalación de WinFF en Windows  Descarga y ejecuta el instalador de WinFF para Windows: winff-1.3.1-setup.exe. El programa se instalará en la carpeta de Archivos de programa y se creará un icono de acceso directo en el escritorio.  En el sitio web oficial del proyecto WinFF podrás encontrar la versión más reciente o que se adapta a tu sistema: http://winff.org/ 6.2.3 Instalación de WinFF en Ubuntu 1. Desde el escritorio de Ubuntu selecciona Aplicaciones > Centro de software de Ubuntu. 2. Introduce el término WinFF en el cuadro de búsqueda y haz clic en el icono de lupa que le acompaña. 3. Haz clic en el botón Instalar del ítem de instalación WinFF
  • 513. Vídeo y animaciones ::: Conversión de formatos de vídeo 513 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.4 Conversión de un vídeo a distintos formatos 1. Descarga y descomprime el archivo wmp.zip a la carpeta personal. Como resultado de la extracción obtendrás el archivo de vídeo: dteatro.wmv. 2. Abre WinFF. 3. En la ventana de WinFF pulsa en el botón Añadir y navega para localizar, señalar y abrir el archivo dteatro.wmv. Otra posibilidad es utilizar el explorador de archivos y arrastrar el icono de este archivo de vídeo desde su carpeta para soltarlo sobre la ventana de WinFF. Esta aplicación admite la conversión por lotes de un listado de archivos de vídeo con sólo añadirlos a esta lista. 4. En este caso vamos a convertir el archivo de vídeo fuente al formato FLV de Video Flash. En la lista desplegable Convertir a… selecciona la opción WebSites. A continuación despliega la lista Elegir variante para seleccionar Flash Vídeo (flv) for Web use Fullscreen . Si pulsas en el botón Ajustes se mostrará en la parte inferior distintos parámetros de la conversión que se pueden personalizar. En este caso NO es necesario. 5. En el cuadro Carpeta destino se indica la carpeta donde se guardará el archivo de vídeo final. 6. Para iniciar la conversión pulsa en el botón Convertir.
  • 514. Vídeo y animaciones ::: Conversión de formatos de vídeo 514 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6.2.5 Reproducir el vídeo FLV 1. Abre el reproductor: Aplicaciones > Sonido y Vídeo > VLC media player. Este reproductor es una excelente aplicación para visualizar vídeos FLV de Flash. 2. Selecciona Archivo > Abrir rápido Archivo para navegar a la carpeta donde se encuentra almacenado el nuevo archivo. Selecciónalo y pulsa en el botón Abrir. Otra posibilidad es utilizar el explorador de archivos y arrastrar el icono de este archivo de vídeo desde su carpeta para soltarlo sobre la ventana de VLC Media Player.
  • 515. Vídeo y animaciones ::: El DVD como fuente de vídeo 515 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. El DVD como fuente de vídeo
  • 516. Vídeo y animaciones ::: El DVD como fuente de vídeo 516 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.1 Extracción con ATG en Windows 7.1.1 Introducción En este apartado se propone un procedimiento para convertir el vídeo de un DVD a un archivo AVI con códec DivX o XviD. A partir de este AVI es posible extraer un fragmento y convertirlo en un formato más propio de publicación web: FLV, WMV, MOV o RAM. Otra posibilidad es la grabación del archivo AVI resultante en un CD-ROM utilizando un programa de grabación de CDs. Esta segunda opción es habitual en la realización de copias de seguridad de DVDs. En el mercado actual casi todos los reproductores DVD incorporan la prestación de la lectura de CDs y DVDs con archivos AVI DivX y XviD. Nota importante: El software e instrucciones recogidas en este capítulo se proponen como método para realizar copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no comercial. En cualquier caso esta información NO se expone para ser usada como herramienta para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y propiedad intelectual legalmente establecidos. 7.1.2 Software necesario DVD Decrypter. La conversión de una película de DVD en otro formato no se puede realizar a partir de la unidad lectora de DVDs. El elevado número de accesos que esta operación necesita podrían dañar esta unidad por sobrecalentamiento. Por este motivo siempre es necesario copiar el contenido del DVD al disco duro. Esta copia de archivos no se puede realizar mediante copiar y pegar usando el Explorador de Windows porque a menudo se encuentran encriptados. Es necesario un programa que desencripte los archivos del DVD y los copie al disco duro. En esta operación no supone ninguna pérdida en la calidad del vídeo. En la actualidad existen algunos programas que realizan esta tarea. Por su facilidad y compatibilidad se propone DVD Decrypter. Se puede descargar de forma gratuita del sitio Free-Codecs.com (http://www.free-codecs.com/) Versión portable. Descarga y descomprime el archivo DVDDecrypter.exe en una carpeta de tu disco duro o pendrive. Se trata de una versión portable del programa que se inicia al ejecutar el archivo DVDDecrypter.exe que aparece dentro de esa carpeta. Auto Gordian Knot Auto Gordian Knot (http://www.autogk.me.uk/) es un paquete de programas que automatiza muchas de las operaciones necesarias para realizar la conversión DVD-AVI. Auto Gordian Knot es un programa gratuito que se descarga de su web oficial. Versión instalable. Descarga e instala el programa en tu equipo a partir del instalador: AutoGordianKnot.2.55.Setup.exe. Versión portable. Otra opción alternativa es la versión portable. Descarga y descomprime el archivo AutoGordianKnot_2.55.exe en una carpeta de tu disco duro o pendrive. En este caso el programa se inicia al ejecutar el archivo AutoGK.exe que aparece dentro de esa carpeta.
  • 517. Vídeo y animaciones ::: El DVD como fuente de vídeo 517 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.1.3 Pasos para convertir DVD a AVI 1. Copiar el DVD al disco duro con DVD Decrypter. 2. Cargar los archivos originales. 3. Seleccionar pista de audio y subtítulos. 4. Definir tamaño del fichero. 5. Configurar parámetros avanzados. 6. Crear película. A continuación se explican con detalle cada uno de estos pasos. Paso 1. Copiar el DVD al disco duro 1. Introduce el disco DVD en la unidad lectora. 2. Inicia del programa DVD Decrypter. 3. En la lista Source (Origen) selecciona la unidad lectora donde has introducido el DVD. En el marco derecho aparecerán todos los archivos que contiene. Notas:  Unidad lectora de DVD no detectada. A veces el DVD Decrypter no detecta la unidad de DVD y en consecuencia no está disponible en la lista Source. Esto suele deberse a que no están instalados los drivers ASPI correspondientes a esa unidad DVD. ASPI significa Advanced SCSI Programming Interface y es el software que gestiona la comunicación entre el ordenador y el dispositivo lector. Para resolver este problema basta con descargar los drivers ASPI de Windows, descomprimir el ZIP y ejecutar el programa aspiinst.exe que contiene. Estos drivers se pueden descargar desde la web oficial de Adaptec (http://www.adaptec.com). La denominación exacta de este software es: Windows ASPI drivers version v4.71.2 y se pueden aplicar a todos los sistemas Windows a partir de la versión 98.  Disco DVD bloqueado. En alguna ocasión será necesario, antes de ejecutar DVD Decrypter, introducir el disco en el lector y a continuación abrir el reproductor de que dispongamos para visualizar DVDs (por ejemplo WindDVD o PowerDVD). De esta forma conseguiremos liberar las claves de los archivos protegidos. Cerramos el reproductor y abrimos DVD Decrypter. 4. DVD Decrypter tiene dos modos de trabajo: modo File (Archivo) donde trabaja con los archivos del DVD y modo IFO donde trabaja con los contenidos del DVD (capítulos, pistas, extras, etc). En este caso es necesario trabajar en modo IFO para lo cual en la barra de menú de DVD Decrypter selecciona Mode > IFO
  • 518. Vídeo y animaciones ::: El DVD como fuente de vídeo 518 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Al activar este modo se mostrarán los contenidos del DVD: (Chapter 1, 2, … = Capítulo 1, 2, …) en lugar de los archivos. 5. Al activar el modo IFO, DVD Decrypter selecciona automáticamente la pista de mayor duración que es la que suele contener la película. El resto de pistas se corresponden con los créditos, tomas falsas y extras que acompañan. En la pestaña Input (Entrada) comprueba que está seleccionada la película (la pista de mayor duración) y que debajo se encuentran seleccionados todos los capítulos (Chapter 1, 2, 3, …). 6. En el marco Destination (Destino) haz clic sobre el icono de carpeta con lupa para definir la carpeta del disco duro donde se guardarán los contenidos del DVD. Por ejemplo en la carpeta C:video o bien D:video si dispones de un segundo disco duro o partición. 7. Es importante realizar la siguiente comprobación. En la barra de menús de DVD Decrypter selecciona Tools > Settings (Herramientas > Configuración). En la pestaña IFO Mode (Modo IFO) dentro de la sección Create Additional Files (Crear Archivos Adicionales), comprueba que la casilla Stream Information (Información de Stream) está activada. Esto producirá en el disco duro un fichero de texto con toda la información del DVD necesaria para que AutoGK concluya con éxito. 8. Desde la ventana principal de DVD Decrypter, pulsa en la pestaña Stream Processing (Procesamiento del Flujo). Se puede activar la casilla Enable Stream Processing (Permitir Procesamiento del Flujo) y desmarcar, por ejemplo, el audio en inglés para que sólo se copie el audio en español. Para extraer del DVD sólo el vídeo o sólo el audio, activa la casilla Enable Stream Processing, seleccionaríamos sólo la pista deseada y en el área Stream: N/A que aparece en el panel inferior activamos la opción Demux. Si eliges un audio AC3, se creará un archivo de audio AC3; si eliges un vídeo, se creará un MPEG-2 sin audio; si eliges una pista de subtítulos (Subtitle) se
  • 519. Vídeo y animaciones ::: El DVD como fuente de vídeo 519 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado crearán dos archivos: IFO y VOB (son subtítulos en modo imagen que luego se puede pasar a texto con la aplicación SubRip). En un principio se recomienda dejar activadas todas las pistas. 9. En la pestaña Stream Processing se muestran los principales datos del DVD:  Dimensiones del vídeo: 720x576  Proporción: 16:9  Sistema de vídeo: PAL.  Número de la pista de audio en Español: 0x81 (pista 2 en el orden de arriba/abajo). 10. Para iniciar el proceso pulsa en el botón Decrypt (Desencriptar). 11. Una vez finalizado el proceso se mostrará el mensaje Operation Successfully Completed! (Operación Completada con Éxito). Pulsa en el botón Aceptar. 12. Cierra la ventana del programa DVD Decrypter.
  • 520. Vídeo y animaciones ::: El DVD como fuente de vídeo 520 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Paso 2. Cargar los archivos originales 1. Abre Auto Gordian Knot. 2. Como podrás observar AutoGK es un programa que simplifica en 4 pasos (steps) la conversión DVD-AVI:  Step 1: Select input source and output file (Paso 1: Elegir fuente de entrada y archivo de salida).  Step 2: Select audio track and subtitle track. (Paso 2: Elegir pista de audio y pista de subtítulos).  Step 3: Select output size (Paso 3: Elegir tamaño de salida).  Step 4 (optional): advanced parameters (Paso 4 –opcional-: parámetros avanzados). 3. En la sección Step 1: Select input source and output file (Paso 1: Elegir fuente de entrada y archivo de salida) En “Input directory” localiza el archivo *.VOB que has capturado del DVD anteriormente. 4. En el cuadro de texto Input directory (Carpeta de entrada), pulsa en el icono situado a la derecha que muestra una flecha verde sobre una carpeta.
  • 521. Vídeo y animaciones ::: El DVD como fuente de vídeo 521 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Se muestra el cuadro de diálogo Buscar carpeta. En él debes localizar el archivo video situada en el disco duro donde has guardado los archivos importados con DVD Decrypter. Clic en el botón Aceptar. Observa que cuando AutoGK detecta los archivos de DVD situados en esta carpeta, en el cuadro inferior de esta sección muestra la información del vídeo. En este caso: PAL – 720x576 – 16:9 – 25 fps 6. En el cuadro de diálogo Output file: (Archivo de Salida), se completa automáticamente con el mismo nombre de archivo y la extensión *.avi. Para modificar la carpeta de destino y el nombre de archivo pulsa en el icono que muestra la flecha verde sobre una carpeta. 7. Se muestra el cuadro de diálogo Guardar como. En la lista Guardar en: define la carpeta destino donde se guardará el archivo AVI final. Por ejemplo dentro de la carpeta video. En la casilla Nombre introduce un nombre de archivo para este AVI. Por ejemplo: video. AutoGK añadirá automáticamente la extensión AVI. Pulsa en el botón Aceptar para concluir. Paso 3. Seleccionar pista de audio y subtítulos 1. En la sección Step 2: Select audio track and subtitle track. (Paso 2: Elegir pista de audio y pista de subtítulos), podrás seleccionar el audio/audios y también los subtítulos. 2. En la lista Audio track(s) (Pistas de Audio), selecciona la pista o pistas de audio que deseas exportar al archivo de vídeo final. Pueden existir varias procedentes del DVD. Las pistas disponibles en esta lista dependerán de las ofrecidas por el DVD original y del tipo de importación realizada con DVD Decrypter. Si no deseas incorporar no marques ninguna pista. 3. En la lista Subtitle track(s) (Pista de Subtítulos) elige No Subtitles (Ningún Subtítulo). En este cuadro podrías elegir una de las pistas de subtítulos disponibles. Paso 4. Definir el tamaño del fichero 1. En la sección Step 3: Select output size (Paso 3: Elegir tamaño de salida), podemos seleccionar el tamaño final que ocupará el archivo. Cuanto mayor sea, mejor será la calidad del archivo final. 2. Activa la opción Predefined size (Tamaño predefinido) y en la lista desplegable selecciona la entrada 1 CD (700 Mb) o bien 2 CDs(1400 Mb). En este caso se recomienda esta segunda opción ya que suele ofrecer una relación peso/calidad muy interesante. Al final obtendremos tantos ficheros como CDs hayamos marcado. Esto permitirá grabar en CD los archivos resultantes de esta conversión. 3. Si seleccionas la opción Custom size (MB) (Tamaño personalizado (MB)), podrás definir el tamaño que tendrá la película final. AutoGK creará un archivo AVI con este tamaño y si es superior a 700 Mb, también producirá los archivos resultantes de haber
  • 522. Vídeo y animaciones ::: El DVD como fuente de vídeo 522 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado fragmentado éste en trozos de peso igual o inferior a 700 Mb. Esto facilitará la copia en soporte CD. 4. Si seleccionas la opción Target Quality (in percentage) (Calidad Destino (en porcentaje)), podrás seleccionar el % de calidad que tendrá el archivo final con independencia del peso del archivo. Paso 5. Configurar parámetros avanzados 1. En la sección Step 4 (optional): advanced parameters (Paso 4 –opcional-: parámetros avanzados), podremos configurar opcionalmente algunos parámetros de la película final. Pulsa en el botón Advanced Settings (Configuración avanzada). En el botón “Advanced Settings” se accede a la configuración de los parámetros avanzados 2. En el cuadro Advanced Options (Opciones Avanzadas) se puede configurar:  Output resolution settings (Configuración Resolución Vídeo). Permite definir la anchura o resolución horizontal del vídeo (la vertical será calculada automáticamente en función de la proporción de la película). Si se selecciona Auto width (Anchura automática), AutoGK calculará la resolución más óptima en función de un test de compresibilidad. Es la opción recomendada. Si se elige Minimum width (Anchura mínima) o bien Maximum width (Anchura máxima) y en el contador derecho se define una anchura –por ejemplo, 640 píxeles- entonces la resolución horizontal que utilizará AutoGK para crear la película final será como mínimo o como máximo respectivamente el valor indicado. Si marcas la opción Fixed width (Anchura Fija), la película tendrá exactamente como resolución horizontal la cantidad de píxeles indicada.  Output audio type (Tipo de Audio de Salida). Permite definir el tipo de audio que deseamos en la película: AC3, VBR MP3 (bitrate variable) o bien CBR MP3. En la mayoría de los casos la opción recomendada es Auto. Si eliges la opción Auto (Automática), para archivos de 700 Mb o menos, el audio será: VBR MP3 a 128 Kbps. Sin embargo para archivos superiores a 700 Mb, el formato de audio será AC3. Si hemos incluído dos pistas de audio y aquí hemos configurado un tipo concreto de audio, ambos tendrán ese formato: ambas AC3 o bien ambas MP3. Si existen dos pistas de audio y aquí elegimos Auto, entonces la primera tendrá formato AC3 y la segunda MP3 VBR 128 Kbps.
  • 523. Vídeo y animaciones ::: El DVD como fuente de vídeo 523 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Códec. Se puede usar cualquiera de los dos: DivX y XviD. Es necesario que el códec elegido esté instalado en el equipo. Recuerda que al instalar Auto Gordian Knot el códec de XviD ya se instala directamente porque viene incluído en el paquete mientras que DivX (versión Create) es necesario descargarlo e instalarlo aparte.  Subtitle Options (Opciones de SubTítulos). Este apartado sólo es necesario configurarlo si hemos incluído subtítulos en la película final. Si marcas la opción Display only forced subtitles (Mostrar solamente subtítulos forzados) sólo se mostrarán los subtítulos forzados, es decir, aquellos que se muestran siempre en la película aunque no tengamos activados los subtítulos. Ejemplo: Traducción al español o inglés del discurso de un personaje que habla en un tercer idioma y cuyo contenido se considera importante para el desarrollo de la acción. En el paso 2 tendríamos que haber selccionado la pista de subtítulos en el idioma adecuado. La opción Use external subtitles se refiere a la posibilidad de cargar los subtítulos de un archivo externo pero no funciona bien en todos los reproductores por lo que conviene no activarlo. 3. Si pulsas en el botón Preview (Vista previa), tras cierta espera, podrás ver una vista previa del aspecto final del vídeo pero sin el audio. Paso 6. Crear película 1. Cuando se ha finalizado la configuración de todos los parámetros, haz clic en el botón Add Job (Añadir Tarea). 2. En la Cola de Tareas (Job queue) aparecerá una nueva entrada con información del nombre del archivo AVI final, su carpeta de ubicación y una casilla de verificación activada. 3. Una vez introducida esta tarea en la Cola de Tareas podemos cerrar AutoGK y continuar en otro momento con la conversión definida. Otra posibilidad es abrir otro DVD para añadir una segunda tarea de conversión a la lista. En cualquier caso la codificación no comenzará hasta que no se lo indiquemos. 4. Para comenzar con la creación de la película AVI final pulsa en el botón Start (Inicio). 5. AutoGK irá abriendo y cerrando programas según lo vaya necesitando para realizar las distintas partes del proceso: creación del proyecto con DGIndex, test de compresibilidad, compresión con VirtualDubMod, audio con BeSweet, etc. En la
  • 524. Vídeo y animaciones ::: El DVD como fuente de vídeo 524 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado ventana de eventos (Log Window) irán apareciendo los mensajes de lo que se está haciendo. En los primeros pasos habrá que fijarse en la barra de tareas porque al desplegar alguna de estas aplicaciones será necesario aceptar las condiciones de la licencia de uso para que el proceso pueda continuar. 6. Una vez pulsado en el botón Start (Inicio) el proceso ya está automatizado y es necesario que se realice sin pausas. Si durante el transcurso del mismo pulsas en el botón Abort (Detener) habría que empezar desde el principio en la siguiente tentativa. 7. La duración de la conversión dependerá de la duración del DVD original y de las características del equipo (procesador, memoria RAM, disco duro, etc.). A título orientativo, por ejemplo, un DVD con una película de 2 horas de duración, en un Pentium IV-2Ghz con 1Gb de RAM puede tardar alrededor de 5 horas. Por ello es necesario armarse de un poco de paciencia. Si vas a dejar el ordenador trabajando solo, una opción interesante es marcar la casilla Shutdown when done (Apagar cuando termine). De esta forma el equipo se apagará cuando finalicen todos las tareas almacenadas en la Cola de Tareas. 8. La tarea terminará cuando en la Log Window (Ventana de eventos) aparezca el mensaje de tarea finalizada: [dd/mm/aaaa hh:hh:ss] Job finished. Total time: X hours XX minutes X seconds. 9. Cierra la ventana de Auto Gordian Knot. Paso 7. Ver película 1. Cuando ha finalizado la conversión, utiliza el Explorador de Windows para situarte en la carpeta donde has creado el archivo AVI final. En el ejemplo anterior era la carpeta video situada en el directorio raíz del disco duro C: ó D: 2. Con intención de ahorrar espacio en disco y una vez terminado con éxito el proceso de conversión DVD-AVI, conviene eliminar la carpeta temporal auto_gk que se ha creado en la misma carpeta donde se ha guardado este AVI. También conviene borrar los archivos *.VOB que se han generado con DVD Decrypter. 3. Para visualizar el video arrástralo y suéltalo sobre una ventana de VLC Media Player. Este reproductor puede leer archivo AVI codificados con Xvid. Nota: La mayoría de los reproductores de DVD actuales reconocen el formato DivX y XviD. Comprueba en la documentación del tuyo si es compatible con estos formatos. Algunos modelos suelen mostrar incluso en su carcasa exterior el logo de DivX para indicar esta característica. Si es así, basta con grabar el archivo AVI desde el disco duro del ordenador a un CD-ROM como si se tratase de un CD de datos utilizando un programa tipo Nero Burning o similar. Al introducir este disco en el reproductor DVD se visualizará en pantalla.
  • 525. Vídeo y animaciones ::: El DVD como fuente de vídeo 525 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.2 Extracción con dvd::rip en Ubuntu 7.2.1 Introducción En este apartado se propone un procedimiento para convertir el vídeo de un DVD a un archivo AVI con códec XviD. A partir de este AVI es posible extraer un fragmento y convertirlo en un formato más propio de publicación web: FLV, WMV, MOV o RAM. Otra posibilidad es la grabación del archivo AVI resultante en un CD-ROM utilizando un programa de grabación de CDs. Esta segunda opción es habitual en la realización de copias de seguridad de DVDs. En el mercado actual casi todos los reproductores DVD incorporan la prestación de la lectura de CDs y DVDs con archivos AVI DivX y XviD. Nota importante: El software e instrucciones recogidas en este capítulo se proponen como método para realizar copias de seguridad de los DVDs originales propios y siempre dentro de un uso particular no comercial. En cualquier caso esta información NO se expone para ser usada como herramienta para vulnerar materiales con copyright. La utilización que se efectúe, total o parcial del archivo de vídeo resultante, estará supeditada en todo momento a los derechos de autor y propiedad intelectual legalmente establecidos. 7.2.2 Software necesario dvd::rip Es un programa que permite ripear un DVD de vídeo, es decir, obtener un archivo o archivos de vídeo en el disco duro a partir de los contenidos de este soporte. Para instalar dvd::rip en Ubuntu: 1. Desde el escritorio selecciona Aplicaciones > Centro de software de Ubuntu 2. En la casilla Buscar introduce el término rip. 3. Pulsa en el botón Instalar del programa dvd::rip mplayer dvd::rip utiliza por defecto el programa mplayer para reproducir los fragmentos de DVD y archivos generados. Para instalarlo sigue una rutina similar a la anterior: Aplicaciones > Centro de software de Ubuntu. Códecs para DVD encriptados La mayoría de los DVDs comerciales están encriptados. Para poder leerlos sin problemas desde dvd::rip, mplayer o incluso VLC Media Player es necesario instalar una librería adicional. Para ello sigue estos pasos: 1. Abre un terminal de consola mediante Aplicaciones > Accesorios > Terminal. 2. Teclea la siguiente orden: sudo apt-get install libdvdread3 debhelper fakeroot 3. Se solicita la contraseña de root y el CD de instalación de Ubuntu. 4. A continuación ejecuta el siguiente comando: sudo /usr/share/doc/libdvdread3/install-css.sh
  • 526. Vídeo y animaciones ::: El DVD como fuente de vídeo 526 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7.2.3 Configuración de dvd::rip 1. Inicia el programa mediante Aplicaciones > Sonido y vídeo > dvd::rip 2. La primera vez que se inicia este programa se muestra el cuadro de diálogo de Preferencias. Estas opciones se podrán modificar en todo momento desde el programa a Editar > Preferencias. 3. En la pestaña Configuraciones básicas se muestran las distintas opciones por defecto del programa. Será necesario utilizar el explorador de archivos para crear la carpeta dvdrip-data dentro del directorio /home/<usuario>/. En esta carpeta será donde se guarden los archivos de la conversión. Tras la creación de esta carpeta pulsa en el botón Comprobar todo para obtener el OK. 4. En la pestaña Comandos comprueba que el Comando de reproducción de DVD y el Comando de reproducción de archivo es el programa mplayer que hemos instalado para reproducir los DVDs y archivos creados.
  • 527. Vídeo y animaciones ::: El DVD como fuente de vídeo 527 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Para cerrar la configuración pulsa en el botón Aceptar. 7.2.4 Convertir DVD a AVI con dvd::rip 1. Introduce el DVD en la unidad del ordenador. 2. Inicia el programa mediante Aplicaciones > Sonido y vídeo > dvd::rip 3. Selecciona Archivo > Nuevo proyecto 4. En la pestaña Almacenamiento introduce el nombre del proyecto de captura. Ejemplo: cortos2007. En este caso interesa elegir un nombre significativo con el contenido del vídeo. 5. Pulsa en el botón + Crear proyecto. 6. Se muestra el cuadro de diálogo Guardar proyecto y en Nombre: aparece el nombre del proyecto. Clic en el botón Aceptar. 7. En la pestaña Almacenamiento y en la sección Elegir un modo de extracción marca la opción Copiar los datos del DVD al disco duro antes de codificar. Conviene activar esta opción para copiar el contenido del DVD al disco duro antes de iniciar la codificación. Esto agilizará el proceso y protegerá la unidad lectora de DVD. 8. Clic en la pestaña Extraer Tìtulo. Pulsa el botón Leer tabla de contenidos del DVD para leer las pistas del DVD que se mostrarán en el listado inferior.
  • 528. Vídeo y animaciones ::: El DVD como fuente de vídeo 528 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Para visualizar una pista márcala en el listado y a continuación pulsa en el botón Ver título(s)/capítulo(s) seleccionados. 10. Para comenzar la extracción de la pista al disco duro del equipo, selecciona la pista que deseas y luego pulsa en el botón Extraer título(s)/capítulo(s) seleccionados. 11. Si deseas tener información de la evolución de la extracción pulsa en la pestaña Registro. 12. En la pestaña Codificar comprueba los siguientes parámetros que normalmente suelen venir definidos por defecto:  Opciones de contenedor > Selecciona contenedor: AVI  Opciones de vídeo > Códec de vídeo: xvid  Opciones de vídeo > Tasa de vídeo: 25.000  Opciones de vídeo > Hacer dos pasadas: Sí  Cálculo de tasa de bits de vídeo > 2x700  Opciones del audio > Seleccionar pista: elegir la pista de audio del idioma adecuado si hubiera varias.  Opciones de audio > MP3: Tasa de bits de 128 kbit/s y 48000 Hz. 13. Para iniciar el procedimiento de codificación pulsa en el botón Codificar. 14. Si deseas ver cómo evoluciona proceso activa la pestaña Registro. 15. Una vez concluido el proceso el archivo AVI resultante de la transformación se encontrará en la carpeta: /home/<usuario>/<nombre_proyecto>/avi/. Para visualizarlo haz clic derecho sobre este archivo y elige Abrir con MPlayer o bien Abrir con VLC Media Player. Desde el programa dvd::rip puedes reproducir el archivo AVI pulsando en el botón Ver de la pestaña Codificar.
  • 529. Vídeo ::: Insertar un vídeo en Blogger 529 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. Insertar un vídeo en el blog
  • 530. Vídeo ::: Insertar un vídeo en Blogger 530 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.1 Insertar un vídeo en Blogger
  • 531. Vídeo ::: Insertar un vídeo en Blogger 531 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.1.1 Insertar un vídeo en Blogger 1. Descarga y descomprime el archivo turismoRural.zip. Como resultado obtendrás un archivo de vídeo turismoRural.mov que puedes visualizar en tu equipo utilizando VLC Media Player. 2. Abre una nueva pestaña del navegador web y accede a la URL de inicio de Blogger: https://www.blogger.com/start?hl=es 3. 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. 4. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio. 5. En este panel aparecerán los distintos blogs que gestionas en Blogger. 6. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición del blog donde deseas publicar el artículo. 7. Descarga y descomprime el archivo turismoRural.zip. Como resultado obtendrás un archivo de vídeo turismoRural.mov que puedes visualizar en tu equipo utilizando VLC Media Player. 8. Introduce el título de la nueva entrada: Turismo rural. 9. En la barra de herramientas del editor haz clic en el botón Añadir vídeo. 10. Se mostrará el cuadro de diálogo Añade un vídeo en tu entrada de blog para subir el vídeo desde nuestro equipo. Clic en el botón Examinar para localizar y señalar el archivo turismoRural.mov que hemos obtenido en un paso anterior.
  • 532. Vídeo ::: Insertar un vídeo en Blogger 532 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Como se indica en este cuadro de diálogo se pueden subir vídeos en formatos AVI, MPEG, MOV (QuickTime), RM (Real) y WMV (Windows Media). El tamaño máximo del archivo de vídeo subido será de 100 MB. 12. Teclea el Título del vídeo y marca la casilla de verificación de condiciones. 13. En la parte inferior activa la casilla de aceptación de condiciones y pulsa en el botón SUBIR VÍDEO. 14. Durante los segundos invertidos en la subida del archivo de vídeo al servidor se mostrará dentro del editor un reproductor multimedia con información al respecto: Uploading vídeo … (Subiendo vídeo). Your video will appear here when finished (Tu video aparecerá aquí cuando haya terminado). 15. Si el proceso de subida se realiza con éxito se mostrará el reproductor con un botón PLAY en el centro.
  • 533. Vídeo ::: Insertar un vídeo en Blogger 533 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 16. Para terminar pulsa en el botón PUBLICAR ENTRADA. 17. A continuación haz clic en el enlace Ver blog para ver el resultado final. Al pulsar en el botón Play se reproducirá el vídeo subido. Nota: Este sistema de publicación de vídeos en Blogger nos ofrece por ahora poco control sobre la edición y eliminación de los vídeos subidos. Es uno de los temas pendientes de mejorar en Blogger.
  • 534. Vídeo ::: Insertar un vídeo en Blogger 534 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.1.2 El formato Flash Vídeo (FLV) En la actualidad Blogger no admite al autor de un blog subir directamente un archivo en formato FLV (Flash Video http://www.adobe.com). Sin embargo es un hecho que este formato ha experimentado un gran auge como medio para publicar contenidos de vídeo en Internet. Varias son las razones que justifican este fenómeno:  El cliente sólo necesita tener instalado el plugin o reproductor de Adobe Flash en su navegador web.  Es accesible desde la mayoría de los sistemas operativos (Windows, Linux, Mac, etc) y navegadores web (IExplorer, Firefox, NetScape, Safari, Opera, etc). Esto garantiza un acceso universal al contenido.  La consola de reproducción se puede incluir fácilmente en una página web y al estar diseñado con Adobe Flash admite un skin con un alto grado de personalización: fondos, colores, botones, logo del centro o empresa, comportamiento, etc  Se puede reproducir en distintos reproductores locales: MPlayer, VLC media player, Riva, Xine, et.  Los repositorios de vídeo más conocidos en Internet han apostado por este formato para la difusión de vídeos: YouTube, GoogleVideo, iFilm, etc.  El formato FLV utiliza los códecs Sorenson Spark y On2 VP6 que permiten una alta calidad visual con bitrates reducidos.  Es un formato que admite streaming, es decir, tras unos segundos iniciales de almacenamiento en el buffer, comienza su visualización y esta se produce de forma ininterrumpida mientras se completa en segundo plano la descarga del resto del vídeo. 8.1.3 Publicación de vídeo FLV en Blogger En este apartado se expone cómo integrar vídeos FLV en una entrada del blog utilizando el reproductor flash multimedia desarrollado por Jeroen Wijering (http://www.longtailvideo.com/). Se utiliza en muchos sitios web ya que permite la configuración de múltiples parámetros y admite la reproducción de archivos flv simples y de listas de reproducción. En este caso vamos a utilizarlo para reproducir un vídeo FLV que alojamos previamente en Google Sites. 8.1.3.1 Introducción 1. Descarga y descomprime el archivo flvplayer.zip en una carpeta del disco local. 2. Desde el explorador de archivos abre la carpeta flvplayer y haz doble clic en el archivo index.html. Con esto se abrirá el navegador mostrando el contenido de un video FLV. 3. La consola de reproducción para un archivo flv permite iniciar y detener el vídeo así como arrastrar la barra de progreso de la pista y del volumen. En la reproducción de listas de vídeos FLV también se proporcionan botones para saltar al siguiente o anterior de la lista. También se ofrece un botón que permite visualizar el vídeo en modo pantalla completa.
  • 535. Vídeo ::: Insertar un vídeo en Blogger 535 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Regresa al explorador de archivos en la carpeta flvplayer. Dentro de esta carpeta se puedes encontrar los siguientes archivos:  La página HTML que permite el acceso a todo el conjunto: index.html  El reproductor de vídeo de Jeroen Wijering creado en tecnología Adobe Flash: flvplayer.swf  El video FLV que se reproduce: video.flv  La imagen previa en formato GIF que se muestra antes de iniciar la reproducción del vídeo y que tiene la misma dimensión del vídeo: captura.jpg 8.1.3.2 Subida de archivos a Google Sites 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>. En este caso vamos a guardar en este espacio los archivos que vamos necesitar para luego enlazarlos desde el blog. 6. La acción anterior te sitúa en la página principal de tu sitio Google. Para organizar los archivos se propone crear una carpeta de nombre video 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 video. Observa que la carpeta contenedora de archivos se creará en la ruta: /site/<nombre_usuario>/video. Clic en el botón Crear página.
  • 536. Vídeo ::: Insertar un vídeo en Blogger 536 Multimedia 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 para pulsar en el botón Examinar y localizar el archivo de imagen captura.jpg. Clic en el botón Subir. 10. Repite el paso anterior para subir el archivo del reproductor flvplayer.swf y el archivo de vídeo video.flv. El vídeo tardará un poco en subir porque tiene cierto peso. 11. No cierres esta ventana o pestaña del navegador porque posteriormente volveremos a ella. 8.1.3.3 Generar el código para incrustar 1. Regresa a la carpeta donde se encuentran los activos descargados y haz clic derecho sobre el archivo index.html para seleccionar Abrir con … > Bloc de notas.
  • 537. Vídeo ::: Insertar un vídeo en Blogger 537 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. El código que integra el reproductor y el vídeo en la página es: <embed src="flvplayer.swf" width="384" height="308" allowfullscreen="true" flashvars="file=video.flv&image=captura.jpg&width=384&height=308"> </embed> En la variable file se indica la referencia a la ubicación del archivo de vídeo flv que se reproduce. Puedes modificar este valor para reproducir un vídeo con otro nombre distinto. En las variables height y width se indican la altura y anchura en píxeles con que se visualizará el reproductor. El vídeo tiene unas dimensiones originales de 384x288 píxeles. Puede comprobarlo utilizando MediaInfo tal y como se explicaba en un apartado anterior. La botonera ocupa 20 píxeles de altura. Sumados a los 288 del vídeo hacen un total de 308 píxeles para el total del reproductor. 3. A continuación modificamos este código para que el reproductor (flvplayer.swf), la imagen (captura.jpg) y el video (video.flv) sean los que has subido a tu espacio en Google Sites. Para ello regresa a la página de Google Sites y haz clic derecho sobre el enlace correspondiente al reproductor flvplayer.swf y elige la opción Copiar la ruta del enlace. 4. Sitúate en el Bloc de Notas, selecciona el valor del parámetro src, es decir, el contenido comprendido entre las comillas y a continuación selecciona Editar >Pegar. Elimina la coletilla attredirects=0 de la URL pegada.
  • 538. Vídeo ::: Insertar un vídeo en Blogger 538 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Repite el paso anterior para sustituir la ruta a video.flv y a la imagen captura.jpg. El resultado final podría ser un código similar a éste: <embed src="http://sites.google.com/site/fernandoposada/video/flvplayer.swf" width="384" height="308" allowfullscreen="true" flashvars="file=http://sites.google.com/site/fernandoposada/video/video.flv&image= http://sites.google.com/site/fernandoposada/video/captura.jpg&width=384&height= 308"> </embed> 6. Selecciona este código <embed> … </embed> y elige Editar > Copiar. 8.1.3.4 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. Teclea el título: Los medios de transporte. 7. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 8. 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.
  • 539. Vídeo ::: Insertar un vídeo en Blogger 539 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Para terminar pulsa en el botón PUBLICAR ENTRADA. 10. A continuación haz clic en el enlace Ver blog para ver el resultado final
  • 540. Vídeo ::: Insertar un vídeo en Wordpress 540 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2 Insertar un vídeo en Wordpress
  • 541. Vídeo ::: Insertar un vídeo en Wordpress 541 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2.1 Vídeos en Wordpress En un blog de Wordpress, a diferencia de Blogger, no se pueden subir de forma gratuita directamente vídeos para integrar en una entrada del mismo. Se requiere contratar el servicio de pago VideoPress Upgrade. Este sistema no será tratado en este curso por razones obvias. Sin embargo en una entrada de un blog de Wordpress se pueden insertar de forma gratuita vídeos alojados en servicios externos. En este capítulo vamos a tratar algunos de ellos. 8.2.2 Blip.tv 1. Visita la web de Blip.tv (http://blip.tv/) 2. Utiliza el buscador para localizar el vídeo que te interesa. Otra opción es crear una cuenta y subir tu propio vídeo. Sitúate en el vídeo para su visualización. 3. En la columna lateral derecha que acompaña al vídeo se ofrece una barra en color naranja. Haz clic en el combo Share y selecciona la opción Embed. A continuación haz clic en el combo Show Player y selecciona la opción Wordpress.com. Clic en el botón Go.
  • 542. Vídeo ::: Insertar un vídeo en Wordpress 542 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Selecciona el código que se ofrece debajo, haz clic derecho y elige Copiar. 5. Sobre el editor HTML de entradas de Wordpress.com haz clic derecho y selecciona Pegar. 6. Clic en el botón Publicar/Actualizar y a continuación haz clic en el enlace Vista previa para ver el aspecto del vídeo insertado en el artículo.
  • 543. Vídeo ::: Insertar un vídeo en Wordpress 543 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2.3 DailyMotion 1. Visita la web de DailyMotion (http://www.dailymotion.com/es) 2. Busca el vídeo que deseas insertar en un articulo de tu blog Wordpress. Fíjate en la URL o dirección de esa página del tipo: http://www.dailymotion.com/video/xcfw1n_el-viento-de-marte-medido-gracias-a_tech 3. En esta dirección aparece el identificador ID de este vídeo en DailyMotion. En este ejemplo el identificador es: xcfw1n 4. En el código HTML de la entrada de tu blog en Wordpress.com introduce la siguiente etiqueta: [dailymotion id=xcfw1n] 5. Clic en el botón Publicar y luego en el enlace Ver artículo.
  • 544. Vídeo ::: Insertar un vídeo en Wordpress 544 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2.4 Otros servicios de vídeo 8.2.4.1 Flickr Video 1. Localiza un vídeo en Flickr (http://www.flickr.com/explore/video/) 2. Copia el identificador ID del vídeo que figura en la última parte de su URL: Ejemplo: http://www.flickr.com/photos/chaddles/2402990826 3. En el código HTML del artículo de Wordpress pega la etiqueta: [flickr video=http://www.flickr.com/photos/chaddles/2402990826] o bien [flickr video=2402990826] Para que no se muestre la información inicial al principio del vídeo: [flickr video=2402990826 show_info=no] Para definir la altura y anchura en píxeles del reproductor: [flickr video=2402990826 w=200 h=150] 8.2.4.2 LiveVideo 1. Localiza un vídeo en LiveVideo (http://www.livevideo.com/) 2. Copia el identificador ID del vídeo que figura en su URL. Ejemplo: http://www.livevideo.com/video/F25406F905A64843B19E7CDC3CFD04A4/cool-mac.aspx 3. En el código HTML del artículo de Wordpress pega la etiqueta: [livevideo id=F25406F905A64843B19E7CDC3CFD04A4] 8.2.4.3 PodTech 1. Localiza un vídeo en PodTech (http://www.podtech.net/) 2. Haz clic en el botón naranja Share (Compartir). 3. Marca la casilla Embedding in Wordpress.com y haz clic en el botón Copy. 4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada. 8.2.4.4 Viddler 1. Localiza un vídeo en Viddler (http://www.viddler.com/) 2. Haz clic en el botón Embed This (Insertar Esto). 3. Marca la opción Wordpress.com, selecciona el código y haz clic derecho para Copiar. 4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada 8.2.4.5 Videolog 1. Localiza un vídeo en Videolog (http://videolog.tv/) 2. Haz clic en el botón Wordpress. 3. Selecciona el código y haz clic derecho para Copiar. 4. Pega en el código HTML del artículo de Wordpress la etiqueta copiada.
  • 545. Vídeo ::: Insertar un vídeo en Wordpress 545 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8.2.5 VodPod: importación de vídeos para Wordpress VodPod (http://vodpod.com) es un servicio intermedio que permite incorporar a un artículo de Wordpress.com un video alojado en cualquier servicio de vídeos: Youtube, Revver, Vimeo, etc. Sólo es necesario que el vídeo esté en formato Flash Vídeo (FLV) y que el servicio que lo aloja ofrezca el código embed. Gracias a VodPod es posible salvar la limitación que ofrece Wordpress.com de no admitir las etiquetas <embed …> en la edición de sus artículos y no poder con ello insertar vídeos de estos servidores. 1. Visita la web de VodPod y registrate como usuario. Identíficate con tu usuario y contraseña. 2. Visita la página http://vodpod.com/wordpress/ utilizando el navegador Mozilla Firefox. 3. En tu navegador Mozilla Firefox debes tener visible la barra de marcadores mediante Ver > Barras de herramientas > Barras de herramientas de marcadores. 4. Arrastra el botón Post to Wordpress para soltarlo sobre la barra de marcadores del navegador. 5. A continuación accede a la página de un servicio de vídeo. Por ejemplo: Revver (http://www.revver.com). Localiza el vídeo que deseas insertar y pulsa en el marcador Post to WordPress. 6. Se mostrará un cuadro de diálogo emergente donde debes introducir la URL de tu blog, el usuario y contraseña para editar en ese blog. Clic en Publish. 7. Se cerrará esta ventana y se mostrará el editor de entradas con un nuevo artículo conteniendo el código correspondiente a ese vídeo. 8. Tras publicar y ver la vista previa de ese artículo, observarás que el vídeo se ha integrado en el artículo.
  • 546. Vídeo y animaciones ::: Youtube, video en streaming 546 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Youtube: video en streaming
  • 547. Vídeo y animaciones ::: Youtube, video en streaming 547 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.1 ¿Qué es Youtube? YouTube (http://www.youtube.com) es un servicio de búsqueda y alojamiento de vídeos que ofrece la posibilidad de asignar tags o etiquetas a los mismos para facilitar su localización. En poco tiempo este sitio web se ha convertido en el mayor repositorio de vídeos en Internet. Cualquier usuario puede registrarse de forma gratuita y subir sus vídeos. Estos pueden ajustarse a cualquier temática siempre y cuando no sea pornográfica y no incumplan las leyes vigentes sobre copyright y pertinencia de contenidos. 9.2 Acceso autentificado a Youtube Para subir tus propios vídeos es necesario registrarse como usuario en Youtube. Sin embargo si ya dispones de credenciales Google puedes utilizarlas para acceder a este servicio con ellas. Básicamente existen dos formas de acceder al espacio autentificado de Youtube:  Acceso directo. Abre el navegador y visita la URL de Youtube: www.youtube.com. Haz clic en el enlace Acceder que aparece en la esquina superior derecha y debes introducir tu dirección de correo electrónico usuario@gmail.com (no el usuario) y tu contraseña de Google.  Acceso desde Blogger. Haz clic en el enlace Mi cuenta que se muestra en la esquina superior derecha una vez que te has autentificado. En la página Mi cuenta haz clic en el entrada al servicio Youtube. 9.3 Publicación de un vídeo en YouTube YouTube puede aceptar casi cualquier formato de vídeo para las subidas: WMV, .AVI, .MOV y .MPG. Sin embargo se ha comprobado que la configuración que ofrece mejores resultados para la mayoría de los usuarios es la que se indica a continuación.  Códec del vídeo: H.264, MPEG-2 o MPEG-4 preferiblemente  Resolución recomendada: 1280 x 720 (16 x 9 HD) o bien 640 x 480 (4:3 SD) aunque admite también resoluciones inferiores como 480x360.  Formato de audio: MP3 o AAC preferiblemente en estéreo con 44,1 kHz de bitrate.  Fotogramas por segundo: 24-25 fps  Tamaño de archivo máximo: 2 GB Los pasos para subir un vídeo son: 1. Descarga y descomprime el archivo paisajesAsturias.zip en tu disco duro. Como resultado obtendrás el archivo de vídeo paisajesAsturias.wmv 2. Accede de forma autentificada a Youtube directamente o a través de Blogger. En ambos casos se mostrará la página de Youtube con tu nombre de usuario en la esquina superior derecha. 3. Haz clic en el enlace Subir.
  • 548. Vídeo y animaciones ::: Youtube, video en streaming 548 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Pulsa en el botón Subir vídeo. Si dispones de cámara web en el equipo otra opción es pulsar en el botón Grabar de cámara web para crear el vídeo utilizando este dispositivo. 5. Se abre un cuadro de diálogo donde debes seleccionar el vídeo a subir. En cuanto pulsas el botón Aceptar comienza la subida al servidor. 6. Mientras se sube el archivo puedes completar los siguientes datos del vídeo  Título. Por ejemplo: Paisajes asturianos.  Descripción. Texto breve que describe el vídeo. Ejemplo: Algunas fotografías sobre paisajes asturianos.  Etiquetas. Facilitan la búsqueda del vídeo. Se introduce una o varias etiquetas separadas por espacios. Ejemplo: asturias paisajes. Estos son los campos obligatorios para poder subir un vídeo. En el resto se pueden dejar las opciones por defecto.  Categoría. Selecciona una categoría o tema. Ejemplo: Viajes y eventos.  Privacidad. Es posible elegir entre Comparte tu vídeo con el mundo (opción recomendada) o bien Privado. 7. Clic en el botón Guardar cambios. Se mostrará una entrada en el listado de vídeos subidos. 8. Una vez finalizada la subida haz clic en el enlace Mis Vídeos. A la sección Mis Vídeos siempre puedes ir desde el menú horizontal superior pulsando en el nombre de usuario y seleccionando la opción Mis vídeos.
  • 549. Vídeo y animaciones ::: Youtube, video en streaming 549 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Después de subir el archivo al servidor puede ocurrir que tengas que esperar unos minutos para que se complete la conversión del vídeo. YouTube procesa el formato original del archivo para transformarlo en formato Video Flash. 9. Observa que se ha creado una entrada nueva con el vídeo. Para visualizar su contenido haz clic en el botón Reproducir. 10. Desde este panel se puede pulsar en sus distintos botones para realizar diversas tareas:  Reproducir. Para visualizar el vídeo tal y como lo verán el resto de usuarios de Youtube.  Editar. Permite personalizar distintos parámetros avanzados de reproducción del vídeo.  Anotaciones. Es una herramienta ideal para crear anotaciones sobre la línea de tiempo del propio vídeo: bocadillos, notas, regiones destacadas, indicaciones de pausa, etc.  Cambiar Audio. Facilita modificar la pista original de audio por otra del listado que propone Youtube. Otra posibilidad es pulsar en el enlace Título y Subtítulos y se puede subir un archivo de subtítulos.  Insight. Al hacer clic en este botón se mostrarán distintos datos estadísticos sobre la visualización del vídeo.  Eliminar. Se utiliza para eliminar el vídeo de Youtube y liberar con ello el espacio disponible para la cuenta en el servidor.  Descargar MP4. Al pulsar en este botón se descargará la película en formato de alta calidad MP4.
  • 550. Vídeo y animaciones ::: Youtube, video en streaming 550 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 11. Clic en el botón Editar. Se mostrará la página Información y configuración de ese vídeo. En ella se ofrecen distintas secciones:  Información del vídeo. Contiene el título, descripción, etiquetas y categoría que se introdujeron al principio. Desde aquí se pueden modificar.  Miniatura del vídeo. Permite elegir la imagen estática que representará el vídeo.  Fecha y mapa. Permite definir la fecha en que fue grabado y sobre una mapa de Google Maps geolocalizar el recurso indicando el lugar geográfico concreto donde se tomó.  Opciones para compartir y emitir vídeos. En este apartado se puede elegir entre …  Privacidad. - Compartir el vídeo con el mundo (opción recomendada). - Privado (visible para un máximo de 25 personas).  Comentarios - Permitir comentarios automáticamente. Opción por defecto. - Permitir comentarios de amigos automáticamente y demás comentarios sólo con aprobación - Permitir todos los comentarios únicamente con aprobación - No permitir comentarios  Comentar votación. - Sí, permitir a los usuarios votar sobre los comentarios. Opción por defecto. - No permitir las votaciones a los comentarios.  Respuestas en vídeo. - Sí, permitir que se añadan respuestas en vídeo automáticamente. Permitir que otros usuarios de YouTube puedan relacionar automáticamente sus vídeos con el mío. - Sí, permitir respuestas una vez que las haya aprobado. Es la opción por defecto. - No, no permitir respuestas en vídeo. No permitir relacionar este video con otros.  Puntuaciones. - Sí, permitir que otras personas puntúen este vídeo. Permitir que este video pueda ser puntuado por los usuarios. Es la opción por defecto. - No, no permitir que se puntúe este vídeo. No permitir que este video pueda ser votado.  Inserción. - Sí, los sitios externos pueden insertar y reproducir este vídeo. Es la opción por defecto. - No, los sitios externos NO pueden insertar ni reproducir este vídeo.  Distribución. - Sí, hacer que este vídeo esté disponible en móviles y TV - No, este vídeo no debería estar disponible en móviles ni en TV. 12. Para guardar los cambios pulsa en el botón Guardar cambios.
  • 551. Vídeo y animaciones ::: Youtube, video en streaming 551 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.4 Insertar video de Youtube en Blogger 9.4.1 Elegir el video en Youtube 1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com. Introduce tus credenciales para autentificarte. En este caso se propone insertar un vídeo propio pero también se puede insertar un vídeo ajeno que se localiza utilizando el buscador de Youtube. 2. Clic en la sección <Usuario> | Mis Vídeos (Mis vídeos). Otra posibilidad es utilizar el buscador de Youtube para localizar un vídeo subido por otro usuario. 3. Clic en la imagen de un vídeo del listado o bien sobre el botón Reproducir. Se visualiza una página mostrando la reproducción del vídeo. 4. A la derecha del cuadro que contiene el código Insertar pulsa en el botón Personalizar. En el cuadro que se muestra puedes elegir algunas opciones:  Incluir vídeos relacionados. Si marcas esta casilla se mostrarán los vídeos relacionados con éste al finalizar su reproducción.  Mostrar borde. Incluye un marco de color alrededor del reproductor.  Activar cookies de acción retardada. Si activas las cookies de acción retardada entonces el reproductor creará en el ordenador del visitante este tipo de cookies. Por defecto no las crea cuando el reproductor está incrustado en una página. 5. También puedes elegir la gama de colores del reproductor que más se ajusta a la página donde se incrustará así como el tamaño del reproductor. 6. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción copiará el código embed/insertar en el portapapeles.
  • 552. Vídeo y animaciones ::: Youtube, video en streaming 552 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.4.2 Insertar el vídeo en una entrada de 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. Teclea el título: Paisajes de Asturias 7. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 8. 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. 9. Para terminar pulsa en el botón PUBLICAR ENTRADA. 10. A continuación haz clic en el enlace Ver blog para ver el resultado final
  • 553. Vídeo y animaciones ::: Youtube, video en streaming 553 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.5 Insertar video de Youtube en Wordpress 9.5.1 Elegir el video en Youtube 1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com. 2. Identifícate con tus credenciales para localizar un vídeo propio o utiliza el buscador para localizar un vídeo ajeno. 3. Una vez situado en la reproducción del vídeo que te interesa, haz clic en el botón Compartir. Se mostrará un cuadro de diálogo con la URL de la página que contiene este video. 4. Selecciona la URL del vídeo. Es de la forma: http://www.youtube.com/watch?v=CkRS3wDg1xU 5. Clic derecho sobre esta URL y elige Copiar. 9.5.2 Insertar el vídeo en una entrada de Wordpress 6. Desde el Escritorio de Wordpress.com selecciona Entradas > Añadir. 7. Teclea el título: Picasso. 8. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 9. 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á la URL del vídeo copiada anteriormente.
  • 554. Vídeo y animaciones ::: Youtube, video en streaming 554 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. A partir de esta URL añade la etiqueta [youtube= … para completar, en el caso del ejemplo que nos ocupa, lo siguiente: [youtube=http://www.youtube.com/watch?v=CkRS3wDg1xU] 11. Pulsa en el botón Publicar y luego en el enlace Vista previa. 9.5.3 Ejemplos de parámetros de integración de Youtube en WP  Para especificar la altura y anchura de forma explícita: [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=320&h=240]  Para especificar sólo la anchura: [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=320]  Para reproducir el vídeo en High Definition-Alta Definición (HD): [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&hd=1]
  • 555. Vídeo y animaciones ::: Youtube, video en streaming 555 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Para reproducir el vídeo en HD con altura y anchura específicos: [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&w=480&h=360&hd=1]  Para ocultar los vídeos relacionados que aparecen una vez finalizada la reproducción del vídeo: [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&rel=0]  Para mostrar el cuadro de búsqueda en Youtube: [youtube=http://www.youtube.com/watch?v=H2Ncxw1xfck&showsearch=1] 9.6 Insertar una lista de vídeos Youtube en Blogger 9.6.1 Crear una lista de vídeos en Youtube YouTube ofrece la posibilidad de crear listas de reproducción de vídeos alojados en este servicio. Estos pueden ser propios o ajenos. En el siguiente ejemplo se recoge el procedimiento para construir una lista de reproducción y luego insertarlo en un artículo de tu blog. 1. Accede a Youtube con tus credenciales de usuario. 2. En la barra de menú horizontal superior elige Usuario > Listas de reproducción. 3. Elige Nuevo > Lista de reproducción.
  • 556. Vídeo y animaciones ::: Youtube, video en streaming 556 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Introduce el título de la nueva lista de reproducción. Por ejemplo: Picasso en Youtube. En este caso vamos a crear una lista de vídeos sobre el pintor Picasso. Clic en el botón 5. Completa los datos de la lista de reproducción: Título, Descripción, Etiquetas y Configuración de Privacidad. Marca la opción Público o Privado para indicar la privacidad de la lista de reproducción. Se recomienda utilizar la opción por defecto: Público. 6. Clic en el botón Guardar cambios.
  • 557. Vídeo y animaciones ::: Youtube, video en streaming 557 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. A continuación utiliza el buscador de YouTube situado en la parte superior de la página para buscar vídeos sobre Picasso. Introduce el término “Picasso” y pulsa en el botón Buscar. 8. Haz clic sobre el título de uno de los vídeos para visualizarlo. 9. En la barra de opciones que aparece debajo del reproductor haz clic sobre el enlace Listas de reproducción. Se visualiza una lista desplegable con las listas de reproducción creadas. Elige la entrada correspondiente a la lista “Picasso en Youtube”. Clic en el botón Añadir. 10. Repite los pasos anteriores para añadir dos o tres vídeos más sobre Picasso. No es necesario utilizar de nuevo el buscador porque en la lista Videos Relacionados se muestran algunos vídeos que están relacionados con el actual. 11. En la barra de menú horizontal superior elige Usuario > Listas de reproducción. 12. En el panel izquierdo debajo de la entrada Listas de reproducción se mostrarán todas las listas creadas. Al seleccionar una de ellas, en el panel derecho, se mostrará el listado de vídeos que la forman. Para eliminar un vídeo de la lista márcalo en la casilla de verificación que se ofrece en la primera columna y a continuación pulsa en el botón Suprimir.
  • 558. Vídeo y animaciones ::: Youtube, video en streaming 558 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.6.2 Insertar la lista de vídeos en una entrada de Blogger. 1. En la columna izquierda donde aparecen las listas de reproducción haz clic en el lista de reproducción creada. 2. Clic en el botón Compartir donde se muestra la URL de la lista de reproducción o bien el código embed. 3. Clic derecho en el cuadro de texto Insertar código y elige Seleccionar todo. A continuación haz clic derecho y elige Copiar. 4. Abre una nueva pestaña del navegador web y accede a la URL de inicio de Blogger: https://www.blogger.com/start?hl=es 5. 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. 6. Si el proceso de autentificación se ha producido con éxito te situarás en el Escritorio. 7. En este panel aparecerán los distintos blogs que gestionas en Blogger. 8. Clic en el botón NUEVA ENTRADA para acceder directamente al interfaz de edición del blog donde deseas publicar el artículo.
  • 559. Vídeo y animaciones ::: Youtube, video en streaming 559 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Teclea el título: Videos de Picasso. 10. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 11. 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. 12. Para terminar pulsa en el botón PUBLICAR ENTRADA. 13. A continuación haz clic en el enlace Ver blog para ver el resultado final
  • 560. Vídeo y animaciones ::: Youtube, video en streaming 560 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Las listas de reproducción NO se integran en un artículo de Wordpress.com ni siquiera utilizando el servicio VodPod.com 9.7 Añadir un vídeo de Youtube a un gadget de Blogger Los vídeos de Youtube se pueden publicar en una entrada de nuestro blog de Blogger como hemos visto en un apartado anterior. Otra posibilidad es incorporar vídeos de Youtube en un gadget de la barra lateral del blog para que estén siempre disponibles al lector. Se puede incorporar un vídeo individual en un gadget del tipo HTML/Javascript o bien un canal de Youtube o los vídeos relacionados con una lista de etiquetas en un gadget del tipo Barra de Vídeo. 9.7.1 Añadir un vídeo de Youtube a un gadget del blog. 1. Abre el navegador web y visita la web de Youtube : http://www.youtube.com. 2. Utiliza el buscador para situarte en el vídeo que deseas insertar en tu blog. Se visualiza una página mostrando la reproducción del vídeo. 3. A la derecha del cuadro que contiene el código Insertar pulsa en el botón Personalizar. En el cuadro que se muestra puedes elegir algunas opciones:  Incluir vídeos relacionados. Si marcas esta casilla se mostrarán los vídeos relacionados con éste al finalizar su reproducción.  Mostrar borde. Incluye un marco de color alrededor del reproductor.  Activar cookies de acción retardada. Si activas las cookies de acción retardada entonces el reproductor creará en el ordenador del visitante este tipo de cookies. Por defecto no las crea cuando el reproductor está incrustado en una página.
  • 561. Vídeo y animaciones ::: Youtube, video en streaming 561 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. También puedes elegir la gama de colores del reproductor que más se ajusta a la página donde se incrustará así como el tamaño del reproductor. En este caso vamos a elegir un tamaño del reproductor de 320x265 píxeles. 5. Haz clic derecho en el código del cuadro de texto Insertar y elige Copiar. Esta acción copiará el código embed/insertar en el portapapeles. 6. Desde el interfaz de gestión de Blogger elige Diseño > Elementos de la página. 7. Clic en el enlace Añadir un gadget. 8. Pulsa en el botón “+” para añadir el gadget HTML/Javascript. 9. En la página Configurar HTML/Javascript introduce el Título del gadget. Por ejemplo: Vídeo destacado.
  • 562. Vídeo y animaciones ::: Youtube, video en streaming 562 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Clic derecho sobre el cuadro de Contenido y elige Pegar. Para que el reproductor no sobrepase los límites de la barra lateral en algunas de las plantillas utilizadas quizás sea necesario reducir las dimensiones 320x265 píxeles que aparecen en este código por 192x159. 11. Para terminar pulsa en el botón GUARDAR. 12. Clic en el enlace Ver blog para observar el resultado final. 9.7.2 Los canales en Youtube Es una página asociada al usuario con una URL del tipo: http://www.youtube.com/user/<nombre_usuario> a la que cualquier visitante puede acceder de forma pública y que contiene el perfil del usuario, sus vídeos, favoritos, etc. El usuario propietario de un canal accede a la administración del mismo pulsando en el nombre de usuario que aparece en la esquina superior derecha. Desde su gestión se pueden configurar múltiples aspectos de este canal: títulos, colores, módulos, etc. Algunos ejemplos de canales Youtube:  RTVE: http://www.youtube.com/user/rtve  Europa Press: http://www.youtube.com/user/europapress  Antena 3: http://www.youtube.com/user/antena3  La Sexta: http://www.youtube.com/user/misextatv  Cuatro: http://www.youtube.com/user/cuatro 9.7.3 Añadir un canal temático de Youtube a un gadget del blog. 1. Desde el interfaz de gestión de Blogger elige Diseño > Elementos de la página. 2. Clic en el enlace Añadir un gadget. 3. Pulsa en el botón “+” para añadir el gadget Barra de vídeo
  • 563. Vídeo y animaciones ::: Youtube, video en streaming 563 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. En la página Configurar Barra de Vídeo introduce el Título del gadget. Por ejemplo: Canal RTVE. 5. En esta página se pueden configurar los siguientes parámetros:  Youtube. Permite elegir las opciones de Vídeos más vistos, Vídeos mejor valorados y Vídeos recientes. En este caso marcaremos Vídeos recientes.  Canales. Introduce aquí rtve que el identificador Youtube del canal de RTVE fácilmente deducible de su URL: http://www.youtube.com/user/rtve  Palabras clave. Puedes introducir etiquetas para que sólo se muestren los vídeos que tengan asociadas estas palabras. En este caso tecleamos noticias. 6. En la parte inferior se muestra una vista previa en función de las opciones elegidas. 7. Pulsa en el botón GUARDAR. 8. Clic en el enlace Ver blog para observar el resultado final.
  • 564. Vídeo y animaciones ::: Youtube, video en streaming 564 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.8 Añadir un vídeo de Youtube a un widget de Wordpress Los vídeos de Youtube se pueden publicar en una entrada de nuestro blog de Wordpress como hemos visto en un apartado anterior. Otra posibilidad es incorporar vídeos de Youtube en un widget de la barra lateral del blog para que estén siempre disponibles al lector. Se puede incorporar una colección de vídeos en un widget del tipo VopPod Vídeos. 1. Visita la web de VodPod (http://vodpod.com/). Clic en Login para introducir tus credenciales (usuario y contraseña) y pulsa el botón Login. 2. Clic en el enlace Your videos (Tus vídeos). Clic en el botón New collection (Nueva colección). 3. En el cuadro de texto Name your collection (Nombre de tu colección) teclea el identificador, por ejemplo, Canal Picasso. Clic en el botón Create (Crear). 4. Abre una nueva pestaña en el navegador web mediante Archivo > Nueva pestaña. Visita la web de Youtube: http://www.youtube.com y utiliza el buscador para localizar un vídeo de Picasso. 5. Clic en el botón Insertar para mostrar el cuadro de código embed asociado a ese vídeo. 6. Clic derecho sobre este código y selecciona Copiar. 7. Regresa a la pestaña donde se encuentra Vodpod y pulsa en el botón Add Video (Añadir Vídeo). 8. En el cuadro de diálogo que se muestra haz clic derecho sobre el cuadro de texto y elige Pegar para pegar el código embed copiado anteriormente.
  • 565. Vídeo y animaciones ::: Youtube, video en streaming 565 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9. Clic en el botón Continue (Continuar). Confirma la elección pulsando en el botón Yes, This is the video (Sí, este es el vídeo). 10. En el siguiente cuadro de diálogo introduce el título del vídeo en Title, las etiquetas de búsqueda en Tags y comentarios opcionales en Comments. 11. Despliega el combo Add to Collection (Añadir a la colección) para elegir la colección deseada. Ejemplo: Canal Picasso. Clic en el botón Save (Guardar). 12. Repite los pasos anteriores para añadir a la colección de VodPod un par de vídeos de Youtube sobre Picasso. 13. Regresa a VodPod y haz clic en Home y luego en Your vídeos (Tus vídeos). 14. Para filtrar los vídeos de esta colección despliega el combo Collection y elige el nombre de la misma.
  • 566. Vídeo y animaciones ::: Youtube, video en streaming 566 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 15. En el listado se muestran los vídeos de esta lista. En el pie de la página de VodPod haz clic en el enlace Widgets. Otra posibilidad es pulsar en el enlace Home > Sharing 16. Despliega en combo Share on (Compartir en …) y elige Wordpress.com 17. En el área Advanced Setup (Configuración avanzada) selecciona como Sytle (Estilo), por ejemplo, Social – Standard y como Source Collection (Colección Fuente) la colección de vídeos creada con anterioridad: Canal Picasso. 18. Selecciona y haz clic derecho para Copiar el código que se proporciona.
  • 567. Vídeo y animaciones ::: Youtube, video en streaming 567 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 19. Abre una pestaña nueva en el navegador web y accede al interfaz de administración de tu blog Wordpress. Para añadir el widget a tu blog selecciona Apariencia > Widgets. 20. Arrastra el widget VodPod Videos de la columna izquierda de widgets disponibles a la columna derecha de widgets visibles. 21. Al soltar el widget se abrirá su panel de configuración. 22. Clic derecho y elige Pegar para pegar el código en la ventana de configuración del widget. 23. Clic en el botón Guardar. 24. Al visualizar el frontend del blog se mostrará un widget con los vídeos de la colección.
  • 568. Vídeo y animaciones ::: Youtube, video en streaming 568 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.9 OverStream: Videos subtitulados de Youtube 9.9.1 ¿Qué es Overstream? Overstream (http://www.overstream.net) es un espacio donde puedes personalizar un vídeo en línea alojado en sitios como Youtube, Google Video, MySpace Video, etc. incorporándole comentarios y subtítulos. Mientras el vídeo se guarda en su repositorio original, Overstream ofrece un visor propio a través del cual se visualiza ese vídeo en sincronía con los textos introducidos. Desde Youtube se pueden añadir títulos, subtítulos y anotaciones a tus propios vídeos pero no a los vídeos subidos por otros usuarios. Con Overstream se puede subtitular cualquier video alojado, por ejemplo, en Youtube. Los vídeos subtitulados se pueden compartir con los demás e integrar dentro de una página web o entrada de tu blog. 9.9.2 Crear un vídeo subtitulado 1. Visita la web de Overstream y regístrate para disponer de un nombre de usuario y contraseña. Una vez que dispongas de ella introdúcelas para entrar en sesión.
  • 569. Vídeo y animaciones ::: Youtube, video en streaming 569 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2. En otra pestaña del navegador utiliza el buscador de Youtube para localizar el vídeo en línea que deseas subtitular. Una vez situado en él, selecciona la dirección en la barra del navegador, clic derecho y elige Copiar. Ejemplo: http://www.youtube.com/watch?v=z_RAEESmsrs 3. Regresa a OverStream. Pulsa en el enlace Create overstream (Crear subtítulos). 4. Se muestra el cuadro de diálogo Vídeo URL (dirección del vídeo). En la casilla Enter Vídeo URL (Introduce URL del vídeo) haz clic derecho y selecciona Pegar para pegar la dirección copiada con anterioridad. Clic en el botón Ok. 5. Tras unos segundos de espera en el visor se cargará la película. Los pasos para crear los subtítulos serían (ver imagen):
  • 570. Vídeo y animaciones ::: Youtube, video en streaming 570 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1) Clic en el botón play de la consola de reproducción. Cuando estimes necesario añadir un comentario pulsa en el botón pause. 2) En la esquina inferior derecha pulsa en el botón add (añadir). 3) Introduce el subtítulo por teclado. Observa que en el listado se crea una entrada con el texto y también se ofrece una vista previa en el visor de la película. Para eliminar un texto se selecciona previamente en el listado y se pulsa en el botón remove (eliminar). Es necesario tener en cuenta que el subtítulo se muestra por defecto durante 3 segundos. Este valor se puede modificar en Options (opciones). Si deseas ampliar la duración del subtítulo seleccionado utiliza los controles Start Time y End Time (Tiempo de inicio y de fin). 4) Para guardar el proyecto pulsa en el botón save (guardar). Se muestra el cuadro de diálogo Overstream Name Dialog (Save To Server) (Nombre de los subtítulos para guardar en el servidor). Introduce un nombre y pulsa en OK. 6. Tras guardar el proyecto se mostrará el mensaje Overstream “título” created in the database (Overstream “título” creado en la base de datos).
  • 571. Vídeo y animaciones ::: Youtube, video en streaming 571 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 7. Pulsa sobre la pestaña Overstream Properties (Propiedades del Overstream). En esta página conviene configurar los siguientes parámetros: Access Level (Nivel de acceso) como Public, Subtitle Language (Idioma de Subtítulos) como Spanish, Tags (Etiquetas) separados por comas, Rating (Votación) y User Comments (Comentarios) activarlos o desactivarlos. 8. Para guardar los cambios introducidos en los parámetros de configuración pulsa en el botón Save Overstream Properties (Guardar propiedades del OverStream) 9. Clic en el enlace My Overstream. Observa que aparece la entrada correspondiente a los subtítulos recién creados. Para actualizar su contenido pulsa en el enlace Edit. Para ver el resultado final pulsa en el enlace Play.
  • 572. Vídeo y animaciones ::: Youtube, video en streaming 572 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Debajo del reproductor se muestra un cuadro de texto con el código Embed. 11. Clic derecho y selecciona Copiar para copiar este código HTML al portapapeles. 9.9.3 Insertar un video Overstream en una entrada de Blogger 1. Crear una NUEVA ENTRADA en Blogger y define como título “El Sistema Solar”. 2. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 3. 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 copiado anteriormente. 4. Para terminar pulsa en el botón PUBLICAR ENTRADA. 5. A continuación haz clic en el enlace Ver blog para ver el resultado final
  • 573. Vídeo y animaciones ::: Youtube, video en streaming 573 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 9.9.4 Insertar un video Overstream en una entrada de Wordpress 1. Visita la web de OverStream (http://www.overstream.net), introduce tus credenciales de usuario y accede al overstream que deseas insertar en un artículo de tu blog de Wordpress. 2. Clic derecho sobre el cuadro de texto del código Embed y selecciona Copiar. 3. Haz clic en el botón Post to Wordpress 4. En el cuadro de diálogo Post to your Blog haz clic en el enlace (Click if you're having trouble) (Clic si tienes problemas). Sobre el cuadro de texto haz clic derecho y elige Pegar. Clic en el enlace preview (vista previa).
  • 574. Vídeo y animaciones ::: Youtube, video en streaming 574 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 5. Introduce la URL of your blog (URL de tu blog), Username (Usuario) y Password para realizar la publicación directa sobre tu blog de Wordpress. 6. Teclea el título del nuevo artículo que contendrá el vídeo Title y el texto del mismo en Body. Clic en el botón Publish. 7. Clic en el botón View your blog (Ver tu blog). Se mostrará un artículo de tu blog conteniendo el video overstream. Es posible posteriormente reeditar esta entrada y modificar su texto.
  • 575. Vídeo y animaciones ::: Servicios de vídeo 575 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Servicios de vídeo
  • 576. Vídeo y animaciones ::: Servicios de vídeo 576 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10.1 Introducción En la Web 2.0 existen multitud de espacios donde es posible almacenar vídeos para su posterior difusión y publicación en nuestro blog. La reproducción mediante streaming que proporcionan estos espacios facilitan su visionado a través de Internet. Actualmente el líder en este sector es Youtube pero también existen otras alternativas interesantes: Revver, Vimeo o Metacafe. La integración de un vídeo de estos servidores en el artículo de un blog de Blogger siempre se realiza copiando y pegando el código Embed que se ofrece en la visualización de cada vídeo. 10.2 Copiar el código embed del vídeo 1. Visita la web de uno de estos servicios:  Revver: http://www.revver.com  Vimeo: http://www.vimeo.com  Metacafe: http://www.metacafe.com 2. Utiliza el buscador para localizar el vídeo que te interesa. Sitúate en su página para visionarlo. 3. El siguiente paso es copiar el código embed. En cada servicio web se hace de una forma distinta: Revver: 3.1 Clic en el botón More Options (Más opciones) 3.2 Asegúrate de que en la lista Select a format (Selecciona un formato) está seleccionada la entrada Flash Embed. 3.3 Clic derecho sobre el cuadro de código y elige Seleccionar todo. Haz clic derecho de nuevo y elige Copiar.
  • 577. Vídeo y animaciones ::: Servicios de vídeo 577 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Vimeo: 3.1 Clic en el botón </> Embed que aparece dentro del reproductor. 3.2 En el cuadro Embed this video (Incrusta este vídeo) haz clic derecho sobre el código y selecciona la opción Copiar. Metacafe: 3.1 Clic en el botón <> Incrustar. Clic derecho en la casilla Embeddable Player y selecciona Seleccionar todo y luego Copiar.
  • 578. Vídeo y animaciones ::: Servicios de vídeo 578 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10.3 Insertar el vídeo en Blogger 1. Crear una NUEVA ENTRADA en Blogger y define como título “Mis vídeos”. 2. Clic en el enlace Edición de HTML para mostrar el código HTML del artículo. 3. 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 copiado anteriormente. 4. Para terminar pulsa en el botón PUBLICAR ENTRADA. A continuación haz clic en el enlace Ver blog para ver el resultado final 10.4 Insertar el vídeo en Wordpress 1. Clic en el botón Post to Blog que se encuentra en la barra de marcadores de Mozilla Firefox. 2. Haz clic en el botón Post to Wordpress 3. En el cuadro de diálogo Post to your Blog haz clic en el enlace (Click if you're having trouble) (Clic si tienes problemas). Sobre el cuadro de texto haz clic derecho y elige Pegar para pegar el código. Clic en el enlace preview (vista previa) 4. Introduce la URL of your blog (URL de tu blog), Username (Usuario) y Password para realizar la publicación directa sobre tu blog de Wordpress. 5. Teclea el título del nuevo artículo que contendrá el vídeo Title y el texto del mismo en Body. Clic en el botón Publish. 6. Clic en el botón View your blog (Ver tu blog). Se mostrará un artículo de tu blog conteniendo el video overstream. Es posible posteriormente reeditar esta entrada y modificar su texto. Revver Vimeo Metacafe
  • 579. Vídeo y animaciones ::: Servicios de vídeo 579 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Wordpress.com contempla la integración de vídeos de Vimeo utilizando una etiqueta específica sin ser necesaria la utilización de un procedimiento general que proporciona VodPod. Si la URL directa de un vídeo en Vimeo es del tipo: http://vimeo.com/240975 Entonces se puede añadir al código HTML de una entrada la siguiente etiqueta: [vimeo http://vimeo.com/240975] O bien [vimeo 240975] La anchura y altura por defecto del reproductor insertado es 400x300 píxeles. Sin embargo en la etiqueta se pueden especificar otras dimensiones: [vimeo http://vimeo.com/240975 w=500&h=400]
  • 580. Anexo I. Canales de suscripción 580 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Anexo 1. Canales de suscripción
  • 581. Anexo I. Canales de suscripción 581 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.1 ¿Qué es un canal de suscripción? Un canal de suscripción de un sitio web permite que los usuarios se puedan vincular al canal y a partir de ese momento recibir notificación de las nuevas entradas que se van publicando en ese sitio web sin necesidad navegar hasta él. Su funcionamiento se basa en un archivo XML diseñado con una sintaxis especial de etiquetas y que está ubicado en una dirección concreta del sitio web. Se actualiza cada vez que se publica una nueva entrada de tal forma que contiene los titulares de las últimas noticias publicadas. Este archivo puede ser leído por los usuarios utilizando el propio navegador web o bien un programa específico. En ambos casos, cada vez que se inicia el programa (navegador o lector de feeds), chequea de forma automática el contenido de los canales suscritos y muestra al lector las novedades si las hubiera. La suscripción de noticias nos va a permitir conocer los últimos artículos y comentarios publicados en nuestros blogs favoritos. Esta adhesión puede realizarse a varios blogs concentrando la lectura de todos ellos en una misma herramienta. En la actualidad los dos principales formatos XML de canales de suscripción utilizados en los blogs son: RSS y Atom. Se diferencian en la sintaxis que utilizan para la difusión de noticias pero su funcionamiento es similar. 1.2 Suscripción con el navegador Firefox 3+ Un marcador dinámico de Firefox permite suscribirse a un canal de noticias de un sitio web y recibir las nuevas noticias sin necesidad de visitarlo. Gracias a los marcadores dinámicos el contenido viene al usuario. En lugar de tener que revisar los cambios y modificaciones de la página web, el marcador dinámico ofrece las actualizaciones tan rápido como están disponibles. 1. Abre Mozilla Firefox 2. Navega hasta la portada o página principal de tu blog en Blogger o Wordpress. 3. Utiliza la barra de scroll vertical para situarte al pie de esta página principal. Blogger 4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se ofrece el formato Atom para la suscripción. Wordpress 5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato RSS para la suscripción. Ambos 6. Se muestra una página con un resumen de los últimos artículos publicados en el blog ordenados comenzando por el más reciente. Si deseas leer en detalle uno de estos
  • 582. Anexo I. Canales de suscripción 582 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado artículos haz clic sobre el enlace de su título para acceder al artículo en el blog original. 7. Cuando se accede desde Firefox a la página de titulares de un canal de feeds, en la parte superior de la misma página se ofrece la oportunidad de crear un marcador dinámico a ese canal. 8. Asegúrate de que la opción Marcadores dinámicos está seleccionada en la lista Suscribirse a este canal usando. 9. Clic en el botón Suscribirse ahora. 10. En el cuadro de diálogo Suscribirse con los marcadores dinámicos puedes modificar el Nombre del canal aunque conviene dejar el que viene por defecto. En la lista desplegable Carpeta conviene que selecciones Barra de herramientas de marcadores para que de esta forma el marcador dinámico aparezca en la barra de marcadores de Firefox y sea visible y accesible directamente. 11. Pulsa en el botón Suscribirse. 12. Observa que esta acción ha creado en la barra de marcadores de Firefox un marcador con el nombre del canal. Si pulsas sobre él se mostrarán las noticias de este canal. Pulsa sobre la noticia deseada para acceder a su página. Si eliges la opción Abrir todo en pestañas se mostrará cada noticia en una pestaña independiente.
  • 583. Anexo I. Canales de suscripción 583 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 13. Si la barra de marcadores no está visible entonces activa su visualización mediante Ver > Barra de herramientas > Barra de herramientas de marcadores Blogger 14. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del blog y también a los comentarios de un artículo concreto. Sin embargo para la suscripción a estos canales NO se ofrece un enlace directo en la página principal o página de un artículo siendo necesario utilizar las prestaciones de la barra de dirección del navegador web.  Si estás situado en la portada principal (se muestran varios artículos en la misma página), Firefox detecta que en esa página se está ofreciendo de forma oculta el canal de suscripción en formatos Atom y RSS. Por este motivo en el extremo derecho de la barra de direcciones aparece el icono característico de los canales feed. Haz clic en este icono y elige el formato de suscripción.  Si haces clic en el título de una entrada accedes a una página donde sólo se muestra ese artículo y dependiendo de la configuración definida quizás
  • 584. Anexo I. Canales de suscripción 584 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado también los comentarios. Firefox vuelve a detectar que en esa página se están ofreciendo de forma oculta el canal de suscripción en formatos Atom y RSS para las entradas del blog pero también el canal de suscripción en formato Atom para los comentarios que se realicen a esa entrada. En cualquiera de estos casos se accede a una página de Marcadores dinámicos desde donde es posible suscribirse utilizando el procedimiento explicado. 1.3 Suscripción con el navegador IExplorer 7+ 1. Abre Internet Explorer 7 2. Navega hasta la portada o página principal de tu blog en Blogger. 3. Utiliza la barra de scroll vertical para situarte al pie de esta página principal. Blogger 4. Se ofrece un enlace con el título: Suscribirse a: Entradas (Atom). En este caso se ofrece el formato Atom para la suscripción. Wordpress 5. Se ofrece un enlace con el título Entradas (RSS). En este caso se ofrece el formato RSS para la suscripción. Ambos 6. Se muestra una página los últimos artículos publicados en el blog ordenados comenzando por el más reciente. Si deseas leer en detalle uno de estos artículos haz clic sobre el enlace de su título para acceder al artículo en el blog original. 7. Clic en el enlace Suscribirse a esta fuente.
  • 585. Anexo I. Canales de suscripción 585 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 8. En el cuadro de diálogo Suscribirse a esta fuente comprueba o modifica si lo deseas el Nombre del canal y pulsa en el botón Suscribirse. Esta suscripción se guarda por defecto en la carpeta de Fuentes. Blogger 9. Blogger ofrece el formato Atom y el formato RSS para suscribirse a los artículos del blog y también a los comentarios de un artículo concreto. Sin embargo para la suscripción a estos canales NO se ofrece un enlace directo en la página principal o página de un artículo siendo necesario utilizar las prestaciones de la barra de dirección del navegador web.  Si estás situado en la portada principal (se muestran varios artículos en la misma página), Internet Explorer detecta que en esa página se está ofreciendo de forma oculta el canal de suscripción en formatos Atom y RSS. Por este motivo en la barra de herramientas del navegador aparece iluminado el icono característico de los canales feed. Haz clic en este icono y elige el formato de suscripción.
  • 586. Anexo I. Canales de suscripción 586 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Si haces clic en el título de una entrada accedes a una página donde sólo se muestra ese artículo y dependiendo de la configuración definida quizás también los comentarios. Internet Explorer vuelve a detectar que en esa página se están ofreciendo de forma oculta el canal de suscripción en formatos Atom y RSS para las entradas del blog pero también el canal de suscripción en formato Atom para los comentarios que se realicen a esa entrada. En cualquiera de estos casos se accede a una página de Suscripción de fuentes desde donde es posible suscribirse utilizando el procedimiento explicado. 10. En Internet Explorer una forma de acceder a los canales que nos hemos suscrito es seleccionar: Ver > Barra del explorador > Fuentes. Esta acción mostrará el panel de Fuentes disponibles. Al hacer clic en una de ellas en el panel derecho se mostrará el listado de noticias que contiene.
  • 587. Anexo I. Canales de suscripción 587 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Nota: Con las credenciales de una cuenta de Google se puede acceder al servicio Google Reader (http://www.google.com/reader/) que permite gestionar la suscripción y lectura de canales de feeds utilizando el interfaz web que proporcionan. También se pueden compartir con otros amigos. 1.4 Enlaces de suscripción a tu blog Blogger Con intención de facilitar la suscripción a tu blog de los lectores que lo deseen se puede incorporar a la barra lateral un gadget o módulo que proporcione en todo momento los enlaces correspondientes de suscripción. 1. Desde el interfaz de administración de tu blog selecciona las pestañas Diseño > Elementos de la página. 2. En el esquema de la barra lateral haz clic en el enlace Añadir un gadget. 3. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Enlaces de suscripción. 4. Por defecto se ofrece como título de este gadget: Suscribirse a. En este caso aceptaremos este título y pulsa en el botón GUARDAR. 5. Para ver el resultado final haz clic en el enlace Ver blog. En la columna lateral se mostrará el nuevo gadget ofreciendo enlaces para la suscripción a entradas y a comentarios incluyendo su incorporación en servicios Web 2.0 que integran la suscripción a canales feed.
  • 588. Anexo I. Canales de suscripción 588 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.5 Enlaces de suscripción a tu blog Wordpress Con intención de facilitar la suscripción a tu blog de los lectores que lo deseen se puede incorporar a la barra lateral un widget o módulo que proporcione en todo momento los enlaces correspondientes de suscripción. 1. Desde el interfaz de administración de tu blog selecciona Apariencia > Widgets 2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la columna derecha de widgets visibles un módulo con el título Enlaces RSS. 3. Al soltarlo se abre este cuadro permitiendo configurar sus distintos parámetros:  Título: Suscribirse a  Feeds to Display (Feeds a Mostrar): Entradas.  Formato: Enlace de texto.
  • 589. Anexo I. Canales de suscripción 589 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Clic en el botón Guardar. 5. Para ver el resultado final visita el frontend del blog. En la columna lateral se mostrará el nuevo gadget ofreciendo enlaces para la suscripción a entradas y a comentarios incluyendo su incorporación en servicios Web 2.0 que integran la suscripción a canales feed. 1.6 Añadir un feed externo a tu blog En un blog se puede añadir un gadget que muestre los titulares de un canal de feeds externo. De esta forma podemos ofrecer en nuestro blog novedades gestionadas por terceras personas que se actualizan sin nuestra mediación. 1.6.1 Buscar un canal de feeds 1. Visita la página web de los canales RSS del diario digital El País. Su URL es: http://www.elpais.com/rss/ 2. Clic en el título de uno de los múltiples canales RSS que ofrece este diario. Por ejemplo: Titulares de portada o Lo último. 3. Se muestra un cuadro de diálogo con la URL de ese canal. Pulsa y arrastra para seleccionar la dirección completa. Sobre ella haz clic derecho y elige Copiar. 1.6.2 Añadir un canal feed externo a Blogger 4. Desde el interfaz de administración de tu blog selecciona las pestañas Diseño > Elementos de la página. 5. En el esquema de la barra lateral haz clic en el enlace Añadir un gadget.
  • 590. Anexo I. Canales de suscripción 590 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. En el catálogo de gadgets disponibles haz clic en el botón “+” del tipo Feed. 7. En el cuadro de diálogo Configurar feed haz clic derecho sobre el cuadro de texto URL del feed y elige la opción Pegar. 8. Clic en el botón CONTINUAR. 9. En el Título puedes introducir un título más personalizado aunque conviene dejar el título extraído del canal. 10. Define el número de artículos a mostrar así como si se incluirán o no las fechas y/o autores de los elementos. En la parte inferior se mostrará una vista previa del resultado en función de la configuración establecida. 11. Para terminar pulsa en el botón GUARDAR. 12. Haz clic en el enlace Ver blog para visualizar el aspecto que tendrá el nuevo gadget añadido. Al hacer clic en un titular se mostrará ese artículo en concreto en el sitio web del periódico.
  • 591. Anexo I. Canales de suscripción 591 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 1.6.3 Añadir un canal feed externo a Wordpress 1. Desde el interfaz de administración de tu blog selecciona las pestañas Apariencia > Widgets 2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la columna derecha de widgets visibles un módulo con el título RSS 3. Al soltarlo se abre este cuadro permitiendo configurar sus distintos parámetros. En el cuadro diálogo RSS haz clic derecho en el cuadro de texto Introduce la URL del feed RSS aquí:
  • 592. Anexo I. Canales de suscripción 592 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Introduce un título del feed y define el resto de parámetros. Clic en el botón Guardar. 5. Al visualizar el blog podemos ver el aspecto que tendrá el nuevo widget añadido. Al hacer clic en un titular se mostrará ese artículo en concreto en el sitio web del periódico.
  • 593. Anexo II. Delicious, marcadores sociales 593 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Anexo 2. Delicious, marcadores sociales
  • 594. Anexo II. Delicious, marcadores sociales 594 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.1 ¿Qué son los marcadores sociales? Los marcadores son enlaces a sitios y páginas web que guardamos para facilitar su posterior localización y acceso. Se llaman también “favoritos”. Tanto el navegador IExplorer como el Firefox disponen de un sistema de creación de marcadores o favoritos para guardarlos y utilizarlos en nuestro equipo habitual. Sin embargo estos marcadores también se pueden guardar en Internet. De esta forma es posible acceder a ellos desde cualquier ordenador y compartirlos con otros usuarios. El calificativo de “social” se debe a que se pueden compartir con otras personas pudiéndose crear redes sociales o grupos. Cuando un usuario crea un marcador le asigna libremente unas etiquetas o tags. La clasificación que se genera a partir de estas etiquetas constituye lo que algunos llaman folksonomía. 2.2. ¿Qué es Delicious? Delicious (http://delicious.com/) es el servicio Web 2.0 más popular donde se pueden guardar los marcadores o favoritos. Es necesario registrarse como usuario e instalar una extensión en el navegador (Firefox o Internet Explorer) para disponer de una consola de botones en la barra de herramientas que facilite la creación y edición de estos marcadores. Mientras se navega si encuentras una página que te interese, no la guardas en los favoritos del navegador, sino que la envías a Delicious y se guarda allí. Esto facilita la utilización de estos marcadores desde cualquier ordenador y compartirlos con otros usuarios. 2.3 Registrarse en Delicious 1. Visita la página de Delicious: http://delicious.com 2. Si no dispones de credenciales (usuario y contraseña) y deseas registrarte haz clic en el botón Join Now (Conectarse ahora) 3. En la pantalla Enter Details (Introducir detalles) completa tus datos personales en la página Enter Details (Introduce detalles) y pulsa en el botón Register. 2.4 Instalación de los botones en el navegador Después de registrarse se accede a la página Add Buttons (Añadir botones). Se puede saltar este paso pulsando en el botón Skip Step 2. La instalación de estos botones en el navegador se puede posponer para más adelante a través de la ayuda Help de Delicious. En este caso vamos a continuar con la instalación de botones porque suponemos que te encuentras en tu equipo personal. En función del navegador web que se utilice se propondrá la instalación de la extensión. Clic en el botón Add buttons.
  • 595. Anexo II. Delicious, marcadores sociales 595 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Si estás utilizando Firefox: 1. En el cuadro de diálogo Instalación de software pulsa en el botón Instalar ahora. 2. En el cuadro de diálogo Complementos haz clic en el botón Reiniciar Firefox para completar la instalación. 3. Automáticamente se pasará al paso 3: Import existing bookmarks (Importar marcadores existentes). Si estás utilizando Internet Explorer: 1. En el cuadro de Advertencia de seguridad de Descarga de archivos haz clic en el botón Ejecutar para iniciar el instalador del complemento. Una vez descargado confirma pulsando de nuevo en el botón Ejecutar. 2. Sigue el asistente de instalación. Tendrás que cerrar todas las ventanas de Internet Explorer para poder finalizar la instalación. 3. Clic en el botón Close para cerrar el asistente de instalación. 4. Se abre el navegador IExplorer mostrando el paso 3 del asistente para importar favoritos. En cualquiera de los casos si seguimos el asistente de 3 pasos propuesto por Delicious, tras finalizar el paso 2, se salta al paso 3 donde se propone importar los favoritos del navegador. La instalación descrita ha creado en la barra de herramientas del navegador web 3 botones:
  • 596. Anexo II. Delicious, marcadores sociales 596 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Firefox: Internet Explorer: Estos botones se utilizan para: 1. Delicious. Ir a la web de Delicious 2. Bookmarks. Muestra/oculta el panel lateral de Delicious 3. Tags. Permite introducir las etiquetas para la página actual. Si es la primera vez que utilizas Delicious se recomienda saltar el paso 3 de importar favoritos para finalizar con el asistente. Nota: Para acceder al instalador de los botones en otro momento utiliza las siguientes URL:  Internet Explorer: http://delicious.com/help/installie  Firefox: http://delicious.com/help/installff 2.5 Guardar un marcador a un artículo de un blog 1. Abre el navegador y sitúate en el artículo del blog cuyo marcador deseas guardar. 2. Clic en el botón Tag para iniciar el etiquetado y guardar el marcador.
  • 597. Anexo II. Delicious, marcadores sociales 597 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 3. Si no te has autentificado todavía en el servicio Delicious se mostrará un cuadro de diálogo Delicious account (cuenta Delicious). Te indica que debes autentificarte en Delicious para poder crear el marcador de esta página. Pulsa en el botón Sign in (Entrar). 4. Se abrirá una nueva ventana donde debes introducir tu usuario y contraseña de Delicious. Si deseas desconectarte de Delicious cuando cierres el navegador desmarca la casilla Keep me signed in (Mantenerme conectado) antes de pulsar en el botón Sign In. Otra posibilidad es visitar la página de Delicious pulsando en el botón Delicious del navegador y una vez allí hacer clic sobre el enlace Sign Out para salir de sesión. 5. Para autentificarte pulsa en el botón Sign In (Entrar). 6. De regreso a la ventana del navegador anterior, vuelve a pulsar en el botón Tag de la barra de herramientas. Se muestra un cuadro de diálogo Save a Bookmark (Guardar un Marcador). Introduce o modifica el Title (Título), Notes (Notas) y Tags (Etiquetas). Las etiquetas debes introducirlas separadas por espacios en blanco. Tambiéjn puedes indicar si compartes o no este enlace desmarcando o marcando la casilla do not share (no compartir). Para terminar pulsa en el botón Save (Guardar).
  • 598. Anexo II. Delicious, marcadores sociales 598 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.6 Importar favoritos del navegador a Delicious Esta tarea se puede realizar si queremos importar a Delicious los favoritos que tenemos en el navegador. Si no los estábamos utilizando los favoritos del navegador es preferible no realizar esta tarea. Para importar los favoritos del navegador a Delicious SI … a) Estás en el paso 3 de configuración de tu cuenta. b) Estás autentificado, no dispones todavía de marcadores y seleccionas BookMarks > My BookMarks > Import Bookmarks (Marcadores > Mis marcadores > Importar Marcadores) c) Estás autentificado y seleccionas Settings > Import/Upload Bookmarks (Configuración > Importar/Subir Marcadores). 1. Clic en el botón Import Now para enviar a tu cuenta Delicious los favoritos que en ese momento tiene tu navegador local. 2. A continuación se mostrará un mensaje notificando que el proceso de importación se ha realizado con éxito. 3. Clic en el botón Your Bookmarks para acceder al listado de marcadores importados.
  • 599. Anexo II. Delicious, marcadores sociales 599 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.7 Editar marcadores Delicious desde página web 1. Abre el navegador web 2. Clic en el botón Delicious para ir directamente a la página de Delicious. 3. Si el navegador no conserva la sesión te pedirá que introduzcas el nombre de usuario y la contraseña de Delicious. 4. Si deseas desconectarte de Delicious cuando cierres el navegador desmarca la casilla Keep me signed in (Mantenerme conectado) antes de pulsar en el botón Sign In. Haz clic en este botón. 5. Tras la autentificación el navegador se situará en la dirección: http://delicious.com/<usuario> mostrando la lista de marcadores registrados. Para visitar un enlace basta con hacer clic en su título. 6. En la entrada correspondiente a cada marcador se pueden realizar las siguientes operaciones:
  • 600. Anexo II. Delicious, marcadores sociales 600 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  SHARE (Compartir). Si pulsas en este botón se mostrará un mensaje de confirmación a la pregunta Share this link?. Si eliges Yes compartirás este enlace con el resto de la comunidad de usuarios Delicious. El icono del “candado” que se muestra a la izquierda del título del marcador desaparecerá. Este enlace será accesible por cualquier visitante anónimo (sin autentificar) que acceda a la dirección: http://delicious.com/<tu_usuario>. Para volver a no compartir en enlace hay que editar (EDIT) el marcador y activar la casilla Do not Share. A la derecha del título se muestra un cuadrado de fondo azul indicando el número de usuarios que comparten ese mismo enlace. Si haces clic en él accederás a este listado de usuarios.  EDIT (Editar). Al hacer clic en el enlace de esta entrada se accederá a la ficha del marcador donde es posible modificar su URL, título, notas, etiquetas o tags, compartir (share), etc. Para guardar los cambios pulsa en Save (Guardar)  DELETE (Borrar). Si pulsas en este enlace y confirmas con Yes a la pregunta Delete this bookmark? (Borrar este enlace) eliminarás este marcador del listado. 2.8 Editar los marcadores Delicious desde el propio navegador 1. Abre el navegador web. 2. Clic en el botón Bookmarks (Marcadores) para abrir la barra lateral izquierda de Delicious en el navegador. 3. En el lateral izquierdo del navegador se mostrará la barra de Delicious.
  • 601. Anexo II. Delicious, marcadores sociales 601 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Si el navegador no conserva la sesión de Delicious es necesario pulsar en el enlace Sign in (Entrar) que aparece en la parte inferior de este panel. En el navegador se mostrará la página de petición de Username (nombre de usuario) y Password (contraseña). Introduce estos datos y pulsa en el botón Sign In. Como resultado de esta autentificación ahora en la base del panel se mostrará el mensaje “<Nombre_usuario> on Delicious”. 5. Para navegar hasta uno de mis favoritos basta con hacer clic sobre el marcador correspondiente en el panel Bookmarks. 6. Haciendo CLIC DERECHO sobre la entrada correspondiente a un marcador se pueden realizar las operaciones más básicas de uso y edición de marcadores:
  • 602. Anexo II. Delicious, marcadores sociales 602 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Open (Abrir la web referenciada en la misma ventana), Open in New Window (Abrir en nueva ventana) y Open in New Tab (Abrir en nueva pestaña).  New Bookmark (Nuevo Marcador). Si eliges esta opción se mostrará un cuadro de diálogo donde podrás introducir los datos del marcador y guardarlos en Delicious pulsando en el botón Save (Guardar).  Delete (Borrar). Si seleccionas esta opción se mostrará un mensaje de confirmación . Si haces clic en Aceptar se eliminará el marcador.  More about this Bookmark (Información acerca de este marcador). Mostrará una página con información de este marcador en Delicious: en mis marcadores, qué usuarios también lo han registrado, etiquetas asociadas, etc.  Properties (Propiedades). Mostrará los datos del marcador. Se pueden modificar y guardar los cambios pulsando al final en el botón Save. 2.9 Añadir un marcador en un navegador sin botones Delicious Si queremos añadir un marcador a nuestra cuenta Delicious, y no nos encontramos en nuestro ordenador, no es necesario instalar los botones. Desde la página de Delicious se podría hacer manualmente siguiendo estos pasos: 1. En el navegador web sitúate en la página cuya dirección deseas conservar. 2. Clic derecho sobre su URL o dirección y selecciona Seleccionar todo y luego clic derecho para elegir Copiar. De esta forma hemos copiado la URL de esta página. 3. Visita la página web de Delicious: http://delicious.com 4. Clic en el botón Sign In (Entrar) 5. Introduce el Username (Nombre de usuario) y Password (Contraseña) de Delicious, desmarca la opción Keep me signed in (Mantenerme autentificado) para que la sesión termine al cerrar el navegador y pulsa en el botón Sign In (Entrar)
  • 603. Anexo II. Delicious, marcadores sociales 603 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 6. Una vez autentificado haz clic en el enlace Save a new bookmark (Guardar un nuevo marcador). 7. Clic derecho sobre la casilla URL y elige Pegar. Clic en el botón Next (Siguiente). 8. En la ficha del marcador puedes introducir su URL, título, notas, etiquetas o tags, compartir (share), etc. Para terminar pulsa en el botón Save (Guardar).
  • 604. Anexo II. Delicious, marcadores sociales 604 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.10 Búsquedas por etiquetas en Mis Marcadores Para buscar en Mis Marcadores: 1. Abre el navegador, sitúate en Delicious e inicia una sesión de usuario introduciendo tu usuario y contraseña. 2. Para situarte en tu lista de marcadores selecciona Bookmarks > My Bookmarks 3. La búsqueda de marcadores por etiquetas es sencilla. Basta con teclear la etiqueta y al pulsar en la flecha azul situada a su derecha el listado se filtrará mostrando sólo los marcadores que contengan esa etiqueta. 4. Se pueden ir añadiendo más etiquetas a este encabezado para afinar la búsqueda. En este caso se mostrarán los marcadores que contengan todas y cada una de las etiquetas introducidas. 5. Para eliminar una etiqueta del filtro pulsa en el botón X situado a la derecha de la etiqueta en el encabezado. Otra posibilidad de búsqueda es pulsar directamente sobre una etiqueta de las situadas en el listado All Tags. Este listado se muestra en la columna derecha de la página. Observa que al seleccionar una etiqueta, ésta se añade al encabezado de filtrado y el listado de marcadores que se muestra corresponde a todos aquellos que contienen la mencionada etiqueta.
  • 605. Anexo II. Delicious, marcadores sociales 605 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado En el listado de All Tags se muestran todas las etiquetas. En la parte superior de las mismas también aparecen las etiquetas relacionadas Related Tags. Se denomina etiquetas relacionadas a aquellas que se han introducido en un mismo marcador. Por ejemplo: si hemos etiquetado un marcador con cuatro etiquetas: cursos formación profesorado distancia, entonces Delicious considera que estos cuatro marcadores están relacionados. Al elegir uno cualquiera en el listado All Tags el resto de etiquetas se mostrarán en el apartado Related Tags. Si elijo una etiqueta relacionada ésta se añadirá al filtrado permitiendo una búsqueda más fina. Otra posibilidad de búsqueda por etiquetas es seleccionar Tags > My tags en la barra de herramientas de la página de Delicious y luego pulsar en una de las etiquetas. Esto mostrará el listado de marcadores filtrados por esa etiqueta. Otra opción para buscar por etiquetas es utilizar la barra lateral de Delicious en el navegador web. Para ello teclea el tag en el cuadro Search (Buscar) o bien elige una etiqueta en el marco Tags (Etiquetas). Haz clic en una etiqueta y en el marco BookMarks (Marcadores) se mostrarán los marcadores que contienen esa etiqueta. 2.11 Búsquedas de marcadores populares o recientes 1. Desde la barra de herramientas selecciona Bookmarks > Popular para buscar los marcadores más catalogados por los usuarios de Delicious. 2. Si seleccionas Bookmarks > Recent podrás acceder a los últimos marcadores añadidos y compartidos por usuarios de la comunidad.
  • 606. Anexo II. Delicious, marcadores sociales 606 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.12 Configurar mi red social Tu red social es una forma fácil de acceder a los marcadores guardados por otros usuarios. 1. Selecciona People > My NetWork (Comunidad > Mi Red Social). 2. Clic en el botón o enlace Add a user to Network (Añadir un usuario a la red). 3. Introduce el nombre de usuario y pulsa en el botón Add (Añadir). 4. De esta forma en esta sección se mostrarán los marcadores de los usuarios que hemos añadido a nuestra red social. 2.13 Suscripciones a marcadores por etiquetas Otra opción interesante es la posibilidad de suscribirse a una etiqueta o tag que nos interese y recibir notificación de los marcadores existentes o nuevos que contengan esa etiqueta. 1. Selecciona Tags > My Subscriptions (Etiquetas > Mis suscripciones) 2. Clic en el botón Add a subscription (Añadir una suscripción). Introduce una etiqueta y pulsa en el botón Add (Añadir). Si marcas la opción From a specific user (De un usuario específico) podrás introducir el nombre de un usuario y limitar la suscripción a los marcadores creados por el usuario indicado. 3. En esta sección se mostrarán los marcadores sociales almacenados en Delicious que contengan la etiqueta introducida.
  • 607. Anexo II. Delicious, marcadores sociales 607 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 2.14 Aplicaciones de Delicious en Blogger En este apartado se describen los distintos procedimientos para integrar en tu blog de Blogger los marcadores sociales gestionados desde Delicious. 2.14.1 Network Badges (Distintivo de red). Esta aplicación de Delicious permite mostrar detalles de tu cuenta Delicious dentro de tu blog o página web. Su integración se realiza configurando las distintas opciones del distintivo para luego copiar y pegar el código HTML en un gadget del blog. 1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Network Badges. (Configuración > Blogging > Network Bagdes) 2. En la página Network Badges configura las distintas opciones de visualización:  Icon: icono  Show: mostrar Username (nombre de usuario), Bookmark count (contador de marcadores), Fan count (contador de seguidores), etc. 3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto del distintivo de acuerdo con la configuración establecida. 4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar. 5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos de la página. 6. Clic en el enlace Añadir un gadget. 7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript. 8. En el cuadro de diálogo Configurar HTML/Javascript introduce “Enlaces favoritos” o similar como Título, haz clic derecho sobre el cuadro Contenido y elige Pegar. 9. Clic en el botón GUARDAR.
  • 608. Anexo II. Delicious, marcadores sociales 608 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Clic en el enlace Ver blog para visualizar el aspecto final de este distintivo de Delicious. 2.14.2 Linkrolls (Listas de enlaces). Las listas de enlaces o linkrolls es una forma de mostrar en tu blog o página web los últimos favoritos que has catalogado en tu cuenta de Delicious. Primero es necesario configurar los parámetros de visualización de este gadget y luego se copia y pega el código HTML que proporciona Delicious para hacer posible esta integración en tu blog. 1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Link Rolls. (Configuración > Blogging > Listas de enlaces) 2. En la página Link Rolls configura las distintas opciones de visualización:  Title. En este caso puedes introducir como título Enlaces favoritos.  Tags (Etiquetas). Si introduces etiquetas separadas por comas sólo se visualizarán los marcadores que tengan estas etiquetas.  Icon (Icono). Puedes elegir el icono que acompañará al listado.  Quantity (Cantidad). Establece el número de los últimos marcadores que aparecerán en el listado. Por defecto este valor es 5.  Bullet (Viñeta). En este apartado se puede seleccionar el tipo de viñeta con que se mostrará cada marcador en el listado.  Sort (Orden). Permite establecer una ordenación en el listado de marcadores que se muestran: Most recent (Más recientes) o Alphabetically (Alfabéticamente).  Show (Mostrar). Permite mostrar Tags (Etiquetas), Notes (Anotaciones realizadas en los marcadores), Username (nombre del usuario) y Add to Network (afiliarse a la red). 3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto resultante del listado de marcadores de acuerdo con la configuración establecida.
  • 609. Anexo II. Delicious, marcadores sociales 609 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar. 5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos de la página. 6. Clic en el enlace Añadir un gadget. 7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript. 8. En el cuadro de diálogo Configurar HTML/Javascript en este ocasión es mejor no introducir título para evitar redundancias. A continuación haz clic derecho sobre el cuadro Contenido y elige Pegar. 9. Clic en el botón GUARDAR.
  • 610. Anexo II. Delicious, marcadores sociales 610 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de marcadores soportado por Delicious. 2.14.3 Tagrolls (Listas de etiquetas). Tagrolls o listas de etiquetas representan una forma excelente de mostrar las etiquetas de Delicious como parte de tu sitio web o blog. Al igual que en ocasiones anteriores el procedimiento de integración es sumamente fácil y consiste en configurar los parámetros de visualización y a continuación copiar y pegar el código HTML en un gadget del blog. 1. Desde el interfaz de administración de Delicious selecciona Settings > Blogging > Tag Rolls. (Configuración > Blogging > Listas de etiquetas) 2. En la página Tag Rolls configura las distintas opciones de visualización:  Title. En este caso puedes introducir como título Mis etiquetas Delicious.  Icon (Icono). Puedes elegir si se incluirá el icono de Delicious o no.  Quantity (Cantidad). Permite definir el número máximo de etiquetas que incluirá en el listado. Se mostrarán las etiquetas de mayor frecuencia.  Font (Fuentes). Permite definir el límite mínimo y máximo del tamaño de fuente y el color (código hexadecimal de color, como por ejemplo, ff0000 sería el rojo). Estos valores se refieren a la etiqueta menos abundante incluida en el listado y la etiqueta con más coincidencias.  Sort (Orden). Permite establecer una ordenación en el listado de etiquetas que se muestran: Alphabetically (Alfabéticamente) o Count (Contador).  Flow (Aspecto). En este caso elegiremos Cloud (Nube) para definir que el listado de etiquetas tenga el aspecto de una nube de etiquetas. Otra posibilidad es elegir List (Lista).
  • 611. Anexo II. Delicious, marcadores sociales 611 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Show (Mostrar). Permite mostrar Tag Counts (contadores de etiquetas), Username (nombre del usuario) y Add to Network (enlace de afiliarse a la red). 3. En la columna derecha de Preview (Vista previa) se mostrará el aspecto resultante del listado de marcadores de acuerdo con la configuración establecida. 4. Clic derecho sobre el cuadro de texto donde se genera el código Embed y elige Seleccionar todo. Clic derecho de nuevo para seleccionar Copiar. 5. Sitúate en la administración de tu blog y haz clic en las pestañas Diseño > Elementos de la página. 6. Clic en el enlace Añadir un gadget. 7. Pulsa en el botón “+” del tipo de gadget: HTML/Javascript. 8. En el cuadro de diálogo Configurar HTML/Javascript en este ocasión es mejor no introducir título para evitar redundancias. A continuación haz clic derecho sobre el cuadro Contenido y elige Pegar. 9. Clic en el botón GUARDAR.
  • 612. Anexo II. Delicious, marcadores sociales 612 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado 10. Clic en el enlace Ver blog para visualizar el aspecto final de este listado de marcadores soportado por Delicious. El usuario al pulsar en un enlace de la nube será enviado a Delicious donde se mostrará un listado de todos los marcadores asignados a esa etiqueta. 2.15 Aplicación de Delicious en Wordpress 1. Desde el interfaz de administración de tu blog selecciona Apariencia > Widgets 2. En el catálogo de widgets disponibles en la columna izquierda, arrastra y suelta en la columna derecha de widgets visibles un módulo con el título del.icio.us 3. Al soltarlo se muestra el panel de configuración de los distintos parámetros de este cuadro:
  • 613. Anexo II. Delicious, marcadores sociales 613 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado  Widget title (título del widget). Por ejemplo: Enlaces ó Favoritos.  Del.icio.us login. Introduce tu usuario en del.icio.us. Otra posibilidad es integrar los marcadores sociales de otros usuarios.  Number of links (Número de enlaces). Define el número de enlaces.  Tags (Etiquetas). Si introduces una o varias etiquetas separadas por comas se mostrarán sólo los marcadores asociados a estas etiquetas. 4. Clic en el botón Guardar. 5. Al visualizar el frontend del blog, en su barra lateral, se mostrará el widget con estos enlaces. Nota: Cuando se actualizan los marcadores en del.icio.us en este widget del blog se mostrarán los cambios introducidos.
  • 614. Glosario de términos Módulo 1. Blogs
  • 615. Glosario de términos ::: Módulo 1 : Blogs 615 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado A   Administrador    Es  un  rol  de  usuario  que  dispone  de  todos  los  permisos  sobre  el  blog:  edición  de  artículos,  gestión de usuarios, configuración de opciones, etc.    Adobe Reader    Programa gratuito de Adobe para leer archivos PDF.     Archivo    En un blog es el conjunto de entradas antiguas que normalmente se ofrecen clasificadas por  años, meses, días, etc.    Artículo    Cada entrada o post de un blog.     Atom  Formato de difusión de noticias de un blog o sitio web para suscripción.    Audioblog    Tipo de blog donde cada entrada suele ser un audio en formato MP3 o similar.    Autor    Es  un  rol  de  usuario  reconocido  en  el  blog  con  permisos  para  crear  y  publicar  sus  propios  artículos  pero,  a  diferencia  del  administrador,  no  puede  editar  los  artículos  de  los  demás  ni  configurar los parámetros del blog.    B   BackEnd    Es el área de acceso restringido del blog. En este espacio entra el autor/autores del blog para  gestionar su contenido.    Barra lateral    Es  la  parte  del  blog  que  muestra  los  gadgets  o  módulos  que  incorporan  prestaciones  adicionales al blog.    Bitácora    Término en castellano que originalmente se ha aplicado al blog para enfatizar su uso primitivo  como  diario  de  a  bordo.  Es  una  palabra  que  ha  sido  sustituida  por  el  término  anglosajón:  "blog".    Blog    Sistema  para  publicar  fácilmente  contenidos  en  Internet  a  título  individual  o  colectivo.  Su  información se organiza en artículos ordenados cronológicamente.    Blogger    Servicio  que  proporciona  al  usuario  con  credenciales  de  Google  la  oportunidad  de  crear  y  mantener uno o varios blogs.     
  • 616. Glosario de términos ::: Módulo 1 : Blogs 616 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Blogosfera    Red de blogs en internet.    Blogroll    Colección de enlaces favoritos que se ofrece en la barra lateral de un blog    Blogspot    Todos los blogs creados en Blogger tienen una URL similar: http://<usuario>.blogspot.com    Borrador    Es la entrada o artículo de un blog que no se visualiza en el frontend porque todavía no se ha  publicado.    C   Cabecera    Parte  de  un  blog  donde  se  muestra  el  título  del  mismo  y  en  algunos  casos  una  imagen  o  banner representativos de fondo.    Canal de suscripción  Sistema  que  permite  a  los  lectores  de  un  blog  o  sitio  web  recibir  notificación  de  las  nuevas  entradas  publicadas  sin  necesidad  de  navegar  hasta  él.  Para  ello  se  puede  utilizar  un  navegador web o bien un lector específico de noticias.    CMS    Content  System  Management  =  Sistema  de  Gestión  de  Contenidos.  Es  una  aplicación  que  suele  estar  diseñada  para  funcionar  en  un  servidor  web.  El  administrador  puede  publicar  contenidos  en  su  sitio  utilizando  las  prestaciones  de  esta  aplicación  a  través  de  su  interfaz  web.     Comentario    Son  aportaciones  enviadas  por  los  lectores  de  un  artículo  de  un  blog.  Se  visualizan  si  el  administrador los aprueba.    Creative Commons    Organización  que  ofrece  a  cualquier  usuario  la  posibilidad  de  elegir  las  condiciones  en  que  desea compartir un trabajo publicado en Internet.     D   Del.icio.us    Servicio Web 2.0 que permite la gestión individual y colaborativa de los marcadores a páginas  web favoritas.    E   Entrada    Cada artículo o post de un blog.     
  • 617. Glosario de términos ::: Módulo 1 : Blogs 617 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Etiquetas    En inglés "tags". Se utilizan para asignarlas a los artículos y facilitar su clasificación temática.    F   Feed  Es el canal de suscripción que ofrece un blog o sitio web.    Firefox    Navegador  web  alternativo  a  Internet  Explorer  con  interesantes  prestaciones:  multiplataforma, extensiones, diccionarios, plugins, etc.    Folksonomía    Sistema de clasificación de los contenidos (artículos, enlaces, etc) basado en la libre asignación  de etiquetas por parte del usuario    Fotolog    Tipo de blog donde la foto es el elemento principal de publicación.    FrontEnd    Es  el  área  pública  del  blog  que  muestra  los  artículos  publicados  que  pueden  ser  leídos  por  cualquier usuario que accede al mismo.    G   Gadget    Pequeño  recuadro  que  se  integra  en  una  página  web  a  modo  de  mosaico  y  que  se  ejecuta  como  una  mini‐aplicación  independiente.  Está  diseñado  para  enriquecer  la  información  o  servicios  de  esa  página.  En  un  blog  se  suele  mostrar  en  la  barra  lateral.  También  recibe  el  nombre de widget.    GMail  Servicio de correo electrónico de Google de excelentes prestaciones y en creciente capacidad  de almacenamiento.    Google Apps  Servicio  Web  2.0  ofrecido  por  Google  a  los  usuarios  con  cuenta  de  Gmail  y  que  permite  la  edición colaborativa de documentos utilizando herramientas ofimáticas en línea: documentos  de texto, presentación, hojas de cálculo, etc.    Google Calendar  Servicio de agenda‐calendario individual y colectivo de Google.    Google Docs  Servicio para crear y compartir documentos.    Google Maps    Servicio de Google que facilita la localización geográfica de imágenes, textos y documentos.    Google Sites    Servicio de Google que permite crear un sitio web. 
  • 618. Glosario de términos ::: Módulo 1 : Blogs 618 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado   L   Lector    Es el usuario que accede al frontend del blog para leer los artículos del mismo. Si el blog está  configurado adecuadamente podrá enviar sus comentarios.    LMS    Learning  Management  System  =  Sistema  de  Gestión  del  Aprendizaje  y  se  utiliza  para  crear  entornos de elearning. El LMS más utilizado en la actualidad es Moodle.    M   Marcadores    Accesos directos a las direcciones de sitios web favoritos.    Marcadores dinámicos  Tipo  de  marcadores  o  favoritos  que  utiliza  Firefox  para  afiliarse  a  un  canal  de  suscripción.  Muestra cada cierto tiempo un enlace a cada uno de los últimos artículos de ese blog o página  web.    Marcadores sociales  Enlaces a sitios web favoritos que se guardan para facilitar su posterior localización y acceso.  Cuando los compartimos con otros usuarios reciben la denominación de "sociales".    Microblog    Tipo de blog donde los artículos están limitados en su extensión de caracteres.    Moblog    Tipo de blog orientado a su visualización en un teléfono móvil.    Moderación    Acción que realiza el administrador de un blog sobre los comentarios enviados por los lectores  a sus artículos. Puede aprobarlos o eliminarlos.    N   Nube de etiquetas  Conjunto de etiquetas que se suelen mostrar en la barra lateral de un blog donde el tamaño de  fuente con que se muestra cada etiqueta dependerá de su frecuencia de uso. En ocasiones la  pulsar sobre una etiqueta se muestra  el listado de  entradas a las que se les ha asignado esa  etiqueta.    O   Openblog    Tipo  de  blog  que  proporciona  a  sus  visitantes  la  posibilidad  de  publicar  de  forma  abierta  o  libre.     
  • 619. Glosario de términos ::: Módulo 1 : Blogs 619 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado P   PDF    Formato  de  documento  muy  extendido  en  internet.  Destinado  a  la  consulta  de  documentos  paginados  de  cierta  extensión.  Se  pueden  leer  con  distintos  programas  gratuitos,  desde  distintos  sistemas,  con  un  tamaño  reducido,  con  posibilidad  de  búsquedas,  presentación  idéntica en cualquier impresora y protección anticopia frente a terceros.    PDF Creator    Aplicación  gratuita  para  generar  archivos  PDF.  Este  programa  instala  una  impresora  virtual  que  permite  crear  un  archivo  PDF  a  partir  de  cualquier  programa  desde  el  que  se  pueda  imprimir.    Plantilla    Conjunto de archivos HTML y CSS que determinan el estilo gráfico de un blog.     Podcast    Sistema para la difusión de audios en formato MP3.    Post    Cada artículo o entrada de un blog.    R   Rol    En Blogger se reconocen 3 tipos de roles de usuarios: administrador, autor y lector.     RSS  Formato de difusión de noticias de un blog o sitio web para suscripción.      S   Slideshare    Servicio Web 2.0 para el almacenamiento y difusión de presentaciones de diapositivas.    Sumatra PDF    Programa gratuito y portable para leer archivos PDF.    Suscripción    Permite  disponer  de  las  últimas  novedades  publicadas  en  el  navegador  web  o  lector  de  noticias sin necesidad de acceder directamente a este sitio web.      T   Trackback    También llamados enlaces de retroceso. Permiten realizar un seguimiento de otros blogs que  han enlazado a un artículo de nuestro blog.   
  • 620. Glosario de términos ::: Módulo 1 : Blogs 620 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Tumbleblog    Tipo de blog poco estructurado que no se ajusta a una temática concreta.    Twitter    Formato  de  nanoblogging  o  microblogging  donde  el  usuario  publica  entradas  que  contiene  texto y enlaces de una longitud no superior a 140 caracteres    V   Videoblog    Tipo de blog donde las entradas son clips de vídeo ordenados cronológicamente.    W   Web 2.0    Término  acuñado  por  el  americano  Dale  Dougherty  que  engloba  sitios  web  basados  en  la  partición colaborativa de los usuarios frente a los sitios de la Web 1.0 menos interactivos.    Wiki    Sistema para crear documentación de un proyecto de forma colaborativa. La información se  organiza en páginas y capítulos.    Wordpress    Servicio alternativo a Blogger que permite crear y mantener un blog.    Y   Youtube    Es  el  gran  líder  en  repositorios  de  vídeo  en  Internet.  Permiten  el  alojamiento  y  difusión  de  vídeos.  Proporcionan  sporte  de  almacenamiento  y  también  de  difusción  en  streaming  facilitando su correcta visualización a través de internet. 
  • 621. Glosario de términos Módulo 2. Imagen
  • 622. Glosario de términos ::: Módulo 2 : Imagen 622 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado B   BMP    (BitMap = Mapa de bits). Formato de archivo de imagen digital de calidad.    C   Código Embed    Código HTML que permite insertar un objeto flash o similar dentro de una página web.    F   Flickr    Servicio Web 2.0 que permite administrar y compartir tus fotos en línea.    G   GIF    (Graphics  Interchange  Format  =  Formato  de  Intercambio  Grafíco).  Formato  de  archivo  de  imagen digital con una paleta de colores máxima de 256 colores. Especialmente diseñado para  comprimir imágenes de colores sólidos.    GIMP    GIMP es el acrónimo de “GNU Image Manipulation Program” y significa programa libre para la  manipulación  de  imágenes.  Es  una  aplicación  adecuada  para  la  edición  y  composición  de  imágenes así como para el retoque fotográfico.    Google Maps    Servicio  que  proporciona  herramientas  para  la  consulta  e  integración  web  de  mapas  geográficos y para la situación de recursos en esos mapas.    I   Iframe    Marco interno definido en una página HTML que muestra el contenido de otra página HTML.      J   JPG‐JPEG    (Joint  Photographic  Experts  Group  =  Grupo  de  Expertos  Fotográficos  Unidos).  Formato  de  archivo  de  imagen  digital  con  una  paleta  de  colores  máxima  de  16  millones  de  colores.  Especialmente diseñado para comprimir imágenes fotográficas.             
  • 623. Glosario de términos ::: Módulo 2 : Imagen 623 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado M   Modo de color    Sistema  de  coordenadas  que  permiten  describir  el  color  de  cada  píxel  utilizando  los  valores  numéricos. Ejemplo: Modo RGB donde cada color resulta de la combinación de tres canales:  Rojo‐Verde‐Azul con un valor de intensidad entre 0 y 255.    P   Picasa    Programa  que  se  instala  en  el  ordenador  para  el  tratamiento  y  gestión  de  las  imágenes  almacenadas en él.    Picasa Web    Servicio Web 2.0 asociado a las credenciales de  usuario Google donde puedes administrar y  compartir tus fotos en línea.    Píxel    Es la unidad mínima de visualización de una imagen digital. Ésta se compone de una parrilla de  puntos o píxeles cuando se visualiza en una pantalla o se imprime.    PNG    (Portable  Network  Graphic  =  Gráfico  portable  para  la  red).  Formato  de  archivo  de  imagen  digital con una paleta de colores máxima de 16 millones de colores.     Profundidad de color    Número de bits necesarios para codificar y guardar la información de color de cada pixel en  una imagen. Por ejemplo: una profundidad de color de 8 bits permite "2 elevado a 8" colores,  es decir, 256 colores.    R   Resolución    Grado de detalle o calidad de una imagen digital. Se mide en pixeles por pulgada (ppp) o en  inglés dpi (dots per inch).     S   Slide.com    Servicio  Web  2.0  que  nos  permite  subir  una  colección  de  imágenes  y  luego  obtener  una  atractiva presentación en línea que las muestra de forma secuencial y con efectos especiales.    Slideshare    Servicio de alojamiento y publicación en línea de presentaciones realizadas con Powerpoint u  OpenOffice. Se utiliza para subir presentaciones y compartirlas con los demás.           
  • 624. Glosario de términos ::: Módulo 2 : Imagen 624 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado T   TIF‐TIFF    (Tagged Image File Format = Formato de Archivo de Imagen Etiquetada). Formato de archivo  de imagen digital de calidad.    X   XCF    Formato de imagen específico de GIMP.   
  • 625. Glosario de términos Módulo 3. Audio
  • 626. Glosario de términos ::: Módulo 3: Audio 626 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado A   Audacity  Software libre y de código abierto para grabar y editar audios.    C   CDex  Programa gratuito para extraer las pistas de un CD de audio a archivos MP3.    Códec  Acrónimo de "codificación/descodificación". Es un algoritmo especial que reduce el número de  bytes  que  ocupa  un  archivo  de  audio.  Los  archivos  codificados  con  un  códec  específico  requieren  el  mismo  códec  para  ser  decodificados  y  reproducidos.  El  códec  más  utilizado  en  audio es el MP3.    D   Decibelio  Unidad de medida del volumen o intensidad de un sonido. El silencio se cuantifica como 0 dB y  el umbral del dolor para el oído humano se sitúa en torno a los  130‐140 dB.    E   Estéreo  Audio que se reproduce por los dos canales: derecho (R) e izquierdo (L).       F   Frecuencia  Número de vibraciones por segundo que da origen al sonido analógico. Se mide en hertzios.       G   Goear  Servicio Web 2.0 que permite subir y guardar archivos de audio en su servidor.      L   LAME  Códec que se propone utilizar con Audacity para la exportación de audios a formato MP3.    Listas de audio  Listados  de  archivos  de  audio  que  permiten  la  reproducción  continuada  y  secuencial  de  los  mismos.   
  • 627. Glosario de términos ::: Módulo 3: Audio 627 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Loop  Fragmento musical de corta duración que reproducido en bucle transmite la sensación de un  acompañamiento musical más largo.     M   MediaInfo  Programa  gratuito  que  permite  conocer  las  propiedades  o  características  técnicas  de  un  archivo de audio o video digitales.    Metadatos  Información  adicional  de  un  archivo  de  audio  MP3  que  se  muestra  en  el  reproductor  y  que  proporciona datos del título, artista, año, género, título del album, etc.    MIDI  (Musical  Instrument  Digital  Interface  =  Interface  Digital  para  Instrumentos  Digitales).  Formato  de  audio  que  no  resulta  de  la  digitalización  de  un  audio  analógico.  Contiene secuencias de intervención de los dispositivos MIDI (sintetizadores) donde  se recoge qué instrumento suena, en qué forma lo hace y cuándo.    Mono  El sonido mono sólo está definido por un canal y al reproducirse origina un sonido semejante  al  escuchado  con  un  solo  oído.  Carece  de  la  sensación  espacial  que  proporciona  la  audición  estereofónica.    MP3  Formato  MPEG  1  Layer  3  de  archivo  para  audio  creado  por  el  Instituto  Fraunhofer.  Por  su  extraordinario grado de compresión y alta calidad está liderando el mundo del audio digital.      O   OGG  Formato  de  audio  reciente  que  surge  como  alternativa  libre  y  de  código  abierto  al  formato  MP3.       P   PCM/ADPCM  Códec de compresión de audio en formato WAV.    PixelOut  Reproductor  de audio  elaborado en tecnología Flash y que permite integrarlo en una página  web para mostrar la reproducción de un archivo de sonido.           
  • 628. Glosario de términos ::: Módulo 3: Audio 628 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado R   Resolución  El número de bits utilizados para guardar cada muestra digital de la señal analógica de audio.  Ejemplo: 16 bits significa una calidad de "2 elevada a 16", es decir, 65536 niveles de amplitud.    S   SoundCloud  Espacio Web 2.0 gratuito destinado a la publicación de archivos de audio.      T   Tasa de muestreo  Define  el  intervalo  de  tiempo  tras  el  cual  se  toma  una  muestra  de  señal  análogica  de  audio  para generar el audio digital. Así por ejemplo una tasa de muestreo de 44100 Hz significa que  se tomaron esa cantidad de muestras en un segundo.    V   Velocidad de transmisión  También llamado bitrate se refiere a la cantidad de espacio físico medido en bits que ocupa un  segundo de duración de ese audio. El bitrate puede ser constante o variable.    W   WAV  (WaveForm  Audio  File  =  Archivo  de  Audio  de  Formato  Onda).  Es  un  formato  de  archivo  de  audio con excelente calidad pero con un peso considerable.   
  • 629. Glosario de términos Módulo 4. Video
  • 630. Glosario de términos ::: Módulo 4: Video 630 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado A   Auto Gordian Knot  Software para la conversión de archivos de vídeo VOB en archivos de vídeo AVI codificados con  DivX o XviD.    AVI  (Audio Video Interleaved  = Audio y Video Intercalado). Formato de archivo de vídeo de gran  calidad y peso.       C   Códec  Acrónimo de "codificación/descodificación". Es un sistema que permite reducir el número de  bytes  que  ocupa  un  archivo  de  vídeo.  Los  archivos  codificados  con  un  códec  específico  requieren el mismo códec para ser decodificados y reproducidos. Ejemplos de códecs de vídeo:  DivX, XviD, etc.    Código Embed  Código HTML que permite insertar el visor y el vídeo elegido en un repositorio de vídeos.      D   DV  Digital  Video.  Es  la  tecnología  que  utilizan  las  cámaras  de  vídeo  al  guardar  la  grabación  en  formato digital.    DVD Decrypter  Programa  que  extrae  los  archivos  VOB  de  un  disco  DVD  a  una  carpeta  del  disco  duro  del  ordenador.    DVD Video  Soporte de reproducción de vídeo. Muestra una estructura especial de carpetas y ficheros (en  algunos  casos  encriptados)  que  al  ser  reproducidos  por  programas  específicos  (VLC  Media  Player, por ejemplo) mostrará una película organizada en capítulos.      F   FLV  Formato de archivo de vídeo de Adobe Flash para visualizar vídeos en Internet. Es el formato  que utiliza Youtube por defecto.    Fotograma Clave  Fotogramas  del  vídeo  que  se  guardan  integramente  durante  el  proceso  de  compresión/codificación de un archivo de vídeo.     
  • 631. Glosario de términos ::: Módulo 4: Video 631 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Fotogramas por segundo.  Es  el  número  de  fotogramas  por  segundo  que  contiene  un  vídeo  durante  su  reproducción.  Oscila entre 15 y 30 fps.    Fotos Narradas  Aplicación gratuita que se instala en Windows XP que permite crear un vídeo WMV a partir de  una secuencia de imágenes y audios.    M   MediaInfo  Programa  gratuito  que  permite  conocer  las  propiedades  o  características  técnicas  de  un  archivo de audio o video digitales.    Metacafe  Servicio Web 2.0 para la publicación y difusión de vídeos    MOV  Formato de archivo de vídeo desarrollado por Apple para reproducir con QuickTime Player.    MP4  Formato  de  archivo  de  vídeo  desarrollado  por  Apple  para  reproducir  vídeo  de  calidad  en  streaming. Es el formato que utiliza el dispositivo iPod para reproducir vídeos.    MPEG  (Moving Pictures Expert Group = Grupo de Expertos de Películas). Formato de archivo de vídeo  estándar para la compresión de vídeo digital.      O   OverStream  Servicio  Web  2.0  que  permite  personalizar  un  vídeo  en  línea  alojado  en  Youtube,  Google  Vídeo, etc incorporándole comentarios y subtítulos.      R   Ratio  Proporción  entre  la  anchura  y  la  altura  de  la  ventana  de  reproducción  de  un  video.  Habitualmente 4:3 o bien 16:9 para los DVD.    Revver  Servicio Web 2.0 para la publicación y difusión de vídeos      RM  Formato de archivo de vídeo de Real Networks.      
  • 632. Glosario de términos ::: Módulo 4: Video 632 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado S   Sintonizadora TV  Tarjeta que se instala en el ordenador y que se conecta a la señal de antena o a un dispositivo  de  vídeo  externo.  Se  utiliza  como  entrada  de  vídeo  al  ordenador  para  la  obtención  de  contenidos.    Sistema de televisión  Sistema  de  reproducción  por  televisión  característico  de  cada  país  o  zona  geográfica:  NTSC  (USA, CentroAmérica, Japón), PAL (Europa), SECAM (Francia), etc.    Streaming  Tecnología servidor‐cliente que permite a los visitantes visualizar un vídeo de cierta duración y  calidad.  Tras  completarse  el  buffer  inicial  la  reproducción  se  inicia  y  se  completa  de  forma  contínua mientras que la descarga del resto se completa en segundo plano.    SuperC  Software  gratuito  que  se  utiliza  para  convertir  un  archivo  de  vídeo  de  un  formato  en  otro.  Admite la lectura y conversión de un amplio catálogo de formatos de vídeo.    SWF  Extensión de archivo que suele contener una animación o utilidad diseñada con el programa  Adobe  Flash.  Este  archivo  se  suele  embeber  dentro  de  una  página  HTML  para  mostrarse  a  través  del  navegador.  Para  su  correcta  visualización  es  necesario  que  el  navegador  web  del  cliente disponga del plugin de Adobe Flash instalado y actualizado.      V   Velocidad de transmisión  Es la cantidad de espacio físico (en bits) que ocupa un segundo de duración de ese vídeo.    Video Download Helper  Extensión del navegador  Firegox que permite descargar y guardar en local  un vídeo, audio o  imagen  que  se  muestra  dentro  de  una  página  web.  En  este  curso  se  propone  como  herramienta para la descarga en local de archivos de vídeo FLV de Youtube.    VideoCD  Formato  de  CD  que  al  insertarlo  en  una  unidad  arranca  por  defecto  el  reproductor  de  vídeo  para mostrar su contenido.    Vimeo  Servicio Web 2.0 para la publicación y difusión de vídeos.    VLC Media Player  Software  gratuito  y  universal  capaz  de  reproducir  cualquier  formato  de  archivo  de  vídeo.  Se  dispone de versión instalable y también portable para memoria USB.       
  • 633. Glosario de términos ::: Módulo 4: Video 633 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado W   Windows Movie Maker  Aplicación integrada en Windows que permite capturar el vídeo de una cámara digital de vídeo  DV.    WMV  (Windows  Media  Video).  Formato  de  archivo  de  vídeo  desarrollado  por  Microsoft  para  la  difusión de vídeo por Internet.    Y   Youtube  Servicio Web 2.0 de búsqueda y alojamiento de vídeos.    
  • 635. Bibliografía sobre Web 2.0 635 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Bibliografía sobre Web 2.0 Título: La Blogosfera Hispana. Pioneros de la cultura digital. Autor: Jose Manuel Cerezo y otros. Licencia: E-book bajo licencia Creative Commons “Reconocimiento- NoComercial SinObraDerivada” Editado por: Fundación France Telecom España Fecha de publicación: 2006 Reseña Bibliográfica: Recopilación de artículos sobre distintos aspectos de la blogoesfera hispana escritos por algunos de los expertos más conocidos. Se abarcan temas como la teoría de los blogs, impacto de los blogs en internet, visibilidad, relaciones con las instituciones, negocios, etc. URL de descarga: http://www.fundacionorange.es/areas/25_publicaciones/la_blogosfera_hispana.pdf Título: Planeta 2.0. Inteligencia colectiva o medios fast food. Autor: Cristóbal Cobo y Hugo Pardo. Licencia: E-book bajo licencia Creative Commons “Reconocimiento-NoComercial SinObraDerivada”. ISBN: 978-84-934995-8-7 Fecha de publicación: 2007 Reseña Bibliográfica: Este libro pretende desde su primer capítulo ser un aglutinador de ideas, al diseñar un breve marco teórico para el darwinismo digital de la World Wide Web y recopilar un vasto mapa de lecturas para aquellos interesados en comprender y profundizar en este momento evolutivo de Internet. Este trabajo refuerza algunas ideas que pretenden proteger al lector del alineamiento ciego con los discursos grandilocuentes y con la dicotomía wired / tired / expired. Sin vocación de predecir el futuro, se reflexiona si se vive una fase determinante y creativa de la inteligencia colectiva o si simplemente se trata de un escenario de medios fast food, de consumo rápido y de carácter amateur en rápida transición hacia una nueva etapa evolutiva. URL de descarga: http://www.planetaweb2.net/
  • 636. Bibliografía sobre Web 2.0 636 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Título: Web 2.0 Autor: Antonio Fumero y Genís Roca. Editado por: Fundación Orange. Licencia: E-book bajo licencia Creative Commons “Reconocimiento- NoComercial SinObraDerivada”. Depósito Legal: M-15478-2007 Fecha de publicación: 2007 Reseña Bibliográfica: Este libro pretende abarcar un subconjunto de Internet (la web 2.0) que, a su vez, aglutina al de los blogs. Y es que, más allá de etiquetas, la forma de concebir la Red se ha visto profundamente alterada con la aparición de nuevas tecnologías que han propiciado un cambio radical en las rutinas con las que nos equipábamos a la hora de navegar. Tanto el “yo” como las Redes Sociales han explosionado de manera paralela, figura geométrica que, por azares del capricho digital, sufre modificaciones de singular importancia al ver sometidas sus infinitas líneas a profundas intersecciones dando lugar a caprichosos segmentos. Fragmentos que constituyen reflejos de distintas realidades, tantas como individuos, tantas como retazos de vida surgen de la fusión, de la ósmosis, incluso de la emulsión de sensibilidades de distintas densidades. URL de descarga: http://www.fundacionorange.es/areas/25_publicaciones/WEB_DEF_COMPLETO.pdf Título: El poder de las redes Autor: David de Ugarte. Licencia: Dominio público. ISBN: 978-84-611-8873-4 Fecha de publicación: 2007 Reseña Bibliográfica: Que estamos en un tiempo de cambios y que esos cambios tienen que ver de alguna manera con las “redes sociales” es ya una idea común, extendida y repetida hasta el cansancio. Sin embargo nadie parece tener muy claro qué son esas famosas redes y sobre todo qué tienen de nuevo. A fin de cuentas, si de las redes que hablamos son las que forman las personas al relacionarse unas con otras, la sociedad siempre fue una red. Y si hablamos de movimientos de activistas también estuvieron siempre ahí, relacionándose unos con otros en una especie de universo hiperactivo y paralelo. Hay sin embargo dos elementos nuevos que todo el mundo entiende intuitivamente relacionados con esta cuestión. Por un lado Internet y su consecuencia más directa: la eclosión de una nueva esfera de relación social que pone en contacto a millones de personas cada día. Por otro la aparición en los últimos años de una amplia literatura sobre redes aplicada a todos los campos, desde la Física o la Biología hasta la Economía, con toda su inevitable secuela de libros de divulgación, aplicaciones al marketing y juegos publicitarios.Y luego está toda una serie de movimientos que van desde la revolución hasta la protesta cívica, pasando por una nueva suerte de sofisticadas algaradas que nadie sabe clasificar muy bien y que llenan páginas en los periódicos. URL de descarga: http://www.deugarte.com/manual-ilustrado-para-ciberactivistas
  • 637. Bibliografía sobre Web 2.0 637 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Título: La revolución de los blogs Autor: Jose Luis Orihuela. Editado por: La Esfera de los Libros, Madrid. ISBN: 84-9734-498-7 EAN: 9788497344982 Fecha de publicación: 2006 Reseña Bibliográfica: Los weblogs, blogs, cuadernos de bitácora o simplemente bitácoras son los sitios web personales que están poniendo la Red al alcance de todo el mundo. Éste es un libro para todos aquellos que alguna vez se han preguntado:¿Qué son los weblogs?, ¿Quiénes son y por qué escriben los bloguers?, ¿Cómo comenzar un weblog?, ¿Cómo escribir buenos comentarios?, ¿Dónde puedo tener un weblog gratis?, ¿Cómo puedo encontrar otros bloguers en mi país?, ¿Cuáles son los mejores weblogs en español?, etc. Este libro está escrito de forma didáctica por un reconocido bloguer. Es la primera obra orientada al gran público que examina los principales ámbitos de impacto de los weblogs -sobre el periodismo, la empresa, la educación o la política- con ejemplos y referencias para comprender cómo y por qué este nuevo medio está cambiando nuestra cultura y generando otra nueva: la blogosfera. URL con más información: http://www.esferalibros.com/libros/librodetalle.html?libroISBN=8497344987
  • 639. Direcciones Web ::: Módulo 1. Blogs 639 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Módulo 1. Blogs Web 2.0 Web 2.0 en Wikipedia http://es.wikipedia.org/wiki/Web_2.0 ¿Qué es la Web 2.0? de MaestrosdelWeb http://www.maestrosdelweb.com/editorial/web2/ Mapa visual de la Web 2.0 http://internality.com/web20/ Libro "Web 2.0" de la Fundación Orange http://www.fundacionorange.es/areas/25_publicaciones/publi_253_11.asp Web 2.0 y Educación http://blog.educastur.es/blog/2007/06/18/web-20-y-educacion/ Planeta Web 2.0 http://www.planetaweb2.net/ Recopilación de servicios Web 2.0 http://wwwhatsnew.com/recopilacion/ Fuente Web en Wikipedia http://es.wikipedia.org/wiki/Fuente_web Del.icio.us http://delicious.com/ Google Apps http://www.google.com/apps/ Ayuda de Google Docs http://docs.google.com/support/?hl=es Curso de Google Docs de Aulaclic http://www.aulaclic.es/googledocs/ Algunos blogs populares Microsiervos http://www.microsiervos.com/ Genbeta http://www.genbeta.com/ Xataka http://www.xataka.com/ Alt1040 http://alt1040.com/
  • 640. Direcciones Web ::: Módulo 1. Blogs 640 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado EduBlogs Educastur Blog http://blog.educastur.es/ Arablogs http://www.catedu.es/arablogs/ Planeta Educativo http://www.catedu.es/arablogs/ Aula Blog http://www.aulablog.com/ Servicios de Blogs Blogger http://www.blogger.com Wordpress http://www.wordpress.com Live Journal http://www.livejournal.com/ Blogger Página oficial de Ayuda de Blogger: http://www.google.com/support/blogger/?hl=es Manual de Blogger del Observatorio Tecnológico del ITE-MEC http://observatorio.cnice.mec.es/modules.php?op=modload&name=News&file=article&sid=383 Ayuda Blogger http://www.ayudablogger.org/ Ayuda Blogger 2.0 http://www.ayudablogger.com/ Wordpress.com Página oficial de Ayuda de Wordpress: http://en.support.wordpress.com/ Foros de Ayuda de Wordpress http://es.forums.wordpress.com/ Derechos de autor Creative Commons http://es.creativecommons.org/ Derechos de autor en Wikipedia http://es.wikipedia.org/wiki/Copyright
  • 641. Direcciones Web ::: Módulo 1. Blogs 641 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado CEDRO http://www.cedro.org/conceptos_basicos.asp Software Adobe Reader http://www.adobe.com/es/products/reader/ Sumatra PDF Portable http://portableapps.com/apps/office/sumatra_pdf_portable PDF Creator http://www.pdfforge.org/products/pdfcreator
  • 643. Direcciones Web ::: Módulo 2. Imagen 643 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Módulo 2. Imagen GIMP GIMP. Curso del ITE http://www.isftic.mepsyd.es/formacion/materiales/86/cd/index.htm Manual de GIMP del Observatorio Tecnológico del ITE http://observatorio.cnice.mec.es/modules.php?op=modload&name=News&file=article&sid=152 Manual de GIMP en Mosaic UOC (PDF) http://mosaic.uoc.edu/pdf/manual_introduccion_gimp.pdf Manual oficial de GIMP en español http://docs.gimp.org/es/ GIMP http://www.gimp.org/ GIMP en español http://www.gimp.org.es/ GIMP portable http://portableapps.com/apps/graphics_pictures/gimp_portable Repositorio de imágenes gratuitas Banco imágenes ITE http://bancoimagenes.isftic.mepsyd.es/ Bigfoto http://www.bigfoto.com/ DesignPacks http://www.designpacks.com/ Flickr CC http://www.flickr.com/creativecommons/ Free Images Co UK http://www.freeimages.co.uk/ FreeFoto http://www.freefoto.com/ Image After http://imageafter.com/ MorgueFILE http://morguefile.com/ NASA Images http://www.nasa.gov/multimedia/imagegallery/index.html Open Clip Art Library http://www.openclipart.org
  • 644. Direcciones Web ::: Módulo 2. Imagen 644 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Openphoto http://www.openphoto.net/ Pixel Perfect Digital http://www.pixelperfectdigital.com/free_stock_photos/ Stock.XCHNG http://www.sxc.hu/ Wikimedia Commons http://commons.wikimedia.org/wiki/Category:Images/ YotoPhoto http://www.genbeta.com/web/busca-fotografias-libres-en-yotophoto Servicios Web 2.0 Flickr http://www.flickr.com/ Slide.com http://www.slide.com/ Slideshare http://www.slideshare.net/ Picasa http://picasa.google.com/intl/es/ Google Maps http://maps.google.es/
  • 646. Direcciones Web ::: Módulo 3. Audio 646 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Módulo 3. Audio Audacity Multimedia. Introducción. Curso del ITE http://www.isftic.mepsyd.es/formacion/materiales/84/cd/index.html Sonido y música con el ordenador. Curso del ITE http://www.isftic.mepsyd.es/formacion/materiales/60/cd/index.htm Captura y edición de audio con software libre de Mosaic UOC (PDF) http://mosaic.uoc.edu/pdf/Captura_y_Edicion_de_Audio_con_Herramientas_Libres_II.pdf Manual de Audacity de GleduWiki http://perso.gratisweb.com/jbarraga/audacity1.html Manual de Audacity de J.Antonio Barragán http://perso.gratisweb.com/jbarraga/audacity1.html Audacity http://audacity.sourceforge.net/ Audacity Portable http://portableapps.com/apps/music_video/audacity_portable Reproductores flash de audio PixelOut http://www.1pixelout.net/code/audio-player-wordpress-plugin/ CDex CDex http://cdexos.sourceforge.net/ Manual de CDex de Angel García http://es.geocities.com/angelgar25/manual-cdex.htm Sonido y música con el ordenador. Curso del ITE http://www.isftic.mepsyd.es/formacion/materiales/60/cd/index.htm Captura y edición de audio con software libre de Mosaic UOC (PDF) http://mosaic.uoc.edu/pdf/Captura_y_Edicion_de_Audio_con_Herramientas_Libres_II.pdf Repositorios de audios gratuitos Banco audios: ITE http://bancoimagenes.isftic.mepsyd.es/ Flash Kit http://www.flashkit.com/
  • 647. Direcciones Web ::: Módulo 3. Audio 647 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Free Loops http://www.freeloops.com/ PacDV http://www.pacdv.com/sounds/index.html Pockect Fuel http://www.pocketfuel.com/gallery.php Servicios Web 2.0 de audio GoEar http://www.goear.com/ SoundCloud http://soundcloud.com/
  • 649. Direcciones Web ::: Módulo 4. Video 649 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Módulo 4. Video VLC Media Player VLC Media Player http://www.videolan.org/ VLC Media Player Portable http://portableapps.com/apps/music_video/vlc_portable VideoLan Wiki http://wiki.videolan.org/Main_Page Servicios Web 2.0 de vídeo YouTube http://www.youtube.com/ Mediateca de EducaMadrid http://mediateca.educa.madrid.org/ TeacherTube http://www.teachertube.com/ Google Vídeo http://video.google.es/ Revver http://revver.com/ Metacafe http://www.metacafe.com/ MySpace http://myspace.com/ Dailymotion http://www.dailymotion.com/ Guba http://www.guba.com/ Sharkle.com http://www.markosweb.com/www/sharkle.com/ Lulu TV http://www.lulu.tv/ Vsocial http://vsocial.com/ Current TV http://www.current.tv/ Colombia aprende http://www.colombiaaprende.edu.co/html/mediateca Universidad de Sevilla
  • 650. Direcciones Web ::: Módulo 4. Video 650 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado http://www.sav.us.es/producciondevideo/videoenred.asp TV educativa del ITE http://tv_mav.cnice.mec.es/ TV educativa de la UNED http://www.uned.es/cemav/tv.htm Biblioteca Virtual Cervantes http://www.cervantesvirtual.com/videoteca/ Mediateca de Educared http://campusuniv.campusred.net/vod-publico2/ Mediateca Universidad de Oviedo http://mediateca.uniovi.es/ Videoteca CUDI de Méjico http://www.udlap.mx/internet2/video/ Vive, TV educativa de Venezuela http://www.vive.gob.ve/ Windows Movie Maker Manual de Windows Movie Maker de TrucosWindows.net http://www.trucoswindows.net/conteni8id-60-manual-Windows-Movie-Maker.htm Manual Básico de Windows Movie Maker de Mosaic UOC (PDF) http://mosaic.uoc.edu/pdf/Manual_Basico_de_Windows_Movie_Maker.pdf Crear películas caseras con Windows Movie Maker http://www.microsoft.com/spain/windowsxp/using/moviemaker/videos/create.mspx Manual de captura y edición de Vídeo con WMM de AyudaDigital.com http://www.ayudadigital.com/video/como_capturar_editar_moviemaker.htm Fotos Narradas (PhotoStory 3) Sitio Oficial de PhotoStory 3 http://www.microsoft.com/latam/windowsxp/fotografiadigital/photostory/default.mspx DVD Decrypter DVD Decrypter en Mr.Bass http://www.mrbass.org/dvdrip/ DVD Decrypter Portable http://appsportables.blogspot.com/2008/01/dvd-decrypter-3540-portable.html AutoGordian Autogordian GTK http://www.autogk.me.uk/
  • 651. Direcciones Web ::: Módulo 4. Video 651 Multimedia y Web 2.0 ::: Edición 2010 ::: Formación del Profesorado Manual para convertir DVD a DivX de MundoDivX http://www.mundodivx.com/dvdavi/autogk.php Media Info Media Info http://mediainfo.sourceforge.net/es Reproductor web FLV Media Player de Jeroen Wijering http://www.longtailvideo.com/players/jw-flv-player/ Wiki de JW Media Player http://developer.longtailvideo.com/trac/