Información multimedia

El término ‘multimedia’ hace referencia a la capacidad de presentar tipos variados de información; habitualmente se asocia con la reproducción de sonido e imágenes en movimiento, pero realmente se debe aplicar a la integración de diferentes tipos de datos en una misma presentación, que en algunos casos permite al usuario interaccionar con ellos.

El servicio de distribución de información que sirve como soporte al Web fue diseñado para crear un entorno abierto de intercambio de tipos de datos diversos, muchos de los cuales no eran conocidos en el ‘estado del arte’ de la informática en el momento de su definición. El protocolo HTTP contempla la distribución de estos diferentes tipos de datos a través del intercambio de las definiciones MIME de cada uno de ellos. Aprovechando esta identificación, un cliente Web puede conocer el tratamiento que debe aplicar a cada formato de fichero, consultando su base de datos MIME, que un usuario puede modificar y ampliar.

Cada browser tiene capacidad para tratar por su cuenta un conjunto diferente de tipos MIME: código HTML, gráficos GIF o JPEG, algunos formatos de sonido, … En función de ello, estos documentos se mostrarán dentro de la pantalla del browser o en una aplicación diferente, que el usuario deberá instalar.

Para recoger y mostrar información multimedia, existen dos posibilidades. La más sencilla pasa por transferir y mostrar cada fichero de forma independiente. El acceso a un documento multimedia se puede insertar como un enlace del documento HTML.

http://www.u.es/video/jornadas.avi

ftp://ftp.u.es/sonidos/himno.wav

http://www.u.es/vrml/pabellon.wrl

Cada uno de esos ficheros, localizado a través de HTTP o FTP, será mostrado, bien por el propio browser si este tiene soporte interno, bien por una aplicación externa, que será posible seleccionar y registrar en la base de datos MIME de cada cliente.

Sin embargo, la solución más sofisticada e interesante consiste en integrar dentro de un mismo documento información procedente de diversas fuentes. El nexo de unión de cada uno de estos ficheros será el lenguaje HTML. Sin embargo, las primeras versiones del lenguaje HTML (1 y 2), sólo incluían la posibilidad de importar imágenes; no se tuvo en cuenta la posibilidad de contener otros elementos, como sonido, vídeo, presentaciones gráficas, …

Ante esta situación, las principales compañías dedicadas al desarrollo de clientes Web, Netscape y Microsoft, optaron por definir nuevas etiquetas y atributos, dedicados a explotar las capacidades multimedia de los browsers. Las soluciones aportadas son, en ocasiones, incompatibles, tanto en el conjunto de etiquetas HTML como en los módulos dedicados a presentar la información multimedia; HTML 3.2 trata de unificar los desarrollos de ambas compañías en una única especificación, aceptada por todos, que sea capaz de adaptarse a la evolución futura del Web.

En cualquier caso, ambas plataformas permiten incorporar, de forma dinámica, módulos de programa capaces de procesar y mostrar nuevos tipos de información sobre la propia ventana del cliente Web, ampliando sus capacidades; estos módulos, que se denominan Plug-ins en Netscape Navigator o ActiveX Controls en Internet Explorer, son insertados desde una etiqueta HTML que contiene información sobre su tipo, parámetros de ejecución y formato de presentación.

Numerosas empresas desarrollan plug-ins y controles ActiveX para actuar como visores de los formados de fichero que generan sus aplicaciones, que por lo general distribuyen de forma gratuita. Los ficheros de procesadores de texto, programas de dibujo vectorial, animación o presentaciones pueden ser visualizados a través de una red de comunicaciones, sin requerir la aplicación con que se generaron. Además, algunas aplicaciones se adaptan a las características de la distribución on-line, generando ficheros compactos que se transfieren de forma rápida.

EMBED de Netscape

La etiqueta <EMBED> permite insertar un fichero de cualquier tipo dentro de una página HTML. Sus atributos son similares a los de <IMG>, ya que reserva un rectángulo de la pantalla para mostrar el contenido del documento.

Para ver el fichero insertado, será preciso disponer de una aplicación capaz de ejecutarse a través del rectángulo reservado, dentro de la propia pantalla del browser. Netscape lo soluciona con el empleo de plug-ins, módulos que se pueden instalar y cargar dinámicamente, capaces de representar sobre la ventana del browser un determinado tipo MIME para el que están registrados. Los plug-ins pueden ser incorporados a Netscape a medida que son requeridos, sin necesidad de alterar el propio programa (se comportan de forma similar a librerías dinámicas).

Si Netscape tiene ya instalado el plug-in correspondiente lo mostrará; en caso contrario, dará instrucciones para descargar a través de la red esta aplicación. La etiqueta <EMBED> puede incluir una URL que informará sobre este proceso; en caso contrario, Netscape accede de forma automática a una sección de su servicio WWW, que recopila gran cantidad de módulos proporcionados por sus fabricantes. Para ver los módulos actualmente instalados, se puede utilizar el menú Helpà About Plug-ins.
 

<EMBED> Inserta un documento dentro de la ventana del browser. 
  SRC=" " URL del objeto MIME que se desea insertar.
  HIDDEN= Indica si el objeto es visible o no. Puede tomar los valores True o False. Es útil para presentar sonidos.
  PLUGINSPACE= URL de una página que proporciona información sobre la descarga e instalación de un plug-in adecuado, en caso de que no esté disponible.
  HEIGHT=
WIDTH=
HSPACE=
VSPACE=
BORDER=
ALIGN=
Tienen el mismo significado que en la etiqueta <IMG>.
  Otros Cada plug-in puede definir otros parámetros, en forma de atributos, que serán pasados a éste en el momento de su activación. Se debe consultar la documentación de cada plug-in para conocer las opciones disponibles.

 

Para mostrar en la pantalla un documento especial, se inserta una etiqueta <EMBED> apuntando al fichero que lo contiene. Por ejemplo, el siguiente código inserta un fichero VRML:

<EMBED SRC="Netscape.wrl" BORDER=0 WIDTH=220 HEIGHT=200 ALIGN=right>A la derecha, se muestra un documento VRML, que podemos controlar y mover con el ratón.
 


 

Microsoft Internet Explorer, a partir de su versión 3, permite visualizar documentos que contengan objetos <EMBED>. Para ello, puede utilizar plug-ins de Netscape o controles ActiveX.

OBJECT de Microsoft

La inserción de elementos multimedia en los clientes Web de Microsoft se realiza a través de la nueva etiqueta <OBJECT>. Microsoft implementa el sistema de inserción y control de objetos que estandarizará HTML3.2. Para Internet Explorer, un objeto puede ser una imagen, un documento, un applet de Java, un control ActiveX, … Al igual que Netscape, la visualización de un objeto precisa disponer de una aplicación o control adecuada para su tratamiento.

Además de servir para mostrar documentos de cualquier tipo dentro de una página HTML, los objetos pueden insertar Controles ActiveX, una clase de aplicaciones especializadas en interactuar con un usuario y presentar información a través de un cliente Web. Los controles ActiveX son una evolución de OLE, adaptada a las características particulares de los entornos Web. ActiveX se explicará con más detalle en un capítulo posterior.
 

<OBJECT>… </OBJECT> Inserta un objeto dentro de un documento.
  CLASSID= Identificador único del control u objeto a insertar, de acuerdo con la especificación Component Object Model
  ID= Etiqueta que identifica de forma única este control dentro de la página. El CLASSID identifica a la clase de objeto, mientras que ID diferencia entre objetos del mismo tipo situados en un documento.
  CODEBASE=" " Contiene una URL de la cual se puede descargar automáticamente el código del control ActiveX, en caso de que no esté instalado.
  BORDER=
ALIGN=
HEIGHT=
WIDTH= 
HSPACE=
VSPACE=
Tienen el mismo significado que en la etiqueta <IMG>.

 
<PARAM> Fija una variable o propiedad de un control ActiveX. Se insertan dentro de la etiqueta <OBJECT>.
  NAME= Nombre del parámetro.
  VALUE= Valor que toma el parámetro.
  TYPE= Informa de cómo interpretar el valor. Puede ser DATA, REF, OBJECT.

 

Por ejemplo, para incluir un control Shockwave (un formato de películas muy compacto, adecuado para ser transferido por Internet):

<OBJECT ID="pelicula1"
CLASSID="CLSID:166B1BCA-3F9C-11CF-8075-444553540000"
CODEBASE="http://www.macromedia.com/…" WIDTH=250 HEIGTH=250>
<PARAM NAME="swURL" VALUE="pelicula.dcr">
</OBJECT>
Se debe tener en cuenta que la inclusión de elementos <OBJECT> hace que las páginas sólo sean compatibles con Internet Explorer. Para permitir que los usuarios de Netscape accedan a la información, se puede insertar un <EMBED> equivalente dentro del <OBJECT>, que será ignorado por el browser de Microsoft: <OBJECT ………>
<PARAM … …>
<EMDEB SRC="pelicula.dcr" WIDTH=250 HEIGTH=250>
</OBJECT>
Inclusión de sonido

El Web dispone de capacidad para incorporar diversos tipos de efectos de sonido a un documento. En función de su tipo, los sonidos se pueden clasificar en dos grupos:

  1. Los ficheros de sonido estáticos, que a través de diversos formatos empaquetan en un fichero la información de sonido; es preciso recuperar este fichero (en su totalidad) para poder interpretarlo con un visor adecuado.
  2. El sonido en tiempo real, o bajo demanda, un sistema cliente-servidor que permite reproducir la información de sonido a medida que es recogida, evitando tener que recibir y almacenar un fichero de sonido completo.
Los formatos de ficheros estáticos más conocidos son WAV (ficheros de ondas de Windows), AU o SND (ficheros de sonido de Sun Microsystems) y AIF (típicos del entorno Macintosh). Todos ellos son representaciones digitales de sonidos analógicos, que tras un proceso de digitalización y compresión son almacenados en un fichero. Otro tipo de sonido estático muy utilizado es MIDI, que almacena información para sintetizadores de sonido, a partir de la definición y uso de diversos instrumentos electrónicos (algo parecido a una partitura electrónica).

En cuanto al sonido bajo demanda, numerosos empresas han creado productos que permiten la conversión, distribución y recepción de sonido; de esta forma, es posible escuchar conciertos en directo, radio a través de Internet, etc. El sistema más conocido y utilizado es Real Audio (www.realaudio.com), pero existen otros muchos.

Para insertar efectos de sonido dentro de un documento HTML, se puede optar por tres soluciones:

  1. La más sencilla es hacer que un enlace apunte a un fichero de sonido; HTTP y MIME se encargarán del resto. Para reproducirlo, el cliente Web utilizará una aplicación independiente, un control ActiveX o un plug-in, dependiendo de lo que tenga a su disposición. Este sistema es el más indicado para insertar ficheros de sonido grandes, ya que sólo se cargarán si el usuario los solicita.
  2. Con sonidos de fondo, que se reproducen automáticamente al abrir un documento. Este sistema y el siguiente realizan la carga automática de los ficheros de sonido, por lo que son poco indicados para archivos grandes.
  3. Y por último, los controles de reproducción de sonido, pequeñas utilidades que aparecen insertadas junto al contenido del documento (plug-in o ActiveX), y que sirven para controlar su reproducción.
Internet Explorer dispone de una nueva etiqueta llamada <BGSOUND>, destinada a insertar sonidos de fondo en una página. El browser tiene soporte interno para reproducir ficheros WAV, AU y MID. De estos, el más interesante para actuar como sonido de fondo es el formato MID, por el reducido tamaño que ocupa.
 
<BGSOUND> Inserta un sonido de fondo para un documento HTML. Los formatos soportados son WAV, AU y MIDI.

Es específico de Internet Explorer.

  SRC=" " URL, relativa o absoluta, del fichero de sonido a reproducir.
  LOOP= Controla el número veces que se reproducirá el sonido. En caso de utilizar el valor INFINITE, se reproducirá de forma indefinida, hasta que se utilice algún botón o control del browser (el botón de stop o la tecla ESC) para detenerlo.

El sistema general para introducir muestras de sonido se realiza a través de las etiquetas <EMBED> y <OBJECT> (esta última solo para Internet Explorer). De esta forma, se insertan dentro del documento HTML pequeños reproductores de sonido, que se obtienen del propio browser, de plug-ins o de controles ActiveX.

Por ejemplo, para incluir un sonido de fondo en Netscape (no dispone de <BGSOUND>) se puede utilizar el siguiente código:

<EMBED SRC="cancion.mid" HIDDEN="true"> También se puede utilizar <EMBED> para insertar un sencillo reproductor de sonido. Este plug-in está preinstalado en Netscape 3 e Internet Explorer, y acepta varios parámetros que alteran su presentación. Todos ellos se incluyen como atributos adicionales en la etiqueta <EMBED>. Los más útiles son: <EMBED SRC="fich_midi.mid" WIDTH=180 HEIGHT=160>
 


 

<EMBED SRC="tambor.wav" CONTROLS=playbutton NAME="radio" MASTERSOUND WIDTH=37 HEIGHT=22>
<EMBED SRC="tambor.wav" CONTROLS=stopbutton NAME="radio" WIDTH=37 HEIGHT=22>
<EMBED SRC="tambor.wav" CONTROLS=pausebutton NAME="radio" WIDTH=37 HEIGHT=22>
<EMBED SRC="tambor.wav" CONTROLS=volumelever NAME="radio" WIDTH=74 HEIGHT=20>
 


 

Para crear ficheros de sonido, se pueden utilizar las funciones de grabación y edición de sonido digitalizado de las tarjetas de sonido. Para crear sonido sintetizado (MIDI) Microsoft distribuye de forma gratuita una versión de prueba de la aplicación denominada Music Producer (http://www.microsoft.com/musicproducer) que permite crear pequeñas ‘bandas sonoras’ de forma muy sencilla.

Inclusión de vídeo y animaciones

La edición, distribución y reproducción de vídeo a través de ordenador es un campo de investigación de plena actualidad, por la importancia futura de los sistemas digitales de distribución de imagen y sonido. Por ello, no es de extrañar la gran variedad de formatos disponibles para almacenar películas digitalmente, entre los que cabe citar los siguientes:

A pesar de que no es un formato de película propiamente dicho, los GIFs animados son un sencillo sistema de incluir animaciones dentro de un documento HTML.

El mecanismo de inclusión de imágenes en un documento HTML es equivalente al descrito anteriormente para los sonidos y se gestiona a través de <EMBED> y <OBJECT>. Como curiosidad, Microsoft ha incorporado un nuevo atributo a <IMG> denominado DYNSCR, que permite insertar la URL de una película o documento VRML en el espacio reservado para la imagen. Mientras la película se está transfiriendo al sistema cliente, se muestra la imagen especificada en SRC, que será reemplazada por la película cuando esté disponible.

Para incluir un fichero AVI con el reproductor predeterminado de Netscape (se controla pulsando el botón derecho del ratón sobre la imagen):

<EMBED SRC="flow.avi" HSPACE=20 WIDTH=300 HEIGHT=105 ALIGN="Left">
Reproductor de ficheros AVI <I>(plug-in)</I> de Netscape.
 

En Internet Explorer, el mismo efecto puede conseguirse con <EMBED>, <OBJECT> o <IMG DYNSCR>: <EMBED SRC="flow.avi" HSPACE=20 WIDTH=98 HEIGHT=132 ALIGN="Left">
Reproductor de ficheros AVI ActiveMovie (ActiveX)
<BR CLEAR="ALL"><P>
<OBJECT ID="ActiveMovie1" WIDTH=267 HEIGHT=145 ALIGN="Right"
CLASSID="CLSID:05589FA1-C356-11CE-BF01-00AA0055595A">
<PARAM NAME="_ExtentX" VALUE="7038">
<PARAM NAME="_ExtentY" VALUE="3836">
<PARAM NAME="ShowDisplay" VALUE="0">
<PARAM NAME="MovieWindowWidth" VALUE="99">
<PARAM NAME="MovieWindowHeight" VALUE="110">
<PARAM NAME="AutoStart" VALUE="-1">
<PARAM NAME="FileName" VALUE="cdec.avi">
</OBJECT>
Este es un control ActiveMovie insertado como objeto.
<BR CLEAR="ALL"><P>
<IMG SRC="cdec_fija.gif" BORDER=0 DYNSRC="flow.avi" LOOP=INFINITE START=FILEOPEN ALIGN="Left">
Y por último, esta imagen se inserta con las extensiones DYNSCR de IMG.