Windows+Ctrl+Enter
Para entrar al VoiceOver de Windows
Dominar las bases de la accesibilidad
Bases de Accesibilidad Web y Creación de Portafolio Personal
Importancia de la Accesibilidad Web en el Desarrollo de Sitios
Pautas de Accesibilidad Web: Comprensión y Aplicación
Pautas de Accesibilidad Web: Principios y Criterios WCAG
Principios de Accesibilidad Web: Perceptible, Operable, Comprensible, Robusto
Tecnologías Asistivas para Accesibilidad Web
Presentar el proyecto
Creación de un Portafolio Accesible con HTML, CSS y JavaScript
Evaluar la accessibilidad de sitios web
Pruebas de Accesibilidad Web con Lighthouse en Chrome
Simulación de Accesibilidad Visual en Sitios Web
Pruebas de Accesibilidad Web con Teclado y Elementos Interactivos
Lectores de Pantalla: Uso y Configuración para Accesibilidad Web
Pruebas básicas con lector de pantalla VoiceOver en Mac
Refactorizar HTML para ser mas accessible
HTML Semántico para Mejora de Accesibilidad Web
HTML Semántico: Mejora la Estructura de tu Página Web
Refactorización de HTML para Mejorar Semántica y Accesibilidad
Mejorando la Accesibilidad Web con HTML Semántico
Uso de WAI-ARIA para Mejorar la Accesibilidad Web
Uso adecuado de roles en aplicaciones web
Accesibilidad Web: Uso de Aria para Lectores de Pantalla
Accesibilidad Web: Estados ARIA para Lectores de Pantalla
Actualizar HTML para Mejorar la Accesibilidad del Sitio Web
Utilizar CSS para aumentar la acessibilidad de un sitio web
Mejora de Accesibilidad Web con CSS: Contraste y Colores
Estrategias para Mejorar la Accesibilidad de Iconos Web
Implementación de Enlaces de Salto para Accesibilidad Web
Estilos de Foco y Hover para Accesibilidad Web
Optimización de Formularios y Estilos CSS en HTML
Extender la accesibilidad usando JavaScript
Interacciones y Accesibilidad en Carruseles Web con JavaScript
Accesibilidad en Carruseles: Manejo de Foco con TabIndex
Accesibilidad en Carruseles para Lectores de Pantalla
Mejoras de Accesibilidad en Modales con HTML y CSS
Accesibilidad en Elementos Dinámicos: Mejora de Modales
Validación de Formularios Web: Instrucciones Claras y Ejemplos
Mejorando la Accesibilidad de Formularios Web
Implementación de ARIA Live para Accesibilidad Web
Conclusión
Accesibilidad Web: Mejora Continua y Pruebas Prácticas
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
Pruebas básicas con lector de pantalla VoiceOver en Mac
12/35Recursos
¿Cómo realizar pruebas de accesibilidad con VoiceOver en Mac?
VoiceOver es un lector de pantalla integrado en todos los dispositivos Mac que facilita la navegación mediante comandos de voz. Aprender a utilizar este herramienta es esencial para evaluar la accesibilidad de los sitios web. Antes de comenzar, es crucial entender cómo activar y utilizar VoiceOver, ya que una manipulación incorrecta podría llevar a conclusiones erróneas sobre la accesibilidad.
¿Cuáles son los comandos básicos de VoiceOver?
Para manejarnos correctamente con VoiceOver, debemos familiarizarnos con los siguientes comandos clave:
- Activar VoiceOver: Presionar
Función + Comando + F5. - Pausar la voz: Utilizar la tecla
Control. - Apagar VoiceOver: Utilizar las flechas con la
Xque aparece en el diálogo. - Navegar hacia adelante: Con
Control + Opción + Flecha derecha. - Navegar hacia atrás: Con
Control + Opción + Flecha izquierda.
Estos comandos permiten tener un control básico sobre la navegación y la lectura de contenido con VoiceOver.
¿Cómo realizar pruebas de navegación en un sitio web?
La navegación básica es crucial para asegurarnos de que todos los elementos en un sitio web sean accesibles para quienes usan lectores de pantalla. Vamos a ilustrar cómo se utiliza VoiceOver en un sitio web cualquiera:
- Activar VoiceOver: Abre el sitio web y activa VoiceOver con
Función + Comando + F5. - Detener la voz: Hay momentos en los que queremos detener la voz; esto se hace presionando
Control. - Avanzar a través del contenido web: Usa
Control + Opción + Flecha derecha. - Acceder al contenido web: Cuando VoiceOver indique la entrada a un área web, presiona
Control + Opción + Mayeras + Flechas abajo.
Así se puede evaluar cómo VoiceOver interactúa y describe los elementos del sitio web.
¿Qué información ofrece VoiceOver sobre los elementos web?
VoiceOver proporciona información valiosa sobre los elementos de un sitio web, como:
- Elementos no etiquetados: Si encuentras imágenes no etiquetadas, el lector mencionará "imagen sin etiquetar", lo que indica un área de mejora en la accesibilidad.
- Encabezados y zonas de navegación: VoiceOver puede identificar encabezados y describe si estás dentro de un banner o navegación, permitiendo entender mejor la estructura.
- Enlaces y botones: Comparar cómo VoiceOver describe estos elementos entre un sitio accesible y uno ineficaz es un buen indicador de la accesibilidad.
¿Qué se espera lograr al implementar accesibilidad en sitios web?
Cuando optimizamos sitios para usuarios de lectores de pantallas, como VoiceOver, se garantiza una experiencia de navegación fluida y significativa. Estos lectores proporcionan instrucciones detalladas sobre cómo navegar y destacan elementos importantes, mejorando así la usabilidad.
Con estas pruebas, identificamos áreas a mejorar que posteriormente ajustaremos con HTML, CSS y JavaScript para potenciar la accesibilidad. Continúa explorando y aprendiendo cómo estas herramientas se implementan en proyectos futuros. ¡La accesibilidad está al alcance!
Aportes 29
Preguntas 2
Ordenar por:
sería bueno que en los videos de la profe colocaran en la pantalla la imagen de los comandos para saber cuales son las teclas ya que cada tecla según el país tiene un nombre diferente !
Es INCREÍBLE como cambió mi perspectiva sobre una página web desde que comencé este curso, nunca más voy a dejar una página con poca accesibilidad. GRAN CLASE.
Comando para ChromeVox:
ChromeVox modifier key = Search
Turn on braille captions = Search + A, B
Show ChromeVox Menus = Search + Period
Next heading = Search + H
Previous heading = Search + Shift + H
Enter Learn Mode = Search + O, K
Next group = Search + Ctrl + Down
Next object = Search + Right
Next line = Search + Down
Next word = Search + Shift + Ctrl + Right
Next character = Search + Shift + Right
PRENDER VOICEOVER
.
PAUSAR VOICEOVER
.
MOVER ADELANTE
.
MOVER ATRÁS
Me encanta, solo faltaría añadirle una clase donde haga la prueba con NVDA para los que tenemos Windows.
Deberían mostrar el manejo de las herramientas también para los que tenemos Windows, supongo que la mayoría aquí
Necesitamos aprender 5 comandos:
- Cómo prenderlo
- Cómo apagarlo
- Cómo navegar hacia adelante
- Cómo navegar hacia atrás
- Detener la voz
En Windows se activa: Tecla Windows + Ctrl + Enter
Los screen readers darán información al usuario sobre qué está en la pantalla, por eso debemos tener muy buena semántica.
Esto fue un despertar para mi, no tenía idea que funcionaba así
Definitivamente uno de los mejores cursos que he visto por su importancia de inclusión a más personas.
En cualquier distribución GNU/Linux con escritorio GNOME, para activar el lector de pantallas: Meta+Alt+S
En cualquier otro escritorio, instalar el paquete ‘orca’ a través de tu gestor de paquetes.
Documentación: https://help.gnome.org/users/orca/stable/
- Es el lector de pantalla que viene en las máquinas Mac
- En windows podemos ver el narrador del sistema operativo con
windows + ctrl + enter
Ya sabemos lo que hace falta, ahora… manos a la obra! 😄
En Linux mint es:
Encender:
**alt + super/window + s**
Apagar:
Una pesadilla ;v hay que reiniciar la pc para que **Orca** deje de funcionar XD
Hola, estaba escribiendo un comentario cuando se reprodujo automaticamente la siguiente clase y perdi todo lo escrito, basicamente un usuario de lector de pantalla evita tener que navegar todo por tabulador, puesto que esto se hace aun mas tedioso cuanto mas se complegise una pagina web, . existe algo llamado navegacion por tecla , asi se puede navegar por encabezados, landmarks botones, links etc etc. por cierto en movile existe el talbak, tambien las apps moviles deben ser accesibles
VoiceOver es el lector de pantalla por defecto de Mac, para activarlo presiona el shortcut Fn + Cmd + F5. Y para navegar a traves de la pagina manten presionado option + control mientras te mueves con las flechas del teclado.
Muy triste mae “Imagen sin etiquetar, Imagen sin etiquetar” :c
profe!! como que no sirven los links que puso
Excelente no sabia esto.
De todos los lectores de pantalla el que mejor funciona es Chrome Vox , JAWS de Microsoft ya no ha recibido actualizaciones desde hace mucho
Al probar VoiceOver en esta misma página, el foco queda atrapado en el campo de Buscar en Platzi (usando Ctrl+Opt+Flechita)… No se puede salir de ahí usando sólo esa combinación…
Perfecto
Instale el ChromeVox Classic Extension y no tiene un botón para apagar 😦 .
Esta es la extensión de ChromeVox que instale : https://chrome.google.com/webstore/detail/chromevox-classic-extensi/kgejglhpjiefppelpmljglcjbhoiplfn
excelente
También sirve seleccionar el texto que deseamos escuchar, click derecho del mouse y tendremos la opción de “voz”…
VoiceOver para Safari, ChromeVox para Chrome
en cada etiquetas es necesario poner el nombre
Alt+Super+S Para Ubuntu 😄
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?