Acerca de la accesibilidad del sitio web
El sitio web de la Universidad es una fuente principal de información, servicios y recursos, a la que acceden diariamente cientos de visitantes. Para servir a nuestro público, el contenido web debe ser accesible para que todos los usuarios, incluidas las personas con discapacidad, puedan acceder a la información que necesitan. También apoya los esfuerzos de la Universidad por cumplir con... Estándares WCAG 2.1 Nivel AA.
¿Sabía? Las mejores prácticas para la accesibilidad de sitios web se pueden aplicar a otras facetas de la accesibilidad digital, incluida la accesibilidad de documentos.
Explorar temas:
Encabezado
Los encabezados se utilizan para organizar secciones de información en las páginas web. La organización se logra mediante el uso de seis niveles de encabezado, cada uno de los cuales debe seguir a un... jerarquía de encabezados.
¿Sabía? Los usuarios de lectores de pantalla pueden navegar por las páginas web desplazándose por una lista de encabezados disponibles. Cuando los encabezados se aplican en el orden correcto, se agiliza la búsqueda de información.
- Proporcione encabezados en sus páginas web para facilitar la navegación.
- Asegúrese de que se siga el orden de encabezado correcto.
- Trate cada nivel de encabezado como una sección o subsección única.
- No haga Saltar niveles de encabezado.
- No haga Seleccione títulos en función de su apariencia.
- No haga Utilice encabezados para llamar la atención sobre un área o sección/
- NO hacer hipervínculos un encabezado - hipervínculo a un encabezado crea confusión.
Los encabezados son importantes porque sirven como puntos de referencia en una página web para los usuarios de lectores de pantalla. A diferencia de los usuarios visuales, que exploran las páginas web de arriba a abajo y de lado a lado (visualmente), los usuarios de lectores de pantalla navegan por una lista de encabezados disponibles.
NO omita los niveles de encabezado
Cuando se omiten los niveles de encabezado y se rompe la jerarquía de encabezados, Crea confusión innecesaria para los usuarios de lectores de pantalla.
La siguiente tabla describe el caso de uso ideal para cada nivel de encabezado y recomendaciones sobre cuándo utilizar cada nivel.
| Nivel | Propósito |
|---|---|
| Rumbo 1 |
Título de su página web
|
| Rumbo 2 |
Encabezado de sección principal: comience aquí
|
| Rumbo 3 |
Subtítulo del Título 2
|
| Rumbo 4 |
Subtítulo del Título 3
|
| Rumbo 5 |
Subtítulo del Título 4
|
| Rumbo 6 |
Subtítulo del Título 5
|
Enlaces
El formato de un enlace puede afectar tanto a usuarios con visión como a aquellos con discapacidad visual. Esta sección describe las consideraciones a tener en cuenta al incluir enlaces en sus páginas web.
¿Sabía? Los lectores de pantalla pueden navegar por su página web por una lista de enlaces disponibles, por lo que tener una frase "Haga clic aquí" hipervinculada no es muy útil ya que carece de contexto.
- Utilice un lenguaje descriptivo que ayude a los lectores a comprender:
- ¿A dónde irá el enlace O
- ¿Qué hace el enlace?
- Lea el texto del hipervínculo y pregúntese:
- ¿Está claro para mi audiencia qué hace el enlace o a dónde va?
- ¿Tiene sentido mi enlace cuando lo leo?
- Los lectores de pantalla son conocidos por leer objetos hipervinculados exactamente como están redactados.
- Los usuarios visuales son menos propensos a hacer clic en enlaces que parecen demasiado largos.
- No haga Proporcionar la dirección web o URL de una página web.
- Los lectores de pantalla leerán todos los objetos hipervinculados exactamente como se presentan, por lo que tener que escuchar la URL completa leída en voz alta no es muy útil.
- Los usuarios visuales tienen menos tendencia a hacer clic en URL de páginas completas.
- No haga Utilice frases cortas en los enlaces
- Evite usar "Haga clic aquí" o frases cortas similares. Al ser leídos por lectores de pantalla, estos enlaces no proporcionan suficiente contexto sobre adónde llevan ni qué hacen.
- "Haga clic aquí" no está actualizado.
Cuando un lector de pantalla encuentra enlaces, estos se leen en voz alta exactamente como se presentan en la página web. Dado que se leen en voz alta, es importante redactarlos con cuidado para que proporcionen contexto sobre adónde lleva o qué hace.
Los lectores de pantalla anunciarán: "Enlace" (seguido del texto utilizado en el enlace).
Ejemplos:
- "Enlace". "Sitio web de Servicios de Inscripción".
- "Enlace". "Formulario de inscripción al evento".
- "Enlace". "myStanState Portal del estudiante".
Algunos hipervínculos están diseñados para impulsar una acción específica. A veces se denominan "enlaces de llamada a la acción". Al usar un enlace de llamada a la acción, usar un verbo al principio ayuda a motivar a los usuarios a usar el enlace.
Ejemplos
Estos ejemplos de llamadas a la acción están redactados de manera tal que los usuarios pueden articular su propósito.
- Registrarse para la conferencia
- El enlace lleva a los usuarios a una página de registro de la conferencia.
- Asistir al taller
- El enlace lleva a los usuarios a una página de registro del taller.
- Contáctenos
- El enlace lleva a los usuarios a una página de envío de formulario.
- Programar una cita
- El enlace lleva a los usuarios a una página de programación de citas.
Si su enlace enviará a los usuarios a una página de referencia específica u otro sitio web, simplemente agregue un hipervínculo al nombre del recurso.
En estos ejemplos, tanto los usuarios visuales como los que tienen discapacidad visual comprenderían a dónde conducen estos enlaces.
Esta sección describe consideraciones sobre elementos comunes de formato de páginas web. Algunos elementos visuales de uso común pueden tener implicaciones si no se implementan correctamente.
¿Sabía? La mayoría de los lectores de pantalla no pueden determinar si el texto aparece en negrita, subrayado, resaltado o en cursiva.
Color y contraste
El uso del color puede presentar diversas limitaciones. Es necesario tomar precauciones especiales para garantizar que el uso del color no represente una barrera para la información, especialmente para los usuarios visuales que puedan ser daltónicos.
¿Sabía? De acuerdo con Somos daltónicos.comAproximadamente el 4% de la población padece algún tipo de daltonismo. Numerosos estudios sugieren que el daltonismo es más frecuente en los hombres.
- Evite codificar por colores la información, ya que algunos usuarios visuales pueden ser daltónicos.
- Es posible que los usuarios daltónicos no puedan ver ciertos colores; en su lugar, utilice texto simple para transmitir información.
- Evite asignar significado al color.
- Por ejemplo, evite marcar información importante con el color rojo.
- En su lugar, utilice palabras clave que transmitan importancia, atención o urgencia.
- Algunos ejemplos pueden incluir:
- ¡Importante!
- Nota
- Actualizar!
- Verifique el contraste de color en cualquier área donde pueda haber fondos brillantes u oscuros.
- ¿Hay enlaces o textos en color que son difíciles de leer?
- Si es así, puedes probar el contraste de color usando Comprobador de contraste de color gratuito de WebAIM.
- ¿Hay enlaces o textos en color que son difíciles de leer?
- Evite codificar por colores la información, ya que algunos usuarios visuales pueden ser daltónicos.
- Evite asignar significado al color.
Lea la sección Mejores prácticas para obtener información adicional.
El color se puede usar para mejorar la apariencia de una página web. Sin embargo, debe usarse de forma que no se convierta en un obstáculo para la información compartida en las páginas web.
Prueba tus colores con Comprobador de contraste de color gratuito de WebAIM
Al utilizar el color, pregúntese:
- ¿Mis enlaces son difíciles de leer debido al color que utilicé?
- ¿El texto en color de mi imagen es fácil o difícil de leer?
- ¿Es difícil leer mi enlace de color?
- ¿Le asigné significados a algún color?
- Si es así, tengo que usar texto simple para transmitir esa información a los usuarios visuales que pueden tener daltonismo.
Alineación del texto
En nuestro sitio web, el cuerpo del texto suele estar alineado a la izquierda. Esta alineación se considera la opción más legible y accesible para muchos usuarios. Tenga en cuenta que algunas funciones del sitio web pueden usar encabezados centrados como excepción.
¿Sabía? Los usuarios con discapacidades cognitivas, como la dislexia, pueden desorientarse cuando el texto se desplaza hacia el centro o se alinea a la derecha.
- Dejar el texto alineado a la izquierda.
- El texto alineado a la izquierda proporciona una experiencia de lectura más sencilla para los usuarios visuales, ya que ayuda a los lectores a comprender dónde comienza y termina cada línea de texto.
- El texto alineado a la izquierda es el más útil para personas con discapacidades cognitivas y usuarios con desafíos de procesamiento visual.
- Evite el formato de texto alineado al centro y a la derecha
- No haga Centrar o alinear a la derecha el texto del párrafo
- Incluyendo: encabezados, hipervínculos, imágenes
- Los usuarios disléxicos pueden desorientarse cuando el texto se desplaza hacia el centro o se alinea a la derecha.
- La alineación del texto puede afectar la accesibilidad, pero solo cuando se modifica a otros formatos además de la alineación a la izquierda.
- Ciertas funciones del sitio web, como nuestros acordeones, alteran la alineación del texto; sin embargo, se limita solo a los encabezados de la sección principal.
Subrayando
El subrayado es un elemento visual disponible solo para usuarios visuales y debe usarse con moderación. Tenga en cuenta las posibles limitaciones que puede encontrar al usar texto subrayado.
¿Sabía? El diseño web moderno suele subrayar los hipervínculos para los usuarios visuales. Al subrayar texto, los usuarios visuales pueden confundir las palabras subrayadas con objetos con hipervínculos. La mayoría de los lectores de pantalla no indicarán que el texto parece estar subrayado.
- Limite el subrayado de 1 a 3 palabras, máximo por página.
- Evite utilizar subrayados para llamar la atención, ya que los usuarios visuales pueden confundir el texto con un hipervínculo.
- No haga Subrayar más de 1 a 3 palabras.
- El usuario visual puede confundir el texto subrayado con un hipervínculo.
- No haga subrayar texto para llamar la atención
- Por ejemplo, "IMPORTANTE:"
- No haga asignar significado a las palabras subrayadas.
- Por ejemplo, "Todas las fechas subrayadas son importantes".
El texto subrayado no genera problemas de accesibilidad inherentemente. Los problemas surgen principalmente cuando se usa en exceso o por motivos inapropiados.
Al utilizar subrayados se encuentran las siguientes limitaciones:
- lectores de pantalla NO anunciar que el texto está subrayado.
- Los usuarios visuales pueden confundir palabras o frases subrayadas con objetos hipervinculados, ya que el diseño web moderno a menudo subraya los hipervínculos.
Texto en negrita
El uso de texto en negrita es excelente para enfatizar visualmente; sin embargo, es un elemento visual disponible solo para usuarios visuales. Debe usarse con moderación. Tenga en cuenta las posibles limitaciones que puede encontrar al usar texto en negrita en páginas web.
¿Sabías que? La mayoría de los lectores de pantalla no anunciar que el texto aparece en negrita. Texto en negrita no Convierte texto en encabezados para lectores de pantalla.
- Limite el uso de texto en negrita, cuando sea posible.
- El texto en negrita no convierte el texto en un encabezado, en su lugar utiliza encabezados reales.
- Si debe utilizar texto en negrita, limite el estilo del texto en negrita a unas pocas palabras en cualquier sección particular de información.
- Tenga cuidado de no abusar del estilo de texto en negrita, ya que puede perjudicar la legibilidad de la página para los usuarios visuales.
- No haga Utilice texto en negrita como reemplazo/sustituto de un encabezado.
- El texto en negrita no se registrará como encabezado para usuarios de lectores de pantalla: utilice encabezados reales en su lugar.
- No haga asignar significado al texto en negrita
- Por ejemplo, "Todos los plazos están marcados en negrita".
- Esta información (visual) sólo estaría disponible para usuarios visuales y no para usuarios con discapacidad visual, creando así una barrera de acceso a la información.
- Por ejemplo, "Todos los plazos están marcados en negrita".
El uso de texto en negrita no crea inherentemente problemas de accesibilidad, sin embargo, existen limitaciones notables con el texto en negrita.
- lectores de pantalla no anunciará que el texto aparece en negrita.
- Cuando se usa texto en negrita en exceso, puede hacer que la página web sea mucho más difícil de leer para los usuarios visuales.
Cursiva
El texto en cursiva es un elemento visual; sin embargo, debe usarse con moderación. Esta sección destaca consideraciones para usuarios visuales y con discapacidad visual.
¿Sabía? La mayoría de los lectores de pantalla no anunciar Cuando el texto aparece en cursiva. Su página web se vuelve cada vez más difícil de leer si se usa demasiado la cursiva.
- Limite el uso de texto en cursiva a unas pocas palabras: de 1 a 3 es un rango seguro.
- Tenga cuidado, ya que el uso excesivo de texto en cursiva puede perjudicar la legibilidad de su página para los usuarios visuales.
- No haga asignar significado al texto en cursiva.
- Por ejemplo, "Todas las fechas en cursiva son importantes".
- En este caso, solo los usuarios visuales entenderían qué fechas son importantes, ya que los usuarios de lectores de pantalla no tienen forma de interpretar el texto en cursiva.
- Evite el uso excesivo de texto en cursiva, ya que esto perjudica la legibilidad de la página para los usuarios visuales.
El texto en cursiva no crea un problema de accesibilidad, sin embargo puede convertirse en un problema en las siguientes circunstancias:
- Utilizado en exceso a lo largo de una página, lo que hace que la página sea cada vez más difícil de leer para los usuarios visuales.
- Cuando se ha asignado significado a un texto en cursiva.
- Cabe señalar que los usuarios disléxicos pueden tener mayores dificultades para leer texto en cursiva, en particular si su extensión es superior a una oración.
Evaluación de su contenido web
Utilice la extensión de navegador gratuita WAVE de WebAIM para comprobar la accesibilidad de su página web.
-
¡Verifica los niveles de tus encabezados, descripciones de texto alternativo, texto de enlace y más!
-
Señala errores y áreas de preocupación
-
Disponible de forma gratuita en Chrome, Edge y Firefox.
Actualizado: Marzo 24, 2026