Técnicas de accesibilidad

  • user warning: Got error 28 from storage engine query: SELECT t.* FROM term_node r INNER JOIN term_data t ON r.tid = t.tid INNER JOIN vocabulary v ON t.vid = v.vid WHERE r.vid = 156 ORDER BY v.weight, t.weight, t.name in /opt/contenidos/produccion/emartos-web/html/modules/taxonomy/taxonomy.module on line 633.
  • user warning: Got error 28 from storage engine query: SELECT t.* FROM term_node r INNER JOIN term_data t ON r.tid = t.tid INNER JOIN vocabulary v ON t.vid = v.vid WHERE r.vid = 156 ORDER BY v.weight, t.weight, t.name in /opt/contenidos/produccion/emartos-web/html/modules/taxonomy/taxonomy.module on line 633.
  • user warning: Got error 28 from storage engine query: SELECT t.* FROM term_node r INNER JOIN term_data t ON r.tid = t.tid INNER JOIN vocabulary v ON t.vid = v.vid WHERE r.vid = 156 ORDER BY v.weight, t.weight, t.name LIMIT 0, 1 in /opt/contenidos/produccion/emartos-web/html/modules/pathauto/pathauto.module on line 142.

AccesibilidadHoy, en la recta final de los desarrollos evolutivos de la web de las Jornadas Salud Investiga desde Fundación Progreso y Salud, he intentado aproximar las necesidades del cliente al problema de la accesibilidad. Se trata de un proyecto de carácter interno y tenemos un mayor control sobre las decisiones técnicas, o dicho de otro modo, tenemos un control más granular.

La web parte de un antiguo desarrollo manual en PHP, que se ha ido actualizando, año tras año, a nivel de contenidos y estructura. A causa de la escasez de tiempo y de la pobre difusión de los beneficios de usar frameworks de desarrollo, o mejor aún, de los gestores de contenido, el proceso de modificación es todavía manual. Pero dentro de los recursos que se disponen, siempre se puede hacer algo más por los usuarios sin un coste adicional en tiempo ni en esfuerzo.

Pasando a lo concreto, los menús de la aplicación cargaban el contenido en un iframe central que, para colmo, ni siquiera tenía dimensionada la altura, por lo que la página mostraba dos barras de desplazamiento: la del navegador y la del iframe. Este aspecto no era del agrado de los responsables de la web, y por supuesto, tampoco cumplía con unos mínimos criterios de accesibilidad, seguridad y estética. Además, un JavaScript intrusivo se dedicaba a desplegar los submenús en función de la opción seleccionada.

En vista de la situación, he propuesto los siguientes cambios de estructura:

  1. El iframe desaparece, salvo en tres casos especiales en los que se incrustan formularios alojados en otro servidor.
  2. En lugar del iframe, un dispatcher implementado en PHP decide, en función de un parámetro HTTP GET, qué contenido debe cargar con un require().
  3. El JavaScript desaparece en favor de una comprobación, en cada elemento principal de menú, para determinar si dicho elemento o alguno de sus hijos coincide con la opción seleccionada, en cuyo caso se despliega el submenú. No es la mejor opción porque la verificación es redundante, pero no existe otra alternativa dado que la generación del menú no es dinámica, sino totalmente estática.

Sinceramente, hay otros aspectos mejorables en cuanto a accesibilidad, pero con estos cambios mínimos, que de paso mejora usabilidad, seguridad y estética del sitio, la navegación no se ve obstaculizada por un método de programación incorrecto.

Todavía nos queda mucho por avanzar hacia una web totalmente accesible y bien construida, pero cada pequeño paso que se da es importante para alcanzar esa meta.

URL trackback

http://m.emartos.es/trackback/134

Comentarios

Comparta su opinión

(no se publicará)
  • Las direcciones de las páginas web y las de correo se convierten en enlaces automáticamente.
  • Etiquetas HTML permitidas: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <p> <img>
  • Saltos automáticos de líneas y de párrafos.
  • Las etiquetas HTML serán transformadas para cumplir los estándares.
  • Syntax highlight code surrounded by the {syntaxhighlighter SPEC}...{/syntaxhighlighter} tags, where SPEC is a Syntaxhighlighter options string or "class="OPTIONS" title="the title".
  • Los @nombres tipo Twitter enlazan con sus respectivas cuentas de Twitter.
  • Los #hashtags tipo Twitter enlazan a search.twitter.com.

Más información sobre opciones de formato

To prevent automated spam submissions leave this field empty.