Todas las notas

Consejos y trucos

Victorias rápidas de accesibilidad que también mejoran tu SEO

La versión corta: la mayoría de las correcciones de accesibilidad son correcciones de SEO con otro nombre. El texto alternativo sirve a un lector de pantalla y a la búsqueda de imágenes a la vez. La jerarquía de encabezados sirve a un lector de pantalla y a un rastreador a la vez. Los enlaces descriptivos, los puntos de referencia, los subtítulos, el contraste y las etiquetas claras cumplen una doble función. Corrige la página para quien más la necesita, y cualquier otro lector, humano o máquina, la lee mejor también.

La mayoría de los equipos gestionan la accesibilidad y el SEO como dos listas de verificación separadas, cada una a cargo de una persona distinta. Al mirar de cerca, las correcciones de cada lista son, la mayoría de las veces, la misma corrección, archivada bajo dos nombres diferentes.

La misma lista, leída dos veces

El WebAIM Million, un análisis anual de las páginas de inicio del millón de sitios más visitados, encontró que el 95,9 por ciento tenía al menos un fallo de WCAG detectado, con un promedio de 56,1 errores por página (WebAIM, por verificar). Los seis fallos más comunes: texto de bajo contraste (83,9 por ciento), texto alternativo faltante (53,1 por ciento), etiquetas de formulario faltantes (51 por ciento), enlaces vacíos (46,3 por ciento), botones vacíos (30,6 por ciento) e idioma del documento faltante (13,5 por ciento) (WebAIM, por verificar). Cada uno de ellos es también un problema de visibilidad: texto que un rastreador no puede analizar, una imagen sin descripción, un enlace que no lleva a ninguna parte.

95.9%

de páginas de inicio no superan una prueba de WCAG

56.1

errores de accesibilidad por página, en promedio

83.9%

tienen texto que no supera el contraste

Las siete correcciones que siguen aparecen en ambas listas, con el beneficio de accesibilidad y el beneficio de visibilidad nombrados uno junto al otro.

¿El texto alternativo ayuda al SEO tanto como a la accesibilidad?

Sí, para la búsqueda de imágenes. Un lector de pantalla anuncia el texto alternativo en lugar de una imagen que no puede renderizar. La documentación de SEO de imágenes de Google confirma que el texto alternativo es una señal principal que utiliza para posicionar una imagen en Google Imágenes (Google), y aun así sigue faltando en el 53,1 por ciento de las páginas de inicio (WebAIM, por verificar). Escríbelo con claridad: qué muestra la imagen, en contexto.

¿Por qué importa la jerarquía de encabezados tanto para los lectores de pantalla como para los rastreadores?

Ambos leen una página por su esquema antes que por sus oraciones. La Guía de introducción al SEO de Google recomienda un solo h1 por página, con h2 y h3 en orden, sin saltos (Google). Los usuarios de lectores de pantalla se apoyan en ese esquema incluso más: el 71,6 por ciento navega páginas largas por encabezados, muy por delante de cualquier otro método (WebAIM, por verificar).

¿Qué hace que un texto de enlace sea descriptivo, y por qué importa dos veces?

Un enlace que dice "más información" o "haz clic aquí" no le dice nada a un lector de pantalla fuera de contexto, y le dice casi tan poco a un rastreador. El texto de enlace ambiguo es una de las mayores frustraciones en la encuesta de WebAIM a usuarios de lectores de pantalla, donde solo el 4,8 por ciento navega directamente por enlaces (WebAIM, por verificar). Escribe un texto de enlace que nombre el destino: "lee la guía de precios", no "haz clic aquí".

¿Qué son los puntos de referencia semánticos, y ayudan a que te encuentren?

Los puntos de referencia marcan las regiones estructurales de una página (encabezado, navegación, contenido principal, pie de página) usando elementos HTML reales, no divs genéricos. Un lector de pantalla salta directo a "main" y omite la navegación repetida, y un rastreador recibe una señal inequívoca para distinguir el contenido repetitivo del contenido que vale la pena indexar. El uso de puntos de referencia ha disminuido entre los usuarios de lectores de pantalla (WebAIM, por verificar), así que trata los encabezados como la prioridad y los puntos de referencia como un paso adicional de bajo costo.

¿Los subtítulos y las transcripciones realmente mejoran la visibilidad?

Los motores de búsqueda leen texto, no video ni audio, así que un archivo de subtítulos o una transcripción suele ser la única parte de un video que un rastreador puede indexar, y ese mismo texto es lo que necesita un espectador sordo o con dificultades auditivas. Un estudio citado por Accessibility.com encontró que los videos con subtítulos tuvieron alrededor de un 7,32 por ciento más de interacción (Accessibility.com, por verificar). Publica la transcripción en la misma página, no en un archivo enlazado, y así se resuelven ambos casos a la vez.

¿Por qué el contraste de color es un problema de visibilidad y no solo de diseño?

El texto de bajo contraste es el fallo de accesibilidad más común en la web, presente en el 83,9 por ciento de las páginas de inicio y en aumento (WebAIM, por verificar). WCAG 2.2 fija el umbral AA en 4,5 a 1 para texto normal, un umbral elegido para compensar la pérdida de visión típica de una persona de unos ochenta años (W3C). Ese umbral ayuda a la baja visión, y ayuda igual de bien a cualquiera que lea en la pantalla deslucida de un teléfono bajo el sol.

¿Por qué importan las etiquetas claras para la accesibilidad y para que te encuentren?

Un campo de formulario sin etiqueta visible, o un botón que solo tiene un ícono, obliga a un lector de pantalla a adivinar o a quedarse en silencio, y no le da a un rastreador nada que asociar con esa interacción. Las etiquetas de formulario faltantes aparecen en el 51 por ciento de las páginas de inicio, los botones vacíos en el 30,6 por ciento (WebAIM, por verificar). Una etiqueta visible y en lenguaje sencillo elimina las conjeturas para todos.

El emparejamiento, lado a lado

CorrecciónBeneficio de accesibilidadBeneficio de visibilidad
Texto alternativo descriptivoEl lector de pantalla obtiene el significado de la imagenGoogle Imágenes puede indexar y posicionar la imagen
Jerarquía de encabezados ordenadaLos usuarios de lectores de pantalla saltan directo a la sección correctaLos rastreadores y los motores de respuesta interpretan el esquema de la página
Texto de enlace descriptivoEl enlace tiene sentido leído por sí solo, fuera de contextoLos rastreadores obtienen una señal real sobre el tema de la página enlazada
Puntos de referencia semánticosLa tecnología de asistencia omite la navegación repetida y llega antes al contenidoEl marcado separa el contenido repetitivo del contenido que vale la pena indexar
Subtítulos y transcripcionesLos espectadores sordos, con dificultades auditivas o en un espacio silencioso pueden seguir el contenidoLos rastreadores obtienen texto indexable que un video por sí solo nunca ofrece
Contraste de color suficienteLos lectores con baja visión o bajo luz intensa realmente pueden leer el textoLas páginas legibles retienen la atención, algo que los motores de búsqueda interpretan como calidad
Etiquetas claras y visiblesLos lectores de pantalla anuncian qué hace un campo o un botónLos rastreadores asocian significado a cada elemento interactivo

Por dónde empezar esta semana

El orden que ofrece resultados más rápido:

  1. Revisa el sitio y corrige primero cada texto alternativo faltante y cada enlace vacío: son las correcciones más económicas y de mayor alcance.
  2. Lee en voz alta el esquema de la página, solo los encabezados. Si no tiene sentido como esquema, un rastreador también tendrá dificultades.
  3. Busca "haz clic aquí" y "más información", y reescribe cada uno para que nombre su destino.
  4. Verifica el contraste contra el umbral de 4,5 a 1, no a simple vista.
  5. Añade una transcripción visible debajo de cada video, no solo una pista de subtítulos.
  6. Etiqueta cada campo y cada botón que solo tenga un ícono, en lenguaje sencillo.

Nada de esto es un truco para engañar a un motor de búsqueda. Es la misma claridad de la que se beneficia una persona, aplicada de manera uniforme, para que una máquina también la lea.

Preguntas frecuentes

No como factor directo de posicionamiento, pero las correcciones de fondo (texto alternativo, encabezados, texto de enlaces, contraste, etiquetas) coinciden en gran medida con lo que los rastreadores y los motores de respuesta necesitan para interpretar y confiar en una página. La coincidencia es mecánica, no magia.

Para la Búsqueda de Imágenes de Google, sí: es una señal principal que Google usa para posicionar imágenes. Para la búsqueda web general funciona más como el texto normal de la página, pero igualmente ayuda a un rastreador a entenderla.

El informe WebAIM Million encontró que el 95,9 % del millón de páginas de inicio principales tenía al menos un fallo detectado de la WCAG, con un promedio de 56,1 errores por página. El problema individual más común, el texto con bajo contraste, apareció en el 83,9 %.

Sí. En la encuesta de WebAIM sobre usuarios de lectores de pantalla, el 71,6 % de los encuestados dijo que navegar por encabezados es su forma principal de encontrar información en una página larga, muy por delante de cualquier otro método.

La WCAG 2.2 de nivel AA exige al menos 4,5 a 1 para el texto normal y 3 a 1 para el texto grande. El nivel AAA eleva aún más la exigencia, pero el AA es el umbral que citan la mayoría de las leyes y normas.

Vale la pena añadirlos, pero con menor prioridad. El uso de puntos de referencia entre los usuarios de lectores de pantalla ha disminuido, así que una estructura de encabezados limpia merece más el esfuerzo. Aun así, añadirlos cuesta poco.

El propio archivo de subtítulos es texto que un motor de búsqueda puede indexar, así que ayuda sin importar si un visitante abre o no una transcripción. Una transcripción visible añade todavía más texto indexable para quienes prefieren leer por encima.

En su mayoría, solo para estas siete. Buena parte del trabajo de accesibilidad (compatibilidad con teclado, orden del foco, preferencias de movimiento) es enormemente importante para los usuarios reales, sin que eso se traduzca en una métrica de visibilidad. La accesibilidad es el objetivo en sí misma, y la visibilidad es lo que viene después.