Codificación de caracteres en HTML (charset)
La codificación de caracteres (charset) define cómo interpreta el navegador el texto en la página. Si no se configura correctamente, los caracteres acentuados o no latinos pueden mostrarse incorrectamente.
¿Qué es la codificación de caracteres?
La codificación de caracteres es un sistema estandarizado que asigna un número a cada carácter. El estándar más popular actualmente es UTF-8.
La importancia de UTF-8
UTF-8 es la codificación de caracteres más utilizada en la web porque admite todos los idiomas del mundo. Se recomienda encarecidamente su uso en todos los documentos HTML.
html
<head>
<meta charset="UTF-8">
</head>Otras codificaciones
ISO-8859-1 (Latin-1) solía ser popular, pero ha sido reemplazada en gran medida por UTF-8.
html
<meta charset="ISO-8859-1">¿Por qué es importante una codificación adecuada?
Una codificación incorrecta puede causar una visualización incorrecta del texto — como signos de interrogación o símbolos extraños.
Ejemplo práctico
En el siguiente ejemplo, se muestran caracteres de varios idiomas dentro de un documento HTML codificado en UTF-8.
html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Character Encoding Example</title>
</head>
<body>
<p>Árvíztűrő tükörfúrógép — 日本語 — русский</p>
</body>
</html>Consejos sobre codificación
Incluye siempre <meta charset="UTF-8"> al inicio del <head>. Esto garantiza la correcta visualización de los caracteres internacionales.
Errores comunes
Muchos desarrolladores olvidan establecer la codificación o colocan la etiqueta meta demasiado tarde. Esto es especialmente problemático si el archivo está guardado en un formato diferente.
¿Qué es BOM?
El BOM (Marca de Orden de Bytes) es un carácter oculto al inicio de un archivo que puede indicar la codificación de caracteres. En UTF-8 no es necesario e incluso puede causar problemas de visualización.
¿Cómo comprobar la codificación?
Puedes comprobar la codificación de un archivo en la configuración de tu editor de texto o usando las herramientas para desarrolladores del navegador. Si hay problemas, asegúrate de que el archivo esté guardado en formato UTF-8.
Seleccionar idioma
Establecer tema
© 2025 ReadyTools. Todos los derechos reservados.