Cómo incrustar videos de youtube sin romper la validación W3C


Si decides que tu web sea compatible con las recomendaciones del World Wide Web Consortium (W3C), te irás encontrando con pequeños problemas cuanto más compleja la quieras realizar. En este tutorial hablaremos de como insertar videos de youtube sin romper la validación de etiquetas.

 

El problema de la validación se produce por esta razón. La etiqueta <embed> no se incluye en ninguna versión estándar de HTML, por eso produce un error en la validación. Esta es una de las varias soluciones que se pueden adoptar.

 

En este ejemplo, esta probado con XHTML 1.0 Transitional, pero también funciona con XHTML 1.0 Strict y XHTML 1.1. 

 

Para incrustar un video de youtube en una página, lo más normal es ir a ese video en particular y pulsar el botón <Insertar>

 

 

Esto nos dará un código similar al siguiente: 

<object width="640" height="385"><param name="movie" value="http://www.youtube.com/v/cvT_Vx9W7zw?fs=1&amp;hl=es_ES"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/cvT_Vx9W7zw?fs=1&amp;hl=es_ES" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>

Lamentablemente si colocamos este código en nuestra página e intentamos pasar la validación, veremos que no lo conseguimos. Para poder pasar la validación, debemos modificar ese código por este otro:

<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/cvT_Vx9W7zw?fs=1&amp;hl=es_ES" width="640" height="385"><param name="allowFullScreen" value="true"><param name="allowscriptaccess" value="always"></param><param name="movie" value="http://www.youtube.com/v/cvT_Vx9W7zw?fs=1&amp;hl=es_ES /><param name="FlashVars" value="playerMode=embedded" /></object>

En data y en value, se pone la dirección donde se encuentra el video de youtube. En width y height, se introduce el ancho y alto de nuestro vídeo. Básicamente lo que hemos hecho es eliminar la etiqueta <embed> y pasar la información que contenía a la etiqueta <object>.

 

Con esto podremos ver nuestro video insertado en la página y no romperá la validación de etiquetas del W3C. Este código funciona en los principales navegadores sin ningún problema.

 

 

4.25
4.3 (4 votos)
 

Comentarios

ya lo iuntente, y me marca un

ya lo iuntente, y me marca un error en la etiqueta object, la etiqueta inicial no coincide con la final

Enviar un comentario nuevo

El contenido de este campo se mantiene privado y no se mostrará públicamente.
Valid XHTML 1.0 Transitional ¡CSS Válido!