Cómo crear un sitio web multi-idioma

Best practice > Paso 1 - Ajustes > Sección Avanzadas >

Cómo crear un sitio web multi-idioma

Previous pageReturn to chapter overviewNext page
Mostrar/ocultar el texto oculto

Internet permite sobrepasar las fronteras nacionales y, si se espera que el sitio web será consultado también por personas de otra nacionalidad, es aconsejable ofrecer la elección entre varios idiomas.

Gestionar un sitio web en idiomas diferentes añade un cierto grado de complejidad al proyecto, pero gracias a las funciones que WebSite X5 pone a disposición y pudiendo contar con un buen servicio de traducción, esta tarea puede ser llevada a cabo brillantemente.

En primer lugar, es importante reseñar que WebSite X5 genera todos los archivos HTML de las páginas de un sitio web utilizando la codificación de caracteres UTF-8 (Unicode Transformation Format 8 bit). Gracias a la utilización de la UTF-8 es posible realizar sitios web en cualquier lengua, incluidas las que utilizan alfabetos diferentes del latino, como por ejemplo el griego, el cirílico, el copto, el armenio, el hebreo y el árabe, sin olvidarnos del chino, el japonés o el coreano. Además, no solo es posible crear un sitio web en cualquier idioma sino también es posible contar con textos en lenguas diferentes dentro de un mismo sitio, sin tener problemas de visualización de caracteres: por ejemplo, podremos considerar tranquilamente poner un texto en ruso con su traducción al lado en español.

En la tarea de creación de un sitio web, WebSite X5 permite, en primer lugar, asociar una lengua al proyecto (en las ventanas Ajustes del Sitio web opción Idioma de los contenidos): este paso es fundamental para una correcta gestión de los textos que el programa añade automáticamente. Además de algunos idiomas preinstalados, es posible acceder a la ventana Gestión de contenido de idioma pulsando el botón para crear/importar otros idiomas o modificar los elementos de los ya presentes (ver Cómo manejar los idiomas para los textos añadidos automáticamente).

Por último, WebSite X5 permite crear un sitio web multi-idioma en el que se da al visitante la posibilidad de elegir el idioma de consulta que prefiere entre los que hay disponibles o, trabajando con la edición Pro, o se le presenta automáticamente la versión del Sitio web que mejor debería responder a sus necesidades. En este caso, no hace falta más que crear un proyecto para cada idioma y unirlos entre sí como si fuesen secciones diferentes de un único sitio web. Los modos de unir proyectos entre sí que se diferencian solo en el idioma de consulta son básicamente dos: el primero se sirve de la Página de Entrada, el segundo de la posibilidad de insertar enlaces directamente en el encabezado de la plantilla. Con la edición Pro, a estos se añade un tercer método, que se sirve de la posibilidad de registrar el Idioma del Navegador para configurar el redireccionamiento automático.

Pulsar para expandir/reducirHow To: Cómo crear un Sitio multi-idioma mediante la Página de inicio

Suponiendo que queremos crear un sitio consultable en español, inglés y portugués, es posible utilizar la Página de Entrada para insertar los botones que permiten al visitante elegir en qué idioma quiere ver los contenidos.

Antes de nada, es necesario crear el sitio web en español definiendo su estructura y sus contenidos en Ajustes del Sitio web configurar "ES - Spanish" como Idioma de los contenidos.
En el Paso 1 - Ajustes del Sitio web | Avanzadas pulsar sobre el botón Página de Entrada y, en la ventana correspondiente, activar la opción Mostrar la página de Entrada, seleccionar Mostrar la Página de Entrada y solicitar elegir el idioma, especificando qué imagen/animación mostrar como Fondo de la página y ajustando todos los parámetros necesarios para darle el aspecto deseado.
Mediante los comandos disponibles, componer la Lista de idiomas. De la lista propuesta, seleccionar los elementos "Deutsch", "Italiano" y "Français", correspondientes a las lenguas no contempladas, y pulsar el botón Eliminar. Pulsar a continuación sobre el botón Agregar... para abrir la ventana Configurar idioma y añadir el idioma portugués: como Nombre de idioma que debe mostrarse introducir "português" e importar un archivo para la imagen asociada.
De manera análoga, seleccionar los elementos "Español" y "English" y pulsar el botón Editar... para abrir la ventana Configurar idioma y añadir las imágenes de las banderas que faltan.
Puesto que el proyecto actual es en español (el único al que se asociará la Página de Entrada), seleccionar el elemento "Español" de la Lista de idiomas y pulsar sobre el botón Valor preestablecido.
Usar los botones Subir y Bajar para ordenar los idiomas del modo más oportuno.

Añadir las imágenes de las banderitas de las lenguas, es preciso definir los enlaces sobre ellas. Suponiendo que se creará un sitio para cada lengua y que este será publicado en internet, es posible contemplar un enlace a un URL:

En la Lista de idiomas seleccionar el elemento "English" y pulsar el botón Editar... para abrir la ventana Configurar idioma.
Pulsar sobre el botón disponible para la opción Enlace para este idioma (ej muestra la página web en este idioma) y, en la ventana Enlace que se abre, seleccionar la acción Archivo o URL y especificar el URL del sitio web en inglés: por ejemplo, http//www.misitio.es/en/index.html, si se desea publicar el sitio web en inglés en la subcarpeta "en" de la carpeta principal del Servidor.
Repetir las mismas operaciones también para el sitio web en portugués enlazándolo al URL correspondiente: por ejemplo http//www.misitio.es/pt/index.html, si se desea publicar el sitio web en portugués en la subcarpeta "pt" de la carpeta principal del Servidor.

Una vez hecho todo esto, el sitio web está preparado para ofrecer la elección del idioma pero faltan todavía los contenidos correspondientes de los idiomas inglés y portugués.

Para avanzar más rápidamente en la creación del sitio en inglés, crear una copia del sitio en español: en la ventana inicial Elección del proyecto seleccionar el proyecto del sitio en español y pulsar en el botón Duplicar. Pulsar a continuación sobre el botón Renombrar para cambiar el nombre del nuevo proyecto por uno más apropiado.
Abrir la copia del proyecto y en Ajustes del Sitio web configurar "EN - English" como Idioma de los contenidos: continuar introduciendo las localizaciones para todos los textos y los elementos que dependan del idioma.
En el Paso 1 - Ajustes del Sitio web | Avanzadas, acceder a la ventana Página de Entrada y desactivar la opción: Mostrar la página de Entrada.
Una vez terminado el proyecto del sitio web en inglés, repetir la misma operación también para configurar el proyecto del sitio web en portugués.

Para la publicación en el Servidor de los sitios web realizados es preciso proceder de la siguiente manera:

Publicación del sitio en español: el sitio en español es al que está asociada la Página de Entrada y ha sido configurado como "prefedefinido". Procediendo a la publicación se creará un archivo index.html, correspondiente a la Página de Entrada, que se guardará en la carpeta de publicación. Para que haya coherencia con los URL configurados para los sitios en inglés y portugués, es necesario crear en el servidor las subcarpetas previstas: "en" y "pt".

Una vez concluido este paso, el sitio español estará en línea y en la Página de Entrada estarán activos los enlaces en los botones de idioma, que por ahora no conducirán a ninguna página.

Publicación del sitio web en inglés: para que el enlace que hay en la Página de Entrada al sitio inglés funcione, hay que publicar el proyecto en la subcarpeta "en" que se ha creado.
Publicación del sitio web en portugués: para que el enlace que hay en la Página de Entrada al sitio portugués funcione, hay que publicar el proyecto en la subcarpeta "pt" que se ha creado.

Una vez publicados los tres sitios en las subcarpetas correspondientes, los botones de la Página de Entrada funcionarán correctamente y permitirán al visitante consultar los contenidos del sitio web en la lengua que prefiera.

Mediante la opción Enlace para este idioma (ej muestra la página web en este idioma) de la ventana Configurar idioma es posible configurar para las imágenes asociadas a los idiomas (en la mayor parte de los casos, las banderitas) diferentes tipos de acciones. Esto significa que, en lugar de enlazar en ellas un sitio web completo como se ha visto en el ejemplo, se puede enlazar una simple página interna o un mensaje de aviso para explicar que el sitio en un idioma determinado todavía no está disponible pero lo estará lo antes posible, o un documento en PDF con toda la información que se quiere dar para un idioma, o poner en práctica otras soluciones según el caso.

Pulsar para expandir/reducirHow To: Cómo crear un sitio multi-idioma a través de los botones en el encabezado de la plantilla

Suponiendo que queremos crear un sitio consultable en español, inglés y portugués, un modo alternativo o complementario a la Página de Entrada para ofrecer los botones para la elección de la lengua es insertarlos en el encabezado de la plantilla del sitio. Este método ofrece la ventaja de dar al visitante la posibilidad de cambiar de idioma de consulta en cualquier momento y desde cualquier página del sitio web.

Antes de nada, es necesario crear el sitio web en español definiendo su estructura y sus contenidos en Ajustes del Sitio web configurar "ES - Spanish" como Idioma de los contenidos.
Acceder a la ventana Contenido de la Plantilla para poder modificar el encabezado y crear los botones que permitiran al visitante elegir el idioma de consulta.
Mediante el Objeto Imagen, importar el archivo gráfico de la imagen de una banderita española: si se quiere crear un botón con efecto de mouseover, usar la opción Efecto mouseover por paso del ratón para importar una segunda imagen, ligeramente diferente de la primera.
Repetir esta operación para crear también los botones con las banderas inglesa y portuguesa.
Seleccionar el botón con la bandera inglesa y pulsar el comando Enlace: en la ventana Enlace que se abre, seleccionar la acción Archivo o URL y activar la opción Archivo de Internet introduciendo la dirección web en la que se encontrará la página de inicio del sitio web inglés una vez que esté en línea (por ejemplo: http//www.misitio.es/en/index.html).
Repetir esta misma operación también con el botón para el idioma portugués enlazándolo al URL correspondiente (por ejemplo: http//www.misitio.es/pt/index.html).

Como es lógico, puesto que se está trabajando en el proyecto del sitio web español, no es necesario añadir ningún enlace a la bandera española.

Para avanzar más rápidamente en la creación del sitio en inglés, crear una copia del sitio en español: en la ventana inicial Elección del proyecto seleccionar el proyecto del sitio en español y pulsar en el botón Duplicar. Pulsar a continuación sobre el botón Renombrar para cambiar el nombre del nuevo proyecto por uno más apropiado.
Abrir la copia del proyecto y en Ajustes del Sitio web configurar "EN - English" como Idioma de los contenidos: continuar introduciendo las localizaciones para todos los textos y los elementos que dependan del idioma.
Acceder a la ventana Contenido de la Plantilla y ajustar los enlaces en los botones de las banderas: asociar al del español el enlace con el URL correspondiente (por ejemplo: http//www.misitio.es/index.html) y quitar el enlace del botón con la bandera inglesa.
Una vez terminado el proyecto del sitio web en inglés, repetir la misma operación también para configurar el proyecto del sitio web en portugués. En este caso será necesario configurar los enlaces de los botones de los idiomas español e inglés y quitarlo del botón para el idioma portugués.

Para que los botones creados para la elección del idioma funcionen correctamente es necesario que los estilos en los 3 idiomas se publiquen en el servidor respetando las rutas previstas.

Crear en la carpeta de publicación en el Servidor dos subcarpetas y nombrarlas: "en" y "pt".
Publicar el proyecto en español (adoptado como proyecto principal) en la carpeta principal del Servidor y los proyectos de los sitios web en inglés y portugués en las carpetas "en" y "pt" respectivamente.
Pulsar para expandir/reducirHow To: Cómo crear un sitio multi-idioma sirviéndose del reenvío en función del idioma del Navegador de Internet

Suponiendo una vez más que se desea crear un Sitio web consultable en español, inglés y portugués; trabajando con la edición Pro de WebSite X5 es posible hacer que el Visitante no tenga que elegir el Idioma preferido sino que se le presente inmediatamente la versión del Sitio web presumiblemente más apropiada para él o ella. Es posible obtener este resultado siriviéndose de la posibilidad de identificar el idioma configurado para el Explorador de internet y reenviar al Visitante de acuerdo con esta información a versiones diferentes del mismo Sitio web. Naturalmente no será posible cubrir todos los idiomas, por lo tanto será necesario elegir de entre los idiomas que se pongan a disposición aquel que será empleado como idioma alternativo.

En nuestro ejemplo, el inglés será usado como Idioma alternativo en todos los casos en los que se identifique en el Explorador un idioma diferente del inglés, el español o el portugués. Así pues, el Sitio web en inglés será el Sitio principal, mientras que los sitios en español y portugués serán versiones publicadas en subcarpetas de la carpeta principal del servidor.

Antes de nada, es necesario crear el sitio web en inglés definiendo su estructura y sus contenidos en Ajustes del Sitio web configurar "EN - English" como Idioma de los contenidos.
En el Paso 1 - Ajustes del Sitio web | Avanzadas pulsar sobre el botón Página de Entrada y, en la ventana correspondiente, activar la opción Mostrar la página de Entrada seleccionar Identificar automáticamente el idioma.
Mediante los comandos disponibles, componer la Lista de idiomas. De la lista propuesta, seleccionar los elementos "Deutsch", "Italiano" y "Français", correspondientes a las lenguas no contempladas, y pulsar el botón Eliminar. Pulsar a continuación sobre el botón Agregar... para abrir la ventana Configurar idioma y añadir el idioma portugués: como Código de referencia del Idioma introducir "PT".
De manera análoga, seleccionar los elementos "Español" y "English" y pulsar el botón Editar... para abrir la ventana Configurar idioma  y comprobar el código de referencia asociado.
Puesto que el proyecto actual es en inglés, seleccionar el elemento "English" de la Lista de idiomas y pulsar sobre el botón Valor preestablecido.

Suponiendo que se creará un sitio para cada lengua y que este será publicado en internet, es posible contemplar un enlace a un URL:

En la Lista de idiomas seleccionar el elemento "Español" y pulsar el botón Editar... para abrir la ventana Configurar idioma.
En el campo URL para este Idioma especificar el URL del sitio web en español: por ejemplo, http//www.misitio.es/es/, si se desea publicar el sitio web en inglés en la subcarpeta "es" de la carpeta principal del Servidor.
Repetir las mismas operaciones también para el sitio web en portugués enlazándolo al URL correspondiente: por ejemplo http//www.misitio.es/pt/, si se desea publicar el sitio web en portugués en la subcarpeta "pt" de la carpeta principal del Servidor.

Una vez hecho todo esto, el sitio web está preparado para ofrecer el reenvío en función del idioma , pero faltan todavía los contenidos correspondientes de los idiomas español y portugués.

Para avanzar más rápidamente en la creación del sitio en español, crear una copia del sitio en inglés: en la ventana inicial Elección del proyecto seleccionar el proyecto del sitio en inglés y pulsar en el botón Duplicar. Pulsar a continuación sobre el botón Renombrar para cambiar el nombre del nuevo proyecto por uno más apropiado.
Abrir la copia del proyecto y en Ajustes del Sitio web configurar "ES - Español" como Idioma de los contenidos: continuar introduciendo las localizaciones para todos los textos y los elementos que dependan del idioma.
En el Paso 1 - Ajustes del Sitio web | Avanzadas, acceder a la ventana Página de Entrada y desactivar la opción: Mostrar la página de Entrada.
Una vez terminado el proyecto del sitio web en inglés, repetir la misma operación también para configurar el proyecto del sitio web en portugués.

Para la publicación en el Servidor de los sitios web realizados es preciso proceder de la siguiente manera:

Publicación del sitio en inglés: el sitio en inglés es al que está asociada la Página de Entrada y ha sido configurado como "prefedefinido". Procediendo a la publicación se creará un archivo index.html, correspondiente a la Página de Entrada, que se guardará en la carpeta de publicación. Para que haya coherencia con los URL configurados para los sitios en español y portugués, es necesario crear en el servidor las subcarpetas previstas: "es" y "pt".

Una vez concluido este paso, el sitio inglés estará online y en la Página de Entrada estará activo el código que identifica el idioma del Explorador de internet y configura en consecuencia el reenvío a los Sitios web en los demás idiomas.

Publicación del sitio web en español: para que el código de reenvío que hay en la Página de Entrada al sitio español funcione, hay que publicar el proyecto en la subcarpeta "es" que se ha creado.
Publicación del sitio web en portugués: para que el código de reenvío que hay en la Página de Entrada al sitio portugués funcione, hay que publicar el proyecto en la subcarpeta "pt" que se ha creado.

 


Best practice:

-

Cómo gestionar los Idiomas para los textos añadidos automáticamente.