En este artículo, veremos cómo se puede servir el contenido de la página en varios idiomas. Podemos configurar el idioma en el documento HTML configurando el atributo lang en el código. Por defecto, el idioma especificado es el inglés, pero se puede cambiar a nuestra conveniencia. Hay una manera de cambiar el idioma del contenido usando Google para eso, puede consultar este artículo, ¿Cómo agregar el botón Google Translate en su página web? ,
Por defecto:
<html lang="en">
Para cambiar el idioma, simplemente configure el atributo lang . Podemos definirlo en cualquier parte del documento, como en el cuerpo, en el párrafo, en el encabezado o en la etiqueta span. Pero la mejor práctica es establecer el lang en la etiqueta span.
-
Ejemplo 1: Como aquí, hemos cambiado el idioma a francés en la etiqueta span.
<p> French " <span lang="fr"> Bonjour </span> " </p>
-
Ejemplo 2:
<p> Spanish " <span lang="es">Hola</span> "</p>
Ahora veamos todo el código HTML a través del cual podemos entenderlo mejor. Tenga en cuenta que al cambiar el atributo lang , la imagen del documento HTML sigue siendo la misma. La única diferencia estará ahí en la traducción de ese idioma.
Para realizar esta tarea, tenemos 2 formas de lograr el mismo resultado. El primero que estamos siguiendo el enfoque a continuación en el que el atributo Html lang se configura en inglés o en francés o en cualquier idioma adecuado y el segundo enfoque, usaremos la referencia de la API de traducción de Google y agregaremos esta API a nuestro Html código. Comencemos la discusión con nuestro primer enfoque.
A continuación, hay dos ejemplos que muestran lo que sucede cuando cambia el idioma de su documento HTML que no sea el idioma de su navegador. En el primer ejemplo, el documento HTML se publica en el idioma «INGLÉS», mientras que en el segundo ejemplo, el documento HTML se publica en el idioma «FRANCÉS».
Ejemplo 1: documento HTML en idioma inglés
HTML
<!DOCTYPE html> <html lang="en"> <body> <p> We can use different languages in the HTML document simply by defining the "lang" property </p> <p>French " <span lang="fr">Bonjour</span> "</p> <p>Spanish " <span lang="es">Hola</span> "</p> <p>Hindi " <span lang="hi">नमस्ते</span> "</p> </body> </html>
Producción:
Salida cuando se utiliza el idioma inglés
Ejemplo 2: documento HTML con un idioma diferente (que no sea inglés) (aquí se usa el francés)
HTML
<!DOCTYPE html> <html lang="fr"> <body> <p> We can use different languages in the HTML document simply by defining the "lang" property </p> <p>French " <span lang="fr">Bonjour</span> "</p> <p>Spanish " <span lang="es">Hola</span> "</p> <p>Hindi " <span lang="hi">नमस्ते</span> "</p> </body> </html>
Salida: aquí puede ver que no hay diferencia en el documento HTML. Se verá exactamente igual, excepto si el idioma es inglés o francés. La única diferencia es que el navegador podrá comprender o identificar que el idioma de todo el documento HTML es francés o inglés o algún otro idioma y, en función de eso, traducirá la página a su idioma preferido.
Traducción de idiomas
Publicación traducida automáticamente
Artículo escrito por jimishravat2802 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA