Niquelao

Una de extensiones: HeadingsMap y WCAG Contrast checker 31 de Mayo de 2008, por Rumoroso

Pues si, por fin me he decidido a publicar un par de extensiones para Firefox. Después de batir toda clase de records en cuanto a número de extensiones en mi Firefox, el siguiente paso natural era ponerme a preparar (“desarrollar” suena demasiado pretencioso) las mias propias. Aquí traigo las dos primeras que hago públicas: headingsMap y WCAG Contrast checker.

headingsMap

Esta extensión genera un índice (o mapa) de cualquier documento web estructurado mediante el uso de encabezados, de tal manera que pulsando sobre cualquiera de los items de dicho mapa, se accede directamente al contenido correspondiente de la página.

Sí, ya lo se, esto mismo lo hace también otra extensión (documentmap). La diferencia estriba en que headingsMap, además de indicar los niveles de cada encabezado y los posibles errores que pudiera haber en su secuencia (por ejemplo, los saltos inadecuados), en el caso de haber marcos (FRAMESET e IFRAMES) también genera el mapa para cada uno de ellos. De esta manera, se convierte en una herramienta útil tanto para la navegación por el documento como para revisar y/o auditar sitios web (en cuanto a accesibilidad, estándares, etc).

Como no podia ser menos, también se le ha añadido una funcionalidad adicional. En el caso de que el documento web al que se esté accediendo sea una presentación en formato web hecha con acc_slide (o rumoslide) o con HTML Slidy, la extensión funciona como un índice, permitiendo acceder directamente a la diapositiva que se desee.

En la página de la extensión headingsMap se puede encontrar más información, así como en Firefox add-ons.

Al instalar la extensión, aparece un icono en la barra de estado que despliega el panel lateral en el que se muestra la estructura de encabezados. También se puede acceder mediante la combinación del teclado Alt + O.

Pantallazo en el que se muestra la extensión headingsMap

WCAG Contrast checker

Mediante esta extensión se puede comprobar si la combinación de dos colores es adecuada para su percepción visual en base a los requerimientos de las WCAG 1 y WCAG 2, empleando para ello el algoritmo que estas proponen. Dado que el algoritmo incluido en las WCAG 2 parece ser más preciso, el resultado de este es el que se muestra por defecto.

En un panel lateral se ofrece la posibilidad de introducir el código de los dos colores que se quieren comparar, mostrándose los resultados tanto para el caso de una percepción normal de los colores, como para situaciones tales como la protanopia, deuteranopia y tritanopia.

El código de color se puede introducir tanto en formato hexadecimal (en forma abreviada o no, y tanto con almohadilla como sin ella), como en RGB (pudiendo usar diferentes separadores entre los valores, como por ejemplo la coma o los dos puntos). Ej:

El uso de la extensión WCAG Contrast checker se puede combinar con la extensión ColorZilla, pues esta permite seleccionar directamente desde el documento web (y copiar al portapapeles) el color que se quiera comprobar. Si se tiene dicha extensión instalada, WCAG Contrast checker reconocerá su presencia. En este caso, pulsando Shift + Z ó Shift + X se activará el eyedropper del ColorZilla y se enviará de forma automática, bien el color de primer plano, bien el de fondo, al WCAG Contrast checker para su análisis.

La extensión hace aparecer un icono en la barra de estado que al pulsarlo despliega el panel lateral, pudiendo acceder también mediante la combinación del teclado Alt + C.

En la página de la extensión WCAG Contrast checker y en Firefox Add-ons hay más información, además del enlace para la descarga.

Pantallazo en el que se muestra la extensión WCAG Contrast checker

Una de extensiones: HeadingsMap y WCAG Contrast checker

Categoría: (X)HTML, Accesibilidad

1  comentario

1 comentario

boton 5 de Junio de 2008

Me encantan las extensiones, me gustaría que nos explicases, como empezar a preparar nuestras propias extensiones o nos dieses ejemplos de como has preparado las tuyas.
Un saludo

Puedes hacer un seguimiento de los comentarios gracias al feed RSS 2.0. También puedes enviar un trackback desde tu sitio.

¿Algún comentario?

Información Personal

...y si quieres incluir un Gravatar.

Creative Commons License Esta obra está bajo una licencia de Creative Commons.