Codificar y decodificar entidades HTML

Cómo funciona

Pegue el texto en el panel izquierdo; el resultado aparece a la derecha mientras escribe. Al codificar se reescriben los caracteres que dan problemas dentro de una fuente HTML: «Café & Té» pasa a «Café & Té» en la fuente y en la página se sigue viendo el signo &. El alcance decide hasta dónde llegar — los cinco imprescindibles solo tocan los signos que rompen la estructura y dejan el texto legible, el alcance «fuera de ASCII» convierte desde las tildes hasta los símbolos y es la opción segura cuando no controla la codificación de la página de destino, y el alcance del español apunta a los caracteres que llegan como signos de interrogación cuando una codificación se pierde: á, é, ñ, ü y los signos ¡ ¿. Al codificar solo se usan los nombres que existen desde HTML 4; el resto se escribe en forma numérica — la salida tiene que verse bien hasta en un cliente de correo antiguo, y esos clientes no conocen los nombres que llegaron con HTML5. Por eso la comilla simple se escribe ' y nunca '. Las letras del español tienen todas un nombre antiguo (á ñ ¿), así que la salida queda además legible. Al decodificar se hace el camino inverso y se reconocen las tres escrituras: con nombre (& ñ  ), decimal (é) y hexadecimal (é); en los nombres se resuelve el juego completo definido por HTML5. Una entidad no reconocida nunca se borra: se queda tal cual y la línea de resultado la cuenta, de modo que no pierde datos y sabe qué parte revisar a mano. Esta herramienta no toca las etiquetas; para quitar las etiquetas y quedarse con el texto, use la herramienta Convertir HTML a texto plano. Copie la salida con un clic o descárguela como archivo de texto.

Esta herramienta también se busca como codificar entidades html, decodificar entidades html, caracteres especiales html, html escape.

¿Qué es Entidad HTML?

Una entidad HTML es la escritura indirecta de un carácter dentro de la fuente: empieza con el signo &, termina con punto y coma y lleva en medio un nombre (ñ) o un número (ñ). Existen por dos razones. La primera es la obligación: el signo menor abre una etiqueta en la fuente, así que para mostrarlo como texto hay que escribir <. La segunda es la comodidad: un carácter que falta en el teclado o que viaja mal en una codificación desconocida (€, —, ½) va seguro en esta forma. La entidad vive solo en la fuente; al dibujar la página, el navegador la vuelve a convertir en un carácter corriente.

¿Qué es   (espacio de no separación)?

El nombre viene del inglés non-breaking space, y dos propiedades lo distinguen del espacio corriente. No separa: escrito '5 kg' con  , la cifra nunca queda al final de una línea con la unidad en la siguiente — por eso se pone entre número y unidad, entre nombre y tratamiento y en fechas que deben ir juntas. Y no se comprime: el HTML reduce una fila de espacios corrientes a uno solo, mientras que cada   se conserva, razón por la que las páginas antiguas armaban sus sangrías con él. Como carácter ocupa la posición 160 de Unicode y pegado en un texto es invisible — causa frecuente y desconcertante de problemas de alineación.

¿Qué es Escape (escaping)?

Escapar es reescribir un carácter que tiene un significado especial en su contexto de modo que el sistema lo lea como dato y no como sintaxis. Cada contexto tiene su regla: en HTML el signo menor pasa a <, en una dirección el espacio pasa a %20, en SQL la comilla simple se duplica. El fondo es el mismo en todos — sin escape, el sistema cree que el texto terminó y toma lo que sigue como parte de la estructura. En HTML las consecuencias van desde una página descuadrada hasta que el texto llegado de un visitante se convierta en una etiqueta activa; por eso todo texto externo se escapa antes de colocarse en una página.

¿En qué se diferencian escapar HTML, quitar etiquetas y codificar una URL?

Las tres transforman texto, pero cada una aplica las reglas de un contexto distinto y ninguna sustituye a otra. El escape de esta página trabaja a nivel de carácter: las palabras quedan idénticas y solo se reescriben los signos con significado especial en la fuente HTML, para que el texto se muestre como texto y no como marcado. La herramienta Convertir HTML a texto plano va en sentido contrario y trabaja a nivel de estructura: descarta etiquetas, scripts y estilos y deja solo el contenido legible — la entrada es HTML y la salida texto puro. La herramienta Codificar y decodificar URL pertenece a otro contexto: reescribe los caracteres que una dirección no puede llevar usando un signo de porcentaje y dos dígitos hexadecimales, de modo que el espacio pasa a %20. Un escape HTML no hace válida una dirección, y la codificación porcentual no hace que un texto pueda insertarse en una página. La regla corta: insertar texto en una página — esta página; sacar el texto de una página — quitar etiquetas; armar una dirección — codificación porcentual.

¿Qué alcance conviene elegir?

El alcance solo actúa al codificar; al decodificar se reconocen todas las entidades sea cual sea el ajuste. Decida según a dónde va la salida:

• Insertar texto de un usuario en una página HTML → los cinco imprescindibles (la estructura queda protegida y el texto legible)
• Una plantilla de correo antigua o un campo de CMS cuya codificación no puede comprobar → todos los caracteres fuera de ASCII
• Una página moderna en UTF-8 que usted controla → con los cinco imprescindibles basta; codificar las tildes solo engorda el archivo
• Solo la ñ y las tildes salen como signos de interrogación en un campo concreto → solo caracteres del español
• Si escribe XML y no HTML: allí solo hay cinco entidades con nombre definidas, ñ no se resolverá — quédese con la escritura numérica

¿Con nombre o numérica?

Cada carácter tiene dos escrituras de entidad: con nombre (ñ) y numérica (ñ o ñ). La numérica existe para cualquier carácter y se resuelve en todas partes; la de nombre es legible, pero solo existe para los caracteres de la lista — y qué estándar define esa lista importa.

Al codificar, esta herramienta usa un nombre solo si existe desde HTML 4, y escribe lo demás en forma numérica. Para el español la cuenta sale redonda: á, é, í, ó, ú, ü y ñ tienen nombre desde siempre (á é í ó ú ü ñ), igual que los signos de apertura ¡ y ¿ (¡ ¿). Un texto en español codificado se ve bien hasta en clientes de correo de otra época. La comilla simple es la excepción deliberada: ' no existe en HTML 4 y en clientes viejos aparece escrita con todas sus letras, así que se escribe '.

Al decodificar el alcance es a propósito mayor: también se reconocen los nombres que llegaron con HTML5, porque el texto que le ponen delante no lo elige usted. Las referencias decimales y hexadecimales se resuelven igualmente.

La trampa del texto pegado desde Word: “

El HTML que sale de programas de escritorio antiguos y de algunos gestores de contenido trae entidades numéricas entre 128 y 159: “, —, ’. En Unicode ese rango está reservado a caracteres de control invisibles; resuelto al pie de la letra no muestra nada en pantalla, o muestra rombos negros.

Lo que se quería decir son los signos tipográficos del juego Windows-1252: “ es una comilla doble de apertura, ” una de cierre, — una raya y ’ un apóstrofo curvo. Los navegadores aplican esa correspondencia en silencio; esta herramienta también. Al decodificar un texto sacado de un archivo viejo, sus comillas y rayas vuelven como signos de verdad en lugar de desaparecer.

Doble codificación: escapar dos veces el mismo texto

El error clásico del escape es codificar dos veces la misma cadena. El signo & se convierte en & en la primera pasada; en la segunda, el & de esa entidad también se codifica y sale &. La página muestra entonces las letras & en vez del signo.

Suele ocurrir en este orden: el valor de un formulario se escapa al guardarse y después el motor de plantillas escapa la salida por segunda vez. El síntoma se reconoce enseguida — los visitantes ven   o é impresos en el texto. La comprobación es sencilla: decodifique el texto aquí una vez; si en la salida siguen quedando entidades, el texto estaba codificado dos veces y el segundo escape de su cadena tiene que desaparecer.

Preguntas frecuentes

¿Qué es   y en qué se diferencia de un espacio normal?

  es el espacio de no separación: mide lo mismo que un espacio normal, pero el navegador no corta la línea en ese punto y varios seguidos no se funden en uno. Se usa entre una cifra y su unidad (15 kg), en fechas y nombres que deben quedar juntos y donde hacen falta varios espacios visibles.

¿Tengo que codificar la ñ y las tildes?

En una página UTF-8 no: á, é, ñ se escriben directamente y el archivo queda más pequeño. Codificarlas ayuda donde usted no controla el juego de caracteres: plantillas de correo antiguas, paneles de administración con codificación fija y campos de exportación que solo aceptan ASCII.

¿Esta herramienta quita las etiquetas HTML?

No. El escape trabaja a nivel de carácter: al codificar, los signos < y > de las etiquetas también se escapan y la etiqueta pasa a ser texto visible; al decodificar, las etiquetas quedan tal cual. Para quitar el marcado y quedarse solo con el texto, use la herramienta Convertir HTML a texto plano.

¿Qué pasa con una entidad que no se reconoce?

Se deja tal cual y se cuenta en la línea de resultado. Es a propósito: borrar una secuencia desconocida sería quitar en silencio un trozo de su texto, y sustituirla sería inventar un carácter que puede ser el equivocado.

¿El texto que pego se envía a algún servidor?

No. La codificación y la decodificación corren por completo dentro de su navegador; correspondencia con clientes, notas de pedido o una página sin publicar, nada sale de esta página ni se guarda en ninguna parte.