Codificador y decodificador de entidades HTML

¿Qué son las entidades HTML?

Una entidad HTML es la forma de escribir un carácter que, si apareciera tal cual dentro del código de una página, el navegador confundiría con parte del propio marcado. El ampersand y el signo de menor que son los dos casos que de verdad importan: si escribes «5 menor que 10» dentro del texto de una página sin más cuidado, el navegador lee ese signo como el inicio de una etiqueta y el resto de la frase desaparece. Escrito como entidad, el navegador lo muestra como el símbolo que querías, sin interpretarlo como código.

Por eso hace falta codificar en tres situaciones muy concretas: cuando el texto viene de un usuario — un comentario, un campo de formulario — y se va a insertar dentro de una página; cuando se muestran ejemplos de código HTML dentro de otra página, para que el navegador los enseñe en vez de ejecutarlos; y al pegar contenido en un gestor de contenidos que a veces «corrige» comillas y ampersands por su cuenta y acaba rompiendo el símbolo original.

Decodificar es el camino inverso: partir de esas referencias y recuperar el carácter que representan, algo necesario cuando el texto llega ya escapado desde una fuente externa — un feed, una exportación, una API — y hay que leerlo o reutilizarlo tal cual era antes de escaparse.

Cómo se usa

1. Elige la dirección. Selecciona Codificar para proteger un texto o Decodificar para recuperar el original a partir de sus referencias.
2. Pega el texto y, si codificas, elige el destino. Indica si el resultado va a texto de un elemento, a un valor de atributo o si prefieres la opción segura que sirve para ambos casos.
3. Copia el resultado. El panel de la derecha se actualiza mientras escribes, y un contador indica cuántos caracteres o referencias se procesaron.

Por qué codificar y decodificar no son lo mismo al revés

Codificar y decodificar no son la misma operación en sentido contrario, y tratarlas como una sola es donde suelen fallar estas herramientas. Codificar tiene una respuesta pequeña y exacta: en HTML solo cinco caracteres necesitan escaparse alguna vez — el ampersand, los dos signos de mayor y menor que, y los dos tipos de comillas. Cuáles hacen falta de verdad depende de dónde va a acabar el texto: en el texto de un elemento basta con el ampersand y el signo de menor que; dentro de un atributo entre comillas basta con el ampersand y esas comillas. Escapar los cinco es el superconjunto seguro, y es la opción por defecto de esta herramienta, porque una cadena pensada para el texto de un elemento acaba con frecuencia, más adelante, dentro de un atributo.

Ahí hay una trampa real, y la descubrieron las propias pruebas de esta herramienta. Escapar pensando solo en un valor de atributo deja intactos los signos de mayor y menor que, porque dentro de unas comillas son legales. Pero eso significa que el resultado sigue conteniendo una etiqueta viva: codifica en modo atributo una etiqueta de negrita que envuelve la palabra «hola» y la salida conserva esa etiqueta tal cual; pásala después a cualquier cosa que interprete HTML y vuelve solo «hola», con el marcado devorado en silencio. Correcto para su propósito declarado, peligroso en cualquier otro sitio — por eso la opción segura por defecto escapa los cinco caracteres.

Un último detalle del codificado, más técnico pero real: el escapado recorre caracteres completos, no las unidades de dos partes en las que JavaScript guarda algunos de ellos internamente. Por eso un emoji se convierte en una única referencia numérica y no en dos mitades sueltas que ningún analizador HTML sabría recomponer después.

Por qué decodificar usa el navegador y no una tabla propia

Decodificar tiene una respuesta mucho más grande, y el navegador ya la tiene guardada. El estándar de HTML define 2231 referencias de carácter con nombre. Enviar esa tabla entera a cada visitante significaría volver a descargarla cada vez que cambia, así que esta herramienta delega en el propio analizador de HTML del navegador: la misma pieza que decide, en cualquier página real, qué carácter mostrar — sin añadir un solo byte de descarga.

Esa decisión trae tres comportamientos que un decodificador escrito a mano suele hacer mal, y los tres están en la especificación, no son casualidades del navegador. Las referencias numéricas entre 80 y 9F en hexadecimal se reasignan: la referencia 128 en decimal no produce el carácter de ese punto de código sino el signo del euro, porque esos números fueron en su día bytes de Windows-1252; un decodificador ingenuo devuelve ahí un carácter de control invisible y no avisa de nada. Además, una lista fija de nombres heredados funciona sin el punto y coma final por compatibilidad, mientras que el resto de nombres sí lo necesita — por eso la referencia corta del ampersand se decodifica aunque no esté terminada, y por eso el propio ejemplo del estándar, «not» seguido de «it» y punto y coma, se decodifica como un signo de negación seguido de las letras i, t y el punto y coma, y no como algo que contenga la palabra «not». Y un nombre que el estándar no reconoce se deja exactamente como está escrito, en vez de intentar adivinarlo.

Decodificar es, además, la dirección peligrosa, y esta página lo dice sin rodeos: el escapado existía precisamente para impedir que una etiqueta se comportara como una etiqueta, y decodificar deshace esa protección. Por eso el resultado se muestra siempre como texto — nunca se renderiza — y por eso aparece un aviso en cuanto el texto decodificado contiene algo que parece una etiqueta.

¿Por qué es gratis?

Esta herramienta corre por completo en tu navegador: no se sube ningún archivo ni ningún texto a un servidor, así que no hay coste que trasladarte y no hace falta crear cuenta ni registrarse para usarla.

Tampoco añade marca de agua ni firma alguna al resultado — lo que copias es exactamente lo que ves en el panel derecho, carácter por carácter. Por eso puede ofrecerse gratis: no cambia el negocio, cambia dónde ocurre el trabajo.