Presentacion3 Webquest

15

Click here to load reader

description

Presentación3Webquest

Transcript of Presentacion3 Webquest

Page 1: Presentacion3 Webquest

Bloque 3. Creación de una Webquest

ObjetivosConocer diferentes herramientas para la creación de webquests

ContenidosUtilización de un tutorial para la creación de webquest.

Creación de una webquest por medio de una plantilla en un editor HTML

Page 2: Presentacion3 Webquest

Creación de Una WebquestEn este apartado el reto es transformar el proyecto en

realidad. Para ello contamos con varias herramientas en línea quedifieren en formato pero todas son sencillas de utilizar.Comenzaremos por el creador de Webquest de Aulafácil, al que se accede mediante la siguiente dirección: http://www.aula21.net/Wqfacil/index.htm

Una vez allí, completaremos los cuadros de texto con lainformación ya planificada en la práctica anterior: titulo delproyecto, Autor/a, Área, Nivel, dirección de correoelectrónico, descripción, palabrasclave, Introducción, Tarea, Proceso, Recursos, Evaluación, Conclusión. y Créditos.

Nota: Los campos “autor”, “área” y “Nivel” son obligatorios, no pueden quedar en blanco.

Page 3: Presentacion3 Webquest

Creación de Una Webquest

En cuanto a la dirección de correo electrónico, no esrecomendable poner una dirección personal.

En el campo descripción colocaremos una frase que describa eltrabajo para el lector ajeno a nosotros que busca material en laweb, o simplemente para otros docentes.

Si vamos a poner nuestro trabajo en línea, podremos pensaren que éste sea relativamente fácil de encontrar en un buscador.Para esto es conveniente completar el campo Palabras claves queharán que sean esas palabras las que, al ser escritas en unbuscador, den acceso a nuestro trabajo.

Las opciones de formato son las que frecuentemente sonutilizadas en cualquier programa:

Page 4: Presentacion3 Webquest

Creación de Una Webquest

Código Hexadecimal del color

Cuadros de opciones. Clicar en el círculo para activarlo

Otra posibilidad: utilizar una imagen que se repita como fondo. Debe ser muy liviana.

Page 5: Presentacion3 Webquest

Creación de Una WebquestLa diferencia entre color de texto y color de fondo puede verse en el siguiente ejemplo:

Muchas veces necesitamos incorporar un color que no seencuentra entre las opciones para equipararlo al de un logotipo, porejemplo, creando la ilusión de transparencia. Para ello, puede consultarseen un editor de imágines el código hexadecimal del color buscado ycompletarlo en la casilla correspondiente, sin necesidad de elegirlo en delmenú.

Una vez completados los datos generales pasaremos a copiar ypegar cada uno de los textos correspondientes a las diferentes partes dela webquest, borrando el contenido de ejemplo.

El formato en el que se pegará el texto es en código HTML, con loque el mismo deberá tener ciertos códigos para ser visualizadocorrectamente:

Aquí el color de texto es verde y el color de fondo es naranja

Aquí el color de texto es naranja y el color de fondo es verde

Page 6: Presentacion3 Webquest

Creación de Una Webquest

Page 7: Presentacion3 Webquest

Creación de Una Webquest

A la izquierda contamos con algunos botones (salto delínea, Negrita, Cursiva) que insertarán estos TAGS de HTML.

En la página Web final, donde dice <br> se realizará unsalto de línea (similar al que se crea en un procesador detextos al presionar la tecla Enter), y donde haya un texto quecomienza con <b> y termina con </b> el exploradorinterpretará que debe ponerlo en negrita.

Por lo tanto, si deseamos que nuestro título aparezcadestacado en negrita y luego haya una línea enblanco, seguido del resto, debemos escribir algo así

<b> Este es el título </b><br><br>Este es el resto del curso

Este es el título Este es el resto del curso

Page 8: Presentacion3 Webquest

Creación de Una Webquest

Al llegar a la sección “Recursos” nos encontraremos con una lista decuadros de texto para completar nuestros vínculos:

Será interesante colocar a la izquierda un texto descriptivo delvínculo, y a la derecha la dirección URL (comenzando siempre conhttp://), de este modo:

Una vez completadas todas las secciones, incluyendo los créditos(referencias a los lugares donde hemos obtenido información, ya seansitios de Internet, libros, revistas, etc) se nos permite optar por una opciónen cuanto a la futura impresión de nuestro trabajo, que podremos dejaren blanco por ahora.

Page 9: Presentacion3 Webquest

Creación de Una Webquest

Luego, al presionar el botón “crear la webquest” simplemente aparecerá lamisma en pantalla (sin las imágines) y deberemos utilizar la opción del navegador “Guardarcomo…” para que se guarde en nuestro disco duro, eligiendo la carpeta en la que tenemostodas las imágenes.

Esto creará un archivo en HTML que abriremos haciendo doble clic en él.Para utilizar la Webquest en forma local debemos copiarla en otros PCs, incluyendo todoslos archivos de imágenes (la carpeta completa).

Page 10: Presentacion3 Webquest

Creación de Una WebquestOtra alternativa

Otra manera, ya no tan sencilla, de crear webquests es mediante lautilización de una plantilla, que no es otra cosa que una webquest ya creada quedebe editarse reemplazando el texto que contiene por el texto que deseamos.

Entrando en la siguiente dirección tendremos varios modelos, entre loscuales debemos elegir uno: http://www.isabelperez.com/webquest/modelo.htm

Page 11: Presentacion3 Webquest

Creación de Una Webquest

Haciendo clic en la imagen de muestra, entraremos en la webquest modelo. En mi caso he elegido la opción “Modelo con marcos”, clicando en la pantalla (donde el puntero del ratón se convierte en una mano)

Una vez allí puede observarse que la pantalla está dividida en dos secciones (marcos). A la izquierda veremos el menú con opciones. Si clicamos en cada una de las secciones se nos mostrará un texto explicativo que nos guiará en la confección de nuestra webquest:

Page 12: Presentacion3 Webquest

Creación de Una Webquest

Una vez elegido el modelo, utilizaremos la opción “atrás” de nuestro navegador y clicaremos en la imagen pequeña que dice:

Page 13: Presentacion3 Webquest

Creación de Una Webquest

Esto pondrá en nuestro disco duro un archivo llamadoplantilla2.zip, que contendrá todo el material necesario para elaborarla webquest en un archivo comprimido.

Presionaremos el botón derecho del ratón y aparecerá entre lasopciones “Descomprimir en…”o “Extract using Winrar…” (Según cuálsea la herramienta de descompresión que tenga instalada en suordenador)

NOTA: Para descomprimirlo será necesario tener una herramientacomo el Winzip o el Winrar, disponibles en la mayoría de losordenadores. Si no cuenta con ninguno de ellos podemos obtenerlosclicando en los siguientes enlaces:

Cuando acceda a la carpeta donde los archivos se handescomprimido, podremos observar la siguiente estructura:

Page 14: Presentacion3 Webquest

Creación de Una Webquest

Si hacemos doble clic en uno de estos archivos veremos que simplemente tiene elcontenido de la sección que menciona en ingles (evaluation=evaluación, process=proceso, etc)Para volcar los textos propios, deberemos editar los archivos en cualquier editor depáginas web (o simplemente en Microsoft Word), cambiando únicamente el textode ejemplo por el propio. Eso sí, sin eliminar códigos para que se vea de la mismamanera que el modelo.

Page 15: Presentacion3 Webquest

Creación de Una WebquestLos archivos que debemos editar son:

•Top.html (Contiene la pantalla principal)•Introduction.html (Contiene la introducción)•Task.html (contiene el contenido correspondiente a la tarea)•Process. Html (contiene el proceso)•Evaluation. Html (contiene la sección evaluación)•Conclusion.html (Contiene la conclusión)•T-index. Html (Contiene la guía para el profesor)•Credits.html (contiene las referencias o créditos)

Si clicamos con el botón derecho del ratón en uno de los archivospueden aparecernos algunas de las opciones remarcadas con rojo. Cualquierade ellas será válida, siempre que no eliminemos ningún código que noconozcamos.

El trabajo será más fácil en dreamweaver, FrontPage o Word ya que en elBloc de notas, por ejemplo, la tarea se complicará ya que se visualizarán todoslos códigos directamente y habrá que distinguir bien el código del contenidoantes de eliminar el texto del ejemplo.

Para el valiente que se atreva a ir más allá, puede editar también elarchivo “navbar.html” que contiene el menú, pero es recomendable hacerantes una copia de seguridad por si dejara de funcionar la navegación.