Insertar video Youtube con XHTML válido

“Google está hecho por ingenieros, su lenguaje son los estándares”

– Javier Casares

La frase de Javier Casares experto en SEO y WPO (Web Performance Optimization) resume muy bien la importancia de seguir los diferentes estándares web para que nuestros sites sean vistos con mejores ojos por los buscadores, lectores de RSS u otros dispositivos que deban interpretarlos.

Según el ranking de SEO Moz, la incorrecta maquetación en HTML de un website tiene una repercusión negativa en el posicionamiento SEO. Pero la maquetación HTML no sólo es una cosa de técnicos o desarrolladores, todo editor de contenidos también debe tener en cuenta una serie de factores y prácticas que mejorarán el posicionamiento SEO de nuestras web y blogs.

La inserción de vídeos de Youtube es una práctica habitual, y por eso es importante tener en cuenta como podemos maquetar los vídeos de forma optima. Youtube nos ofrece dos formas de insertar los vídeo, pero ninguna de las dos formas son validables por los estandares del W3C.

La opción por defecto nos muestra un código en iframe que no es aceptado por el W3C

iframe-youtube-embed-300x200

 

La opción de usar el antiguo código de Youtube para insertar el vídeo tampoco es válida para el estandar del W3C

En el blog del W3C nos explican como se construye un código para vídeos de Youtube acorde con los estándares que se corresponde con el siguiente ejemplo:

<object width=”640″ height=”390″ type=”application/x-shockwave-flash” data=”http://www.youtube.com/v/redacted“><param name=”movie” value=”http://www.youtube.com/v/redacted” /><p>Texto descriptivo del vídeo</p><param name=”allowFullScreen” value=”true” /><param name=”allowscriptaccess” value=”always” /></object>

Para conseguir que el código funcione tan solo debemos substituir el término redacted del ejemplo por el código que aparece en la url que nos da Google para incrustar el vídeo por defecto. Además también modificaremos el texto descriptivo del vídeo para explicar el contenido del mismo. Con esto conseguiremos que además de bien visto por Google pueda ser accesible para aquellos usuarios con limitaciones o que, por ejemplo, visitan nuestra web con navegadores que sólo reconocen el texto.

<iframe title=”YouTube video player” width=”640″ height=”390″ src=”http://www.youtube.com/embed/QfWL5sIDMKg” frameborder=”0″ allowfullscreen></iframe>

El resultado sería el siguiente:

<object width=”640″ height=”390″ type=”application/x-shockwave-flash” data=”http://www.youtube.com/v/QfWL5sIDMKg“><param name=”movie” value=”http://www.youtube.com/v/QfWL5sIDMKg” /><p>Explicación sobre como consultar si nuestra web cumple los estándares web</p><param name=”allowFullScreen” value=”true” /><param name=”allowscriptaccess” value=”always” /></object>

Una vez introducido el vídeo podremos comprobar en la web del W3C como el código que sugieren en W3C no aporta ningún error y tanto el código por defecto como el código antiguo de Google generan entre 5 y 7 errores de maquetación.

Evidentemente, más importante que los estándares web, tanto el gestor de contenidos como los encargados del posicionamiento SEO deberán procurar que el contenido del vídeo y en general todos los contenidos siempre sean de buena calidad y pertinentes para el usuario, pero eso ya es harina de otro costal.

 

Leave a Reply

Your email address will not be published. Required fields are marked *