Simulador de lector de pantalla

Simula el orden de lectura y la semantica hablada de un lector a partir de una URL o HTML

Puedes pegar HTML o indicar una URL. La herramienta estima un orden de lectura similar al de un lector de pantalla y muestra lo que una persona ciega podria oir primero: titulo de pagina, landmarks, encabezados, enlaces, botones, etiquetas de formulario, imagenes y elementos de lista.

Como usar:

  • Entrada HTML: ideal para analisis estable y repetible
  • URL de pagina: obtiene la pagina y revisa su semantica
  • Preset del lector: solo cambia el estilo de redaccion del informe
  • Incluir landmarks: resume header, nav, main y footer
  • Mostrar sugerencias: agrega consejos de correccion

El informe destaca:

  • Orden probable de lectura
  • Saltos de niveles de encabezados
  • Faltas de aria-label o labels de formulario
  • Alt faltante o vacio en imagenes
  • Enlaces y botones sin nombre accesible

Resultados de ejemplo

1 Ejemplos

Previsualizar como leeria un lector una pagina de registro

Muestra el orden hablado, controles sin etiqueta y errores de encabezados.

What a screen reader may announce
Ver parámetros de entrada
{ "htmlInput": "<html><head><title>Launch Promo</title></head><body><header><a href=\"/\"><img src=\"/logo.png\"></a></header><main><h1>Launch Promo</h1><h3>Early access</h3><form><input id=\"email\" type=\"email\" /><button></button></form></main></body></html>", "pageUrl": "", "preset": "VoiceOver", "includeLandmarkSummary": true, "showFixSuggestions": true }

Datos clave

Categoría
Seguridad y validación
Tipos de entrada
textarea, text, select, checkbox
Tipo de salida
html
Cobertura de muestras
4
API disponible
Yes

Resumen

El Simulador de lector de pantalla analiza código HTML o una URL para estimar el orden de lectura y la semántica que percibiría un usuario con discapacidad visual. Esta herramienta extrae títulos, enlaces, botones, imágenes y etiquetas de formulario, generando un informe detallado que resalta problemas de accesibilidad como saltos de encabezados, atributos ARIA faltantes o controles sin nombre accesible.

Cuándo usarlo

  • •Al auditar la accesibilidad web de una nueva página o componente antes de su lanzamiento a producción.
  • •Para identificar rápidamente enlaces, botones o campos de formulario que carecen de etiquetas descriptivas.
  • •Cuando se necesita verificar la jerarquía de encabezados y la estructura de landmarks (regiones) de un documento HTML.

Cómo funciona

  • •Pega el código HTML directamente en el área de texto o introduce la URL de la página que deseas analizar.
  • •Selecciona un perfil de lector de pantalla (NVDA, JAWS o VoiceOver) y ajusta las opciones para incluir landmarks o sugerencias de corrección.
  • •La herramienta procesa el contenido y genera un informe visual con el orden de lectura probable y los errores semánticos detectados.

Casos de uso

Revisión de componentes de interfaz de usuario (UI) para asegurar que los botones y formularios sean accesibles.
Auditoría rápida de plantillas de correo electrónico o landing pages para validar el texto alternativo de las imágenes.
Comprobación de la estructura semántica de artículos de blog para garantizar una navegación lógica por encabezados.

Ejemplos

1. Auditoría de un formulario de registro

Desarrollador Frontend
Contexto
Se ha creado un nuevo formulario de registro, pero los usuarios de lectores de pantalla reportan dificultades para completarlo.
Problema
Identificar campos de entrada y botones que no tienen etiquetas accesibles.
Cómo usarlo
Pega el HTML del formulario en 'Entrada HTML', activa 'Mostrar sugerencias' y selecciona el preset 'VoiceOver'.
Configuración de ejemplo
{"preset": "VoiceOver", "showFixSuggestions": true}
Resultado
El informe revela que el campo de correo electrónico carece de la etiqueta <label> y el botón de envío no tiene texto interno ni aria-label.

2. Revisión de jerarquía en una landing page

Especialista en Accesibilidad
Contexto
Una página de aterrizaje promocional tiene un diseño visual atractivo, pero su estructura de código es dudosa.
Problema
Verificar si el orden de lectura tiene sentido y si los niveles de encabezado son correctos.
Cómo usarlo
Introduce la URL de la landing page en 'URL de página' y marca 'Incluir landmarks'.
Configuración de ejemplo
{"pageUrl": "https://example.com/promo", "includeLandmarkSummary": true}
Resultado
El simulador muestra un salto del encabezado H1 directamente a un H3, y advierte que la navegación principal no está dentro de un landmark <nav>.

Probar con muestras

html
Muestras de Comunicación en Tiempo Real WebRTC
Muestras completas de WebRTC para comunicación de audio/video P2P, canales de datos, compartir pantalla y servidor de señalización
keywords screen
sample
Colecciones Postman - Pruebas API
Ejemplos completos de colecciones Postman incluyendo pruebas de API, scripts de automatización, variables de entorno, servidores mock y patrones avanzados de prueba para REST APIs
keywords aria
sample
Muestras de HTML con Imágenes
Muestras de código fuente HTML con imágenes para probar la extracción
task extract
sample
Ejemplos de Apache Pulsar
Ejemplos de Apache Pulsar incluyendo pub/sub, lectores, consumidores con diferentes tipos de suscripción, gestión de esquemas y almacenamiento jerárquico para mensajería empresarial
keywords reader
sample

Hubs relacionados

Herramientas de Html para Convert
Explora 13 herramientas de html para flujos de convert y encuentra utilidades cercanas con rapidez.
Herramientas de Json para Convert
Explora 100 herramientas de json para flujos de convert y encuentra utilidades cercanas con rapidez.
Herramientas de Image para Convert
Explora 100 herramientas de image para flujos de convert y encuentra utilidades cercanas con rapidez.
Herramientas de Audio para Convert
Explora 100 herramientas de audio para flujos de convert y encuentra utilidades cercanas con rapidez.

Preguntas frecuentes

¿Es esta herramienta un reemplazo para pruebas con usuarios reales?

No, es una simulación semántica diseñada para detectar errores técnicos de accesibilidad, pero no sustituye las pruebas manuales con lectores de pantalla reales.

¿Qué perfiles de lector de pantalla están disponibles?

Puedes elegir entre NVDA, JAWS y VoiceOver. Esto ajusta el estilo de redacción del informe generado, aunque el análisis semántico base es el mismo.

¿Puede analizar páginas que requieren inicio de sesión?

No mediante la URL directa. Para páginas privadas o con autenticación, debes copiar y pegar el código HTML generado en la opción de Entrada HTML.

¿Qué tipo de errores de accesibilidad detecta?

Identifica saltos en niveles de encabezados, imágenes sin texto alternativo (alt) y controles interactivos sin nombre accesible (aria-label o labels de formulario).

¿Evalúa contenido dinámico generado por JavaScript?

Solo si proporcionas el HTML final renderizado. Si usas la opción de URL, es posible que el contenido dinámico del lado del cliente no se capture completamente.

Documentación de la API

Punto final de la solicitud

POST /es/api/tools/screen-reader-simulation-tester

Parámetros de la solicitud

Nombre del parámetro Tipo Requerido Descripción
htmlInput textarea No -
pageUrl text No -
preset select No -
includeLandmarkSummary checkbox No -
showFixSuggestions checkbox No -

Formato de respuesta

{
  "result": "
Processed HTML content
",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
HTML: HTML

Documentación de MCP

Agregue este herramienta a su configuración de servidor MCP: 

{
  "mcpServers": {
    "elysiatools-screen-reader-simulation-tester": {
      "name": "screen-reader-simulation-tester",
      "description": "Simula el orden de lectura y la semantica hablada de un lector a partir de una URL o HTML",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=screen-reader-simulation-tester",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Puede encadenar múltiples herramientas, por ejemplo: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, máximo 20 herramientas.

Si encuentra algún problema, por favor, póngase en contacto con nosotros en [email protected]