Tramas Sensibles. Taller de capacitación docente. María Gabriela Hernández Celiz y Marcelo Santorelli. Mayo 2012

Transcripción

1 Tramas Sensibles Taller de capacitación docente. María Gabriela Hernández Celiz y Marcelo Santorelli Mayo tutorial para registro y operación de Hotglue Qué es Hotglue? Hotglue es un sistema de manipulación de contenidos digitales que posibilita cnstruir sitios web directamente el el navegador. La diferencia con otras opciones se basa en su operación directa sobre la página resultante, evitando interfaces que rompen con su apariencia final. A diferencia de las páginas web tradicionales, nos permite: de forma gráfica, manual y libre, configurar un diseño prescindiendo de programas de edición web como Adobe Dreamweaver o Bluefish. almacenar los archivos de la página en el servidor hotglue.me y no en nuestra computadora. Se evitan los servidores privados (opcionalmente se puede instalar Hotglue en un servidor privado también), y de programas para operar dichos servidores y subir la página, como Filezilla. obtener un cuenta rápidamente y comenzar un diseño intuitivo desde una página enteramente en blanco, sin plantillas ni organizaciones previas. extender la composición infinitamente hacia la derecha y hacia abajo. crear objetos, superponerlos, darles transparencia y editar otras propiedades gráficas. generar un árbol de páginas web, sus correspondientes vínculos y disponer de una página extra que resume la cantidad de páginas que componen el sitio. disponer de herramientas sofisticadas (aunque no perfectas) de comunicación y colaboración a distancia gratis, y modificable por el usuario desde su fuente (open source). Además, Hotglue permite el uso opcional de lenguajes de programación como HTML, Javascript, jquery y también incrustar imágenes vectoriales.svg (que pueden componerse en el programa de edición vectorial Inkscape) mediante la inserción de código en la correspondiente ventana Por qué Hotglue? Hay una multiplicidad de recursos para establecer una sitio de colaboración virtual, pero no hay una infinita cantidad de opciones a un mismo requerimiento. Algunos se enfocan hacia la generación y edición de textos (Wikispaces otros a compartir archivos a manera de bibliografía (Google docs), otros proveen espacio de servidor sin importar formatos de archivos y las facilidades para actualizar cambios en los diferentes clientes (Dropbox o bien servicios destinados a compartir marcadores de páginas web (Delicious En general, a almacenar datos en servidores propios, con lo cual se facilita el acceso desde diferentes computadoras y consecuentemente la colaboración. En este curso tratamos de brindar herramientas advirtiendo que son ocasionales y que la provosión del servicio puede ser limitado en tiempo. Hotglue, en particular, reúne las condiciones que pueden intesarle a un usuario que desea manejar el contenido de su proyecto en correlación con la forma o composición. Es decir, una persona con inquietudes creativas que no desea condicionamientos estéticos a priori. Para casos en los que se requiera componer en formatos tradicionales no creativos, el uso podría ocacionar complicaciones Tutorial Registro (págoina siguiente. Acceda mediante internet a y regístrese como lo indican las imágenes siguientes.

2 Click para registrarse nombre de usuario a elección contraseña a elección repetir contraseña proveer dirección de marcar la pistola de silicona (dato de humor, sin uso práctico) desmarcar la 1ª (deseo recibir información...) y marcar la 2º (Acepto los términos) Confirma registro y solicita chequear mail

3 Activar registro haciendo click en el 1º vínculo Confirma la activación de la página y solicita ir a Informa que la página no existe todavía y nos invita a crearla. Haga click en "create it!"

4 A partir de ahora, Ud. estará en condiciones de editar su página. Un mensaje le da las primeras instrucciones: 1. Ahora, Ud. está en modo edición. Ud. puede usar clicks simples y dobles para acceder a los menus. Ellos pararecerá al lado de puntero de mouse. 2. Clickée en la tela (fondo blanco de la pantalla) para abrir el menú, el cual le permitirá crear nuevos objetos, crgar archivos e incrustar videos de YouTube y Vimeo (solamente). 3. Los clicks dobles le darán opciones de menú para cambiar preferencias, mostrar una grilla, crear nuevas páginas, configurar el fondo de la pagina y más! 4. Remover el "edit" de la dirección de la página (el URL) para verla en modo visualización. Así es como la página aparecerá para todas las personas. 5. Para volver al modo edición agregar /edit a la dirección de la página. Haga click en cualquier parte del mensaje para eliminarlo. No volverá a aparecer Uso Primer click (arriba) y doble click (abajo) sobre la tela o fondo. Crea objeto cuadrado. Puede introducirse texto con un doble click en el mismo. Cargar cualquier tipo de archivo, p.e. una foto. También.pdf,.doc, etc. Incrusta página web. Con esta función pueden crearse "marcos". Solicita ingresar dirección después del click. Cambia el título de página Cambia dirección de página Cambia color de fondo Crear pagina nueva Agregar imágen de fondo Agregar/editar código* Hace de la página la página inicial Elimina la página Muestra lista de páginas Ajusta selección de imagen de fondo Esconde/muestra grilla** Deshacer

5 * Ofrece una página distinta pero asociada a la que se estaba editando, en la que se puede ingresar código HTML. En caso de diseñar un esquema o ilustración en formato.svg (con Inkscape o Adobe Illustrator), se puede abrir dicho archivo con un procesador de texto (Word, OpenOffice o Wordpad), copiar el texto completo (Ctrl+E) e ingresarlo en la ventana inferior. ** Dicho comando esconde y muestra una grilla para facilitar la alineación de objetos. Asimismo, cambia la medida deslizando el mouse mientras se mantiene el click derecho (dragar) Menú de edición de texto Color de fondo Hacer fondo transparente Tamaño (cuerpo) de letra Color de letra Tipografía Estilo de tipografía Interlineado Clonar Transparencia Nivel Voltear Vincular Nombre del objeto (para vincularlo) Aparecer en todas las páginas Bloquear objeto Eliminar objeto Alinear texto Margen de texto