Declarar idioma en HTML

audiencia meta: codificadores HTML (que usan editores o automatización), desarrolladores de secuencias de comandos (PHP, JSP, etc.), gerentes de proyectos web y cualquier persona que necesite entender mejor cómo declarar el idioma del texto de una página web.

Pregunta

¿Cómo debo establecer el idioma del contenido de mi página HTML?

Respuesta rápida

Use siempre un atributo de idioma en la etiqueta html para declarar el idioma predeterminado del texto de la página. Cuando la página tenga contenido en otro idioma, agregue un atributo de idioma a un elemento que rodee a ese contenido.

Use el atributo lang para páginas servidas como HTML, y el atributo xml:lang para páginas servidas como XML. Para documentos políglotas XHTML 1.X y HTML5, use ambos juntos.

Use etiquetas de idioma del Registro de subetiqueta de idioma de la IANA. Para encontrar códigos pertinentes puede consultar la herramienta no oficial de Búsqueda de Subetiquetas de Idioma.

Use elementos localizados para cuidar los valores de contenido y atributos en el mismo elemento que están en idiomas diferentes.

Detalles

Nociones básicas

Use siempre un atributo de idioma en el elemento html. Este es heredado por todos los demás elementos, y así establecerá un idioma predeterminado para el texto en el elemento head del documento.

Tome en cuenta que debe usar el elemento html y no el elemento body, dado que body no cubre el texto que está dentro del elemento head del documento.

Si tiene cualquier contenido en la página que esté en un idioma diferente del declarado en el elemento html, use atributos de idioma en elementos que rodeen a ese contenido. Esto le permite estilizarlo o procesarlo de manera diferente.

En algunas partes de su código puede tener un problema. Si tiene texto multilingüe en el elemento title, usted no puede marcar partes del texto para diferentes idiomas porque el atributo title solamente permite caracteres, no marcado. Lo mismo aplica para múltiples idiomas en valores de atributos. En este momento no hay una buena solución para esto.

Elección del atributo correcto

Si su documento es HTML (es decir, servido como text/html), use el atributo lang para establecer el idioma del documento o un rango de texto. Por ejemplo, lo siguiente establece el idioma predeterminado en francés:

<html lang="fr">

Cuando se sirven páginas XHTML 1.x o políglotas como text/html, use tanto el atributo lang como el atributo xml:lang juntos cada vez que desee establecer el idioma. El atributo xml:lang es la manera convencional de identificar información sobre idioma en XML. Asegúrese de que los valores para ambos atributos sean idénticos.

<html lang="fr" xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">

El atributo xml:lang realmente no es útil para manejar el archivo como HTML, pero interviene desde el atributo lang cada vez que usted procese o sirva el documento como XML. El atributo lang lo permite la sintaxis de XHTML, y también puede ser reconocido por los navegadores. Sin embargo, al usar otros analizadores sintácticos XML, (como la función lang() en XSLT) no puede confiar en que sea reconocido el atributo lang.

Si está sirviendo su página como XML, (es decir, usando un tipo MIME tal como application/xhtml+xml), no necesita el atributo lang. Con el atributo xml:lang solo es suficiente.

<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">

¿Y si el contenido del elemento y los valores del atributo están en idiomas diferentes?

Ocasionalmente, el idioma del texto en un atributo y el contenido del elemento están en idiomas diferentes. Por ejemplo, en la esquina superior derecha de este artículo hay enlaces hacia versiones traducidas de esta página. El texto del enlace muestra el idioma de la página meta usando el idioma de la página meta, pero un atributo title asociado contiene un indicio en el idioma de la página actual:

Captura de pantalla que muestra una información sobre herramientas que contiene la palabra 'Spanish' emergiendo del texto del documento 'Español'.

Si su código se ve como el que sigue, los atributos de idioma realmente indicarían que no sólo el contenido sino también el texto del atributo title están en español. Esto es obviamente incorrecto.

 Código malo. ¡No copiar!

<a lang="es" title="Spanish" href="qa-html-language-declarations.es">Español</a>

Por el contrario, mueva el texto que contiene el atributo en un idioma diferente a otro elemento, como se muestra en este ejemplo, en el que el elemento span hereda el ajuste en predeterminado del elemento html.

<span title="Spanish"><a lang="es" href="qa-html-language-declarations.es">Español</a></span>

¿Y si no hay un elemento dónde colgar tu atributo?

Si desea especificar el idioma de algún contenido pero no hay marcado alrededor del mismo, use un elemento como span o div alrededor del contenido. Este es un ejemplo:

<p>Usted diría eso en chino como <span lang="zh-Hans">中国科学院文献情报中心</span>.</p>

Elección de valores de idioma

Para estar seguros de que todos los agentes del usuario reconozcan a qué idioma se refiere usted, necesita seguir una estrategia convencional al proporcionar valores de atributo de idioma. También necesita considerar cómo hacer referencia de una manera convencional a las diferencias dialectales entre idiomas, como la diferencia entre el inglés de EE.UU. y el inglés británico, los cuales divergen significativamente en cuestión de ortografía y pronunciación.

Las reglas para crear valores de atributos de idioma se describen mediante una especificación IETF llamada BCP 47. Además de especificar cómo usar language tags sencillas, como en para inglés y fr para francés, BCP 47 describe cómo redactar etiquetas de idioma que le permitan especificar dialectos regionales, escrituras y otras variantes relacionadas con ese idioma.

BCP 47 incorpora, pero va más allá, los conjuntos ISO de códigos de idioma y de país. Para encontrar códigos pertinentes debe consultar el Registro de Subetiquetas de Idioma IANA.

Para una introducción suave pero más bien concienzuda a la sintaxis de las etiquetas BCP 47, lea Etiquetas de idioma en HTML y XML. Para ayuda en la elección de la etiqueta de idioma adecuada entre las muchas etiquetas y combinaciones posibles, consulte Elección de una etiqueta de idioma.

Información adicional

Especificación de metadatos acerca del idioma de la audiencia

Si desea crear metadatos que describan el idioma de la audiencia planeada de una página, en lugar del idioma de un rango de texto específico, deberá hacer que el servidor envíe información en el encabezado HTTP Content-Language. Si su audiencia planeada habla más de un idioma, el encabezado HTTP le permite usar una lista separada por comas de los idiomas.

Este es un ejemplo de un encabezado HTTP que declara que el recurso es una mezcla de inglés, hindi y punjabi:

Content-Language: en, hi, pa

Observe que este enfoque no es efectivo si acceden a su página desde un disco duro, disco u otra ubicación basada en no-servidor. Actualmente no hay una forma ampliamente reconocida de usar este tipo de metadatos dentro de la página.

Anteriormente la gente usaba un meta elemento con el atributo http-equiv establecido en Content-Language. Debido a confusiones que existen desde hace mucho y a implementaciones inconsistentes de este elemento, la especificación HTML5 hizo que esto quedara como no conforme en HTML, de modo que ya no debe usted usarlo.

Para compatibilidad con versiones anteriores, HTML5 describe un algoritmo por medio del cual el idioma predeterminado del contenido se puede adivinar desde el HTTP o de la información meta Content-Language bajo ciertas condiciones. No obstante, esto es solamente un mecanismo de tipo plan B para casos en los que no se ha usado ningún atributo de idioma en la etiqueta html. Si usted ha usado el atributo de idioma en la etiqueta html, como debe hacerlo siempre, tales recursos de emergencia son irrelevantes.

Para información acerca de Content-Language en HTTP y en meta elementos consulte HTTP y meta para información de idioma.

Varias cosas que son irrelevantes

Tan sólo como información extra, y en nombre de la minuciosidad, tal vez valga la pena mencionar unos cuantos puntos que no son relevantes para esta discusión.

En primer lugar, no es posible declarar el idioma del texto usando CSS.

En segundo lugar, el DOCTYPE que debe iniciar cualquier archivo HTML puede contener lo que a algunas personas les parece una declaración de idioma. El DOCTYPE del ejemplo que aparece a continuación contiene el texto EN, lo cual significa 'inglés'. Esto, no obstante, indica el idioma del esquema asociado con este documento, no tiene nada que ver con el idioma del documento mismo.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

En tercer lugar, a veces la gente supone que la información acerca del idioma natural se podría inferir a partir de la codificación de caracteres. Sin embargo, una codificación de caracteres no permite la identificación inequívoca de un idioma natural: debe haber una correspondencia uno a uno entre la codificación y el idioma para que funcione esta inferencia, y no lo hay. Por ejemplo, se podría usar una sola codificación de caracteres para muchos idiomas, por ejemplo Latín 1 (ISO-8859-1) podría codificar tanto al francés como al inglés, así como a numerosos otros idiomas. Además, la codificación de caracteres puede variar en un solo idioma, por ejemplo el árabe podría usar codificaciones como 'Windows-1256' o 'ISO-8859-6' o 'UTF-8'.

Sin embargo, todos estos ejemplos de codificación actualmente son irrelevantes, ya que todo el contenido debe estar creado en UTF-8, el cual cubre todos menos los idiomas más raros en una sola codificación de caracteres.

Lo mismo cabe decir para la dirección del texto. Al igual que con las codificaciones y el idioma, no siempre hay una correspondencia uno a uno entre idioma y escritura, y por lo tanto, direccionalidad. Por ejemplo, el azerbaiyano se puede escribir usando escrituras de derecha a izquierda (árabe) y escrituras izquierda a derecha (latín o cirílico), y el código de idioma az puede ser pertinente para cualquiera de ellos. Además, el marcado de dirección del texto que se usa con texto en línea aplica un rango de diferentes valores al texto, mientras que el idioma es un cambio simple que no está a la altura de las tareas que se requieren.