Codificador/Decodificador de Entidades HTML
Herramienta gratuita para codificar y decodificar entidades HTML online. Convierta caracteres especiales a entidades HTML (<, >, &). Previene ataques XSS.
Codificador/Decodificador de Entidades HTML - Convertir Caracteres Especiales HTML
Una herramienta online completa de codificación y decodificación de entidades HTML para convertir caracteres especiales a entidades HTML y viceversa. Soporta entidades con nombre (&, <, >), entidades numéricas (&, <) y entidades hexadecimales (&, <). Esencial para desarrolladores web para prevenir ataques XSS, mostrar código HTML de forma segura y manejar caracteres especiales en aplicaciones web.
¿Qué son las entidades HTML?
Las entidades HTML son códigos especiales usados para mostrar caracteres reservados o especiales en HTML. Comienzan con & y terminan con ; para distinguirlos del texto regular.
Por qué existen las entidades HTML:
- Algunos caracteres tienen significado especial en HTML (<, >, &, ")
- Estos caracteres serían interpretados como código HTML, no mostrados como texto
- Las entidades permiten mostrar estos caracteres de forma segura
- Permiten mostrar caracteres no disponibles en teclados
- Soportan caracteres internacionales y símbolos
Tres tipos de entidades HTML:
1. Entidades con Nombre (más comunes):
< → <
> → >
& → &
" → "
' o ' → '
→ espacio sin salto
© → ©
® → ®
2. Entidades Numéricas (decimal):
< → <
> → >
& → &
© → ©
3. Entidades Hexadecimales:
< → <
> → >
& → &
© → ©
Los tres formatos funcionan igual - le dicen al navegador que muestre el carácter, no que lo interprete como código.
¿Cómo codifico texto a entidades HTML?
Codificar texto a entidades HTML es simple:
1. Seleccione el modo 'Codificar' (predeterminado)
2. Ingrese o pegue su texto en el campo de entrada
3. Elija su tipo de codificación:
- Con Nombre: Usa nombres legibles como < y & (recomendado)
- Numérico: Usa códigos decimales como < y &
- Hexadecimal: Usa códigos hex como < y &
4. Opcionalmente marque 'Codificar todos los caracteres especiales'
5. Haga clic en el botón 'Codificar'
6. Su texto codificado en entidades HTML aparece en la salida
Ejemplo 1 - Codificación básica (entidades con nombre):
Entrada: "<div>Hola & adiós</div>"
Salida: "<div>Hola & adiós</div>"
Ejemplo 2 - Entidades numéricas:
Entrada: "<p>Precio: $100 & más</p>"
Salida: "<p>Precio: $100 & más</p>"
Ejemplo 3 - Con opción 'codificar todo':
Entrada: "© 2024 Compañía™"
Salida (con nombre): "© 2024 Compañía™"
Salida (numérico): "© 2024 Compañía™"
El texto codificado puede mostrarse de forma segura en HTML sin ser interpretado como código.
¿Cómo decodifico entidades HTML?
Decodificar entidades HTML de vuelta a texto normal es sencillo:
1. Seleccione el modo 'Decodificar'
2. Pegue su HTML con entidades en el campo de entrada
3. Haga clic en el botón 'Decodificar'
4. El texto decodificado y legible aparece en la salida
Ejemplo 1 - Entidades con nombre:
Entrada: "<div>Hola & adiós</div>"
Salida: "<div>Hola & adiós</div>"
Ejemplo 2 - Entidades numéricas:
Entrada: "<p>Precio: $100 & más</p>"
Salida: "<p>Precio: $100 & más</p>"
Ejemplo 3 - Entidades hexadecimales:
Entrada: "<span>Test</span>"
Salida: "<span>Test</span>"
Ejemplo 4 - Entidades mixtas:
Entrada: "© 2024 – Todos los derechos reservados ™"
Salida: "© 2024 – Todos los derechos reservados ™"
La herramienta automáticamente:
- Reconoce los tres tipos de entidades (con nombre, numérico, hex)
- Las decodifica correctamente a caracteres originales
- Maneja formatos de entidades anidadas o mixtas
- Cuenta cuántas entidades se encontraron
- Preserva texto sin entidades sin cambios
¿Cuándo debo usar entidades HTML?
Las entidades HTML son esenciales en varias situaciones:
1. Mostrar Código HTML:
- Sitios web de tutoriales mostrando ejemplos HTML
- Documentación de código
- Resaltadores de sintaxis
- Posts de blog sobre desarrollo web
Ejemplo: Mostrar "<div>" como <div> para que aparezca como texto
2. Prevenir Ataques XSS:
- Contenido generado por usuario (comentarios, posts)
- Envíos de formularios mostrados en páginas
- Sanitizar entrada de usuario
- Contenido de base de datos mostrado en HTML
Ejemplo: Convertir <script> a <script> para prevenir ejecución
3. Mostrar Caracteres Especiales:
- Símbolos de copyright: ©
- Marca registrada: ™
- Registrado: ®
- Moneda: € £ ¥
- Símbolos matemáticos: × ÷ ±
4. Comillas en Atributos HTML:
- <div title="Él dijo "Hola"">...</div>
- Previene romper el atributo HTML
- Esencial para atributos de datos con comillas
5. Espacios Sin Salto:
- previene saltos de línea
- Útil para formateo
- Mantener palabras juntas
Mejores prácticas:
- Siempre codifique entrada de usuario antes de mostrar en HTML
- Use entidades con nombre para legibilidad (© vs ©)
- Use charset UTF-8 y evite entidades para caracteres internacionales
- Codifique <>&"' como mínimo para prevención XSS
¿Cuál es la diferencia entre entidades con nombre, numéricas y hexadecimales?
Las entidades HTML vienen en tres formatos, todos produciendo el mismo resultado:
1. Entidades con Nombre:
Formato: &nombre;
Ejemplo: < > & ©
Ventajas:
- Legibles para humanos y memorables
- Auto-documentadas (© claramente significa copyright)
- Más fácil de escribir y reconocer
- Nombres estándar en todos los navegadores
Desventajas:
- Conjunto limitado (solo ~250 entidades con nombre)
- No todos los caracteres tienen nombres
- Más largo que numérico para algunos caracteres
Usar para: Caracteres comunes con nombres conocidos
2. Entidades Numéricas (Decimal):
Formato: &#número;
Ejemplo: < > & ©  
Ventajas:
- Funciona para CUALQUIER carácter Unicode (0-1,114,111)
- No necesita memorización (solo usar código de carácter)
- Soporte universal
- Compacto para caracteres de número bajo
Desventajas:
- No legible para humanos (¿qué es ™?)
- Más difícil de depurar o editar manualmente
- Más grande para valores Unicode altos
Usar para: Caracteres sin entidades con nombre
3. Entidades Hexadecimales:
Formato: &#xHEX;
Ejemplo: < > & ©  
Ventajas:
- Funciona para CUALQUIER carácter Unicode
- Coincide con estándar Unicode (U+00A9)
- Más corto para valores Unicode altos
- Más fácil de cruzar referencia con tablas Unicode
Desventajas:
- No legible para humanos
- Requiere conocimiento hexadecimal
- Menos común que decimal
Usar para: Al trabajar con referencias Unicode
Tabla de comparación:
| Carácter | Con Nombre | Decimal | Hex |
|----------|-----------|---------|----------|
| < | < | < | < |
| > | > | > | > |
| & | & | & | & |
| " | " | " | " |
| © | © | © | © |
| € | € | € | €|
Recomendación:
- Use entidades con nombre para caracteres comunes
- Use numérico/hex para caracteres raros
- Esta herramienta usa entidades con nombre por defecto
¿Cómo previenen las entidades HTML los ataques XSS?
Las entidades HTML son cruciales para prevenir ataques de Cross-Site Scripting (XSS):
¿Qué es XSS?
- Atacantes inyectan JavaScript malicioso en su sitio web
- Si la entrada de usuario se muestra sin codificar, los scripts pueden ejecutarse
- Pueden robar cookies, tokens de sesión o datos sensibles
- Pueden desfigurar su sitio web o redirigir usuarios
Cómo las entidades previenen XSS:
1. Neutralizando código malicioso:
Entrada maliciosa: <script>alert('XSS')</script>
Codificado seguro: <script>alert('XSS')</script>
Resultado: Se muestra como texto, no se ejecuta
2. Rompiendo inyección HTML:
Ataque: <img src=x onerror="alert('XSS')">
Codificado: <img src=x onerror="alert('XSS')">
Resultado: Muestra como texto, etiqueta img no se crea
3. Prevención de inyección de atributos:
Ataque: " onclick="alert('XSS')"
En atributo: <div title="entrada usuario aquí">
Sin codificar: <div title="" onclick="alert('XSS')"">
Con codificar: <div title="" onclick="alert('XSS')"">
Resultado: Seguro - tratado como parte del texto del título
Caracteres esenciales para codificar:
- < → < (previene creación de etiquetas)
- > → > (previene cierre de etiquetas)
- & → & (previene inyección de entidades)
- " → " (previene ruptura de atributos)
- ' → ' (previene ruptura de atributos)
Mejores prácticas:
1. Siempre codifique entrada de usuario antes de mostrar
2. Codifique en salida, no en almacenamiento
3. Use biblioteca de codificación confiable
4. No intente filtrar o sanitizar - codifique todo
5. Combine con Content Security Policy (CSP)
6. Nunca confíe en entrada de usuario
¡La codificación de entidades HTML es su primera línea de defensa contra ataques XSS!
Características Principales
- Codificar texto a entidades HTML (con nombre, numérico o hexadecimal)
- Decodificar entidades HTML de vuelta a caracteres originales
- Soporte para entidades con nombre (&, <, ©, etc.)
- Soporte para entidades numéricas (&, <, ©)
- Soporte para entidades hexadecimales (&, <, ©)
- Opción para codificar solo caracteres esenciales o todos los caracteres especiales
- Conteo automático de entidades y estadísticas
- Previene ataques XSS codificando caracteres peligrosos
- Intercambiar entre modos codificar y decodificar con un clic
- Estadísticas de comparación de tamaño en tiempo real
- Copiar texto codificado/decodificado al portapapeles
- Descargar resultados como archivos de texto
- Cargar archivos de texto para codificar/decodificar
- Soporte de modo oscuro
- Procesamiento 100% del lado del cliente
- Sin límites de tamaño de archivo
- Funciona sin conexión
- Diseño responsivo compatible con móviles
- Soporte para Unicode y caracteres internacionales
- Sin registro requerido