Codificador de entidades HTML
Y un decodificador que perdona
Este codificador de entidades HTML convierte el texto en entidades con nombre, decimales o hexadecimales, y también las devuelve a texto. Por defecto codifica los cinco caracteres que HTML reserva y, si lo pides, todo lo que queda fuera de ASCII.
- GratisPrecio
- 3Formas
- NingunoRegistro
- NingunoSubidas
Codificador y decodificador de entidades HTML
Texto a entidades y vuelta, con las reglas explicadas
- Caracteres de entrada
- 0
- Convertidos
- 0
- Caracteres de salida
- 0
En HTML hay cinco caracteres que de verdad necesitan codificarse: el ampersand, los dos signos de ángulo y las dos comillas. Todo lo demás es una elección sobre márgenes de seguridad.
Listo. Pega algo y se convertirá mientras escribes.
Qué caracteres reserva HTML
Cinco caracteres significan algo para un analizador. El ampersand inicia una entidad, los dos signos de ángulo abren y cierran una etiqueta y, además, las dos comillas terminan un valor de atributo.
El resto se queda como texto corriente. Así que una letra acentuada, una raya y un emoji pasan intactos por un documento UTF-8.
Así que codificar sirve para menos cosas de las que se cree. En el texto necesitas tres de los cinco y, dentro de un atributo, también la comilla correspondiente.
La lista completa de nombres está en el estándar HTML, y supera las dos mil entradas. Sin embargo, casi ninguna es necesaria.
Por nombre, en decimal o en hexadecimal
Las entidades con nombre se leen bien, porque un te dice lo que es. En cambio, un   solo te dice un número.
Los números siempre funcionan. Cada punto de código tiene uno, no interviene ninguna tabla y, por lo tanto, nada depende de que un analizador conozca un nombre.
El hexadecimal es el mismo número en base dieciséis. Úsalo cuando copies valores de una tabla Unicode, ya que las tablas los imprimen así.
Cuándo codificarlo todo
Un documento servido como UTF-8 no necesita entidades para los acentos, ya que los caracteres son simplemente caracteres. Así el navegador los lee correctamente.
Codificar todo lo que está fuera de ASCII es un seguro contra un servidor que envía el charset equivocado. Sin embargo, hace el archivo más grande y mucho más difícil de editar.
Por lo tanto, recurre a ello solo cuando no controles las cabeceras. En cualquier otro caso, una declaración de charset correcta es la mejor solución.
Las entidades no son saneamiento
Codificar el texto antes de imprimirlo en una página impide que se convierta en marcado. Eso es escapar, y además las reglas cambian según el lugar: un atributo, un bloque de script y una URL necesitan cada uno el suyo.
Por qué decodificar es la mitad difícil
Los documentos reales llevan entidades con nombre, decimales, hexadecimales y muchas sin punto y coma. Así que un decodificador tiene que manejar las cuatro.
Además, tiene que dejar en paz todo lo que solo parece una entidad. La palabra &foo; es texto, y un decodificador que adivina corrompe la prosa.
Este decodificador comprueba los nombres contra su tabla y los puntos de código contra el rango válido. Por eso todo lo que no reconoce vuelve exactamente como estaba.
Dónde siguen apareciendo entidades
Las plantillas de email antiguas las llevan a cientos. También las exportaciones de CMS y las conversiones de PDF y, además, todo lo que pasó alguna vez por un procesador de textos.
También aparecen en archivos CSV sacados de una página web. Por ejemplo, una columna de nombres llena de amp y rsquo es la señal habitual.
Decodificar ese archivo una vez lo vuelve legible. Luego puedes ver las comillas y rayas sueltas que se escondían como códigos.
Sin embargo, guarda una copia del original. Si un valor debía seguir codificado, querrás devolverlo.
La trampa del espacio que no deja partir la línea
Los procesadores de textos los insertan, y en pantalla parecen idénticos a un espacio normal. Luego rompen el ajuste de línea y las comparaciones de texto. Por eso decodificar un bloque pegado es la forma más rápida de encontrarlos.
En esta página
- La herramienta
- Qué caracteres reserva HTML
- El codificador de entidades HTML, paso a paso
- Lo que distingue a este codificador de entidades HTML
- Reglas para codificar caracteres especiales HTML
- Seis errores con entidades que llegan a producción
- Preguntas frecuentes sobre entidades
- Herramientas para trabajar con marcado
Sigue leyendo
El codificador de entidades HTML, paso a paso
Tres pasos, y el resultado sigue cada pulsación. Además, el botón de intercambio se encarga del viaje de ida y vuelta.
- 1
Elige una dirección
Al codificar, cada carácter especial pasa a ser una entidad. En cambio, decodificar convierte las entidades otra vez en caracteres, incluidas las que no llevan punto y coma.
- 2
Elige la forma
Con nombre donde exista, o números en decimal o hexadecimal. Los números siempre funcionan, por eso son el valor por defecto más seguro para las máquinas.
- 3
Decide hasta dónde llegar
Deja apagado el interruptor de ASCII para el trabajo normal. Enciéndelo cuando un servidor envíe el charset equivocado y no puedas arreglar las cabeceras.
- 4
Copia, o intercambia y comprueba
Pulsa Mover el resultado a la izquierda y la dirección se invierte. Luego, convertir otra vez debería devolver exactamente lo que tenías al principio.
Lo que distingue a este codificador de entidades HTML
La mayoría de los conversores hacen bien una dirección y adivinan la otra. En cambio, estas son las diferencias que importan en la práctica.
Deja en paz los nombres desconocidos
El texto que parece una entidad pero no lo es se queda como está, porque un decodificador que adivina corrompe la prosa sin avisar.
Tres formas de salida
Con nombre, decimal y hexadecimal salen de un mismo interruptor, así que puedes igualar lo que ya usa el archivo que lo rodea.
Maneja la falta de punto y coma
Los documentos reales lo omiten, y los navegadores perdonan un nombre conocido. Por eso este decodificador hace lo mismo en lugar de fallar.
Lo que codificas se puede recuperar tal cual
Intercambia los paneles y convierte otra vez. Si algo no vuelve a su texto inicial, has encontrado un fallo en uno de los pasos.
Sin trucos con el DOM
Este sitio bloquea a propósito el truco habitual de innerHTML, así que las tablas están en el archivo y cada cambio ocurre a la vista.
Las imágenes nunca salen de esta pestaña de Denwix
Por conversores como este pasan fragmentos de plantillas y datos de clientes. Por eso todo aquí se queda en tu navegador.
Reglas para codificar caracteres especiales HTML
Escapar es uno de esos trabajos en los que el buen hábito es más corto que el malo.
- Escapa al mostrar el dato, no al guardarlo. Guarda lo que escribió el usuario. Luego codifica al imprimirlo, y codifica para el lugar exacto donde cae.
- Usa la función de tu framework. Todos los lenguajes tienen una, y sabe dónde caerá el texto. Una cadena de reemplazos hecha a mano acaba fallando en algún caso.
- Sirve UTF-8 y decláralo. Entonces los acentos y los emojis no necesitan entidades. Sobre todo, esta es la solución que hace desaparecer toda la cuestión.
- Codifica ambas comillas dentro de los atributos. Una comilla simple cierra un atributo entre comillas simples, igual que una doble cierra uno entre dobles. Así que codifica ambas y olvídate.
- Prefiere entidades numéricas en archivos generados. No interviene ninguna tabla de nombres, así que nada depende de que un analizador conozca una palabra. Los nombres ayudan a quien lee tu código fuente.
- Vigila la doble codificación. Un ampersand codificado dos veces se ve como
&en la página. Por lo tanto, decodifica una vez y mira antes de volver a codificar. - Busca espacios de no separación en el texto pegado. Vienen de los procesadores de textos y rompen el ajuste de línea. Decodifica un bloque y los que sobran se vuelven visibles.
- Revisa las exportaciones tras mudar de CMS. Una migración es donde se cuela la doble codificación. Así que decodifica una muestra de las páginas nuevas y compárala con las antiguas.
- Mantén la misma forma en todo el archivo. Mezclar nombres y números en una plantilla complica mucho buscar un carácter suelto más adelante.
- Nunca escapes para sanear marcado. Escapar hace que el texto sea seguro de imprimir. Permitir algunas etiquetas y quitar otras es otro trabajo que necesita un saneador de verdad.
Seis errores con entidades que llegan a producción
Pasan la revisión porque la página se ve bien. Sin embargo, el daño aparece en un feed, una exportación o un índice de búsqueda.
Doble codificación
El más común. Cuando la plantilla escapa un valor y el framework lo vuelve a escapar, el lector ve el texto crudo de la entidad.
Codificarlo todo por defecto
Duplica el tamaño de una página en francés o urdu y deja el código ilegible. Así que arregla el charset en su lugar.
Escapar para el contexto equivocado
El escape HTML dentro de un bloque de script o de un parámetro de URL no basta. De hecho, cada contexto tiene sus propias reglas.
Entidades con nombre en XML
XML conoce cinco nombres y ninguno más. Por lo tanto, un
en un sitemap o un feed RSS es un error de análisis.Olvidar la comilla dentro de los atributos
Termina el atributo antes de tiempo y luego deja el resto del valor como marcado. Así empieza una inyección.
Confiar en el escape como control de seguridad
Un escape correcto evita la inyección en el punto de salida. Sin embargo, no hace nada con lo que guardaste ni con lo que permitiste.
Preguntas frecuentes sobre entidades
¿Qué caracteres debo codificar en HTML?
Tres en el texto: el ampersand y los dos signos de ángulo. Además, dentro de un valor de atributo codifica también la comilla, y codificar ambas comillas es más fácil de recordar.
¿Mejor nombres o números?
Los nombres se leen mejor en el código fuente. En cambio, los números siempre funcionan, no necesitan tabla y son la opción más segura en un archivo generado por una máquina.
¿Sirve como decodificador de entidades HTML online?
Sí, y maneja entidades con nombre, decimales y hexadecimales, incluidas las que llegan sin punto y coma. Además, los nombres desconocidos se quedan exactamente como están.
¿Por qué veo & en mi página?
Algo codificó el texto dos veces. Por eso conviene decodificarlo una vez aquí para ver el original y luego buscar el segundo escape en tu plantilla o framework.
¿Necesito entidades para las letras acentuadas?
No en un documento UTF-8 con una línea charset correcta. Por lo tanto, codifícalas solo cuando no puedas controlar cómo envía el archivo un servidor.
¿Puedo usar estas entidades en XML o RSS?
Usa las numéricas. De hecho, XML define solo cinco entidades con nombre, así que cualquier otra, incluida nbsp, rompe el feed.
¿Y los caracteres especiales HTML en el email?
Los clientes de correo analizan HTML con motores más antiguos, así que ahí las entidades numéricas son la opción más segura. Además, prueba en un cliente real antes de enviar.
¿Codificar es lo mismo que sanear?
No. Codificar hace que el texto se muestre como texto. En cambio, sanear decide qué etiquetas pueden quedarse como marcado, y ese trabajo necesita una biblioteca hecha para ello.
¿Puedo decodificar un archivo entero aquí?
Pégalo. La herramienta maneja una página larga sin ralentizarse y, además, los recuentos te dicen cuántos códigos cambió.
¿Qué entidades rompen un feed RSS?
Cualquiera con nombre salvo las cinco que define XML. Normalmente la culpable es nbsp, y cambiarla por un código numérico arregla el feed.
¿Por qué mi texto muestra comillas raras?
Un procesador de textos insertó comillas tipográficas y algo las codificó dos veces. Por eso basta con decodificar el bloque una vez aquí para recuperar los caracteres reales.
¿Tengo que codificar el apóstrofo?
Dentro de un atributo entre comillas simples, sí, y el interruptor de comillas lo hace por ti. En cambio, en el texto un apóstrofo es puntuación normal, así que puede quedarse tal cual.
¿Por qué mi ampersand quedó intacto?
Porque el codificador estaba en modo decodificar, o porque el carácter ya formaba parte de una entidad. Así que cambia la dirección y convierte otra vez para ver la diferencia.
¿Lo que pego acaba en algún servidor?
No. Ambas direcciones funcionan en la pestaña de tu navegador. Por lo tanto, nada llega a este sitio, no se guarda ninguna copia y cerrar la pestaña lo borra.
Herramientas para trabajar con marcado
Las entidades son una parte del manejo de HTML a mano. Estas tres cubren el resto.
Minificador HTML
Comprime el marcado o embellécelo para que vuelva a ser legible.
Abrir herramienta →Eliminador de etiquetas HTML
Saca el texto plano y conserva los saltos de párrafo.
Abrir herramienta →Codificador y decodificador Base64
Codifica bytes para una data URI o el valor de una cabecera.
Abrir herramienta →
¿Listo para convertir algo?
Pega un bloque, elige una dirección e intercambia los paneles para comprobar el viaje de ida y vuelta. El codificador de entidades HTML es gratis, no necesita cuenta y funciona entero en tu navegador.