¡Envia tu foto al Fotomaton!
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:
Si comprobaramos con el validador W3C este código, veríamos que tiene varios problemas:
La solución es bien sencilla. Basta con codificar de la siguiente manera:
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.
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 &.
Finalmente, tendremos un código para videos o animaciones flash de youtube (u otra entidad similar) completamente estándar:
Conexión a internet más rápida y veloz.
16 Comentarios
Un buen artículo, la estandarización me parece algo muy importante y sitios como youtube deberían proporcionar el código estandarizado (ya que le dan...).
También es verdad que seguir al pie los estándares hace doler un poco la cabeza, jej, pero qué te van a contar a ti Manz.
Una vez en Wordpress pegue el código de YouTube, y además de no respetar los estándares HTML el reproductor no se mostraba. Pero ahora utilizo un plugin que inserta cualquier reproductor con solo pegar la dirección URL, es mas sencillo y respeta los estándares.
No se entusiasmen... este plugin es solo para Wordpress, si están en otro CMS sigan las instrucciones del articulo.
Saludos.
Yo simplifique la faena poniéndome un botón en mi editor de Wordpress, y con un simple click tengo el código correcto de cualquier vídeo de Youtube ;)
Un poco de Spam :P
Un muy interesante articulo.. prestaré más atencion a esto...
Gracias, yo había hecho mi propia implementación para que pasase la validación pero la tuya trae más detalles. Además el código lo tengo en un plugin así que con tocar en un sitio los tengo todos corregidos (que supongo que es más o menos lo que hizo inkilino).
@Nacho 001, el problema es de wordpress (o al menos en mi caso) y es que al re-editar un post destroza el código al intentar reformatearlo para el editor visual, la solución pasa por el plugin, pero las modificaciones que propone Manz también se pueden implementar dentro del plugin (yo así lo tengo hecho como he dicho antes).
Una duda, los vídeos que publicas con ese código en Webs importantes como google reader no se ven (se ve la imagen alternativa)
¿Hay que añadir/eliminar algo al código para que se vean al menos en google reader?
Muy interesante la entrada ;-)
RubenDomFer, interesante cuestión.
Quizás me equivoque, pero creo que el problema es de los user agents, en este caso el lector de feeds.
El problema es que la mayoría sólo interpretan contenido flash con el tag embed, cuando deberían hacerlo con el object.
Dondado: Si, al parecer es problema de Wordpress, por que en Flatpress no pasa, lo malo que tiene Flatpress es que es medio truchito.
Saludos.
Interesante... si mi blog fuera mío y no de blogger, intentaba hacerme un script para corregir tooodos los vídeos del youtube. Pero como no es asín creo que se van a tener que quedar como están. Eso si, tengo esta página en marcadores para más adelante :P
Yo lo que no entiendo es porqué no proporcionan el código ya válido y nos ahorran tener que modificarlo a mano, via plugins o como cada uno lo tenga preparado.
Hola a la comunidad ^^:
Ese video me lo mando una amiga xD, me parti mucho. Saludos desde Tenerife Manz :D .
¿Y me dejas robarte la imagen que utilizas como contenido alternativo?
Creo que el codigo no funciona en mozila como se pude solucionar este punto en el codigo????
Hola Manz, acabo de probar el código (si, un poco tarde ó_ò) y funciona muy bien, sólo resaltar un matiz, utilizando un DTD transitional funciona muy bien, sin embargo, utilizando el strict hay un error al validar ya que no se admite el atributo border dentro del elemento image, sólo indicar que lo del border habría que utilizarlo en la CSS. Por lo demás funciona a la perfección :)
Saludos.
Sabes ke??? cuando metes un link en forma de variavel que ha venió del banco de datos y to eso , pues no aparece el video.... eso ya no sé porque pasa....alguien lo sabe????
algo como eso:
en Internet.
Envia tu fotografía al fotomatón de Emezeta. Puedes enviar varias y saldrás en la portada de Emezeta.
10 consultas efectuadas / Página generada en 0.045 segundos
Programado íntegramente por José Román (Manz) en XHTML y CSS estándar.
Sindicado bajo Feed RSS. Contenido bajo licencia Creative Commons
Estadísticas de visitas · Términos y condiciones · Contacto · Publicidad · Preguntas frecuentes (FAQ)