Semana 4 del 30/09/2019 al 06/10/2019

SEMANA NÚMERO 04

PRIMERA CLASE

ENCARGO Nº 2 DE LA PRÁCTICA Nº 1. Un/a traductor/a profesional quiere promocionar su empresa de traducción y, para ello, decide crear un sitio web “estándar”, al cual se pueda acceder a través de un ordenador personal. Aprovechando sus conocimientos de diferentes lenguas de trabajo decide hacerla bilingüe (puedes usar, preferentemente, tus lenguas A, materna, y B de trabajo; o bien cualesquiera otras dos lenguas que tu quieras y conozcas). El sitio web “estándar” estará formado por dos páginas web: una página principal y otra secundaria, idénticas en cuanto a contenido, pero en las dos lenguas que tu escojas (preferentemente, la principal en tu lengua A y la segundaria en tu lengua B de trabajo). Cada una de las páginas web deberá incluir, obligatoriamente, entre otros elementos, un apartado de hiperenlaces a diversas herramientas informáticas que use en su labor profesional, con un breve comentario para cada una de ellas. Y, finalmente, un enlace a una cuenta de correo electrónico para que los clientes puedan contactar contigo.

MATERIALES: http://jmv.webs.uvigo.es/docs/practicas/practica1/encargo2/p1-e2.htm

ENUNCIADO: http://jmv.webs.uvigo.es/docs/practicas/practica1/encargo2/practica1-encargo2.pdf

---

PRELIMINARES

Tipología del software según su modo de uso. Desde el punto de vista de cómo se usa el software podemos clasificar el software en "instalable", "portable" y "en Internet o en la nube (cloud computing)".

• El software instalable, como su nombre indica, se "instala" en el disco duro del ordenador mediante la ejecución del “archivo de instalación” o setup. El programa instalador (a veces con la ayuda del/de la propio usuario/a, a quien se le requiere su opinión) copia en el disco duro aquellos archivos que considera "mejores" para la configuración del ordenador (hardware) y del propio programa (software). Ventajas: el programa se "adapta" al ordenador receptor como si de un guante se tratara. Inconvenientes: el programa sólo puede usarse en el ordenador receptor (que, en ocasiones, no es portátil y, por tanto, no puede moverse del lugar y/o “llevarse encima”).

• El software "portable" puede usarse directamente (sin necesidad de instalarlo) y, además, puede copiarse y "llevarse puesto" (en inglés diríamos, muchas veces, que es “wareable”) en un dispositivo de (relativamente) poca capacidad como pueda ser una memoria USB. "Portable" (término inexistente en español) se contrapone a "portátil" (término que sí existe en español) en el sentido de que se puede transportar de un lugar a otro y, además, se puede "llevar puesto" o "vestir" de una manera más o menos permanente (“wareable”, que diríamos en inglés). La mayoría de programas de código abierto instalables tienen su correspondiente versión portable (no así los de pago). Ventajas: puede usarse sin necesidad de instalarlo en un ordenador y puede guardarse en una simple memoria  USB. Inconvenientes: si se usa en una memoria USB funciona de manera más lenta; y, para que que quepa en una memoria USB, normalmente se "recorta" la versión instalable (se le quitan los archivos no imprescindibles como puedan ser los ejemplos, las ayudas, los archivos multilingües –dejándose solo las versiones en inglés-, etc.). El portal de programas “portables” más conocido y usado es: http://portableapps.com .

• El software "en Internet o en la nube (o cloud computing)", como su nombre indica, puede usarse directamente siempre que dispongamos de una conexión a internet; y, por tanto, no hace falta tenerlo "físicamente" (instalado o copiado) en nuestro poder (basta un simple acceso telemático). Ventajas: solo precisamos de acceso a Internet para poder usarlo y no es necesario tenerlo "físicamente"; la actualización y mantenimiento del mismo corre a cargo del proveedor del programa; no hace falta comprarlo, puede usarse como servicio y pagar por el tiempo de uso. Inconvenientes: si no funciona Internet no podemos usarlo (cosa que, en la realidad, acostumbra a  suceder en muy contadas ocasiones).

Aspectos en la creación de páginas web relacionados con el ámbito profesional, social, informático-telemático y traductológico. A la hora de crear un/a espacio/página web es necesario tener en cuenta diversos factores.

• Aspectos relacionados con el ámbito profesional. Desde un punto de vista profesional, nos interesa crear una “marca” para promocionar nuestros servicios de traducción en la web; nos interesa que el usuario no “pierda de vista” en ningún momento nuestra página web (y, por ende, nuestra marca); y, por último, nos interesa que nuestros clientes potenciales “nos encuentren” (en Internet) de una manera fácil (“amigable”, que diríamos en el ámbito informático) y rápida. Para ello: crearemos un “logo o marca” para darnos a conocer (desde un punto de vista profesional, para hacerlo, es necesario acudir al “Registro de la propiedad” para cerciorarnos que dicho logo o marca no está todavía solicitado; y, registrar nuestra marca si así lo queremos); procuraremos que en todo momento nuestra página principal esté en primer plano, abriendo las páginas secundarias en otra ventana o pestaña y procuraremos que nuestra marca o logo esté visible el máximo de tiempo posible; y, por último, estableceremos todos los mecanismos posibles para que los buscadores de Internet (básicamente el buscador de Google) nos encuentren (usando etiquetas y metadatos).

• Aspectos relacionados con el ámbito social. Desde un punto de vista social, nos interesa (y en las webs públicas es de obligado cumplimiento) que “todos/as” los/as usuarios nos encuentren. Por ello, en aquellos casos en los que los/as potenciales clientes padezcan algún tipo de dificultad (auditiva, visual, etc.) para poder acceder a la información disponible en nuestra web, intentaremos (de la manera que sea) facilitarles el acceso a la misma (es lo que, en términos informáticos, se conoce como “accesibilidad”). Para ello, por ejemplo, duplicaremos la información (en modo textual y gráfico), guardaremos con los elementos gráficos una descripción textual de los mismos y de su función, para las personas invidentes o con dificultades de visión, o bien crearemos “ayudas contextuales” para facilitar la navegación de los/as usuarios/as. También podemos crear enlaces en la propia página web para poder navegar por la misma con un simple “clic” del ratón.

• Aspectos relacionados con el ámbito informático-telemático. Desde un punto de vista informático y telemático es importante tener en cuenta diversos factores. En primer lugar, igual que ya hicimos en el encargo-1, trabajaremos siempre con carpetas. En segundo lugar, dado que los ordenadores “entienden y hablan” un lenguaje “próximo al inglés”, cuando pongamos nombre a los “elementos” que sean susceptibles de ser manipulados por el ordenador y/o por los programas (carpetas, archivos, enlaces internos, etc.), es preciso escribirlos “a la inglesa” (es decir, empleando sólo caracteres propios de la lengua inglesa –evitando, por tanto, tildes varias, “ñ”, “ç”, etc.–), sin espacios, sin paréntesis, sin barras, sin corchetes, sin mayúsculas y con nombres relativamente cortos (de menos de 8 caracteres). Recordad que los “programas de pago” disponen de un “sistema de depuración de errores” muy elaborado; mientras que los ”programas de código abierto” acostumbran a tener un sistema de depuración de errores muy básico (e incluso, a veces, totalmente inexistente). En el caso de las páginas web e Internet puede darse el caso de que, de no cumplirse las  premisas relacionadas con el nombre de los elementos usados por el ordenador y/o programa, la web funcione perfectamente “off line” (en nuestro ordenador, para entendernos); pero que, al subir/hospedar nuestra página web en (un ordenador servidor de páginas web de) Internet, la página web en cuestión funcione de manera defectuosa o, simplemente, deje de funcionar. En tercer lugar, los posibles elementos formales de nuestra web (tipo de letra, tamaño, colores, etc.) están la mayoría de las veces sujetos al tipo de interfaz usada para visualizarla (televisión, pantalla de ordenador, dispositivo móvil o smartphone, etc.) y/o a la propia configuración del navegador usado (Google Chrome, Mozilla Firefox, Safari, Internet Explorer, Edge, Pufino, Opera, etc.). Si queremos que dichos aspectos formales permanezcan invariables o indiferentes a dichos elementos es necesaria la creación de “estilos” para las páginas web (son archivos con la extensión ".css" para cuya creación es necesario saber programación web; y, por ello, en esta materia no vamos a aprender a trabajar con estilos web). Y, en cuarto y último lugar, indicar que si queremos usar a través de nuestra web alguno de los servicios genéricos proporcionados por Internet (navegación web, correo electrónico, servicio de ftp, etc.), es necesario indicar específicamente cuál es el servicio que queremos usar (http o https, mailto, ftp, etc; respectivamente).

• Aspectos relacionados con el ámbito traductológico. Desde un punto de vista traductológico la traducción de páginas web (de la misma manera que ocurre, por ejemplo, con la traducción de programas informáticos o la traducción de videojuegos) es un tipo e traducción que posee algunas características intrínsecas: por una parte, en algunas ocasiones es necesario ir un poco más allá de lo que es estrictamente una traducción (entendida como “pasar de una lengua A a otra lengua B”), y es necesario “adaptar” en marco traducido (es lo que se conoce normalmente como “localización). A veces dicha adaptación está condicionada por la propia naturaleza del tipo de traducción, por cuestiones de tipo informático, o, incluso, algunas veces por (aparentemente) simples cuestiones de tipo cultural.  Por otra parte, en el caso de la traducción/localización de páginas web, es necesario traducir TODOS los elementos susceptibles de ser traducidos (es decir, todo aquellos elementos que son susceptibles de ser “vistos” por el/la usuario/a); incluso aquellos que, “a simple vista” inicialmente no son susceptibles de ser vistos “off line” (es el caso, por ejemplo, del texto alternativo en las imágenes, de las ayudas contextuales, del título de la página web, etc.).

USO PRÁCTICO DE “KOMPOZER”

• Para la creación del sitio web usaremos el programa “KompoZer”.

• Antes de empezar, tal como hicimos con el encargo-1, crearemos una carpeta de trabajo en el disco duro (escritorio) de nuestro ordenador. Recordad al respecto las pautas establecidas a propósito del nombre de las carpetas (archivos, enlaces internos, etc.). Por ejemplo, podeis llamarla “encargo2nombreapellido1” (en mi caso “encargo2joanmiquel”).

• Entramos en Kompozer. Por defecto, el programa trabaja en modo “diseño” (ved que la opción/pestaña inferior izquierda de “diseño” está activada). Observamos que la interfaz de trabajo tiene algunos elementos que podemos asociar a los procesadores de texto, en cuanto sirven para dar formato al texto y/o alinear el mismo. Es el caso del “formato de letra”, “formato de fondo”, “disminuir tamaño de letra”, “aumentar tamaño de letra”, “negrita”, “cursiva”, “subrayado”, “alinear a la izquierda”, “centrar”, “alinear a la derecha”, y “justificar” (ver la captura de pantalla que sigue a continuación, de izquierda a derecha, respectivamente). Recordad que, si no usáis dichos elementos para alinear (y, por ejemplo, utilizáis por el contrario espacios o tabuladores), puede darse el caso que la página web se visualice correctamente “off line” pero que, “on line” no sea así. Podemos usar dichos elementos para, “a modo de (o emulando) un procesador de texto” dar forma al texto. Por ejemplo, para escribir “Hola” en negrita, basta con pulsar la tecla de “negrita” y escribir “Hola”.

• Por el contrario, hay otros elementos que se relacionan con aspectos intrínsecos de las páginas web. Es el caso de los “enlaces internos” y “enlaces” (a secas). Con el botón “enlace” crearemos los 4 tipos de enlace que vamos a tener que crear en nuestra web.

• Con Kompozer podemos crear una página web directamente con el “lenguaje de etiquetas HTM o HTML” (usando el programa a modo de editor de texto y utilizando las etiquetas del lenguaje de programación HTM o HTML). Para ello debemos seleccionar la opción/pestaña inferior izquierda de “código fuente”. En el caso de que hayamos escrito la palabra “Hola” con negrita, observaremos que la palabra “Hola” en cuestión está marcada con una determinada etiqueta inicial “span” y final “/span” (entre ángulos “<”, “>”) y atributos varios como “bold”. Desde un punto de vista estrictamente traductológico, la principal premisa usada para traducir páginas web directamente desde el código fuente es que “hay que traducir todo aquello que no sea (o esté) una (o dentro de) una etiqueta” (en otras palabras, “todo aquello que no esté entre los símbolos ‘<’ y ‘>’). Si, por ejemplo, queremos traducir la web que estamos manejando, bastará con traducir (únicamente) la palabra “Hola” por “Hello” del texto  (ver imagen adjunta).

• Si, por el contrario, trabajamos con el “modo diseño”, la traducción de la página web en cuestión es mucho más fácil, ya que, como en el caso anterior, basta con traducir la palabra “Hola” por “Hello”; pero, en este caso, no hay (visible) ninguna etiqueta que pueda molestarnos ni corremos el peligro de borrar accidentalmente alguna de las etiquetas (de suceder esto, dependiendo de la etiqueta de que se trate, la web incluso podría dejar de funcionar). Observamos, pues, que este tipo de programas como pueda ser Kompozer nos facilitan la labor de la traducción de las páginas web “escondiendo” (de alguna manera) las etiquetas HTML (o HTM) de nuestra página web, mostrando solo el texto a traducir y evitando que borremos accidentalmente cualquier etiqueta.

• El funcionamiento de Kompozer es parecido al de los programas de traducción asistida (TAO) genéricos (tipo Déjà Vu, que veremos y usaremos en la práctica-2 de esta materia) o programas de traducción asistida (TAO) enfocados a la localización de páginas web (tipo CatsCradle, que tendréis oportunidad de ver y usar en la materia opcional de “Traducción avanzada” de cuarto curso del grado). En el caso de los programas de traducción asistida (TAO), sean genéricos o específicos de la traducción/localización de páginas web, sin embargo y a diferencia de programas como Kompozer, estos muestran ya de inicio TODO el texto a traducir (en el caso de Kompozer, en algunos casos hay que buscar explícitamente algún que otro texto susceptible de ser traducido que no se muestra de inicio); y, además, permiten el uso de terminología y memorias de traducción como ayuda a la traducción (cosa que no ocurre con Kompozer). En el caso de Kompozer, además, la traducción/localización de la páginas web será toda ella “manual” (sin ayuda alguna del programa que usamos).

• En el ámbito de los sitios web es deseable que el/la usuario/a acceda al sitio web siempre a través de una misma página (la que denominamos página principal) y que, a partir de ahí, se le permita navegar al resto de páginas web del sitio web. En los inicios de Internet no existía ningún tipo de pauta a priori acerca de esta página inicial, por lo que, era responsabilidad del usuario conocer el nombre de la misma. Con el crecimiento y auge de Internet y el uso cada vez más generalizado de buscadores, los “gurús” de Internet acabaron por acordar que el nombre de la página principal (o inicial) de un sitio web se llamaría “index” (escrito en inglés, sin acento por tanto). De esta manera, en la actualidad, basta con conocer el dominio de una URL de un determinado sitio web para poder acceder a su página principal (o inicial); ya que el navegador (que, recordad, es el software que utilizamos para navegar por las páginas web) asume de entrada que la página principal (o inicial) del sitio web es “index.html”. De esta manera, por ejemplo, si escribimos en el navegador las URL http://traduccionesvigotrans.atwebpages.com (sin indicar, por tanto la página principal o inicial del espacio web) y http://traduccionesvigotrans.atwebpages.com/index.html  (indicando la página principal o inicial de nuestro espacio web), el navegador nos remitirá en ambos casos a la misma página web (esto es: la página principal o inicial de nuestro espacio web).

• De lo explicitado anteriormente se deduce que la página principal (de inicio) de nuestro sitio web debe llamarse, forzosamente, “index.html”. Si intentamos guardar nuestra web (sin nombre) en nuestra carpeta de trabajo por primera vez, Kompozer nos obligará a establecer también el “título de nuestra” página web. El título de una página web no tiene nada que ver con el nombre del archivo de la página web. El título de una página web debería ser, desde un punto de vista profesional, el nombre de nuestra marca o empresa; ya que el mismo queda guardado en formato HTML entre las etiquetas inicial <title> y final </title> (que, a su vez, quedan englobadas dentro o entre las etiquetas inicial <head> y final </head>). Ponemos como título el nombre o marca de nuestra empresa de traducción (en mi caso “Traducciones VigoTrans”). Al respecto, vuelvo a insistir en el hecho de que, en el ámbito profesional, antes de utilizar una determinada marca o título para nuestra empresa es necesario acudir al Registro de la Propiedad y verificar que dicha marca o título no está asignada a otra empresa; y, en caso de querer usarla, deberemos pagar y registrarla a nuestro nombre (de no ser así, nos exponemos a una multa administrativa por uso fraudulento de una marca de otra empresa). Una vez insertado el título, Kompozer nos “propone” guardar el archivo con el mismo nombre que el título que hemos puesto; recordad que en este caso el nombre del archivo debe ser “index.html” siempre (y no otro). Observad que en la parte superior de la ventana de Kompozer (en la franja de color azul) aparece, en primer lugar el título de la página web (en mi caso, “Traducciones VigoTrans”) y, en segundo lugar, el nombre del archivo de dicha página web (en mi caso y también en vuestro caso, “index.html”).

• Con lo hecho hasta ahora tenemos ya cumplimentado el apartado “1.1)” del enunciado de nuestro ENCARGO-2, en lo referente a la página principal (cuando tengamos la página secundaria hecha ya procederemos a hacer lo mismo).

• Llegados a este punto es necesario reflexionar acerca de, una vez creado nuestro sitio web y almacenado u hospedado este en un servidor web (un ordenador con acceso permanente a Internet) ¿cómo van a poder acceder nuestros/as “hipotéticos clientes nuestra web? La respuesta, hoy por hoy, es muy sencilla (y casi unánime, diría yo): a través de un motor de búsqueda o buscador (y, mayoritariamente, a través del “motor de búsqueda o buscador Google”). Pero ¿cómo hace el buscador Google para encontrar nuestro sitio o páginas web? La respuesta, una vez más, en relativamente sencilla de dar: el buscador Google usa el robot de búsqueda “GoogleBot”, o “Google (Ro)bot”, de la empresa Google, que colecciona documentos desde la web con el fin de construir una base de datos para el motor de búsqueda o buscador Google. A modo de ejemplo, podéis ver a través del contador de StatCounter de la página página principal de mi sitio web académico, en http://jmv.webs.uvigo.es/index.htm, como dicho robot de Google ha accedido a dicha página web. Pero ¿qué tipo de información busca exactamente Googlebot en una página web? Parece obvio pensar que, dada la enorme cantidad de páginas web existentes en el mundo y a pesar de que la empresa Google hace uso de millones de googlebots, dichos robots (o programas) no pueden (o no están en condiciones de) leer y entender todo el contenido de una página web. En realidad, solo leen la información contenida entre las etiquetas inicial <head> y final </head> de una página web; y, dentro de estas, se centran en la etiqueta inicial <title> y final </title> y la metaetiqueta que contiene las palabras clave o “keywords”. La primera de las etiquetas (“title”) le proporciona a Googlebot información sobre el nombre de la empresa en cuestión (o, como mínimo, así debería ser); mientras que, la metaetiqueta que contiene las palabras clave (“keywords”) le permite al/a la propietario/a de la página web poder caracterizar su página web (en nuestro caso, nuestra actividad profesional como traductor/a) de manera que el buscador Google pueda introducir nuestros datos en su base de datos. Es por ello que, según lo explicitado (y solicitado) en el apartado “2.2)” del encargo: introduciremos 4 palabras clave que serán la traducción a las dos lenguas usadas en nuestro sitio web de los términos “traductor” y “traducción”; en nuestro caso serán los cuatro términos o palabras clave “traductor”, “traducción” y “translator” y “translation” (en cuanto a que mis lenguas de trabajo son el español y el inglés). En las notas a pie de página 1, 2, 3 y 4 del enunciado del encargo de traducción se explica la importancia de los metadatos y de las palabras clave y cómo introducir las mismas en nuestra página web. Para ello, por las razones que ya hemos explicado anteriormente, copiaremos la etiqueta <meta name="Keywords" content="palabra-1, palabra-2, palabra-3, palabra-4"> entre las etiquetas <head> y </head>, utilizando el “modo vista código fuente” de Kompozer, insertando un <Intro> después de la línea de código <title>... </title> para generar una nueva fila, y copiando en dicha fila la etiqueta anterior (mejor usar “Control>+C” y  “<Control>+V” para copiar y pegar dicha etiqueta del enunciado del encargo a nuestra página web, respectivamente). Siempre procurando no borrar accidentalmente ninguna etiqueta de nuestra página web. Con ello lo que conseguimos es que, cuando Googlebot acceda a la página web principal de nuestra web, la información contenida en la etiqueta “title” le permitirá al buscador Google encontrar nuestra empresa (en mi caso “Traducciones VigoTrans”), mientras que las palabras clave de la etiqueta de metadatos le permitirá al buscador Google caracterizarnos en la base de datos de Google como traductor/a de dos lenguas (en mi caso, de/al español e inglés). En el momento que tengamos nuestra web hospedada en un servidor web con acceso a Internet ya somos susceptibles de ser “visitados/as” por Googlebot. No hace falta decir que, si visualizamos nuestra página web “index.html” en “modo diseño”, aparentemente no hay nada en nuestra página web; sin embargo, sabemos que contiene datos y metadatos que ayudarán a los/as usuarios/as a encontrar nuestra página web cuando la busquen a través del buscador Google. Con ello tenemos ya realizado el apartado “1.2)” de nuestro encargo.

• Una vez insertada la información “para Googlebot” podemos empezar a diseñar la página principal de nuestra web. Para ello, debemos tener en cuenta que, en una página web, los elementos constitutivos de la misma de formatos diferentes (imágenes, vídeo, audio, páginas web en formato HTML o HTM, etc.) deben estar guardados todos ellos dentro de nuestra carpeta de trabajo en archivos diferentes. Así, si consultamos “un modelo” (que no el modelo) del sitio web a construir en el encargo-2 en http://jmv.webs.uvigo.es/docs/practicas/practica1/encargo2/web o bien en http://traduccionesvigotrans.atwebpages.com , observaremos que el sitio web está constituido por 6 archivos: 2 páginas web (en formato de texto HTML), 2 banderas (en formato gráfico, mayoritariamente GIF), 1 imagen dentral (en formato gráfico, mayoritariamente JPEG) y 1 imagen animada (en formato gráfico, mayoritariamente GIF). Por ello, procederemos en primer lugar a buscar las 4 imágenes para, con posterioridad crear las 2 páginas web de nuestro sitio web. Buscaremos dicha información en Internet.

• Búsqueda de los elementos gráficos (imágenes) “banderas”. Precisamos de 2 banderas para nuestras páginas web principal y secundaria. En mi caso, las banderas de España (español) y Reino Unido (inglés). Si buscamos las mismas en Internet con el “buscador (textual) genérico Google” (http://google.es) observamos que obtenemos un número ingente de entradas (121 millones en mi caso), lo cual se hace imposible de consultar. Ante tal desaguisado podemos probar buscar con el buscador especializado de imágenes Google (https://www.google.es/imghp?hl=es&tab=wi&authuser=0) las banderas en cuestión; en tal caso obtenemos como resultado algunas banderas que, de ser conocedores de la historia de España, resulta obvio que no podemos/debemos usarlas como elementos gráficos en nuestra web (es el caso de la bandera franquista con el águila presnte). El problema radica en que en Internet hay mucha información, por lo que es aconsejable acceder a la misma a través de una “puerta de acceso fiable”, donde esté “explicada” la información. En Internet se conocen estos lugares como “portales”. La pregunta que podemos realizarnos al respecto es ¿en verdad existen portales especializados de banderas? La respuesta debe ser que sí, ya que de no existir lo creamos y nos hacemos millonarios/as. Para encontrar dicho portal hacemos uso del buscador genérico Google. Pero antes podemos reflexionar brevemente acerca de ¿en qué lengua le daremos información a Google sobre qué buscar? Obviamente, si usamos una lengua que tenga una mayor presencia en Internet, la posibilidad de obtener resultados a nuestra consulta siempre será mayor. Por tanto, optamos por buscar usando la lengua inglesa: “flags of the world” (“banderas del mundo”). Obtenemos como resultado el portal https://www.crwflags.com/fotw/flags/ que está organizado alfabéticamente (en inglés) por países. Navegamos y buscamos en dicha web hasta encontrar las 2 banderas que precisamos (indicar que la bandera gallega está en https://www.crwflags.com/fotw/flags/es-ga.html Descargamos las 2 banderas que precisemos (con “botón derecha del ratón > descargar imagen como”), en formato GIF, y con el nombre que queramos (siempre y cuando este cumpla las condiciones que hemos explicitado de antemano para los nombre de archivos (carpetas, enlaces internos, etc.). En mi caso procedo a descargar las banderas de España y reino Unido con los nombres de “es.gif” y “uk.gif”, respectivamente. El formato GIF es un formato de imagen comprimido (https://fileinfo.com/extension/gif).

• Búsqueda del elemento gráfico (imagen) “imagen principal o central”. Precisamos de 1 imagen principal o para nuestras páginas web principal y secundaria (la misma), que tenga relación con el nombre de nuestra marca o empresa. En mi caso, como el nombre de mi empresa es "Traducciones VigoTrans", buscaré una imagen de la "Ría de Vigo". Usamos el buscador de imágenes Google para encontrar dicha imagen y la descargamos con "botón derecho del ratón > guardar imagen como". La imagen resultante normalmente tendrá la extensión (formato) ".JPG", que es otro de los formatos comprimidos de imagen que acostumbra a estar presnte en INternet (ver https://fileinfo.com/extension/jpg). La guardamos con un nombre que cumpla todos los parámetros exigidos para poder estar presente en Internet (en mi caso "ria.jpg")

• Búsqueda del elemento gráfico (imagen) “imagen gif animado del correo-e”. Precisamos de 1 imagen gif animada de nuestro correo-e para nuestras páginas web principal y secundaria (la misma), que tenga relación con el correo electrónico. Como no es fácil encontrar en Internet imágenes GIF animadas, en el apartado "1.9)" del enunciado del encargo-2 tenéis un enlace a gifs animados (http://gifsanimados.espaciolatino.com/es/E_mail2.htm). Podéis descargar el que queráis ("botón derecho del ratón > descargar imagen como"), con un nombre que se adecúe a lo impuesto por las convenciones de Internet (en mi caso lo nombr´ñe como "correo.gi"). También podéis insertar cualquier otro gif animado que queráis.

• Una vez tenemos ya las 4 imágenes que necesitamos para  nuestro sitio web podemos ya a empezar a elaborar nuestra web principal o inicial (que, os recuerdo, debe llamarse SIEMPRE "index". Empezaremos por insertar todos los elementos textuales y gráficos de nuestra web, emplazándolos todos ellos según corresponda con los botones de alineación correspondientes, y con el tamaño, formato y color que creamos más adecuados. Al respecto del tamaño, formato y color que usemos, decir que muchas veces la visualización de los mismos en el navegador depende de la propia configuración del navegador o del dispositivo en que estemos viendo la página web (TV, pantalla de ordenador, pantalla de smartphone, etc.) ; o incluso podemos usar las opciones "<Control>+<rueda del ratón>" en Windows o "<Command>+<->" en Mac para ampliar o reducir la pantalla que estamos viendo. Por ello, procuraremos solo que los elementos de nuestras páginas web sean proporcionales entre ellos. Si quisiéramos "fijar" las características formales de nuestras web deberíamos crear "hojas de estilo web (en cascada)" o, lo que es lo mismo, archivos con el formato ".css" (https://fileinfo.com/extension/css); para lo cual, deberíamos poseer todos/as conocimientos de programación web y tiempo suficiente para poder crearlos  (http://www.ite.educacion.es/formacion/materiales/107/cd/html/pdf/html07.pdf). Ello no forma parte del contenido de esta materia.

• Insertar los elementos formales (texto e imagen) relacionados con los "enlaces a la página secundaria". Insertamos en la página principal la imagen de la bandera correspondiente que va a ser el enlace a la página secundaria en la "lengua contraria" a la lengua de la página principal. Como en mi caso la página principal o inicial está en español, la bandera a insertar será la inglesa ("uk.gif"). Alineamos la imagen a la derecha con el botón "alinear a la derecha" y establecemos el tamaño de imagen que creamos adecuado "tocando y cogiendo la esquina de la imagen". Kompozer, por defecto, nos obliga a usar "texto alternativo" para hacer la web "accesible a las personas invidentes o con problemas de visión"; por lo que (en mi caso) insertaré como texto alternativo el texto "Image of English flag linked to English webpage" (obviamente, en la lengua de la página secundaria; inglés, en mi caso). De esta manera tenemos ya creado el "enlace gráfico a la página secundaria" pendiente, obviamente, del enlace en sí. Insertamos un <Intro> en la web y creamos el "enlace textual a la página secundaria" con el texto adecuado (en mi caso, con el texto de "In English") pendiente, obviamente, del enlace en sí; los enlaces textuales, normalmente, se insertan "entre corchetes ("[" y "]"). Jugamos con los tamaños de la imagen y del texto para crear una visión proporcional de los dos enlaces. Para establecer el tamaño del texto usaremos los botones de "reducir y ampliar el tamaño de la letra" que hemos visto antes y el botón "negrita" (si queremos ponerlo en negrita). Al final, insertamos otro <Intro> (o dos) para pasar a la siguiente línea.

• Insertar los elementos formales (texto e imagen) relacionados con la "marca o nombre de la empresa". Para insertar la marca o nombre de nuestra empresa, la centraremos en la página web usando el botón de "alinear al centro" y le daremos el formato que queramos con las opciones de "elige un color para el texto", "negrita" y "aumentar y reducir el tamaño del texto". Recordad que el nombre de la marca o empresa debe coincidir con el título de la página principal (si queréis cambiar el título siempre podéis hacerlo con "Formato > título y propiedades de la página"). Recordad también que, en el ámbito profesional, no pueden usarse marcas o nombres de empresa que ya estén registradas en el "Registro mercantil". En mi caso usaré la marca "Traducciones VigoTrans" (¡ojo! "VigoTrans", en mi caso, ya está asignado a una empresa de transporte de Moaña https://www.google.es/search?source=hp&ei=j--5W7z2HML-sQH8wZPQCA&q=VigoTrans&oq=VigoTrans&gs_l=psy-ab.3...1980.3688.0.3923.0.0.0.0.0.0.0.0..0.0....0...1c.1.64.psy-ab..0.0.0....0.K0tIKf-XtHs; registrada en http://empresite.eleconomista.es/VIGOTRANS.html, por lo que, estaría infringiendo la ley administrativa y sería sancionado por ello y obligado a no poder usar dicha marca a no ser que el/la registrador/a de la propiedad considerase que el añadido de "Traducciones" desambigua el nombre de la marca). Podéis consultar en internet si la marca y el logo de la marca, si es el caso, que queréis registrar están ya registrados o no (por ejemplo, en https://www.einforma.com). Respecto a nuestra página web, si observáis que en el nombre de la página web (de la pestaña) aparece un "disquete de ordenador de color rojo", ello quiere decir que no están guardados todos los cambios realizados en la página web. Por favor, guardad todos los cambios con la opción "Archivo > guardar" o el botón "Guardar".

• Insertar lel elemento formal (imagen) relacionado con la "imagen principal o central". Según la opción "1.5)" del enunciado del encargo-2, debéis incluir en la página web una imagen vuestra escaneada o, en su defecto, cualquier otra imagen relacionada con el nombre o marca de vuestra empresa, centrada en la página. Para hacer vuestra web accesible a las personas con discapacidad visual debéis usar “texto alternativo” por debajo de la imagen para identificarla. Para insertar la imagen y el texto alternativo procederemos de la misma manera que en el caso anterior de la bandera (pero, en este caso, el texto alternativo estará en la lengua de la página principal; en mi caso en español). El texto alternativo debe servir para facilitar a las personas invidentes o con dificultades visuales la identificación de la imagen (en mi caso, por ejemplo, podría ser "Imagen de la Ría de Vigo"). Con el ratón establecemos el tamaño que queramos de la imagen.

• Insertar los elementos formales (texto) relacionados con el "menú principal". Según la opción "1.6)" del enunciado del encargo-2, debemos crear un "menú de opciones" con unas determinadas características. Si queréis, podéis usar el menú de opciones que ya aparece en el "modelo de ejemplo" de la web de http://traduccionesvigotrans.atwebpages.com ; pero, si es así, copiad el menú con "<Control>+C" del teclado, pero pegadlo con la opción "Editar > Pegar sin formato" de Kompozer (de esta manera se pega el texto del menú, pero SIN ENLACES).

• Creación de los "enlaces internos". Dentro de la página web deberemos aprender a crear 4 tipos de enlace: 1) enlaces dentro de la propia página web (para lo cual, previamente, deberemos insertar en la propia web dichos enlaces internos); 2) enlaces a una dirección web; 3) enlaces a una dirección de correo electrónico; 4) y, finalmente, enlaces a un archivo local. En esta primera clase de la semana veremos solo cómo crear un enlace interno que remita desde una opción del menú principal a dicha opción en la página web. Todos los enlaces se crean utilizando la opción "Insertar > enlace" o bien el botón "Enlace". En el caso de los "enlaces dentro de la misma página", además, debemos crear e insertar previamente los "enlaces internos" en la página con la opción "Insertar > enlace interno" o el botón "enlace interno". Los enlaces internos deben colocarse al principio de donde queremos que se desplace el navegador al seleccionar el enlace, tienen la forma de un ancla, y deben designarse con un nombre que cumpla con todos los requisitos de los elementos susceptibles de ser usados en Internet (básicamente: con caracteres existentes en inglés, sin espacios, en minúsculas, y, relativamente cortos). 

• Por ejemplo, empezamos creando un enlace para la opción "Currículo" del menú principal. Para ello, primero creamos el apartado "CURRÍCULO" en nuestra página donde expondremos nuestro currículo (recordad que debéis escribir un mínimo de 15 palabras y que dicho texto debe estar redactado). A continuación, insertamos el "enlace interno" que podemos denominar "curriculo" (sin tilde en la "i", en minúsculas, etc.) delante del apartado correspondiente con el botón "enlace interno". Y, en último lugar, insertamos el "enlace" en la opción "Currículo" del menú principal (seleccionándolo previamente y usando el botón "enlace"). Para comprobar que el enlace funciona debemos hacerlo en un navegador, y, para no tener que usar un navegador externo, usaremos la opción "Archivo > visualizar página en el navegador" o, aún mejor, <F5>). Podemos configurar el navegador por "defecto" que queremos usar con la opción "Herramientas > preferencias > aplicaciones externas, aplicación: navegador web"; y, "usar valores (por defecto del sistema)" o bien "usar aplicación (navegador) personalizada" y seleccionar, de entre todos los navegadores que tengamos instalados en nuestro ordenador, el navegador que queramos (en el aula Newton-17 no debemos tocar el navegador por defecto ya seleccionado).

• Antes de dar por acabada la primera clase de la semana conviene recordar que debéis realizar FUERA DEL AULA INFORMÁTICA NEWTON-17 (en vuestra casa, por ejemplo) el apartado de "crear un hospedaje para vuestro sitio web" en una empresa que lo proporcione de manera gratuita. Para ello debéis daros de alta en alguna de dichas empresas que proporcionan este servicio. Nosotros usaremos AWARDSPACE. Recordad que por la disposición de "falsa red" de los ordenadores del aula Newton-17 no es posible hacerlo en dicha aula.

• CÓMO CREAR UN HOSPEDAJE GRATUITO PARA NUESTRO SITIO WEB. Para ello, en primer lugar, debéis daros de alta "en casa" en la empresa "Awardspace" para poder hospedar vuestro sitio web (http://www.awardspace.com); después, debéis crear también un subdominio (gratuito) con la opción "gestión de dominios" de la aplicación, que remita a vuestro sitio web (que tenga, obviamente, relación con "vuestra empresa"), de la forma "DOMINIO-DE-TU-EMPRESA.atwebpages.com" (por ejemplo http://traduccionesvigotrans.atwebpages.com); y, por último, debéis subir todos los archivos (6, en total) de vuestro sitio web a dicho hostal gratuito con el "gestor de archivos" de la aplicación. De momento, os explicaremos sólo cómo realizar dichos procesos.

• CÓMO DARSE DE ALTA EN "AWARDSPACE". Es necesario que os déis de alta, "en casa", en la empresa "Awardspace" a través del enlace de la propia empresa http://www.awardspace.com y la opción "Signup" ("sign up", en inglés, significa "registrarse") de dicha web. Para ello debéis tener en cuenta, entre otras cosas (la aplicación ya os "guiará" al respecto, si es el caso): no debéis usar tildes en vuestro nombre; debéis usar el correo de Gmail que usamos para todos los encargos de la primera práctica (de la forma "primer+apellido"+"segundo apellido"+"nombre"; etc.) que se detalla en la nota a pie de página 8 del apartado "1.10)" del enunciado del encargo-2; y la contraseña a usar debe tener "4 números"+"3 letras". Si el registro ha funcionado correctamente recibiréis un correo de Awardspace en vuestra cuenta de Gmail para que confirméis vuestra solicitud de cuenta (debéis "hacer clic" en el enlace que os manden en el correo). A partir de ese momento ya podréis entrar a la aplicación a través de la opción "Login" con vuestra cuenta de correo de Gmail y vuestra contraseña. En sucesivas ocasiones usaremos la opción de "Login" que aparece en la propia aplicación (ver la primera imagen que aparece a continuación).

• CÓMO CREAR UN SUBDOMINIO GRATUITO EN "AWARDSPACE". Una vez dados/as de alta en "Awardspace" (ver el apartado anterior), entramos en la aplicación a través del enlace http://www.awardspace.com y la opción "Login" (con nuestro correo de Gmail y nuestra contraseña). De entre todas las opciones del programa nos centramos exclusivamente en la opción "Herramientas de alojamiento > administrador del sitio web". Y, dentro de esta, en la opción "gestor de dominios" (a través del menú de imágenes o a través del menú textual, según nos sea más cómodo). Si quisiéramos registrar un dominio (por ejemplo ".com") hay que pagar por ello; como no queremos pagar registraremos un subdominio dentro de ".atwebpages.com"). Para ello, en primer lugar, probaremos con nuestra propuesta de URL que debe ser significativa y relacionarse con  nuestra marca o empresa (recordad que debe estar escrita según los parámetros acordados para los "elementos de Internet"); en mi caso será "traduccionesvigotrans". Si no existe, se creará; si ya existe deberemos probar con otra URL.

• CÓMO SUBIR NUESTRO SITIO WEB AL HOSTAL GRATUITO DE "AWARDSPACE". Una vez creada la cuenta y el subdominio relacionado con nuestra marca o empresa en "Awardspace" (ver los dos apartados anteriores), accedemos a los mismos a través del enlace http://www.awardspace.com y la opción "Signup" (con nuestro correo de Gmail y nuestra contraseña). De entre todas las opciones del programa nos centramos exclusivamente en la opción "Herramientas de alojamiento > administrador del sitio web" (ver las imágenes del apartado anterior al respecto). Y, dentro de esta, en la opción "gestor de archivos" (a través del menú de imágenes o a través del menú textual, según nos sea más cómodo). Observaremos que al crear nuestro subdominio dentro de la aplicación se ha creado una carpeta con el nombre de dicho subdominio (en mi caso "traduccionesvigotrans.atwebpages.com"). Entramos dentro de dicha carpeta haciendo "doble clic" con nuestro ratón.  Seleccionamos la opción "subir (archivos)", arrojamos los archivos de nuestro sitio web "en el recuadro de "Drag & Drop Files here to Upload" (o usamos la opción "click to select files" y seleccionamos los archivos) y le daremos a la opción "Upload" (cargar). Si todo ha funcionado bien los archivos de nuestro espacio web que subamos aparecerán en dicha carpeta. Cuando hayamos acabado el encargo-2 y hayamos subido todos los archivos de nuestro espacio web deberán aparecer en dicha carpeta 6 archivos (ahora, en vuestro caso, solo deben aparecer 5, falta la página secundaria, y la página principal no está acabada). Y, si visualizamos nuestro espacio web en el navegador a través de la URL correspondiente (en mi caso http://traduccionesvigotrans.atwebpages.com), nuestro sitio web creado debe funcionar correctamente. Cada vez que cambiemos alguna cosa (nombre, contenido, etc.) de alguno de los 6 archivos de nuestro sitio web deberemos volver a subir el/los archivo/s modificados. Si, por lo que sea, tenemos que borrar alguno de los archivos ya subidos, lo borraremos con "botón izquierdo del ratón encima del archivo a borrar"+"opción delete".

ó bien

SEGUNDA CLASE

• Seguimos con la creación de enlaces dentro de la propia página web mediante la creación de enlaces internos que vimos en la clase anterior. Así, crearemos los enlaces restantes para las opciones "Lenguas", "Tipología de textos", "Plazos de entrega", "Precios" y "Herramientas en línea" del menú principal. Para ello, recordad, primero creamos los diferentes apartados de "LENGUAS", "TIPOLOGÍA DE TEXTOS", "PLAZOS DE ENTREGA", "PRECIOS", y "HERRAMIENTAS EN LÍNEA" en nuestra página donde expondremos la información de cada uno de los diferentes apartados (recordad que debéis escribir un mínimo de 15 palabras y que dicho texto debe estar redactado). Recordad que vosotros/as sois los/as únicos/as responsables del contenido de la información que insertéis en vuestro sitio web (a nivel académico, que la información que insertéis sea veraz o no no tiene ninguna importancia). A continuación, insertamos el los "enlaces internos" correspondientes que podemos denominar, por ejemplo, "lenguas", "tipologia", "plazos", "precios" y "herramientas" (sin tildes, en minúsculas, sin espacios, etc.) delante del apartado correspondiente con el botón "enlace interno" (obviamente podéis usar otros nombres para los enlaces internos). Y, en último lugar, insertamos el "enlace" en las diferentes opciones del menú principal (seleccionando previamente cada opción del menú y usando el botón "enlace"). Insisto en que debéis completar la información de cada uno de los apartados (recordad que debéis escribir un mínimo de 15 palabras y que dicho texto debe estar redactado). Para comprobar que los enlaces funcionan debemos hacerlo en un navegador, y, para no tener que usar un navegador externo, usaremos la opción "Archivo > visualizar página en el navegador" o, aún mejor, <F5>). Tened en cuenta que, si no dejáis suficiente espacio al final de la última entrada (por ejemplo, insertando <Intros>, el navegador no podrá desplazarse hacia abajo y situarse al principio de cada entrada al seleccionar la opción correspondiente (por ejemplo, la opción "Curriculo" en la imagen). Con ello, ya tenemos acabado el apartado "1.6)" de nuestro encargo (por lo menos, en lo que a la página principal se refiere).

• Siguiendo con el mismo tipo de enlaces internos, crearemos un enlace al final de cada sección que remita otra vez al menú principal (por ejemplo, con el texto "Volver al menú principal"). De esta manera el/la usuario/a no deberá usar (la rueda de) el ratón para desplazarse otra vez al menú principal. En este punto, y antes de insertar el "enlace interno" correspondiente, es muy importante tener en cuenta que, desde un punto de vista profesional, es muy importante que la marca o nombre de nuestra empresa siempre esté visible para el/la usuario/a de nuestra página web; por ello insertaremos el enlace interno delante de la marca o nombre de nuestra empresa y no delante de "Menú principal". Podemos, por ejemplo, llamar a dicho enlace interno "menu". Para crear el texto del enlace tendremos en cuenta las siguientes observaciones: 1) Insertaremos el texto del enlace entre corchetes ("[" y +"]"); 2) Alinearemos el enlace a la derecha para que no se confunda con el texto de cada uno de los apartados; 3) Debemos crear un enlace para cada entrada del menú por lo que, una vez creado el primero, podemos crear los demás (que son iguales al primero) con la opción "copiar y pegar" (mejor usar "<Control>+C" y "<Control>+V"); 4) Por lo que hemos indicado anteriormente, haremos que el enlace haga que el navegador se desplace a la líne adonde está el nombre o marca de nuestra empresa. Con ello, ya tenemos acabado el apartado "1.8)" de nuestro encargo (por lo menos, en lo que a la página principal se refiere).

• Creación de los "enlaces a una dirección web". Como ya comentamos anteriormente, dentro de la página web deberemos aprender a crear 4 tipos de enlace: 1) enlaces dentro de la propia página web (para lo cual, previamente, deberemos insertar en la propia web dichos enlaces internos); 2) enlaces a una dirección web; 3) enlaces a una dirección de correo electrónico; 4) y, finalmente, enlaces a un archivo local. A continuación veremos cómo crear enlaces a una dirección web. Dentro del apartado de "herramientas en líneas", en el enunciado del encargo-2 se nos pide que insertemos 4 herramientas online que puedan ser de utilidad. A modo de ejemplo veremos cómo insertar una de ellas. para seleccionar cuáles insertar buscaremos 2 herramientas relacionadas con la lengua de nuestra página principal (el español, en mi caso) y 2 herramientas relacionadas con la lengua de nuestra página secundaria (el inglés, en mi caso). Hay 3 condiciones a cumplir: 1) Debemos describir cada una de las herramientas con un mínimo de 10 palabras: 2) Cada herramienta debe contener un enlace a la página web de la herramienta; 3) Para cada enlace crearemos una "ayuda contextual" que informe al/a la usuario/a de la naturaleza de la herramienta; y, por último, 4) Al abrirse la página web de la herramienta esta SIEMPRE debe abrirse en una nueva ventana o pestaña (que sea lo uno o lo otro solo depende de la configuración del navegador que usemos; y, ello debe ser así porque, por razones profesionales, nuestra página web NUNCA debe desaparecer de la pantalla del dispositivo del/de la usuario/a). Para la creación del enlace usaremos el botón "enlace" y copiaremos en la ventana o combo de opciones la URL de la página web de la herramienta en línea que queramos insertar (para conocer dicha URL usaremos el buscador Google). Para que se abra en una nueva ventana o pestaña marcaremos la opción "Destino: el enlace se abrirá... en una nueva ventana". Para crear la ayuda, como no es fácil, podéis seguir las instrucciones que aparecen en la nota a pié de página número 5 del enunciado del encargo-2 (esto es: en las “Propiedades del enlace” hay que seleccionar “Edición avanzada”; y, en “Atributos HTML”, abrir la ventana de atributos ya predefinidos y seleccionar el atributo “title”. Por último, como valor del mismo escribiremos el texto que queramos que aparezca como ayuda contextual y aceptaremos todos los pasos); en mi caso, la ayuda contextual que aparecerá será "Diccionario monolingüe del español". Como siempre, con <F5> comprobaremos que todo funciona en el navegador. Después de crear las 4 herramientas (si ponéis menos se os penalizará; si ponéis más no os dará más puntos) ya tendremos acabado el apartado "1.7)" de nuestro encargo (por lo menos, en lo que a la página principal se refiere).

• Creación de los "enlaces a una cuenta de correo". Como ya comentamos anteriormente, dentro de la página web deberemos aprender a crear 4 tipos de enlace: 1) enlaces dentro de la propia página web (para lo cual, previamente, deberemos insertar en la propia web dichos enlaces internos); 2) enlaces a una dirección web; 3) enlaces a una dirección de correo electrónico; 4) y, finalmente, enlaces a un archivo local. A continuación veremos cómo crear enlaces a una cuenta de correo.  Para la creación del enlace insertaremos previamente la imagen del gif animado (recordad que Kompozer nos obligará a insertar "texto alternativo"; que, en mi caso, en español, podría ser "Gif animado que enlaza con mi correo electrónico") y escribiremos debajo nuestro correo electrónico de Gmail (en mi caso "miquel.verges.joan@gmail.com"); y, posteriormente, utilizando la opción de "enlace", insertaremos (otra vez) el la dirección de nuestro correo electrónico. En el caso del enlace textual, a diferencia del caso anterior del enlace a una página web, no utilizaremos ni la opción de "en una nueva página o pestaña" ni insertaremos ayuda contextual alguna; por contra, sí deberemos indicar la opción "lo anterior es una cuenta de correo electrónico", para que el programa inserte "mailto:" antes del correo electrónico en el enlace. Con <F5> comprobaremos que todo funcione en el navegador. Tened en cuenta que los enlaces a la dirección de correo electrónico no funcionarán si en nuestro ordenador no tenemos instalado y/o configurado ningún programa de correo electrónico (como ocurre en el aula Newton-17). Sabremos que los enlaces textual y gráfico a la cuenta del correo son correctos porque, en la barra de estado inferior izquierda del navegador aparecerá "mailto:" y "nuestra cuenta de correo". Con ello ya tendremos acabado el apartado "1.9)" de nuestro encargo (por lo menos, en lo que a la página principal se refiere).

• Creación de los "enlaces a un archivo local". Como ya comentamos anteriormente, dentro de la página web deberemos aprender a crear 4 tipos de enlace: 1) enlaces dentro de la propia página web (para lo cual, previamente, deberemos insertar en la propia web dichos enlaces internos); 2) enlaces a una dirección web; 3) enlaces a una dirección de correo electrónico; 4) y, finalmente, enlaces a un archivo local. A continuación veremos cómo crear enlaces a un archivo local.  Con lo hecho hasta ahora podemos considerar que ya tenemos finalizada la página principal o inicial de nuestro espacio web. Nos faltan solo los enlaces (gráfico y textual) del apartado "1.1)" de la página principal o inicial "index.html" a la página secundaria, y viceversa. Por ello, lo que procede realizar a continuación es CREAR LA PÁGINA SECUNDARIA de nuestro espacio web.

CREACIÓN DE LA PÁGINA SECUNDARIA DEL ESPACIO WEB

Para la creación de la página secundaria de nuestro espacio web NO VOLVEREMOS A REALIZAR los mismos pasos que hemos seguido para crear nuestra página principal "index.html". Lo que haremos será crear UNA COPIA de la página principal o inicial y TRADUCIR la página secundaria creada.

Para crear UNA COPIA de la página principal o inicial "index.html" lo que haremos será guardar dicha página con otro nombre en nuestra carpeta de trabajo (por ejemplo, en mi caso, la guardaré con el nombre de "ingles.html"). Recordad al respecto las pautas a cumplir para los nombres de los elementos de Internet. Tened en cuenta que la página web que nos queda abierta en Kompozer es la secundaria (en mi caso "ingles.html").

Con ello, lo que conseguimos de hecho es tener dos páginas web (principal y secundaria) exactamente iguales excepto en el nombre del archivo. Procedemos a abrirlas las dos en (la misma versión de) Kompozer. La única manera de saber cual es la página web que tenemos seleccionada (la pestaña mos lo indica) es comprobar en la barra azul de la ventana de Kompozer el título y el nombre del archivo de la página web activa en Kompozer.

Nos aseguramos que sea la página web secundaria la que está activa y traducimos algunos elementos para diferenciar las dos página (por ejemplo la marca o nombre de la empresa y el título del menú de opciones). En mi caso traduciré "Traducciones VigoTrans" por "VigoTrans Translations" y "Menú principal" por "main Menu".

A continuación procederemos a traducir todos los elementos traducibles de nuestra página secundaria. Al respecto, decir que muchas veces no basta con traducir sino que en algunas ocasiones es necesario también "adaptar" la web. El tipo de adaptaciones a realizar puede ser de muy diversa naturaleza: condicionada por el propio diseño de la página web (este será nuestro caso, ya que deberemos cambiar en la página secundaria la bandera de enlace a la página web principal; que en mi caso será cambiar la bandera de España por la bandera de Reino Unido), por cuestiones culturales, (por ejemplo, si nuestra web tuviese la imagen central de un cerdo, para la traducción a mercados de religión preferentemente musulmana, sería preferible reemplazar dicha imagen por la de otro animal "más querido" en dicha cultura), etc. Por ello, en el ámbito de la traducción de páginas web (y en otros ámbitos como puedan ser el de la traducción de programas informáticos, la traducción de videojuegos, etc.) se prefiere hablar de LOCALIZACIÓN (en el sentido de traducir y adaptar) DE PÁGINAS WEB (ver http://eltallerdeltraductor.com/que-es-la-localizacion-l10n/).

Empezaremos por cambiar la imagen de la bandera representativa de la lengua de nuestra página secundaria (en mi caso la "bandera de Reino Unido") por la imagen de la bandera representativa de la lengua de nuestra página principal (en mi caso la "bandera de España"). Al respecto destacar que, en muchas ocasiones, para evitar la connotación política que tienen las banderas en cuanto a lenguas se refiere, se prefiere no usar las mismas y, por ejemplo, usar solo el nombre de la lengua sin bandera (sería un caso de localización por razones políticas). Obviamente, deberemos traducir el "texto alternativo" a la lengua asociada a la bandera de la página principal (en mi caso, al español). También traduciremos el texto del enlace textual (por ejemplo, en mi caso, del inglés al español, traduciendo "In English" por "En español").

Como sea que ya tenemos todos los elementos (textuales y gráficos) de las dos páginas de nuestro espacio web (aunque falte acabar de traducir/localizar la página secundaria), podemos ya ENLAZAR LAS DOS PÁGINAS WEB. Para ello llevaremos a cabo el último de los 4 enlaces que nos falta por aprender/realizar: la creación de enlaces entre archivos locales (entre la página secundaria y la página principal; y entre la página principal y la secundaria). Para cada una de las dos páginas de nuestro espacio web deberemos hacer por duplicado el enlace entre los elementos textuales y gráficos que nos permitirán cambiar de la página principal a la página secundaria y viceversa. Como supondremos que si un/a usuario/a quiere cambiar de una página a la otra es porque desconoce la lengua e la página en la que inicialmente se encuentra, haremos que el abrirse la otra página se realice en la misma ventana (normalmente es la "opción por defecto") y que la página web visible desaparezca y se vea sustituida por la otra. para realizar dicho enlace basta con insertar en la ventana o combo el nombre de la "página web contraria" a la que tengamos activada (para ello usaremos la opción "enlace" y el icono de la carpeta que hay al lado de la ventana o combo). Nuevamente, usando <F5>, comprobaremos que todos los enlaces funciones (tanto de la página secundaria a la principal como de la página principal a la secundaria).

Ya solo nos queda traducir/localizar el resto de elementos de la página secundaria. En nuestro caso serán: 

• El título de nuestra página secundaria (con "Formato > título y propiedades de la página"). La traducción del título tiene que observarse en el navegador, en el título de la página que aparece en el nombre de la ventana o de la pestaña.

• El nombre de nuestra marca o nombre comercial (que ya tradujimos en su momento).

• El texto alternativo de todas las imágenes: de la bandera (a la lengua contraria; la propia de la página principal); la imagen principal (a la lengua contraria; la propia de la página secundaria); y, finalmente, la del gif animado del correo (a la lengua contraria; la propia de la página secundaria).

• Creación del contador SOLO en la página principal. El último elemento que nos faltará insertar en nuestro espacio web es el CONTADOR DE VISITAS (apartado "1.11)" del enunciado del encargo-2. Para ello solicitaremos (gratuitamente) el código HTML de dicho contador a la empresa https://www.contadorvisitasgratis.com . Si pulsamos "aquí" en el enlace "Estamos trabajando para que sea herramienta realmente útil, todos los días nos agregar contadores de marca nueva para todos los gustos. clic aquí" podremos acceder a todos los modelos de contador de la empresa (más de 1.000). Seleccionamos el que queremos y rellenamos el "formulario de configuración del mismo" (al respecto, notad las pésimas traducciones de algunos términos contenidos en el mismo). Insertaremos los siguientes valores: 1) Como "ubicación" dejaremos la que nos propone la propia página web (que será nuestra ubicación real; en nuestro caso "Europe/Madrid GTM +2") o la cambiaremos por la ubicación que queramos; 2) Como "categoría del sitio" elegiremos, por ejemplo, "Comercio y economía" (tened en cuenta que "adultos" significa "sexo"); 3) Como "sub-categoría" elegiremos, por ejemplo, "comercio electrónico"; 4) Como "salida" (en el formulario original en inglés  se detalla "numbers digit") escribiremos el número de dígitos que queremos que aparezcan en nuestro contador, por ejemplo, "6" (el contador contará hasta "999999"); 5) Como "número inicial", aunque el sistema proponga "0", lo cierto es que, desde un punto de vista profesional, nadie contrataría los servicios de traducción de un/a usuario/a cuyo contador de su página web muestra "0", por considerarle un/a "primerizo/a"; por ello cambiaremos su valor a un número mucho más grande (en mi caso opté por introducir "40.315"); ...) para el resto de valores dejaremos las opciones por defecto. Enviamos el formulario con la opción "enviar". El programa genera el código HTML del contador, en javaScript y sin JavaScript; probamos cuál de los dos nos funciona (en nuestro caso la segunda versión, inferior, "sin javascript"). Pulsamos el botón "HAGA CLIC Y COPIE EL CÓDIGO" y lo copiamos al final de nuestra página web principal (el código debe pegarse en el "modo de vista de código fuente" de Kompozer, ya que de no ser así se pega "como texto" y no como "código HTML". Como corremos el riesgo de borrar alguna de las etiquetas de nuestra página web, para pegarlo, el "truco" está en, "en modo de visión de diseño" de Kompozer, insertar tres equis "XXX" al final de la página principal; y, después, "en modo de visión de código fuente", buscar las "3 equis", seleccionarlas, y pegar sobre las mismas el código HTML del contador copiado previamente (mejor hacedlo con la opción "<Control>+V" del teclado y no con el ratón). Si todo ha funcionado correctamente, al volver al "modo de visión de diseño" aparecerá el contador. Tened en cuenta que, si usáis el navegador "INternet Explorer", el mismo tiene un nivel de seguridad alto y bloquea el contador; para visualizarlo hay que "hacer clic" con el botón derecho del ratón sobre la franja amarilla de bloqueo que aparece en la parte superior de la ventana del navegador y aceptar la acción del contador.

Para finalizar nuestro encargo solo nos resta subir los 6 archivos de nuestro espacio web (2 páginas web, 2 banderas, 1 imagen principal y 1 gif animado) a nuestro hostal gratuito; igual que hicimos al final de la primera clase. CÓMO SUBIR NUESTRO SITIO WEB AL HOSTAL GRATUITO DE "AWARDSPACE". Una vez creada la cuenta y el subdominio relacionado con nuestra marca o empresa en "Awardspace" (ver los dos apartados anteriores), accedemos a los mismos a través del enlace http://www.awardspace.com y la opción "Signup" (con nuestro correo de Gmail y nuestra contraseña). De entre todas las opciones del programa nos centramos exclusivamente en la opción "Herramientas de alojamiento > administrador del sitio web" (ver las imágenes del apartado anterior al respecto). Y, dentro de esta, en la opción "gestor de archivos" (a través del menú de imágenes o a través del menú textual, según nos sea más cómodo). Observaremos que al crear nuestro subdominio dentro de la aplicación se ha creado una carpeta con el nombre de dicho subdominio (en mi caso "traduccionesvigotrans.atwebpages.com"). Entramos dentro de dicha carpeta haciendo "doble clic" con nuestro ratón.  Seleccionamos la opción "subir (archivos)", arrojamos los archivos de nuestro sitio web en el recuadro de "Drag & Drop Files here to Upload" y le daremos a la opción "Upload" (cargar). Si todo ha funcionado bien los archivos de nuestro espacio web que subamos aparecerán en dicha carpeta. Cuando hayamos acabado el encargo-2 y hayamos subido todos los archivos de nuestro espacio web deberán aparecer en dicha carpeta 6 archivos. Y, si visualizamos nuestro espacio web en el navegador a través de la URL correspondiente (en mi caso http://traduccionesvigotrans.atwebpages.com), nuestro sitio web creado debe funcionar correctamente. Cada vez que cambiemos alguna cosa (nombre, contenido, etc.) de alguno de los 6 archivos de nuestro sitio web deberemos volver a subir el/los archivo/s modificados. Si, por lo que sea, tenemos que borrar alguno de los archivos ya subidos, lo borraremos con "botón izquierdo del ratón encima del archivo a borrar"+"opción delete".

Para dar por acabado el encargo-2 es necesario que: 1) Verifiquéis con el enunciado del encargo-2 que habéis realizado todos los apartados del mismo, 2) Verifiquéis que todo funcione bien en vuestro espacio web EN LÍNEA; 3) Debéis entregar (en el supuesto de que tengáis que entregar el encargo-2) el formulario “formulario-p1-e2.txt” (que debéis descargar previamente de http://jmv.webs.uvigo.es/docs/practicas/practica1/encargo2/formulario-p1-e2.txt, rellenarlo, y subirlo al "ejercicio" corrspondiente de FaiTIC) asociado a este encargo antes de la fecha límite del jueves 31/10/2019 a las 23:59 horas.

* * *

CON ELLO DAMOS POR ACABADO EL ENCARGO-2 DE LA PRÁCTICA-1

* * *