Codificación

Guía de codificación URL (codificación por porcentaje): por qué el texto se convierte en %20 y %C3%B1

Copia un enlace con una palabra como «año» y obtendrás cadenas como a%C3%B1o. Eso es la codificación URL. Esta guía explica las reglas que hay detrás y los problemas que causa en el desarrollo web, los enlaces de marketing y las integraciones de API.

En una URL solo se permiten algunos caracteres

La sintaxis de las URL está definida en la RFC 3986. Solo las letras, los dígitos y cuatro símbolos —guion (-), punto (.), guion bajo (_) y virgulilla (~)— pueden aparecer tal cual en una URL. Se llaman caracteres no reservados.

Símbolos como :, /, ?, #, & y = son reservados: dan a la URL su estructura. ? inicia la cadena de consulta, & separa parámetros y # marca un fragmento. Si un término de búsqueda contiene & o #, insertarlo sin codificar cambia el significado de toda la URL.

Cómo funciona la codificación por porcentaje

Los caracteres que no pueden aparecer directamente se dividen en bytes, y cada byte se escribe como % seguido de dos dígitos hexadecimales. Un espacio (byte 0x20) se convierte en %20, un ampersand (0x26) en %26 y un signo igual (0x3D) en %3D.

El texto no ASCII se convierte primero en bytes UTF-8 y después se codifica igual. La sílaba coreana 안 ocupa tres bytes en UTF-8 (EC 95 88), así que se convierte en %EC%95%88: un carácter pasa a ser nueve. La ñ, de dos bytes, se convierte en %C3%B1.

안녕 하세요?  →  %EC%95%88%EB%85%95%20%ED%95%98%EC%84%B8%EC%9A%94%3F
a b&c=d      →  a%20b%26c%3Dd

Decodificar invierte el proceso: %EC%95%88 vuelve a ser los bytes EC 95 88, que se interpretan como UTF-8. Si un servidor interpreta esos bytes con una codificación antigua, el texto sale ilegible, una causa habitual de términos de búsqueda rotos en sitios web antiguos.

¿Un espacio es %20 o +?

Los espacios son lo que más confunde. Según la RFC 3986, un espacio es %20. Sin embargo, el formato application/x-www-form-urlencoded que usan los formularios HTML escribe los espacios de la cadena de consulta como +. El mismo texto a b puede aparecer como a%20b en una ruta y como a+b en la consulta de un formulario.

El problema surge cuando necesitas un signo más literal. Un teléfono como +34 o una expresión como 1+1 puestos sin codificar en una consulta pueden leerse como un espacio. Codifica esos valores como %2B. Las bibliotecas difieren —encodeURIComponent de JavaScript produce %20, mientras que algunas bibliotecas de servidor producen +—, así que asegúrate de que ambos lados usan la misma convención.

Codifica componentes, no URL completas

Nunca codifiques una URL entera de una vez. Codificar https://example.com/search?q=... convierte : y / en %3A y %2F, y el resultado deja de funcionar como dirección. Aplica la codificación solo a las partes que son datos, como los valores de los parámetros.

JavaScript refleja esto con dos funciones. encodeURI deja intactos los caracteres estructurales, mientras que encodeURIComponent también codifica /, ?, & y =. Para los valores de parámetros de consulta, encodeURIComponent es la opción segura.

Doble codificación: desconfía de %2520

Codificar una cadena ya codificada convierte % en %25. Si un espacio aparece como %2520 en lugar de %20, se ha codificado dos veces. Ocurre a menudo con enlaces de seguimiento que pasan por varias redirecciones o con URL de retorno tras el inicio de sesión que llevan otra URL como parámetro.

Decodificar dos veces es igual de dañino: un %25 auténtico de los datos se convierte en % y el valor cambia. La regla es sencilla: codifica una sola vez, en el último momento, cuando un valor entra en una URL, y decodifica una sola vez, en el primer momento, cuando lo lees.

Lista de comprobación práctica

Prueba valores en el codificador/decodificador URL de AIBIZAP para ver exactamente qué caracteres cambian y cómo.

  • Codifica los nombres de campaña de los enlaces UTM si contienen espacios, tildes o ñ.
  • Codifica a nivel de componente los valores de API como términos de búsqueda, direcciones de correo (con @) y marcas de tiempo (con :).
  • Si un enlace se rompe, busca %25 para detectar doble codificación.
  • Si los registros del servidor muestran texto ilegible, confirma que los valores se decodificaron e interpretaron como UTF-8.
  • Cuando un valor Base64 deba ir en una URL, usa Base64URL o codifica el resultado por porcentaje.

Pruébalo con estas herramientas

Más guías

Todas las guías