Aunque recientemente ha salido la versión 2.9 de WordPress voy a comentar un importante giro de la versión 2.8 que se vuelca en la accesibilidad de la estructura de contenidos.
Una de las nuevas características de WordPress es la incorporación de los conocidos landmarks de WAI-ARIA, añadidos a través del atributo role al theme por defecto de WordPress. De esta forma se especifican los roles de las diferentes zonas funcionales del blog haciendo que sea más semántico y accesible.
Los landmarks que WordPress ha incluido en su theme por defecto son: main, contentinfo, banner, complementary y navigation.
Sin duda se trata de una gran apuesta de WordPress volcada a mejorar la accesibilidad de sus blogs.
El problema de la validación XHTML W3C
Esta importante actualización que viene integrada en el theme por defecto de Wrodpress plantea un problema de validación. Las especificaciones HTML 4.01 y las DTD no contemplan aún los landmarks de ARIA y esto hace que nuestro blog no pase positivamente el test de validación W3C.
Para solventar este problema podemos eliminar los atributos role del theme e inyectarlos por medio de JavaScript en tiempo de ejecución.
Inyectando landmarks de ARIA con jQuery
$(document).ready(function() {
$('#content').attr('role', 'main');
$('#footer').attr('role', 'contentinfo');
$('#header').attr('role', 'banner');
$('#sidebar').attr('role', 'complementary');
$('#sidebar ul').attr('role', 'navigation');
$('#searchform').attr('role', 'search');
});
Sencillamente tomamos los elemento a partir de sus IDs (identificadores) e inyectamos la propiedad role con el valor que representa a cada una de las zonas funcionales role="navigation".
La última línea es un añadido que se encarga de inyectar el landmark del clasico buscador de WordPress.
