Artículos
HTML5

Texto no traducible con HTML5

06/Dic/2021

Hoy en día es muy fácil que estemos viendo una página web y que nuestro navegador web a la hora de visualizarla detecte que esté en otro idioma y nos ofrezca, de una manera sencilla, el poder traducir el texto a nuestro idioma. Pero qué sucede si nosotros, como desarrolladores, queremos que haya una parte del texto que no se traduzca. Que cuando un usuario vea la página y utilice un traductor automático no perdamos el idioma original. Así que, en este artículo, vamos a ver cómo podemos crear texto no traducible con HTML5 de una forma muy sencilla.

Y es que dentro de nuestro texto puede darse el caso que queramos mantener una parte invariable aunque entren los traductores automáticos y que siempre se muestre tal cual la diseñamos. Esto puede darse en nombres de empresas, eventos que tengan un nombre en concreto,…

Para poder trabajar con texto no traducible con HTML5 vamos a recurrir al atributo translate. El atributo translate es un atributo global que podemos aplicar sobre cualquier elemento. De tal manera que los elementos de texto anidados a dicho elemento no serán traducidos.

En nuestro caso vamos a utilizar directamente un elemento de texto.

<p>Explicado por Línea de Código. Si pruebas verás que esta última línea no se traduce.</p>

Lo que hacemos es añadir el atributo translate directamente sobre el elemento p aplicando el valor «no».

<p translate="no">Explicado por Línea de Código. Si pruebas verás que esta última línea no se traduce.</p>

Ahora, cuando carguemos la página con este código y le pasemos el traductor automático veremos que no se traduce.

De esta forma tan sencilla podemos crear págnas web que contengan texto no traducible con HTML5.

Código Fuente

Descárgate el código fuente de Texto no traducible con HTML5
Y si te ha gustado nuestro código fuente puedes regalarnos una estrella Star

Vídeos sobre HTML5

Disfruta también de nuestros artículos sobre HTML5 en formato vídeo. Aprovecha y suscribete a nuestro canal.

Test HTML5

¿Te atreves a probar tus habilidades y conocimiento en HTML5 con nuestro test?

Test HTML5
Suscribir
Notificar de
guest
0 Comentarios
Opiniones integradas
Ver todos los comentarios