El editor HTML de Brightspace tiene un verificador de accesibilidad incorporado que hace que sea más fácil que nunca mejorar la accesibilidad de sus páginas de contenido. Aquí tienes siete consejos sencillos para crear temas de contenido más accesibles con la ayuda del Comprobador de accesibilidad.
Ejecute el Comprobador de accesibilidad de Brightspace
El Comprobador de accesibilidad está disponible en el Editor de Brightspace cuando crea o edita páginas de contenido HTML. Se encuentra justo al lado de la Corrector ortográfico botón. Puede seleccionar Comprobar accesibilidad en cualquier momento mientras editas tu contenido.
El Comprobador de accesibilidad detecta problemas comunes de accesibilidad en contenido HTML estático y ofrece sugerencias para ayudarlo a solucionar los problemas en el acto.
Nota: el Comprobador de accesibilidad no reemplaza las pruebas de usuarios reales, especialmente cuando tiene actividades interactivas que se importan al curso. Todavía se necesitan pruebas de usuario real para la navegación solo con teclado y las pruebas de lector de pantalla.
Agregar texto alternativo de imagen adecuada
El problema de accesibilidad más común es la falta de texto alternativo a la imagen (texto alternativo). Un lector de pantalla lee el texto alternativo en lugar de la imagen, lo que permite a los alumnos con discapacidad visual acceder a la información. Como requisito del estándar HTML, cada imagen debe tener un Alt atributo.
Cómo introducir texto alternativo
Al insertar una imagen en el Editor de Brightspace, se le solicitará que ingrese el texto alternativo que se incrustará automáticamente en el código HTML. por ejemplo:
<em>img src="Scoops.jpg" </em><em><strong>alt="helado"</strong></em><em> /></em>
El Comprobador de accesibilidad muestra un mensaje de error Las imágenes deben tener texto alternativo si falta el texto alternativo. A continuación, le dará la oportunidad de reparar el problema añadiendo texto alternativo dentro del panel de informes.
Usar el verificador de contraste de color
El bajo contraste de color es otro problema común de accesibilidad. Pautas de accesibilidad al contenido web (WCAG) 2.1 El nivel AA requiere una relación de contraste de 4,5:1 para texto normal y de 3:1 para texto grande.
Cómo comprobar el contraste de color.
La mayoría de ustedes ya saben que hay un verificador de color incorporado dentro del Editor HTML de Brightspace. Al seleccionar un color de fuente para el texto, el color Relación de contraste se calcula e indica si cumple con los puntos de referencia WCAG 2.1.
Basándose en el mismo principio, el Comprobador de accesibilidad puede detectar los siguientes problemas:
- El texto grande debe tener una relación de contraste de al menos 3:1.
- La presentación visual debe tener una relación de contraste de al menos 4,5:1.
Propina: Para ajustar el contraste de color, puede utilizar el botón WebAIM: Comprobador de contraste de color para aclarar u oscurecer opciones para modificar ligeramente los colores.
Usar los encabezados correctamente
Los encabezados permiten a los alumnos con discapacidad visual comprender la estructura lógica de la página y navegar o saltarse secciones. Si los encabezados de las páginas solo están hechos de texto en negrita o de tamaño de fuente grande, el lector de pantalla no puede dar sentido a la jerarquía ni ayudar a los usuarios a ir rápidamente a la sección que querían.
Cada página debe tener un encabezado H1 (generalmente el título de la página), luego el encabezado H2 como los encabezados de las secciones principales, hasta H3, H4, y así sucesivamente. Los encabezados también deben usarse en el orden correcto.
Cómo usar los encabezados correctamente
Selecciona el texto y luego configúralo en el encabezado adecuado usando el menú desplegable Formato. No te saltes un nivel.
Si los niveles de encabezado no están en orden, el Comprobador de accesibilidad informará El orden de los encabezados debe ser secuencial.
Usar las listas de manera adecuada
Las listas transmiten una estructura de contenido jerárquica a los usuarios de lectores de pantalla. La lista desordenada
se debe usar cuando los elementos de la lista se pueden organizar aleatoriamente, mientras que la lista ordenada
se debe usar cuando un orden secuencial es importante.
Cómo usar las listas
Seleccione los elementos y, a continuación, elija el icono Lista desordenada si el pedido no importa o seleccione Lista ordenada en el menú desplegable si es secuencial.
El Comprobador de Accesibilidad sugerirá lo siguiente: Usar el marcado de lista para listas Si las listas no fueran verdaderas, listas.
Crear texto de hipervínculo descriptivo
Hacer que los hipervínculos sean accesibles es uno de los aspectos más importantes de la accesibilidad web.
Cómo usar los hipervínculos
Escoger Insertar enlace rápido y, a continuación, seleccione URL en la ventana emergente, introduzca la URL y el título que describen el destino del enlace.
Prácticas recomendadas:
- Crear texto de hipervínculo único y descriptivo
- Evite usar la URL como texto de hipervínculo
- Evite frases como "haga clic aquí", "más", "haga clic para obtener más detalles"
- Evite proporcionar dos enlaces uno al lado del otro que apunten a la misma ubicación (puede resultar confuso para los usuarios de lectores de pantalla). Intente combinar los enlaces cuando sea posible.
Tablas de marcado adecuadas
Una tabla contiene columnas o filas que muestran el significado de los datos en la cuadrícula. El usuario vidente puede hacer rápidamente una asociación visual entre los datos y los encabezados de fila/columna, sin embargo, los usuarios que no pueden ver la tabla no pueden hacer las asociaciones visuales, confían en el lector de pantalla para navegar por las celdas de una en una y escuchan los encabezados de columna/fila si la tabla está marcada correctamente. Para obtener una explicación detallada, consulte el artículo WebAIM – Creación de Tablas Accesibles.
Cómo marcar tablas
Seleccione las celdas que se van a marcar como encabezado de tabla, seleccione Propiedades de la celda de la tabla y, a continuación, elija Tipo de celda como Encabezado de columna o Encabezado de fila.
Estos son algunos errores comunes que puede detectar el verificador de accesibilidad:
Las tablas deben tener subtítulos.
Cómo solucionarlo: establezca un breve texto descriptivo para indicar el contenido de la tabla. Esto se sumará
dentro del elemento.Las tablas deben tener al menos un encabezado.
Cómo solucionarlo: Establezca el encabezado de la tabla en "Fila de encabezado" o "Columna de encabezado", lo que cambiará las celdas de datos a celdas de encabezado.Los encabezados de tabla deben estar asociados a celdas.
Cómo solucionarlo: Establezca el alcance del encabezado en "Fila" o "Columna" para el encabezado de tabla simple, lo que agregará el atributo de alcance ( o Además, puede utilizar plantillas HTML accesibles para crear nuevas páginas y lograr un aspecto coherente y mantener la accesibilidad. En D2L, reconocemos la necesidad de plantillas que no sean fáciles de usar para desarrolladores. Información adicionalWebAIM – Estructura SemánticaWebAIM – Texto alternativoWebAIM – Creación de Tablas AccesiblesPCC – Cree su página web D2L
