Durante más de 10 años ayudamos a las empresas a alcanzar sus objetivos financieros y de marca. Onum es una agencia de SEO basada en valores dedicada.

CONTACTOS
Nuestro viaje

Consejos de diseño de sitios web en varios idiomas

Numerosos sitios web ahora tienen muchas opciones de idioma para que sus visitantes de todo el mundo puedan navegar cómodamente. Internet ha ayudado a hacer del mercado una experiencia global, por lo que al tener un sitio web, ha abierto las puertas de su negocio a todas las personas con conexión a Internet. Sin embargo, si no entienden el idioma, no se quedarán.

Por suerte, el proceso de convertir su sitio web en varios idiomas es bastante simple. ConveyThis puede crear una versión traducida de su sitio en minutos y luego puede personalizar la apariencia y la ubicación de su cambiador de idioma, realizar algunos cambios de diseño para adaptarse a los idiomas más wordier o de derecha a izquierda y cambiar los colores y las imágenes en aquellos casos en los que los originales no son adecuados para la referencia cultural de destino.

El proceso no está completamente automatizado, deberá investigar un poco de antemano. Esta guía explica algunos aspectos del diseño de sitios web para ayudarlo a ingresar cómodamente en el mundo de los sitios web multilingües y el excelente diseño.

Marca consistente

La experiencia del usuario debe ser coherente independientemente de la versión de idioma que esté visitando. La apariencia debe ser muy similar en todas las versiones, algunas diferencias pueden ser necesarias debido a diferencias de idioma o cultura, pero si cambia de idioma, no debería sentir que ha sido redirigido a un sitio completamente diferente.

Por lo tanto, los elementos de diseño como el diseño y el estilo de marca particular de su empresa deben seguir siendo los mismos en todos los idiomas.

Esto es muy fácil de hacer en WordPress con ConveyThis, que identifica perfectamente el texto independientemente del tema que hayas elegido (¡incluso si está personalizado!) y lo traduce automáticamente, incluso si estás trabajando con otros plugins.

Esto le ayudará a tener una plantilla global con el mismo tema para todos los idiomas y, por lo tanto, la misma experiencia de usuario.

La página de inicio de Airbnb funciona muy bien como ejemplo, echemos un vistazo a la versión australiana:

Y aquí está la versión japonesa:

Sin duda, este es el mismo sitio web. El fondo es el mismo y también la función de búsqueda. Tener un diseño unificado ayuda a la identidad de su marca y ahorra tiempo y esfuerzo al agregar nuevos idiomas o actualizar.

Cambiadores de idioma claros

Elija una ubicación destacada para el selector de idiomas, como cualquiera de las cuatro esquinas de su sitio web, y colóquelo en cada página, no solo en la página de inicio. Tiene que ser fácil de encontrar, nadie quiere buscar un botón oculto.

Es muy recomendable que los nombres de los idiomas estén en su propio idioma. "Español" en lugar de "español", por ejemplo, hará maravillas. Asana hace esto, su sitio tiene un cuadro desplegable con las opciones de idioma disponibles.

De esta forma ayuda a los visitantes a sentirse bienvenidos. Si su sitio web está traducido, la lista de idiomas debería reflejarlo. Leer “alemán, francés, japonés” en un sitio web en inglés no facilita la navegación a las personas y da la impresión de que la versión en inglés es la más importante.

"Idiomas" es mejor que "Regiones"

Muchas grandes marcas internacionales le obligan a cambiar de región para poder leer el sitio web en su idioma. Esta es una idea terrible que dificulta la navegación para los visitantes. Estos sitios web funcionan asumiendo que está navegando en la región donde se habla el idioma, por lo que obtiene el texto en su idioma, pero es posible que no obtenga el contenido de la región que le interesa.

La siguiente imagen fue tomada del sitio web de Adobe:

Los idiomas no deberían ser indisociables de sus regiones. Tomemos como ejemplo todas esas ciudades cosmopolitas como Nueva York, Londres y París. Tal vez una persona belga que vive en el Reino Unido quiera comprar en el sitio del Reino Unido pero navegar en francés. Tienen que elegir entre comprar en el sitio belga en su idioma o comprar en el sitio del Reino Unido en inglés, y no quieren hacer ninguna de las dos cosas. Por tanto, ha creado accidentalmente una barrera. Echemos un vistazo a un sitio web que le permite especificar el idioma y la región por separado, el sitio web de Uber.

Este es un excelente diseño. En este caso, la opción de cambio de idioma se ha colocado en el pie de página de la izquierda y, en lugar de un cuadro desplegable, tiene un modal debido a las numerosas opciones. Los nombres de los idiomas también se mencionan en su propio idioma.

Como beneficio adicional, podría "recordar" cuál fue el idioma elegido por el usuario para que desde esa primera visita en adelante ya no tenga que cambiar.

Detectar ubicación automáticamente

Esta función es muy útil para que sus visitantes no accedan a través del idioma incorrecto. Y para ahorrar tiempo por parte del usuario para que no tenga que buscar el conmutador de idioma. Así es como funciona: el sitio web identifica el idioma en el que se encuentra el navegador o su ubicación.

Pero tenga cuidado en caso de que el usuario sea un turista y no esté familiarizado con el idioma local porque necesitará el botón de idioma para poder cambiar, por esta razón, la herramienta no siempre es precisa.

Al diseñar su sitio en varios idiomas, no elija entre la detección automática de idioma y el conmutador de idioma, este último es obligatorio mientras que el primero es opcional.

Las banderas no son reemplazos adecuados para el nombre de un idioma

Hay 21 países de habla hispana y 18 países de habla inglesa, y en China, hay 8 dialectos primarios, por lo que las banderas no son buenos sustitutos de los nombres de los idiomas. Además, las banderas pueden no ser indicadores útiles porque pueden confundir a quienes no las reconocen.

Sea flexible con el espacio de texto

Esto puede ser un desafío, pero es innegable que las traducciones no ocupan el mismo espacio que el texto original, algunas pueden ser más cortas, otras pueden ser más largas, ¡algunas incluso pueden necesitar más espacio vertical!

Los caracteres chinos contienen mucha información, por lo que no se necesita mucho espacio, mientras que el italiano y el griego son más prolijos y necesitan el doble de líneas. Una buena regla general es asumir que algunas traducciones pueden requerir más de un 30% de espacio adicional, así que sea flexible con el diseño y asigne espacios amplios para el texto. Es posible que esos espacios reducidos en el sitio web original no tengan suficiente espacio para la traducción, el inglés es un idioma particularmente compacto, y si encuentra la necesidad de abreviar en inglés para que el contenido se ajuste, definitivamente encontrará algunos problemas cuando sea necesario. hora de traducir.

Además de tener espacio para que el texto se estire, también es una buena idea tener elementos de interfaz de usuario adaptables para que los botones y los campos de entrada también puedan crecer, también puede disminuir el tamaño de la fuente, pero no demasiado.

El sitio web de Flickr es multilenguaje, echemos un vistazo al botón de "vistas" original:

Se ve fantástico, todo es genial, pero 'vistas' resulta ser una palabra más larga en otros idiomas, requiriendo más espacio.

¡En italiano requiere tres veces más espacio!

Muchas escrituras no latinas, como el árabe, requieren más altura para que la traducción se ajuste. Entonces, para resumir, el diseño de su sitio web debe ser lo suficientemente flexible para adaptarse a los diferentes requisitos de idioma, de modo que en el cambio no se pierda el aspecto pulido del original.

Compatibilidad de fuentes web y codificación de sitios web

Según el W3C, se recomienda encarecidamente que codifique su página web utilizando UTF-8 , que permite caracteres especiales.

Es bastante simple, la declaración UTF se ve así

También asegúrese de que las fuentes sean compatibles con los diferentes idiomas, de lo contrario, el texto puede terminar pareciendo ilegible. Básicamente, antes de decidirse por cualquier fuente, verifique su compatibilidad con todos los scripts que necesite. Si desea ingresar al mercado ruso, verifique que la escritura cirílica sea compatible.

La siguiente imagen fue tomada de Google Fonts y, como puede ver, puede elegir descargar las versiones de scripts que necesite. Los idiomas con mayor cantidad de caracteres generan archivos de fuentes más grandes, así que téngalo en cuenta al elegir y mezclar fuentes.

Con respecto a los idiomas de derecha a izquierda

A medida que crece el mercado de Oriente Medio, puede considerar crear una versión de su sitio web que atraiga visitantes de esta región, esto significa adaptar el diseño para que sea compatible con su idioma. Un rasgo característico de la mayoría de los idiomas del Medio Oriente es que se leen de derecha a izquierda. Este es un gran desafío y la solución comienza con la duplicación de la interfaz.

Este es el diseño de Facebook para idiomas de izquierda a derecha, como el inglés.

Y este es el diseño invertido para idiomas de derecha a izquierda, como el árabe.

Mire de cerca, la ubicación de todo en el diseño se ha reflejado.

Consulte el artículo de Robert Dodis sobre diseño para idiomas de derecha a izquierda para obtener más información sobre cómo hacerlo.

Algunos idiomas de derecha a izquierda son árabe, hebreo, persa y urdu y ConveyThis no tiene problemas para adaptar su sitio web para adaptarse a sus requisitos de idioma y garantizar una gran experiencia de usuario. Y lo mejor es que puedes personalizar el aspecto de cada idioma y realizar cambios en el tipo de fuente o su tamaño, y si es necesario, editar la altura de la línea.

Elija iconos e imágenes apropiados

Las imágenes tienen un componente cultural muy pesado y son elementos clave del diseño adecuado de un sitio web. Cada cultura asigna significado a diferentes imágenes e íconos, algunas interpretaciones son positivas y otras completamente opuestas. Algunas imágenes reflejan las experiencias de los ideales de una cultura pero en un contexto diferente harán que los usuarios se sientan alienados.

Aquí hay un ejemplo de una imagen que tuvo que ser reemplazada porque no era culturalmente apropiada. Tenga en cuenta que no todas las imágenes serán ofensivas para los demás, tal vez solo genere apatía cuando desee que la gente sienta curiosidad e interés en su producto.

Esta es la página de inicio de Clarín para el idioma francés, con una mujer caucásica. Y aquí está la versión coreana, con una mujer coreana como embajadora de la marca.

El tipo de imágenes que pueden ofender son aquellas que pueden parecer inocentes para algunas culturas, pero, a los ojos de una cultura diferente, muestran comportamientos que son ilegales o tabú, por ejemplo, representaciones de homosexualidad o empoderamiento femenino.

Esto también se aplica a los íconos, mientras que en los EE. UU. Un ícono con dos copas de champán brindando representa una celebración, en Arabia Saudita es ilegal beber alcohol, por lo que ese ícono tendrá que ser reemplazado por uno culturalmente apropiado.

(Fuente de imagen: SteelKiwi)

Por lo tanto, se requerirá investigación para garantizar que los íconos que ha elegido sean adecuados para el mercado objetivo. Si no está seguro, siempre puede ir a lo seguro.

Por ejemplo, estos tres íconos con la Tierra, el primero fue diseñado para el público australiano; el segundo, para el público africano; y el último es adecuado para audiencias más grandes y globales, ya que no se presenta un área en particular.

Por último, pero no menos importante, ConveyThis puede traducir cualquier texto, siempre y cuando no esté incrustado en una imagen. El software no será capaz de identificar lo que está escrito en él por lo que permanecerá en el idioma original, así que evite incrustar texto.

Elección de colores

Como se mencionó en el apartado anterior, las culturas interpretan las imágenes de manera diferente y ocurre lo mismo con los colores. Sus significados son subjetivos.

Por ejemplo, en algunas culturas, el blanco es el color de la inocencia, pero otros no estarían de acuerdo, es el color de la muerte. Lo mismo ocurre con el rojo, en las culturas asiáticas se usa en celebraciones pero para algunos países africanos no tiene una connotación tan positiva ya que está ligado a la violencia.

Sin embargo, parece que el azul es el más seguro de todos los colores, comúnmente asociado con significados positivos como calma y paz. Muchos bancos usan el azul en sus logotipos porque también puede significar confianza y seguridad.

Este artículo muestra las diferencias en los significados de los colores en todo el mundo , muy útil para comenzar su investigación sobre cuáles son los mejores colores para su sitio multilingüe.

Ajustes de formato

Considere evitar el uso de solo números al escribir fechas porque hay muchas maneras diferentes de escribirlos, en los EE.UU. el formato oficial es mm / dd / aaaa y si sólo se puede ver los números algunos usuarios de otros países que utilizan diferentes sistemas (como dd / mm / aaaa) puede confundirse. Así que sus opciones son: asegurarse de que las versiones traducidas tengan el formato de fecha adaptado o escribir el mes en letras para que ConveyThis siempre escribirá la fecha correcta.

Además, mientras que en los EE. UU. Se usa el sistema imperial, la mayoría de los países usan el sistema métrico, por lo que deberá decidir si sería adecuado para su sitio transformar las medidas.

El mejor plugin de traducción para WordPress

Hay tantas opciones cuando se trata de agregar un plugin de traducción a su sitio web WordPress y no todas funcionan de la misma manera, los resultados variarán. Con ConveyThis se le garantiza una integración perfecta sin importar el diseño de su sitio web.

ConveyThis es la mejor opción para la traducción de sitios web con 92 idiomas disponibles. Es un plugin de WordPress confiable que le permitirá tener una versión sólida en varios idiomas de su sitio web rápidamente. Puede entender el diseño del sitio, detectar todo el texto y traducirlo. ConveyThis también incluye un editor intuitivo para la personalización de texto.

ConveyThis incluye un botón de cambiador de idioma único que funciona con cualquier sitio de forma predeterminada, pero también puede editarlo tanto como desee. También seguimos los principios de diseño enunciados en este artículo:

  • Marca coherente en todas las versiones lingüísticas del sitio web.
  • Selector de idioma claro y la opción de elegir un idioma preferido.
  • Los sitios web se codifican con UTF-8 automáticamente.
  • Interfaces adecuadas para idiomas de derecha a izquierda

ConveyThis: una solución de sitio web en varios lenguajes en la que puede confiar

Se cree comúnmente que la traducción del sitio web es un proceso complejo. Pero no hay necesidad de posponerlo porque no quieres lidiar con los dolores de cabeza. ¡No es nada desalentador! Con ConveyThis, se convierte en una conversión directa. Es fluido y rápido.

Después de una instalación rápida, todo el contenido ahora se puede traducir sin afectar al formato, y eso incluye el contenido generado por otras aplicaciones y el proceso de pago. ConveyThis es una herramienta fácil para la traducción de sitios web en varios idiomas que no hará un lío de su código, como hacen otros.

¡También está disponible la opción de solicitar traducciones profesionales de su sitio! Le ayudarán a transformar completamente su sitio web multilingüe en uno multicultural, mejorando drásticamente la experiencia de sus clientes. Recuerde que si traduce un sitio web, también debe tener disponible el servicio de atención al cliente en el idioma de su nuevo cliente. Considere invertir en la localización y adaptación de contenido para garantizar una excelente experiencia de usuario para sus visitantes.

Autor

Alex Buran

Comentarios (4)

  1. ¡El fin a la vista para Google-Translate para sitios web! – ConveyThis
    8 de diciembre de 2019 Respuesta

    […] El texto relacionado con la computadora en sueco. Elementos como estos ayudaron al equipo de diseño a formular un camino para los clientes que visitan la plataforma, hacia una experiencia de traducción fácil y evitando el índice de desplazamiento como antes […]

  2. Optimización global de motores de búsqueda para todas las plataformas de idiomas: ConveyThis
    10 de diciembre de 2019 Respuesta

    […] Se formulen las ideas en torno a la plataforma multilingüe y la base de clientes, lo siguiente sería una mirada al ingrediente textual del lenguaje […]

  3. Gire su WooCommerce Multilingual – ConveyThis
    19 de marzo de 2020 Respuesta

    [...] y conseguir un linguista de la ConveyThis equipo para echar un vistazo y editarlo para que pueda estar seguro de que la redacción y el tono son adecuados para los valores de su tienda y [...]

  4. ¿Qué tan personalizable es WooCommerce? – ConveyThis
    23 de marzo de 2020 Respuesta

    […] Que las imágenes siempre están muy cargadas de significado cultural, y las diferentes audiencias tienen diferentes expectativas de cómo las tiendas deben mostrar su […]

Deja un comentario

Su dirección de correo electrónico no se publicará. Los campos obligatorios están marcados como *