Uninstallme

La Web se ideó cuadrada.

Vídeo accesible: añadiendo subtítulos a Flash vídeo con Timed Text

19 de Octubre 2008

Una de las pautas para la accesibilidad del contenido web es la de proporcionar textos equivalentes para contenidos multimedia, tanto subtítulos de diálogos como descripciones de otros hechos necesarios para comprender el contenido del vídeo (un timbre, un portazo, una entonación, etc.), además de descripciones sonoras si fuera necesario.

En este turorial nos explican cómo hacer vídeo accesible añadiendo subtítulos y descripciones sonoras. Además, el vídeo utilizado, es un buen ejemplo de descripción sonora. Este post se limita a explicar la técnica utilizada en el tutorial, aunque con una modificación en el método para añadir el vídeo.

Timed Text (TT) es un método para la adición de subtítulos sincronizados a contenidos multimedia escrito en formato XML, por lo que sólo necesitaremos un editor de texto para crear nuestro archivo con los subtítulos.

Existen varios programas que nos pueden facilitar esta tarea, sobretodo la de la sincronización. Dos de ellos gratuitos son: Subtitle Workshop y MagPie. Estos programas además, permiten crear archivos de subtítulos en otros formatos como QText para Quicktime o SAMI para Windows Media.

También necesitaremos un reproductor de vídeo flash preparado para mostrar subtítulos y descripciones sonoras. Desde la web del tutorial podemos descargar uno gratuito para usos no comerciales.

Por último sólo hay que pasar la ruta al archivo XML con los subtítulos como un parámetro flashvars.


<param name="flashvars" value="file=ruta_al_archivo.flv&captions=ruta_al_archivo.xml" />

En el ejemplo del tutorial se ha utilizado el javascript SWFObject para incluir el vídeo proporcionando un contenido alternativo (vídeo descargable en formato MP4) para los usuarios que no tengan Adobe Flash Player o tengan una versión inferior.

Yo no dispongo de la versión del vídeo en otros formatos así que, he incluido simplemente un link para descargar Adobe Flash Player dentro de la etiqueta <object> y otro para descargar el vídeo en formato MPG. Si el contenido de esta etiqueta fuera un banner, podríamos incluir dentro de ella una imagen en formato gif con el contenido alternativo para los usuarios que no tuvieran el reproductor de Flash.

Así es como queda el archivo XML con los subtítulos, utilizado en el ejemplo de este post:


<tt xml:lang="es">
  <head>
  </head>

  <body>
    <div xml:id="captions">
        <p begin="00:00:04" end="00:00:07">Después de probar el iPod <br />con pantalla panorámica</p>
        <p begin="00:00:12" end="00:00:14">Internet de verdad <br />a velocidad 3G</p>
        <p begin="00:00:18" end="00:00:20">y mapas creados con GPS</p>
        <p begin="00:00:22" end="00:00:23">serí­a fácil que olvidaras</p>
        <p begin="00:00:23" end="00:00:26">que también, es un teléfono increible.</p>
    </div>
  </body>

</tt>

He utilizado un anuncio por su duración, y le ha tocado al iPhone y Movistar:

Fuentes y más información:

Actualización:

Minutos después de escribir este post, encuentro una entrada publicada este mismo día en Bitelia que nos presenta un servicio en línea para convertir vídeos de Youtube a otros formatos, entre ellos MPG, MOV, MP4, 3GP o WMV. Teniendo en cuenta que Flash no puede ser visualizado desde cualquier dispositivo,  proporcionar otros formatos de archivo para nuestros vídeos será una buena forma de ofrecer contenido accesible.

Archivado en Accesibilidad, How to

1 Comentario