Tras escribir mi anterior artículo Validar flash en XHTML y HTML sin hacer uso de javascript para maximizar la compatibilidad, os traigo un nuevo artículo para validar flash. Esta vez mediante el uso de javascript con la librería swfobject, que se ofrece bajo licencia MIT License.
De este modo, os sugiero otra forma de cumplir los estándares web de la W3C y las pautas de accesibilidad web respecto a la validación flash que tantos problemas nos ha dado a los desarrolladores web puristas de la validación web y el SEO.
Características validar flash con JavaScript y SWFObject
SWFObject es una pequeña librería en javascript que nos permite incluir contenido flash de forma práctica y sencilla, permitiendo agregar contenido alternativo en caso de que el navegador no tenga habilitado javascript o el flash player.
- No se hace uso de la etiqueta embed y noembed.
- No hay redundancia de información en la inicialización del contenido flash.
- Cumple los estándares web de la W3C y las pautas de accesibilidad web.
- Permite visualizar contenido alternativo a los usuarios que no tengan el flash player o naveguen con javascript deshabilitado.
- El código fuente de nuestro desarollo web queda más limpio y legible.
Parámetros constructor SWFObject, validar flash, validar swf
- SWFObject(swf, id, width, height, version);
- swf - La ruta y el nombre de su archivo flash.
- id - La id de su objeto flash.
- width - El ancho de su objeto flash.
- height - El alto de su objeto flash.
- version - La versión requerida del flash player.
Ejemplo validar flash con JavaScript y SWFObject
Lo primero que debemos de hacer es incluir nuestra librería swfobject entre la etiqueta <head>…</head> de nuestro documento.
<!-- Flash SWFobject --> <script src="/js/swfobject.js" type="text/javascript"></script>
Posteriormente, crearemos nuestra contenedor flash con id única donde irá insertado nuestro flash y le agregaremos el contenido alternativo, todo ello irá ubicado entre la etiqueta <body>…</body> de nuestro documento.
<div id="reproductor"> <img src="/flash-no-disponible.jpg" alt="Flash Player no disponible" /> </div><br />
Después, llamaremos al constructor SWFObject de la librería en javascript agregada anteriormente.
<script type="text/javascript">
var flash = new SWFObject('/play-audio.swf', 'stream', '100%', '20', '7');
flash.addVariable('type', 'mp3');
flash.addVariable('file', '/audio.mp3');
flash.write('div_reproductor');
</script><noscript>Flash SWFobject</noscript>
Finalmente, nuestro código HTML completo usando la librería SWFObject quedaría de la siguiente forma:
<html>
<head>
<title>Validar flash con JavaScript y SWFObject</title>
<!-- Flash SWFobject -->
<script src="/js/swfobject.js" type="text/javascript"></script>
</head>
<body>
<div id="reproductor">
<img src="/flash-no-disponible.jpg" alt="Flash Player no disponible" />
</div>
<script type="text/javascript">
var flash = new SWFObject('/play-audio.swf', 'stream', '100%', '20', '7');
flash.addVariable('type', 'mp3');
flash.addVariable('file', '/audio.mp3');
flash.write('div_reproductor');
</script><noscript>Flash SWFobject</noscript>
</body>
</html>
Como podéis observar la librería SWFObject es una herramienta muy potente y fiable en el desarrollo web de aplicaciones siempre y cuando el navegador del usuario tenga javascript habilitado.
Últimos Comentarios