El texto no está en la forma de normalización Unicode C.

Unicode permite que algunos caracteres se representen de múltiples formas. Por ejemplo, la letra acentuada “é” se puede almacenar como un solo carácter precompuesto (U+00E9) o como dos puntos de código separados: la letra base “e” (U+0065) seguida de un acento agudo combinado (U+0301). Aunque se ven idénticos cuando se renderizan, son fundamentalmente diferentes a nivel de bytes. La forma de normalización Unicode C (NFC) es la forma canónica que prefiere la representación precompuesta única siempre que exista una.

La especificación HTML y el modelo de caracteres W3C para la World Wide Web requieren que todo el texto en documentos HTML esté en NFC. Esto es importante por varias razones:

• Coincidencia de cadenas y búsqueda: El texto no-NFC puede causar fallos cuando los navegadores o scripts tratan de hacer coincidir cadenas, comparar valores de atributos o procesar selectores CSS. Dos cadenas visualmente idénticas en diferentes formas de normalización no coincidirán con una comparación simple de bytes.
• Accesibilidad: Los lectores de pantalla y las tecnologías de asistencia pueden comportarse de manera inconsistente al encontrar secuencias de caracteres descompuestos.
• Interoperabilidad: Diferentes navegadores, motores de búsqueda y herramientas pueden manejar el texto no-NFC de manera diferente, llevando a un comportamiento impredecible.
• Identificadores de fragmento e IDs: Si un atributo id contiene caracteres no-NFC, los enlaces de fragmento (#id) pueden fallar al funcionar correctamente.

Este problema aparece más comúnmente cuando se copia texto de procesadores de texto, PDFs u otras aplicaciones que usan formas Unicode descompuestas (NFD), o cuando el contenido es generado por software que no normaliza su salida.

Cómo solucionarlo

1. Identifica el texto afectado: El validador señalará la línea específica que contiene caracteres no-NFC. Los caracteres a menudo se verán normales visualmente, así que necesitarás inspeccionarlos a nivel de punto de código.
2. Convierte a NFC: Usa un editor de texto o herramienta de línea de comandos que soporte normalización Unicode. Muchos lenguajes de programación proporcionan funciones de normalización integradas.
3. Prevén problemas futuros: Configura tu editor de texto o pipeline de construcción para guardar archivos en NFC. Cuando aceptes entrada del usuario, normalízala del lado del servidor antes de almacenarla o incrustarla en HTML.

En Python, puedes normalizar una cadena:

import unicodedata
normalized = unicodedata.normalize('NFC', original_string)

En JavaScript (Node.js o navegador):

const normalized = originalString.normalize('NFC');

En la línea de comandos (usando uconv de ICU):

uconv -x NFC input.html > output.html

Ejemplos

Incorrecto (forma descompuesta — NFD)

En este ejemplo, la letra “é” se representa como dos puntos de código (e + acento agudo combinado), lo que activa la advertencia de validación. El código fuente puede verse idéntico a la versión correcta, pero los bytes subyacentes difieren:

<!-- "é" aquí se almacena como U+0065 U+0301 (descompuesto) -->

<p>Résumé available upon request.</p>

Correcto (forma precompuesta — NFC)

Aquí, el mismo texto usa el carácter precompuesto único é (U+00E9):

<!-- "é" aquí se almacena como U+00E9 (precompuesto) -->

<p>Résumé available upon request.</p>

Incorrecto en atributos

El texto no-NFC en valores de atributos también desencadena este problema:

<!-- El id contiene un carácter descompuesto -->

<h2 id="resumé">Résumé</h2>

Correcto en atributos

<!-- El id usa el carácter NFC precompuesto -->

<h2 id="resumé">Résumé</h2>

Aunque estos ejemplos se ven igual en el texto renderizado, la diferencia está en cómo se codifican los caracteres. Para verificar que tu texto está en NFC, puedes pegarlo en una herramienta de inspección Unicode o usar las funciones de normalización mencionadas arriba. Para lectura adicional, el W3C proporciona una excelente guía sobre normalización en HTML y CSS.

Más información:

W3C Reference

Normalization in HTML and CSS

→