¿Cómo preparar su software para la traducción?

Antes de usar PTC, asegúrese de que el software gestione bien el texto, use marcadores y cargue el idioma correcto.

Preparación de su software para la traducción por primera vez

Para preparar su software para la traducción, necesitará:

  • Mover todo el texto visible para el usuario a archivos de recursos
  • Utilice placeholders para contenido dinámico
  • Cargar el archivo de traducción correcto según el idioma del usuario

Estos pasos se aplican a todos los lenguajes y marcos de programación. PTC admite múltiples formatos de archivo de recursos, incluidos .po, .json, .yaml, .strings y .xml.

1. Mover todo el texto visible para el usuario a archivos de recursos

Coloque todo el texto visible para el usuario, como etiquetas, mensajes de error e indicaciones para el usuario, en archivos de recursos. PTC lee de los archivos de recursos y no detecta cadenas de texto codificadas en su código fuente. Este es un paso de preparación importante cuando desea traducir los archivos strings.xml de su aplicación Android o localizar sus aplicaciones iOS.

La mayoría de los frameworks incluyen una función o biblioteca de internacionalización (i18n) que le ayuda a marcar el texto traducible y a almacenarlo en el formato de archivo de recursos correcto.

  • En React y Vue, bibliotecas como react-intl y vue-i18n le proporcionan una forma de cargar y utilizar archivos de traducción. Las traducciones se almacenan entonces en los archivos JSON que genera.
  • Ruby on Rails incluye el módulo I18n.
  • WordPress utiliza la función __() para marcar cadenas para la traducción, que luego se compilan en archivos PO.

Ejemplo correcto (React y archivo JSON)

En su código:

<button>{t('submit_button')}</button>

En su archivo de recursos (en.json):

{
  "submit_button": "Submit"
}

Ejemplo correcto (WordPress y archivo PO)

En su código:

<?php echo __( 'Submit', 'your-textdomain' ); ?>

En su archivo de recursos (en.json):

msgid "Submit"
msgstr ""

Ejemplo incorrecto (cadena de texto codificada)

<button>Submit</button>

2. Utilice placeholders para contenido dinámico

Cuando su texto incluya valores dinámicos, como nombres de usuario, fechas o números, no los inserte directamente en la cadena de texto. Utilice placeholders en su lugar. Esto mantiene las traducciones precisas y evita romper la gramática o el diseño en otros idiomas.

PTC detecta y conserva los placeholders durante la traducción.

Ejemplos correctos

Archivo PO:

msgid "Hello, %s!"
msgstr ""

Archivo JSON:

{
  "greeting": "Hello, {name}!"
}

Archivo YAML:

greeting: "Hello, %{name}!"

Ejemplo incorrecto (concatenación de cadenas de texto)

const name = 'John';
const message = 'Hello, ' + name + '!';

Si divide o construye cadenas de texto en su código, PTC no verá la frase completa. Eso puede llevar a una gramática incorrecta, una redacción torpe o traducciones faltantes.

Asegúrese de utilizar una sintaxis de placeholder que funcione con su framework. Aquí hay algunos patrones comunes:

Formato de archivoSintaxis común de placeholderUtilizado en
.json{name}JavaScript (React, Vue)
.yaml%{name}Ruby on rails
.po%s, %d, %1$s, %2$dWordPress, PHP
.xml%1$s, %2$dAndroid
.strings%@, %d, %fiOS/macOS

3. Asegúrese de que su software sabe cómo cargar archivos de recursos

Una vez que su texto se almacena en archivos de recursos, su aplicación necesita cargar el archivo correcto según el idioma del usuario. Sin este paso, el usuario no verá las traducciones.

La mayoría de los frameworks y plataformas lo admiten a través de sus herramientas i18n:

  • React/Vue: Utilice bibliotecas como react-intl o vue-i18n, que se encargan de cargar los archivos correctos en tiempo de ejecución
import { createI18n } from 'vue-i18n'

const i18n = createI18n({
  locale: detectBrowserLanguage(),
  messages: {
    en: require('./locales/en.json'),
    fr: require('./locales/fr.json')
  }
})
  • Ruby on Rails: El módulo I18n carga automáticamente los archivos de traducción YAML
I18n.locale = request.env['HTTP_ACCEPT_LANGUAGE']
  • WordPress: Carga los archivos .mo automáticamente según el idioma del sitio

En las aplicaciones web, también puede detectar el idioma preferido del usuario desde el navegador y utilizarlo para establecer el idioma predeterminado. Por ejemplo:

  • React/Vue

Utilice la biblioteca i18next-browser-languagedetector para detectar automáticamente el idioma del navegador. Esta biblioteca comprueba la configuración de idioma del navegador y aplica el idioma apropiado como predeterminado.

  • Ruby on rails

Detecte el idioma del navegador utilizando el encabezado HTTP_ACCEPT_LANGUAGE y establezca el idioma con I18n.locale.

Para las aplicaciones móviles, plataformas como Android e iOS cargan los archivos de recursos de forma diferente:

  • Android: Almacena los archivos de traducción en el directorio res/values, con subcarpetas para cada idioma (por ejemplo, res/values-fr para francés). Android carga el archivo de idioma correcto según la configuración del sistema del dispositivo.
  • iOS: Coloque los archivos .strings en carpetas .lproj específicas del idioma (por ejemplo, en.lproj/Localizable.strings). iOS selecciona la carpeta apropiada automáticamente.

4. Añada un selector de idiomas (si es necesario)

Como se ha tratado en el paso anterior, la mayoría de las plataformas utilizan la configuración del sistema o del navegador para cargar el idioma predeterminado. Pero algunos usuarios pueden querer cambiar a uno diferente, especialmente en la web. Un selector de idiomas les da esa opción.

Es opcional, pero a menudo mejora la accesibilidad y el control del usuario. La implementación difiere según el framework:

React/Vue

Utilice bibliotecas como react-intl o vue-i18n para establecer el idioma. Tendrá que crear el selector de idiomas usted mismo (por ejemplo, un menú desplegable o un botón) para recargar los archivos de recursos apropiados en función de la selección del usuario.

Ruby on rails

La biblioteca I18n le permite cambiar el idioma mediante programación, pero debe diseñar la interfaz del selector de idiomas. La aplicación vuelve a cargar la página con el archivo YAML correcto una vez que el usuario selecciona un idioma.

WordPress

Los temas y plugins utilizan el idioma establecido en el backend. Para traducir el contenido generado por el usuario o proporcionar un selector de idiomas en el front-end, utilice un plugin multilingüe como WPML.

Traducción de sus archivos de recursos con PTC

Una vez que sus archivos estén listos, puede traducirlos con PTC. No necesita copiar y pegar cadenas de texto, mantener scripts frágiles ni contratar traductores humanos. PTC ofrece traducciones de calidad humana, optimizadas para el tono, el público y la plataforma de su producto.

Paso 1: regístrese y elija cómo utilizar PTC

Comience su prueba gratuita de 30 días de PTC. Puede elegir entre tres formas de usar PTC: conectar su repositorio de Git, cargar archivos manualmente o usar la API para enviar y recibir archivos de forma programática.

Paso 2: configure su proyecto

A continuación, configurará su proyecto.

Se le pedirá el nombre de su producto, su función, a quién va dirigido (público objetivo) y los idiomas a los que desea traducir.
Esto ayuda a PTC a comprender el contexto de su proyecto y a generar traducciones precisas y relevantes para la marca que se leen como si hubieran sido escritas por un experto del sector.

Paso 3: reciba traducciones impulsadas por IA a través de una solicitud de combinación

PTC ofrece traducciones de calidad humana a la velocidad y el coste de una máquina. Tendrá traducciones listas para usar en su proyecto en cuestión de minutos.

¿Listo para traducir su software?

Ha preparado sus archivos de recursos: PTC se encarga del resto. Inicie su prueba gratuita para obtener traducciones para su software con reconocimiento del contexto y mejores que las humanas.

Ir arriba