¿Qué es el escape HTML?
El escape HTML es el proceso de reemplazar caracteres que tienen un significado especial en HTML por sus referencias de entidad correspondientes. Los cinco caracteres que deben escaparse son: ampersand (&), menor que (<), mayor que (>), comilla doble (") y comilla simple ('). Sin escapar, el navegador interpreta estos caracteres como instrucciones de marcado en lugar de texto visible, lo que rompe el renderizado de la página y abre la puerta a ataques de inyección.
La especificación HTML (mantenida por WHATWG) define dos formas de referencias de carácter: entidades con nombre como & y entidades numéricas como & o &. Las entidades con nombre son más fáciles de leer en el código fuente. Las entidades numéricas (decimales o hexadecimales) pueden representar cualquier punto de código Unicode, lo que las hace útiles para caracteres que no tienen alias con nombre. Ambas formas producen salida idéntica en el navegador.
El desescapado (también llamado decodificación) es la operación inversa: convertir referencias de entidad de vuelta a sus caracteres literales. Es frecuente al extraer texto de fuentes HTML, migrar contenido entre sistemas o depurar plantillas que codifican entidades dos veces. Esta herramienta maneja ambas direcciones en el navegador, por lo que puedes verificar tu lógica de escape o recuperar texto plano de una fuente HTML en segundos.
¿Por qué usar una herramienta de escape HTML?
Reemplazar manualmente los signos de menor que y los ampersands en bloques grandes de texto es tedioso y propenso a errores. Una herramienta dedicada convierte tu entrada en un solo paso sin necesidad de instalación.
⚡
Conversión instantánea
Pega texto o HTML y obtén la salida escapada o desescapada de inmediato. Sin esperar una respuesta del servidor porque todo el procesamiento ocurre localmente en JavaScript.
🔒
Procesamiento con privacidad primero
Tu entrada nunca abandona el navegador. Nada se envía a un servidor ni se almacena en ningún lugar, por lo que puedes escapar con seguridad marcado que contenga credenciales, claves API o código interno.
📋
Sin cuenta ni configuración
Abre la página y empieza a pegar. No hay inicio de sesión, ni correo de verificación, ni software que instalar. Funciona en cualquier dispositivo con un navegador moderno.
🌐
Cobertura completa de entidades
Maneja los cinco caracteres especiales HTML obligatorios más entidades numéricas (decimales y hexadecimales). Soporta conversión de ida y vuelta: escapar y luego desescapar devuelve la cadena original.
Casos de uso del escape HTML
Desarrollador frontend: mostrar entrada del usuario
Al renderizar texto enviado por el usuario dentro de una página, escápalo primero para evitar que el navegador lo interprete como etiquetas HTML. Esta es la defensa principal contra XSS almacenado en cualquier plantilla que muestre cadenas sin procesar.
Ingeniero backend: generar respuestas HTML
El código del lado del servidor que concatena cadenas en HTML debe escapar los valores dinámicos antes de insertarlos. Usa esta herramienta para verificar que tu función de escape produce la salida correcta para casos límite como comillas anidadas.
DevOps: incrustar configuración en HTML
JSON en línea o comandos de shell dentro de una página HTML (por ejemplo, en una etiqueta script o en un atributo data) requieren escape. Verifica que los signos de menor que y los ampersands en tus fragmentos de configuración estén correctamente codificados.
Ingeniero de QA: probar vectores XSS
Pega cargas útiles XSS habituales en la herramienta para confirmar que la salida de tu aplicación coincide con la versión correctamente escapada. Compara la salida escapada carácter por carácter con lo que produce tu aplicación.
Escritor técnico: ejemplos de código en documentación
Publicar fragmentos de código en documentación basada en HTML (Jekyll, Hugo, CMS personalizados) requiere escapar los signos de menor que para la sintaxis de tipos genéricos y los marcadores de plantilla. Pega tu ejemplo de código y cada carácter especial se codifica al instante.
Estudiante: aprendiendo entidades HTML
Escribe o pega cualquier carácter y observa sus formas de entidad con nombre y numérica. Experimenta con casos límite como espacios sin separación, rayas em y símbolos Unicode para entender cómo funciona la codificación de caracteres en HTML.
Tabla de referencia de entidades HTML
La tabla a continuación lista las entidades HTML de uso frecuente. Los cinco caracteres especiales (& < > " ') siempre deben escaparse en el contenido HTML y en los valores de los atributos. Las demás entidades son opcionales pero útiles para caracteres difíciles de escribir o ambiguos en el código fuente.
| Carácter | Descripción | Entidad con nombre | Entidad numérica |
|---|---|---|---|
| & | Ampersand | & | & |
| < | Less-than sign | < | < |
| > | Greater-than sign | > | > |
| " | Double quote | " | " |
| ' | Single quote / apostrophe | ' | ' |
| Non-breaking space | |   | |
| © | Copyright sign | © | © |
| ® | Registered sign | ® | ® |
| — | Em dash | — | — |
| ’ | Right single quote | ’ | ’ |
| € | Euro sign | € | € |
Escapar vs. desescapar: cuándo usar cada operación
Las dos operaciones son inversas. Elegir la dirección equivocada produce salida doblemente codificada o sin protección.
Escapar (codificar)
Úsalo al insertar texto no confiable o dinámico en HTML. Convierte el literal < en < para que el navegador muestre el carácter en lugar de iniciar una etiqueta. Aplícalo antes de renderizar entrada del usuario, entradas de registro o cualquier cadena que pueda contener marcado.
Desescapar (decodificar)
Úsalo al extraer texto plano de una fuente HTML. Convierte < de vuelta a <. Aplícalo al migrar contenido desde un CMS, analizar HTML extraído o corregir cadenas doblemente codificadas como &amp; que muestran nombres de entidad en lugar de caracteres.
Ejemplos de código
A continuación se muestran ejemplos funcionales de escape y desescapado HTML en cuatro lenguajes. Cada fragmento cubre ambas direcciones y maneja casos límite como comillas anidadas y entidades numéricas.
JavaScript (browser / Node.js)
// Escape HTML entities manually
function escapeHtml(str) {
return str
.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''')
}
escapeHtml('<img src="x" onerror="alert(1)">')
// → "<img src="x" onerror="alert(1)">"
// Unescape using DOMParser (browser only)
function unescapeHtml(str) {
const doc = new DOMParser().parseFromString(str, 'text/html')
return doc.documentElement.textContent
}
unescapeHtml('<div>Hello</div>')
// → "<div>Hello</div>"Python
import html
# Escape special characters
html.escape('<script>alert("XSS")</script>')
# → '<script>alert("XSS")</script>'
# Escape including single quotes (quote=True is default in Python 3.8+)
html.escape("It's <b>bold</b>", quote=True)
# → 'It's <b>bold</b>'
# Unescape entities back to characters
html.unescape('<p>Price: €10</p>')
# → '<p>Price: €10</p>'
# Unescape numeric entities
html.unescape('<div>&amp;</div>')
# → '<div>&</div>'Go
package main
import (
"fmt"
"html"
)
func main() {
// Escape HTML special characters
escaped := html.EscapeString(`<a href="page?id=1&sort=name">Link</a>`)
fmt.Println(escaped)
// → <a href="page?id=1&sort=name">Link</a>
// Unescape back to original
original := html.UnescapeString("<b>Go & HTML</b>")
fmt.Println(original)
// → <b>Go & HTML</b>
}PHP
<?php
// Escape HTML entities (ENT_QUOTES escapes both " and ')
echo htmlspecialchars('<p class="info">Tom & Jerry's</p>', ENT_QUOTES, 'UTF-8');
// → <p class="info">Tom & Jerry's</p>
// Convert all applicable characters to HTML entities
echo htmlentities('Price: 10€ — 50% off', ENT_QUOTES, 'UTF-8');
// → Price: 10€ — 50% off
// Decode entities back
echo html_entity_decode('<div>&copy; 2026</div>');
// → <div>© 2026</div>Preguntas frecuentes
¿Cuál es la diferencia entre el escape HTML y la codificación de URL?
El escape HTML reemplaza los caracteres especiales en HTML (< > & " ') con referencias de entidad como < para que se muestren como texto. La codificación de URL (percent-encoding) reemplaza los caracteres no seguros en URLs con secuencias hexadecimales %XX. Protegen contextos distintos: el escape HTML previene la inyección de marcado, mientras que la codificación de URL garantiza cadenas de consulta y segmentos de ruta válidos.
¿Qué caracteres deben escaparse en HTML?
Los cinco caracteres que siempre deben escaparse son: & (ampersand), < (menor que), > (mayor que), " (comilla doble en atributos) y ' (comilla simple en atributos). No escapar cualquiera de estos puede romper el renderizado o crear una vulnerabilidad de cross-site scripting.
¿Es válido ' en HTML5?
Sí. La entidad con nombre ' está definida en la especificación HTML5 y es compatible con todos los navegadores modernos. No formaba parte de HTML 4, que solo reconocía &, <, > y ". Si necesitas soportar analizadores HTML 4 muy antiguos, usa la forma numérica ' en su lugar.
¿Cómo corrijo entidades HTML doblemente codificadas como &amp;?
La doble codificación ocurre cuando una cadena ya escapada pasa por la función de escape una segunda vez. La solución es desescapar hasta que la salida se estabilice. Pega la cadena doblemente codificada en esta herramienta en modo desescapar, y vuelve a ejecutarla si quedan referencias &. Para prevenir la doble codificación, comprueba si la entrada ya está escapada antes de aplicar la función de escape.
¿Puedo usar entidades HTML dentro de cadenas JavaScript?
Las entidades HTML las interpreta el analizador HTML, no el motor de JavaScript. Dentro de un bloque script, el código se ejecuta después de que el analizador HTML procesa la página, por lo que < en un bloque script se convierte en < antes de que JavaScript lo vea. Para manejadores de eventos en línea (onclick, etc.), el valor del atributo se decodifica como HTML primero y luego se ejecuta como JavaScript. En archivos .js externos, las entidades no tienen ningún significado especial y se tratan como texto literal.
¿Cuál es la diferencia entre htmlspecialchars y htmlentities en PHP?
htmlspecialchars() escapa solo los cinco caracteres especiales (& < > " ') que afectan la estructura HTML. htmlentities() escapa esos cinco más cualquier carácter que tenga una entidad HTML con nombre, como el símbolo de copyright y las letras con tilde. Para fines de seguridad, htmlspecialchars() con ENT_QUOTES es suficiente. htmlentities() es útil cuando necesitas salida solo ASCII para sistemas que no pueden manejar UTF-8.
¿Es suficiente el escape HTML para prevenir XSS?
El escape HTML previene XSS en el caso más habitual: insertar texto no confiable en el contenido de elementos HTML o valores de atributos. No protege otros contextos de inyección. Insertar datos del usuario en un bloque script requiere escape de cadenas JavaScript. Insertar en un atributo style requiere escape CSS. Insertar en un atributo URL (href, src) requiere validación de URL más codificación. Una defensa completa contra XSS aplica escape específico al contexto en cada punto de inserción.