Jump to content

Codigo valido Youtube estándar con (X)HTML


Alejo

Publicaciones recomendadas

El código para insertar un video de Youtube (o análogos como metacafe, dailymotion, etc..) en una página que busca cumplir los estándares web es a menudo un quebradero de cabeza para los bloggers y webmasters.

 

Youtube proporciona un código que copiar y pegar en nuestro blog para reproducir los videos de una forma rápida y sencilla, pero el código no es todo lo correcto que debiera:

 

youtubecode-1.png

 

 

Si comprobaramos con el validador W3C este código, veríamos que tiene varios problemas:

 

•Se utiliza correctamente el tag object, pero no se especifican ciertos parámetros importantes como data o type.

 

•Los tags "unitarios" param en XHTML se deben cerrar en la misma etiqueta de apertura.

 

•El uso de la etiqueta no estándar embed puede producir incompatibilidades en navegadores que no la utilicen, así como dispositivos móviles, lectores u otros.

 

•No se proporciona un método alternativo en el caso de que no exista soporte para flash.

La solución es bien sencilla. Basta con codificar de la siguiente manera:

 

youtubecodexhtml-1.png

 

 

En este código se corrigen varios conceptos, pero sobre todo se elimina el uso del tag embed, puesto que se trata de una etiqueta privada que se

ha utilizado mucho e irregularmente, pero no es estándar.

 

•Se utiliza un object con la dirección del objeto en el atributo data y el MIME en el atributo type.

 

•Los tags param se vuelven "unitarios". Así el código es estándar XHTML, y además es compatible con HTML.

 

•Accesibilidad: Se añade como método alternativo una imagen que se mostrará en el caso de no disponer del plugin Flash para el navegador. En el caso de no tener tampoco soporte para imagenes (lectores de voz, navegadores de texto, ...) se mostrará el texto del atributo alt de la imagen.

Un problema también muy común en las validaciones suele ser el tema de no codificar correctamente el ampersand (&) en una URL (en el atributo data de object o en value del param), que debería aparecer como &.

 

 

 

Fuente

Enlace al comentario
Compartir en otros sitios web

Crear una cuenta o conéctate para comentar

Tienes que ser miembro para dejar un comentario

Crear una cuenta

Regístrese para obtener una cuenta nueva en nuestra comunidad. ¡Es fácil!

Registrar una nueva cuenta

Conectar

¿Ya tienes una cuenta? Conéctate aquí.

Conectar ahora
×
×
  • Crear nuevo...