Ir al contenido

Idioma del enlace en HTML

En HTML podemos indicar el idioma del enlace, es decir, podemos indicar en qué lenguaje se encuentra el elemento enlazado mediante el elemento anchor A.

Para ello tenemos que utilizar el atributo hreflang en el elemento anchor A.

Por ejemplo, si la página que enlazamos está en español podemos asignarle el valor es-ES, o simplemente es. Un enlace a Línea de Código quedaría de la siguiente forma:

<a href="http://lineadecodigo.com" hreflang="es-ES">Linea de Código</a>

Los códigos están compuestos por el código primario y el subcódigo. El código representa al idioma y el subcódigo representa a una especificidad del lenguaje.

Por ejemplo, el inglés de Inglaterra sería en-UK, mientras que el inglés americano sería en-US. Otro ejemplo sería el portugués en Portugal sería pt o pt-PT y el portugués en Brasil sería pt-BR.

La W3C nos proporciona ejemplos de los códigos.

Así, podríamos enlazar a los diferentes portales de Google con el siguiente código:

<a href="http://www.google.es" hreflang="es">Google España</a>
<a href="http://www.google.pt" hreflang="pt-PT">Google Portugal</a>
<a href="http://www.google.com.br/" hreflang="pt-BR">Google Brasil</a>

Es muy importante saber que el atributo hreflang solo funciona si el elemento anchor A tiene el atributo href.

Al utilizar el atributo hreflang, el agente de usuario o navegador podrá identificar los lenguajes que se pueden utilizar y avisar al usuario.

Hay que reseñar que de esta forma solo indicamos el lenguaje base del recurso destino y que queda en manos del desarrollador. Por desgracia, seguimos sin tener una forma estándar de indicarle a la página o recurso destino el idioma deseado. Seguro que algún día lo tendremos :-)

Foto de Víctor Cuervo

Víctor Cuervo

Programador, Arquitecto IT, álter ego de Línea de Código, amante de las tecnologías, generador de conocimiento y facilitador del aprendizaje.

Descarga el código de Idioma del enlace en HTML

Aprende a configurar el idioma del enlace en HTML utilizando el atributo hreflang para mejorar la accesibilidad y el SEO de tus páginas web.

Descargar código