Insertar archivos de Flash en Blogger

Los archivos SWF o "de Flash" son muy comunes y fáciles de agregar en cualquier blog pero, parece que siempre causan stress pese a que cualquiera que haya agregado un video de YouTube en su sitio, ya ha agregado un archivo SWF porque el reproductor es eso mismo, un archivo de Flash.

Para que funcione bien sólo debemos conocer tres cosas: la dirección URL, el ancho y el alto. El primero de esos datos es el que suele causar estragos porque, como en Blogger no podemos alojar archivos, es común que todos los problemas surjan al utilizar servicios externos que sirven para guardar archivos pero que no nos permiten enlazarlos desde una página web (hotlink); hay muchos sitios que los admiten, en lo personal, utilizo dos: Fielden y DropBox; en cualquier caso, sea el servicio que sea, es importante verificar que ofrezcan anchos de banda suficientes porque estos archivos suelen ser "pesados" y consumen bastante.

El tamaño es complicado de establecer. Hay un software de escritorio gratuito llamado Swiff Player que nos da esa información y que además es un reproductor independiente de este tipo de archivos. Sino, habrá que usar el viejo sistema del ojo, capturar la pantalla, etc etc etc.

El código elemental para insertar un archivo de Flash es este:

<object type="application/x-shockwave-flash" data="URLarchivo.swf" width="ancho" height="alto">
<param name="movie" value="URLarchivo.swf" />
</object>

Eso es todo; no hace falta utilizar la etiqueta EMBED que suele causar problemas y que es una etiqueta obsoleta y no reconocida por la w3.org

Antiguamente, se usaban atributos como classid o codebase pero hace tiempo que son una reliquia innecesaria; en la etiqueta OBJECT, basta agregar el atributo type.

En Blogger, la URL siempre comienza con el protocolo http:// y se coloca en dos atributos diferentes porque Internet Explorer utiliza una y el resto de los navegadores la otra. Como decía antes, este es el detalle que provoca el error en la gran mayoría de los casos. Para verificar que sea correcta, basta copiarla y pegarla en al barra de direcciones del navegador. Si todo esta bien, veremos el SWF funcionando; caso contrario, veremos una página web o un mensaje de error.

Un detalle a tener en cuenta es que en ciertos servicios se nos permite tener archivos de acceso público o privado y para usarlos en una web siempre deben ser públicos. Es común que a veces, nos parezca que funcionan porque nosotros los vemos pero no los ven los visitantes. Seguramente estamos logueados en nuestra cuenta así que hay que estar atentos a ese detalle.

width indica el ancho y height indica el alto. Ambos, se miden en pixeles pero, eventualmente, pueden usarse porcentajes. Si bien es cierto que este tipo de archivo admite que esos valores sean varaibles y en teoría, la animación se redimensionará casi sin perder definición, esto no siempre es posible. Algunos SWFs tienen tamaños fijos o tamaños máximos y mínimos establecidos por lo tanto, cualquier intento de redimensionarlos, ampliará el rectángulo de la etiqueta pero no la película en si misma y quedarán espacios vacios.

OBJECT admite más atributos como ID, ALIGN o STYLE que son los mismos que se usan con cualquier otra etiqueta. La etiqueta PARAM se usa para agregar atributos especficos. A mi juicio, hay dos que deberían agregarse siempre:

<param name="wmode" value="transparent" />
<param name="allowScriptAccess" value="always" />

El primero, indica el modo en que se mostrará el SWF; poniendo transparent, resolvemos la mayoría de los problemas que se presentan cuando se producen superposiciones. De todas maneras, admite otros dos valores: window y opaque.

El segundo, habilita la ejecución de acciones que contenga el SWF (por ejemplo, un menú o algunos juegos).

Así que, el código que utilizo por defecto es algo así:

<object type="application/x-shockwave-flash" data="URLarchivo.swf" width="ancho" height="alto">
<param name="movie" value="URLarchivo.swf" />
<param name="wmode" value="transparent" />
<param name="allowScriptAccess" value="always" />
</object>

Todas las opciones de PARAM se escriben del mismo modo, la sintaxis general es:

<param name="NOMBRE" value="VALOR" />

Por ejemplo:

• play indica si se ejecuta de modo automático que es el valor por defecto (true) o no (false)
• loop indica si se reproduce de manera indefinida (true) o no (false)
• menu lo utilizamos para definir el modo del menú contextual que se abre cuando hacemos click con el botón derecho; con true se muestra completo y con false se muestra con las opciones mínimas
• quality es la que nos permite establecer la calidad por defecto; puede ser low, high, autolow, autohigh o best
• scale por defecto tiene el valor showall que es el que hace que veamos la animación sin distorsiones cuando lo redimensionamos; otros valores son noborder, exactfit y noscale.

Todas ellas es difíciil que las necesitemos pero, estas dos últimas suelen verse con más regularidad:

• bgcolor indica el color de fondo de la animación si es que esta es transparente. Se indica como cualquier otro color, en formato #RRGGBB
• flashvars es el atributo que se utiliza para transferirle datos a la animación y es algo que veremos en muchos reproductores de audio

Quienes usen LighthWindow o algún otro script que genere ventanas modales pueden abrir archivos SWF en ese tipo de ventanas lo que tiene dos ventajas; la primera es que no tendremos problemas para mostrar animaciones que sean más grandes que el espacio disponible en nuestras entradas y la segunda, que no se cargarán hasta que un usuario las abra con lo que que la velocidad de carga de nuestro sitio no se verá afectada en absoluto.

click para ver la animación

REFERENCIAS:adobe.com