Skip to main content

Acerca de esta regla de accesibilidad

El elemento <blink> se usaba anteriormente para llamar la atención sobre el contenido haciéndolo parpadear repetidamente. Aunque podía parecer un efecto llamativo, crea serias barreras de accesibilidad para múltiples grupos de usuarios. El elemento ha sido marcado como obsoleto en la especificación HTML, y aunque la mayoría de navegadores modernos ya no renderizan el efecto de parpadeo, el elemento debe eliminarse de tu código para asegurar el cumplimiento y evitar problemas en cualquier entorno que aún lo soporte.

Por qué esto es un problema de accesibilidad

El contenido parpadeante afecta a varios grupos de usuarios:

  • Usuarios con discapacidades cognitivas pueden encontrar el texto parpadeante distractor o incomprensible. El parpadeo constante puede hacer que sea muy difícil concentrarse y entender el contenido.
  • Usuarios con baja visión tienen dificultades para leer texto que aparece y desaparece rápidamente. La visibilidad intermitente hace que el contenido sea efectivamente ilegible.
  • Usuarios con discapacidades motoras pueden tener dificultades para hacer clic en enlaces o botones parpadeantes, ya que el objetivo no es consistentemente visible y requiere una sincronización precisa para activarse.
  • Usuarios con condiciones fotosensibles pueden experimentar incomodidad o, en casos extremos, convulsiones por contenido parpadeante, dependiendo de la frecuencia.

Esta regla se relaciona con el Criterio de Conformidad 2.2.2 de WCAG 2.2: Pausar, Detener, Ocultar (Nivel A), que requiere que para cualquier contenido en movimiento, parpadeante o que se desplace que comience automáticamente y dure más de cinco segundos, los usuarios deben poder pausarlo, detenerlo u ocultarlo. Dado que el elemento <blink> no proporciona ningún mecanismo para que los usuarios controlen el parpadeo, falla este criterio directamente.

Esta regla también aplica a la Sección 508 §1194.22(j), que establece que las páginas deben diseñarse para evitar que la pantalla parpadee con una frecuencia mayor a 2 Hz y menor a 55 Hz.

Cómo solucionarlo

  1. Elimina todos los elementos <blink> de tu HTML. Reemplázalos con elementos estándar como <span>, <strong> o <em>.
  2. Elimina text-decoration: blink; de tu CSS, ya que este es el equivalente CSS del elemento <blink>.
  3. Usa técnicas alternativas de énfasis para hacer que el contenido destaque — texto en negrita, color, tamaño de fuente mayor, bordes, resaltados de fondo o iconos.

Importante: Muchos navegadores modernos ignoran silenciosamente el elemento <blink>, por lo que el texto no parpadeará visualmente aunque el elemento esté presente en el código fuente. No te bases en cómo se ve la página en el navegador para determinar si existen etiquetas <blink>. Siempre revisa el código HTML real.

Ejemplos

Incorrecto: usar el elemento <blink>

<p><blink>Moving Sale Thursday!</blink></p>

Esto hace que el texto parpadee (en navegadores que lo soporten), haciéndolo inaccesible.

Incorrecto: usar text-decoration: blink en CSS

<style>
  .attention {
    text-decoration: blink;
  }
</style>
<h2 class="attention">Limited Time Offer!</h2>

El valor CSS text-decoration: blink logra el mismo efecto inaccesible que el elemento <blink>.

Correcto: usar énfasis visual estático

<p><strong>Moving Sale Thursday!</strong></p>

Usar <strong> hace que el texto esté en negrita y transmite énfasis a los lectores de pantalla sin ningún parpadeo.

Correcto: usar CSS para énfasis visual sin parpadeo

<style>
  .highlight {
    background-color: #fff3cd;
    border-left: 4px solid #ffc107;
    padding: 8px 12px;
    font-weight: bold;
  }
</style>
<p class="highlight">Limited Time Offer!</p>

Esto llama la atención sobre el contenido usando color, un borde y texto en negrita — todo sin parpadeo, manteniendo el contenido legible y accesible para todos.

Ayúdanos a mejorar nuestras guías

¿Te ha sido útil esta guía?

Detecta problemas de accesibilidad automáticamente

Rocket Validator escanea miles de páginas con Axe Core y el W3C Validator, encontrando problemas de accesibilidad en todo tu sitio web.

¿Listo para validar tus sitios?
Inicia tu prueba gratuita hoy.