Skip to main content
Validación HTML

El valor del atributo X en el elemento Y del namespace “http://www.w3.org/1999/xhtml” no está en la forma de normalización Unicode C.

Acerca de este problema HTML

Unicode permite que ciertos caracteres — especialmente letras acentuadas y otros caracteres compuestos — se representen de múltiples maneras. Por ejemplo, la letra “é” puede ser un solo carácter precompuesto (U+00E9, forma NFC) o una letra base “e” (U+0065) seguida de un acento agudo combinatorio (U+0301, forma NFD). Aunque puedan verse idénticos en pantalla, son secuencias de bytes diferentes. La especificación HTML requiere que todos los valores de atributo usen NFC para asegurar un comportamiento consistente entre navegadores, motores de búsqueda y tecnologías de asistencia.

Esto es importante por varias razones cruciales:

  • Coincidencia y comparación de cadenas: Los navegadores y scripts pueden comparar valores de atributo byte a byte. Un valor de id en forma NFD no coincidirá con un selector CSS o identificador de fragmento que apunte a la forma NFC, causando enlaces rotos y estilos rotos.
  • Accesibilidad: Los lectores de pantalla y otras tecnologías de asistencia pueden procesar las cadenas NFC y NFD de forma diferente, potencialmente pronunciando mal el texto o fallando al coincidir referencias ARIA.
  • Interoperabilidad: Diferentes sistemas operativos producen formas de normalización diferentes por defecto (los sistemas de archivos macOS históricamente usan NFD, por ejemplo). Copiar texto de varias fuentes puede introducir caracteres no-NFC sin ninguna indicación visual.
  • Cumplimiento de estándares: La especificación HTML de WHATWG y la guía de W3C sobre normalización recomiendan explícitamente NFC para todo el contenido HTML.

El problema aparece más comúnmente cuando los valores de atributo contienen caracteres acentuados (como en los atributos id, class, alt, title, o value) que fueron copiados de una fuente que usa normalización NFD, o cuando los archivos se crean en sistemas que usan NFD por defecto.

Para solucionar el problema, necesitas convertir los valores de atributo afectados a NFC. Puedes hacer esto:

  1. Volviendo a escribir los caracteres directamente en tu editor, que normalmente produce NFC por defecto.
  2. Usando una herramienta de programación como unicodedata.normalize('NFC', text) de Python, text.normalize('NFC') de JavaScript, o utilidades similares en tu lenguaje de preferencia.
  3. Usando un editor de texto que soporte conversión de normalización (algunos editores tienen funciones de normalización Unicode integradas o plugins).
  4. Ejecutando una conversión en lote en tus archivos HTML antes del despliegue como parte de tu proceso de build.

Ejemplos

Incorrecto: El valor del atributo usa NFD (forma descompuesta)

En este ejemplo, el valor del atributo id para “résumé” usa caracteres descompuestos (letra base + acento combinatorio), lo que desencadena el error de validación. La descomposición es invisible en el código fuente pero está presente a nivel de byte.

<!-- La "é" aquí está almacenada como "e" + acento agudo combinatorio (NFD) -->

<div id="résumé">
  <p>Mi contenido de résumé</p>
</div>

Correcto: El valor del atributo usa NFC (forma precompuesta)

Aquí, el valor del atributo id usa caracteres precompuestos, que es la forma NFC correcta.

<!-- La "é" aquí está almacenada como un solo carácter precompuesto (NFC) -->

<div id="résumé">
  <p>Mi contenido de résumé</p>
</div>

Aunque estos dos ejemplos se ven idénticos en la vista de código fuente, difieren a nivel de byte. Puedes verificar la forma de normalización usando las herramientas de desarrollador del navegador o un editor hexadecimal.

Verificar y corregir con JavaScript

Puedes normalizar valores de atributo programáticamente:

<script>
  // Verificar si una cadena está en NFC
  const text = "résumé";
  const nfcText = text.normalize("NFC");
  console.log(text === nfcText); // false si el original era NFD
</script>

Verificar y corregir con Python

import unicodedata

text = "r\u0065\u0301sume\u0301"  # forma NFD
normalized = unicodedata.normalize('NFC', text)
print(normalized)  # Produce la forma NFC: "résumé"

Si encuentras este error de validación, inspecciona cuidadosamente el valor del atributo marcado y asegúrate de que todos los caracteres estén en su forma NFC precompuesta. Agregar un paso de normalización a tu pipeline de build es una manera confiable de prevenir que este problema se repita.

Encuentra problemas como este automáticamente

Rocket Validator escanea miles de páginas en segundos, detectando problemas de HTML en todo tu sitio web.

Ayúdanos a mejorar nuestras guías

¿Te ha sido útil esta guía?

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