Especificar la codificación de un documento

Tabla de contenidos

1. Introducción
2. Cómo especificar una codificación
3. Cómo especificar una codificación para HTML y XHTML
4. Cómo especificar una codificación para CSS
5. Resumen: tabla de referencia rápida

Introducción

Hace poco me encontré con un tutorial bastante interesante en la página de la Actividad de Internacionalización del W3C, Character sets & encodings in XHTML, HTML and CSS (inglés), que explica lo que es un juego de caracteres, ofrece información sobre qué codificación elegir, y, lo más importante, cómo especificar la codificación en un documento. No voy a traducir el documento por su extensión, pero sí voy a resumir la parte que tiene que ver con este aspecto.

Cómo especificar una codificación

Suponiendo que hemos elegido una codificación que consideramos adecuada, y que además el documento que vamos ha publicar ha sido creado y guardado con la misma¹, tenemos tres medios para declarar la codificación y que un agente de usuario sepa qué va a encontrar:

• Por medio de la cabecera HTTP.
• Por medio de una declaración XML.
• Por medio del elemento meta.

El primer método se aplica en el servidor, y dependiendo del que se esté utilizando, la manera de hacerlo puede variar. Para Apache, por ejemplo, hay que modificar el archivo .htaccess y añadir una línea como ésta:

    AddType 'text/html; charset=UTF-8' html
            

Lo que se está diciendo es que los archivos servidos con un tipo MIME text/html estarán codificados en UTF-8, y que su extensión será .html.

Sin embargo, el W3C recomienda que se asegure por todos los medios posibles que existe una declaración explícita de la codificación, por lo que también es aconsejable incluirla en el propio documento.

Para los documentos XML la declaración de realiza en la primera línea de código:

    <?xml version="1.0" encoding="utf-8"?>
            

En este caso, sería redundante, porque por defecto los intérpretes de XML tratan los documentos con esa codificación, pero como para el resto es necesario declararla así, acostumbrándonos a hacerlo en todos los casos asegurará que nunca nos olvidaremos.

Por su parte, para los documentos HTML se realiza incluyendo en la cabecera una línea de metainformación:

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            

Ésta es la información general. Ahora pasemos a ver en qué medida nos afecta como desarrolladores web.

Cómo especificar una codificación para HTML y XHTML

Todo desarrollador web ilustrado sabe que una página que crea puede servirse como un documento HTML o como un documento XML, en virtud de la DTD que haya elegido para su documento. Los escenarios posibles son por tanto:

1. Se ha elegido la DTD 4.01, el documento ha de servirse con un tipo MIME text/html. Como se trata entonces de un documento HTML tradicional, su codificación:
   • puede declararse por medio de la cabecera HTTP,
   • no debe declararse por medio de una declaración XML,
   • debe declararse por medio del elemento meta.
2. Se ha elegido la DTD XHTML 1.0, y se ha elegido servirlo con un tipo MIME text/html. A efectos prácticos, es el mismo caso que el anterior, pero sin embargo por la peculiar naturaleza de la especificación 1.0, hay una diferencia:
   • puede declararse por medio de la cabecera HTTP.
   • puede declararse por medio de una declaración XML,
   • debe declararse por medio del elemento meta.
3. Se ha elegido la DTD XHTML 1.0, y se ha elegido servirlo con un tipo MIME application/xhtml+xml. En este caso, ya no se trata de un documento HTML, sino XML, por lo que:
   • puede declararse por medio de la cabecera HTTP.
   • debe declararse por medio de una declaración XML,
   • no debe declararse por medio del elemento meta.
4. Se ha elegido la DTD XHTML 1.1, por lo que el tipo MIME ha de ser application/xhtml+xml. Como el caso anterior:
   • puede declararse por medio de la cabecera HTTP.
   • debe declararse por medio de una declaración XML,
   • no debe declararse por medio del elemento meta.

Cómo especificar una codificación para CSS

En el caso de CSS, es menos común necesitar declarar su codificación. Personalmente, sólo he necesitado declararla cuando he aplicado un estilo de contenido generado en el que incluía algún texto con caracteres especiales. De todas formas, nunca está de más saber que se puede hacer:

• por medio de la cabecera HTTP de la misma manera que para cualquier fichero,
• por medio de la regla @charset en el propio archivo .css:

  
      /* Aquí comienzan las declaraciones de estilo */
      
      @charset 'utf-8';
                  

• o por medio del atributo charset del elemento link:

  
      <link href="estilo.css" type="text/css" rel="stylesheet" charset="utf-8" />
                  

La ventaja es que declarando la codificación se pueden emplear caracteres no ASCII para los nombres de elementos, atributos y valores; no olvidemos que CSS no siempre se aplica a un documento HTML.

Resumen: tabla de referencia rápida

Para quienes no tienen paciencia de leer todo lo anterior, aquí dejo una tabla con los datos:

Métodos para especificar la codificación de un documento HTML, XHTML o CSS

Tipo de documento	HTTP	<?xml … >	<meta… />	@charset	<link charset… />
El valor «Opcional» de la columna de la cabecera HTTP significa más bien «Si se puede… sí».
HTML 4.01	Opcional	No	Sí	n/a	n/a
XHTML 1.0 text/html	Opcional	Opcional	Sí	n/a	n/a
XHTML 1.0 application/ xhtml+xml	Opcional	Sí	No	n/a	n/a
XHTML 1.1	Opcional	Sí	No	n/a	n/a
CSS	Opcional	n/a	n/a	Opcional	Opcional

Notas

1. Sé que parece un poco obvio, pero es un error común especificar una codificación cuando se ha guardado el archivo con otra distinta, por ejemplo cuando no se ha modificado el valor por defecto de los archivos a guardar en el editor empleado.