Reseña de la herramienta Silktide para monitorizar la accesibilidad en sitios web

El objetivo de este artículo es reseñar la herramienta Silktide. La reseña es imparcial e independiente, puesto que no he recibido ninguna compensación por realizarla.

Silktide es una herramienta de evaluación y gestión de calidad web que incluye, entre otros aspectos, pruebas de accesibilidad.

Ofrece:

• Extensión de navegador con diversas herramientas gratuitas, como la validación de accesibilidad de la página que estás visitando. Para los usuarios de pago incluye otro tipo de validaciones adicionales como, por ejemplo, la revisión de la ortografía y la gramática de la página o la localización de sus enlaces rotos.
• Plataforma SaaS de pago que permite monitorizar sitios completos.

Por tanto, es una herramienta similar a otras como SiteImprove, herramienta que reseñé hace años en Siteimprove, herramienta para el análisis programado de nuestro portal. El objetivo del artículo no es una comparativa de herramientas, por lo que me centraré en describir sus funcionalidades, sus puntos fuertes y su margen de mejora.

Índice

• Silktide, extensión de Chrome y Edge
• Silktide, monitorización de sitios web
• Conclusiones: puntos fuertes y débiles

Silktide, extensión de Chrome y Edge

La extensión Silktide es gratuita, está disponible en inglés para los navegadores Chrome y Edge y permite revisar una página de forma inmediata.

Este tipo de herramientas no sustituyen a una auditoría manual de accesibilidad, pero pueden ser muy útiles durante las mismas y en las revisiones preliminares.

En este sentido, la extensión de navegador Silktide me parece que es una herramienta útil y completa, entre mis favoritas, con ANDI o ARC Toolkit.

La extensión se despliega en la zona derecha de la pantalla y tiene las herramientas que voy a explicar a continuación, comentando cuáles son sus puntos fuertes y su margen de mejora.

Código y tipo de visualización

La herramienta analiza el código fuente resultante tras ejecutar los scripts, es decir, el equivalente a "Inspeccionar". Permite visualizar este HTML y localizar los elementos referenciados, aunque no lo hace mediante la herramienta para desarrolladores, que en el trabajo diario de auditoría me resulta más cómoda. Aun así, nada impide tener ambas abiertas de forma simultánea.

Extensión Silktide. Opciones de mostrar HTML y visualización en dispositivos móviles.

También tiene integrada la simulación de visualización en un dispositivo móvil, en concreto, ofrece las opciones: Desktop, MacBook Air, iPad Mini, iPad Air 4, iPad Pro 11, iPhone 5 e iPhone X.

Herramientas

La extensión presenta las siguientes herramientas:

Extensión Silktide. Herramientas.

• Color Contrast: la herramienta permite validar el contraste mediante la inclusión del código de color o mediante cuentagotas. Usa el algoritmo de las WCAG, pero no incluye como alternativa el Accessible Perceptual Contrast Algorithm (APCA).
• Alt text: listado de todas las imágenes y su texto alternativo. Se puede filtrar por las imágenes con "alt", las imágenes decorativas (con "alt" vacío) o las imágenes sin "alt". Es una lástima que no tenga en cuenta los <svg>, que tendrás que buscarlos manualmente.
• Screen reader: opción que no solemos encontrar en otros validadores. ANDI, por ejemplo, indica lo que anunciará el lector de pantalla, pero Silktide lo verbaliza, además de mostrarlo en formato texto. No sustituye, por supuesto, al acceso con un lector de pantalla, como NVDA, JAWS o VoiceOver, pero puede ser útil a muchas personas para una validación rápida.

  Puedes usarlo con la opción de página en negro, para acceder "a ciegas". También puedes elegir diferentes voces y velocidad de habla, y tienes disponibles varios atajos. La pega es que el anuncio de los elementos (no del texto) es en inglés. En cada verbalización te avisa de si ha encontrado un error, como un enlace sin un texto que pueda anunciar.

  

  Extensión Silktide. Screen Reader integrado para validación.

• Focus order: muestra el orden en el que los elementos recibirán el foco.
• Landmark: para consultar las regiones en las que se estructura la página (navigation, search, main, etc.).
• Links: listado de páginas a las que se enlaza desde esta.
• Headings: jerarquía de encabezados.
• Impaired vision: simulador de problemas de visión, como cataratas, miopía, visión doble, pérdida de visión periférica o pérdida de visión central.
• Color blindness: simulador de diferentes problemas de ceguera al color.
• Dyslexia: esta herramienta desordena y cambia las letras; no es así como percibe exactamente el texto una persona con dislexia, pero te ayuda a ponerte en su lugar.
• Learn about accessibility: acceso a documentación sobre accesibilidad.
• View full website report: acceso a la herramienta de monitorización para usuarios registrados.

Validaciones

La herramienta incluye diferentes tipos de validaciones. La validación de accesibilidad es gratuita, pero las demás solo están disponibles si eres usuario registrado de la plataforma SaaS de pago.

Extensión Silktide. Tipos de validaciones.

La revisión de accesibilidad es una validación automática según los estándares WCAG 2.0, 2.1 y 2.2 en sus niveles A, AA y AAA. Los resultados se pueden filtrar por aquellos que la página pasa, falla o que necesitan una verificación manual.

Como todos los validadores automáticos, valida solo ciertos criterios y solo ciertas técnicas. Recuerda que siempre deben comprobarse manualmente los resultados, porque pueden darse falsos positivos o falsos negativos.

Por ejemplo, en esta herramienta he detectado falsos negativos en el criterio "2.4.11 Focus not obscured", que se da por pasado (no como pendiente de revisión manual) en páginas que, sin embargo, tienen un menú fijo que tapa el foco de teclado.

Los demás tipos de validaciones son:

• Content: revisa, entre otras cosas:
  • faltas de ortografía y gramática;
  • número de palabras en la página;
  • enlaces rotos;
  • si se explica qué enlaces se abren en ventana nueva;
  • el meta description;
• UX: analiza, entre otros aspectos:
  • si la página tiene desplazamiento horizontal en pantallas pequeñas;
  • si el texto se leerá de forma cómoda en pantallas pequeñas (el texto con un tamaño de fuente por debajo de 11px se marca como fallido);
  • imágenes que no se cargan;
  • errores o advertencias de JavaScript;
  • la presencia de un favicon.
• Privacy: revisa, entre otros aspectos:
  • si se tiene aviso de cookies;
  • si se tiene política de privacidad;
  • las tecnologías utilizadas que pueden ver, controlar o comprometer la privacidad de los visitantes, para que se revise que están cubiertas por la política de privacidad.
• Marketing: algunas validaciones son comunes a "Content" y otras específicas, como si hay un sitemap o si se está usando una herramienta de analítica.

Silktide, monitorización de sitios web

Silktide también dispone de una plataforma SaaS de pago que permite monitorizar sitios completos y que está disponible en español. A continuación, explico sus principales funcionalidades, así como sus puntos fuertes y su margen de mejora.

Pantalla principal y menú

En la pantalla principal de la aplicación tenemos el acceso a nuestros sitios web:

Silktide. Pantalla principal de la aplicación.

Las opciones del menú principal son:

• Sitios web, para volver a la página principal.
• Inspeccionar, para validar una página o PDF concretos.
• Tareas, acceso al listado de tareas con las personas asignadas y su prioridad; al listado de anotaciones y al listado de objetivos, de los que hablo más adelante.
• Academia, con diversos recursos.
• Notificaciones.
• Perfil.

Página principal de un sitio web y menú

Cuando accedes a uno de tus sitios web, tienes un dashboard con información por defecto, pero también existe la posibilidad de crear dashboards personalizados.

Silktide. Pantalla principal de un sitio web.

En el menú tienes acceso a los diferentes tipos de validaciones que hemos visto en la extensión: contenido, accesibilidad, marketing, experiencia de usuario, privacidad y políticas. Además, tienes el acceso al listado de anotaciones, de objetivos y al inventario, que voy a explicar a continuación.

Inventario

El inventario incluye el listado de:

• páginas
• PDF
• idiomas
• enlaces
• tecnologías
• favicons del sitio

En el listado de páginas me resulta muy útil que se incluya la captura de pantalla de todas las páginas en escritorio y móvil. Sin embargo, echo en falta que no se listen también los archivos multimedia, JS y CSS.

Anotaciones, vista de página e integración de la validación manual

Las anotaciones se añaden desde la vista de página, donde tienes la opción de ir pasando por los diferentes problemas detectados en ella. Esta vista también dispone de otras funcionalidades:

• simulaciones (dislexia, problemas de visión, motor de búsqueda)
• ocultar partes de la página
• consultar su información: orden del foco, enlaces, secciones, encabezados, cabeceras HTTP, etc.
• reevaluar
• aprobar la página
• incluir comentarios

Me centro en las anotaciones, que me parecieron una buena idea, pensando en aquellas que realizas cuando revisas manualmente una página y reportas un error.

Cuando creas una anotación, le asignas una persona, le das una prioridad e indicas su estado.

Silktide. Alta de una anotación.

Sin embargo, las anotaciones no se integran en las tareas y el listado de comprobaciones, ni pueden asociarse a un criterio de las WCAG. Solo se visualizan desde el menú Anotaciones.

Por otro lado, tenemos el listado de Comprobaciones, por una parte el listado de comprobaciones automáticas y, por otra, el listado de las comprobaciones que necesita verificación manual (denominado "Controles asistidos"). Es otra manera de gestionar los errores que detectas en la revisión manual, pero estás limitada al listado que se muestra:

Silktide. Comprobaciones > Controles asistidos.

Puedes asignar una de las comprobaciones asistidas a una persona y poner comentarios a nivel de comprobación y de página.

En resumen, creo que la integración de los resultados detallados de una auditoría manual podría mejorarse mucho para resultar más práctico y flexible.

Objetivos

Los objetivos son bastante útiles. Los creas indicando el sitio web, la fecha en la que quieres alcanzar el objetivo, las personas asignadas y la métrica del objetivo, escogida de un listado muy extenso.

Silktide. Objetivos

Listado de tareas

El listado de tareas se puede filtrar por sitio web, persona asignada, etiquetas o categoría. Por ejemplo, en accesibilidad se puede filtrar por nivel, tipo de discapacidad, PDF o accesibilidad móvil:

Silktide. Tareas

Sería muy interesante que las tareas estuvieran categorizadas para permitir los siguientes filtros, que no están disponibles actualmente:

• tipos de contenidos: formularios, enlaces, etc.
• perfil profesional: diseñador, desarrollador, editor de contenido, etc.
• pauta y criterio de las WCAG (ahora solo se puede usar para ello el buscador).

Página principal de accesibilidad

La página inicial de "Accesibilidad" muestra una visión global de las puntuaciones por nivel y a lo largo del tiempo, de los problemas comunes y de los problemas por tipo de discapacidad (visual, auditiva, motora y cognitiva).

Silktide. Pantalla principal de Accesibilidad

Según el sitio, podría mostrarse también el "Benchmark", es decir, la puntuación comparada con webs del mismo sector. El "Silktide Index" es una tabla de clasificación que muestra cómo se comparan las organizaciones de diversas industrias en términos de accesibilidad. Puedes consultar más en "¿Qué es el índice Silktide?" o acceder a la web "Compare websites for accessibility" para probarlo.

Página de resultado de Silktide Index

Las opciones de menú del apartado "Accesibilidad" son:

• Listado de comprobaciones con acceso a las instancias.
• Listado de páginas con su puntuación.
• Listado de PDF y su puntuación.
• Móvil, con el listado de páginas no responsivas.
• Directrices, con el listado de criterios de las WCAG (no se incluyen los criterios específicos de la EN301549) y el número de errores asociados a cada uno.
  

  Silktide. Directrices

  Aprovecho para recordar que no se puede usar este tipo de información para cumplimentar un informe IRA o un ACR (Accessibility Conformance Report), ya que es necesario para ello una evaluación manual experta de todos los criterios.

• Auditorías manuales, para contratar una revisión manual.
• Decisiones: para revisar o deshacer las decisiones tomadas, como qué problemas se ignoraron o se aprobaron.

Cada tipo de problema encontrado tiene su página, con la prioridad, el progreso, las personas asignadas, las estadísticas, el historial y la posibilidad de comentar o de ignorar la comprobación.

Silktide. Página de una comprobación

Otros tipos de validaciones

Además de la validación de accesibilidad, tenemos las validaciones que he comentado en la extensión:

• Contenido: incluye el análisis de ortografía y gramática, disponible en español y catalán entre otros idiomas (idiomas soportados por Silktide); la legibilidad del texto (si es fácil de entender), pero solo disponible en inglés; el listado de enlaces rotos; la optimización de imágenes y comprobaciones relacionadas con el SEO.
• Marketing: validaciones relacionadas con las palabras clave, los anuncios, la cantidad de información o la optimización.
• Experiencia de usuario: validaciones relacionadas con el acceso móvil, el flujo de usuarios, los fallos de funcionalidad (imágenes o CSS que faltan, errores JS, etc.), detecta si el sitio está caído, o los Web Vitals de Google.

Hay dos tipos de validaciones adicionales que no están en la extensión.

• Políticas, esto es, las validaciones adicionales aplicadas. En la configuración hay algunas políticas predefinidas que se pueden añadir a la revisión, por ejemplo, revisar el uso de mayúsculas o de palabras específicas. También se pueden crear políticas personalizadas.
• Privacidad, con el inventario de elementos relacionados con la privacidad: números de teléfono y correos electrónicos incluidos en el portal, muy útil en sitios grandes gubernamentales; así como el listado de cookies, de tecnologías y de campos de formulario del portal.

Configuración

La herramienta se puede integrar con diferentes CMS (consultar lista completa), como Drupal, AEM, WordPress, Liferay, entre otros muchos. Además, permite integraciones personalizadas a través de API.

A nivel de configuración, se puede indicar cada cuántos días se reevalúa el sitio y hay reglas para personalizar qué páginas del sitio se incluyen o no.

También se pueden crear agrupaciones de páginas (secciones), que actúan como sitios web por sí mismas, esto es muy útil en sitios muy grandes.

Ayuda y soporte

La aplicación tiene soporte 24/7 ilimitado mediante un chat para hablar con un agente IA o con una persona real, y dispones de un teléfono y el correo electrónico de tu gestor asignado.

La herramienta dispone de ayuda relacionada con la propia herramienta y con la accesibilidad. En relación con la ayuda relativa a la accesibilidad, tienes diferentes recursos, pero también ayuda contextual:

• En las comprobaciones hay explicaciones sobre el criterio evaluado, a veces acompañadas de un vídeo de apoyo.
• En la página del error tienes la opción "Preguntar a la IA", que hoy en día es casi imprescindible:

Silktide. Página de un error con chat de ayuda

En las respuestas de la IA me ha gustado que tienes un desplegable para seleccionar que la explicación sea: no técnica, moderadamente técnica o para desarrolladores web; pero me ha parecido un poco lenta. Tal y como esperarías, te ofrece diferentes alternativas y se ofrece a darte el código que lo arregle.

Recuerda que siempre debes verificar si es un falso negativo o positivo y supervisar el código que te ofrece. Son una ayuda muy útil, no un sustituto.

Por ejemplo, en un error de dos enlaces con el mismo texto en los destacados de noticias (el típico "leer más"). Me ha explicado bien el error y las posibles soluciones: mejorar el texto de enlace; mejorar el texto de enlace, pero ocultar la parte añadida; o usar aria-label. También me ha advertido que usar el title para la aclaración no sería fiable.

Todo muy correcto, la explicación y el código. Pero no me ha ofrecido la opción de aria-labelledby, mucho más adecuada que la de aria-label en este contexto.

Informes

Uno de los aspectos más débiles de la herramienta es que no genera informes, solo se permite la exportación de las tablas en formato CSV.

Usabilidad y accesibilidad de la herramienta

La herramienta me ha resultado, personalmente y para mi perfil, intuitiva de usar.

No he realizado un análisis exhaustivo de accesibilidad de la herramienta, y esta tampoco dispone de una declaración de conformidad o ACR. Sí puedo decir que, en general, se nota que se ha tenido en cuenta, aunque no está exenta de problemas.

Por ejemplo, me resultó cómodo acceder con el teclado, pero tuve algún problema con el lector de pantalla. Hay un error muy sencillo de solucionar, pero muy molesto con el lector, y es que la definición del idioma a nivel de página es el inglés y, por tanto, el lector me lee por defecto el texto español con fonética inglesa.

También tuve problemas con las notificaciones toast, que no están etiquetadas como mensajes de estado con ARIA.

Precio

La extensión es gratuita, pero las validaciones adicionales son solo para los usuarios registrados de la plataforma SaaS, de pago.

El precio de la plataforma de monitorización depende de diferentes factores, no puedo dar cifras concretas porque no son públicas, es necesario solicitar un presupuesto, pero son similares al de otras herramientas disponibles en el mercado.

Conclusiones

Extensión de navegador

Los puntos fuertes de la herramienta, a mi parecer, son:

• Interfaz clara y cómoda.
• Útil para revisiones rápidas, apoyo en auditorías manuales y formación.
• Conjunto amplio de herramientas y simuladores de discapacidad, que incluye un lector de pantalla, poco habitual en estas herramientas.
• Versión gratuita de la herramienta.
• Validaciones complementarias útiles, como la revisión de ortografía, el número de palabras en la página o los enlaces rotos, aunque recuerdo que estas son opciones de pago.

Los puntos a mejorar según mi criterio serían:

• Disponer de una versión en español, incluida la simulación del lector de pantalla, que actualmente anuncia los elementos en inglés.
• Incluir los SVG en la validación de las imágenes.
• Revisión de los falsos negativos (extensión y plataforma de monitorización) en criterios que se dan por validados.

Sería muy interesante, desde mi punto de vista:

• Que se incluyera el algoritmo APCA como una opción en el validador de contraste.
• Usar la herramienta para desarrolladores para mostrar el código HTML, en vez de una ventana independiente.
• Herramienta para listar determinadas etiquetas HTML usadas en la página, a elegir de un listado (br, table, ul, svg, etc.) Esta opción la tiene ARC Toolkit y es muy útil.

Plataforma de monitorización

Los puntos fuertes de la herramienta, a mi parecer, son:

• Monitorización continua de sitios completos, con visión global y evolución en el tiempo.
• Más allá de la monitorización de accesibilidad, opciones de gestión de calidad útiles y complementarias a la accesibilidad y las auditorías, como la revisión ortográfica, los inventarios o el listado de capturas de pantalla.
• Soporte de gestión de tareas, objetivos y seguimiento.
• Integración con el CMS y opciones de configuración de secciones para sitios grandes.
• Creación de políticas personalizadas.
• El soporte y la ayuda IA integrada de calidad, con respuesta personalizada según perfil.

Los puntos críticos a mejorar según mi criterio serían:

• Incluir la generación y personalización de informes.
• Corregir la accesibilidad de la herramienta y tener disponible un ACR actualizado.
• Mejorar la gestión de anotaciones y controles asistidos para hacer más efectiva la gestión de la validación manual, que al final es imprescindible y más importante en la práctica que la automática.

Sería muy interesante, desde mi punto de vista:

• Disponer de más tipos de categorización y filtro de los problemas y tareas, como tipo de contenidos (formularios, enlaces, etc.), perfil profesional (diseñador, desarrollador, editor de contenido), filtro concreto por principio, pauta y criterio.
• Incluir en los inventarios el contenido multimedia, CSS y JS.
• Añadir los requisitos adicionales de la EN 301 549, que es el estándar a cumplir en Europa.

Agradecimientos

La reseña es imparcial e independiente, puesto que no he recibido ninguna compensación por realizarla, pero agradezco a Silktide la resolución por su parte de todas las dudas que me han surgido mientras trabajaba con la herramienta para poder elaborar esta reseña.

Este artículo se ha elaborado y redactado sin el uso de herramientas IA, solo se han usado para la revisión final de la ortografía.

Artículos relacionados

• AuditTool WCAG 2.2. Herramienta para auditorías de accesibilidad de acuerdo a las WCAG 2.2
• Siteimprove, herramienta para el análisis programado de nuestro portal
• Criterio 2.5.8 AA de las WCAG. Herramientas gratuitas para su evaluación manual
• Viajar en Realidad Virtual. Opciones de accesibilidad. Metaverso y turismo inclusivo.
• Validador del Observatorio de Accesibilidad Web - Rastreador OAW. Presentación, Instalación y uso, Metodología e Informes. (Parte I)
• Validador del Observatorio de Accesibilidad Web - Rastreador OAW. Validaciones y fiabilidad (Parte II)