Tecnología y Coaching para Emprendedores

Cómo Conseguir que Lightbox valide en HTML5

html5

Hoy estaba trabajando en la página web de un cliente, cuando he ido a implementar una versión de la galería de imágenes Lightbox, llamada Gallery View. La sorpresa ha sido mía cuando al ir a validar la página me daba errores en la etiqueta rel=”nombre_atributo”. Pues sí, resulta que rel=”lightbox” da error de validación en HTML5.

Soy de la opinión de hacer que las páginas web, en la medida de lo posible, validen. rel=”lightbox” se utiliza por todo Internet sin problemas en páginas creadas con XHTML. Sin embargo, HTML5 sólo reconoce estos atributos:

  • alternate
  • author
  • bookmark
  • external
  • help
  • icon
  • license
  • next
  • nofollow
  • noreferrer
  • pingback
  • prefetch
  • prev
  • search
  • sidebar
  • stylesheet
  • tag

Solución al problema de validación de rel=”lightbox”

La solución es de lo más sencilla: en lugar de utilizar la etiqueta rel, utilizamos la etiqueta class. Es un simple truco, pero lo importante es que funciona! Para los que ya trabajáis con HTML5 y os importa que vuestros sitios web validen, espero que este pequeño truco os sea útil.


Comentarios

  • lgruz

    No es de extrañar la desaparición de esta etiqueta. Salvo para ayudar con JavaScript no le veía ninguna utilidad. Espero que por lo menos, entre todas esas etiquetas, podamos utilizar algo similar en el futuro.

    Y respecto al cumplimiento de estándares, yo la verdad recomiendo no comerse mucho la cabeza. Es bueno utilizar los validadores como ayuda para obtener un sitio lo más correcto posible, pero lo importante es que el sitio funcione, realmente, y sea cross-browser. Para conseguir esto último, mucho código JS, CSS o HTML debe incumplir los estándares para funcionar, por ejemplo, en Internet Explorer. Incluso sitios webs como Google, Yahoo!, YouTube, (eBay llega a casi los 500 errores)… incumplen estándares.

  • Dmaggio

    Hola Sandra,
    Me parece muy interesante tu articulo porque lo de pasar a HTML5 está siendo un quebradero de cabeza. En mi caso lo estoy intentando pasar por el tema de los microdatos, que google nos anima a ponerlos en las páginas web cuando solo se validan en HTML5.

    Siento comunicarte que la opción de class no funciona (class=”lightbox”) por lo menos en mi caso. No se si será por la versión del lightbox lo cual ahora es un poco engorroso cambiarla. ¿se os ocurre alguna otra opcion?

    Saludos.

    • Sandra

      Hola, pues la verdad no sé qué decirte, en el momento de escribir el artículo funcionaba, si han actualizado Lightbox es posible que ya no funcione..