Ir a la página de inicio

Saltar menú

Blog de ST Visual, dedicado al diseño Web, posicionamiento en buscadores, etc.

Como incluir un video de YouTube con código que valide los estandares W3C

14 de octubre, 2009

Dada la importancia que a día de hoy tiene el desarrollo de páginas Web utilizando los estándares marcados por la W3C se hace extraño que Google nos ofrezca insertar videos de YouTube en nuestras páginas Web y para ello nos facilite un fragmento que código que curiosamente no valida. Después de ver en el siguiente ejemplo lo sencillo que es hacer que pase la validación de código del W3C se nos antoja más increible.

Vamos a ver un ejemplo con un video de Mutt Cutts, ingeniero de Google. Esta es la url del video: http://www.youtube.com/watch?v=4VduSHma–E y este es el código que Google nos ofrece para insertar este video en nuestra página Web:

Entre otras perlas este fragmento de código utiliza etiquetas embed que nunca han formado parte del estandar. Para publicar este mismo video con código estandar simplemente tendremos que hacerlo de la siguiente manera:

Si estás utilizando para el desarrollo de tu página Web código XHTML tienes que eliminar la etiqueta de cierre param y finalizar la primera con “/>”

Fíjate como hemos modificado el caracter ampersand (&) en nuestro ejemplo para que valide el código.

Como veis es muy fácil publicar videos de youtube en nuestras páginas Web respetando los estándares Web marcados por el W3C.

El inconveniente de insertar el video de youtube cumpliendo los estándares Web es que el usuario no podrá ampliar el video a pantalla completa.

Asi se ve el video con nuestro codigo

Clasificado bajo: Diseño Web, XHTML | Sin comentarios »

Como crear un enlace que se abra en una nueva ventana que cumpla con los estándares, sea accesible y válido para los buscadores

26 de noviembre, 2008

Hasta hace poco tiempo la mejor forma de crear un enlace que se abriera en una nueva ventana era utilizar el atributo target=”_blank” ,esta instrucción en HTML hacía que la página de destino del enlace que incorporaba este atributo se abría en una nueva ventana del navegador.

Como la mayoría de nuestros lectores saben la especificación XHTML 1.0 strict ya no permite el uso de la etiqueta target por lo que para conseguir el mismo efecto nos vemos obligados a utilizar javascript. Pero hay que tener cuidado con este código, ya que mal aplicado nos podría traer problemas.

Uno de los problemas sería que la página podría no cumplir con los criterios de accesibilidad Web y otro poblema sería la pérdida de indexabilidad de la página Web o pérdida del valor del enlace de cara a los buscadores, dependiendo del uso que le queramos dar.

Es muy habitual en este tipo de enlaces encotrarnos con el siguiente código: a xhref=javascript:void(0)” onClick=”m = window.open(‘paginadestino.htm’ … este código hace que la página de destino se abra en una nueva ventana del navegador, pero se trata de javascript intrusivo lo cual probocará que si un usuario entra sin tener activado el javascript no funcionará el enlace. Además el robot de Google no podrá seguir el enlaces.

Una buena opción sería cambiar este código por el siguiente: a xhref=”paginadestino.htm” onclick=”window.open(this.href); return false;
Con esto conseguimos que el código de nuestra página Web sea válido y cumpla con el estandar, que la páginas Web sea accesible, ya que si un usuario entra sin el javascript activado omitirá la instrucción onclick pero funcionará el enlace al estar la página de destino dentro del atributo href. Y también conseguiremos que la araña de Google pueda seguir el rastro al enlace.

Desventajas de utilizar frames en el diseño de una Web

22 de julio, 2008

El uso de frames es una técnica ya obsoleta que se utilizaba sobre todo antes de la llegada de las conexiones ADSL. Cuando las conexiones no erán tan veloces como en la actualidad había que cuidar mucho el tiempo de descarga de las Web y el uso de frames ayudaba a minimizar este tiempo de descarga.

El uso de frames o marcos no es más que dividir la ventana del navegador en varias secciones y cada sección es un fichero html. De esta forma era muy común encontrarse con páginas donde había una sección para el menú, otro para la cabecera de la Web y otro para el contenido, de tal forma que cada vez que hacíamos clic en una zona del menú sólo se actualizaba la sección dedicada al contenido permaneciendo estáticas las secciones de menú y cabecera.

Como decía al principio esta es una técnica obsoleta y actualmente utilizar este tipo de técnica puede ocasionar importantes desventajas.

Una de ellas es que cada marco del frame es un archivo HTML independiente y Google los va a indexar cada uno individualmente lo que puede ocasionar que al hacer clic en los resultados de búsqueda en los buscadores se nos habra la cabecera, el menú o la sección de contenido las cuales abiertas independientemente hacen innavegable la página Web.

Otra de las desventajas es que sólo disponemos de una página Web que es donde se muestran los diferentes marcos que componen la Web por lo que sólo dispondremos de esta página para optimizar el título, la descripción, las keywords, etc.

El uso de frames es un barrera para los buscadores haciendo muy dificil el trabajo de posicionamiento de este tipo de Webs, muchas de las empresas de posicionamiento en buscadores no ofrecen sus servicios a este tipo de página ya que a poca competencia que tenga la Web en cuestión, ésta se verá superada por estas Webs.

Aunque parezca mentira hoy en día se siguen utilizando los frames para maquetar páginas Web, es una técnica utilizada erroneamente en páginas en cuyas url hay un buen número de variables y utilizan un frame esconder esas url cuando esto se podría hacer mediante el archivo htaccess reescribiendo las urls y haciéndolas más amigables para los buscadores.

Clasificado bajo: Diseño Web, SEO | 4 comentarios »

Diseño Web: ST Visual - © 2007 - Todos los derechos reservados - Aviso Legal - Accesibilidad

  • XHTML Válido!
  • CSS Válido!
  • CSS Válido!