tutorial paginas web[1]
Post on 20-Nov-2015
226 Views
Preview:
DESCRIPTION
TRANSCRIPT
Tutorial
Mdulo Proyectos Virtuales Educativos
Tutorial: Creacin de Pginas Web en
Google Page Creador
Existen muchas opciones para crear pginas Web, en esta ocasin crearemos un sitio Web con la herramienta de Google Page Creador.
Visitar sitios Web
Para crear un sitio Web, primero tienes que pensar cules sern las pginas que crears. Si el sitio es para una Institucin Educativa, puedes visitar estos sitios Web para tomar ideas:
Colegio Andino Antillanca
http://www.colegioandino.cl/catalog/home.htm
Colegio Andino de Bogot
http://www.colegioandino.edu.co/
Colegio Tierra Nueva
http://www.colegiotierranueva.edu.co/
Comenzar a crear el propio sitio Web
Para eso:
1) Abrir un navegador de pginas Web (Internet Explorer, Mozilla, Netcaspe, Opera, Ares, etc.)
2) Escribir en el campo de la direccin
http://googlepages.comSi escribiste bien la direccin vers la siguiente pantalla:
Figura Nro. 13) Para ingresar debes usar tus datos de acceso de la cuenta de gmail, en email y password.
4) Una vez ingresado aparece la siguiente ventana de bienvenida, hacer clic en Im ready to create my pages
Figura Nro.2
5) Luego se muestra la siguiente ventana activar la aceptacin de los trminos y condiciones de uso. Hacer clic donde indica la flecha.
Figura Nro. 36) Luego aparece la siguiente ventana. Para comenzar, elige una plantilla con la opcin Change Look,
Figura Nro.47) Selecciona el diseo de tu agrado haciendo doble clic sobre el mismo de entre todas las plantillas que aparezcan.
Figura Nro. 58) Aparece la plantilla elegida. Esa primera pgina es el HOME o pgina principal. All se puede actualizar la informacin, haciendo clic el los lugares donde hay textos en ingls. Escribir el ttulo del sitio en el lugar donde dice: clic here to enter your pages title tal cual aparece en la siguiente pantalla.
Figura Nro. 6Salir y volver a ingresar al sitio. Cuando se reingresa se visualiza la siguiente pantalla:
Figura Nro. 7La arquitectura del Sitio
Ahora agregaremos las pginas al sitio, donde publicaremos el proyecto de grado. Luego pueden crear otro para promover el proyecto.
1) En la imagen anterior, se visualizan dos cuadros, hacer clic en el que tiene la casita, esa es la pgina principal.
Figura Nro. 82) Luego se visualiza la siguiente ventana
Figura Nro. 93) En la caja de texto de la izquierda, hacer clic y escribir los NOMBRES de las pginas que tendr el sitio Web. Por ejemplo:
Sitio Web de Proyecto
Inicio
Planteamiento del Problema
Descripcin
Justificacin
Marco Terico
Estado del Arte
Objetivos
Metodologa Propuesta
Introduccin con enfoque
Fases y Etapas
..
Sitio Web Institucional
Inicio
Misin
Visin
Modelo Pedaggico
PEI
Aula Virtual
Plan de estudios
Sedes
Docentes
Estudiantes
Promociones
Para ENSENET, tener en cuenta la gua para publicacin del proyecto de grado entregado por el profesor.
4) Una vez hecho el listado de pginas que tendr el sitio comenzar a agregarlas. Cmo? 4.a- Marcar (seleccionar) con el mouse el ttulo. Luego hacer clic sobre el botn Link
Figura Nro. 104.b- Luego aparece la siguiente ventana, hacer clic en el botn Add Page
Figura Nro. 114.c- Luego se visualiza la siguiente pgina, ver que ya aparece una pgina con el ttulo elegido. All hacer clic en el botn Ok.
Figura Nro. 124.d- Aparecer la pgina principal con el link hecho. Repetir los pasos desde el 4.a y hasta el 4.c hasta finalizar con todas las pginas.
Figura Nro.135) Ahora a copiar ese MEN de NAVEGACIN en cada una de las pginas. Para eso, seleccionar con el mouse todos los ttulos, COPIAR. Hacer clic en Back to Site Manager.
Figura Nro. 146) Luego visualizarn la siguiente ventana, con todas las pginas creadas. Hacer en la segunda pgina, en este caso: Misin
Figura Nro. 157) Una vez all, en el marco de texto de la izquierda PEGAR el men de la pgina principal. Luego seleccionar el primer ttulo, en este caso: Inicio, hacer clic en el botn Link, y enlazarlo a la pgina principal (el que tiene el icono de una casita). En este ejemplo: I.E. Distrital Juan B. Alberti. Verificar que est marcado en color naranja suave, luego hacer clic en el botn Ok.
Figura Nro. 168) Luego se visualiza la siguiente ventana, con los links sealados en color rojo (en este ejemplo). Esta ventana est en modo EDICIN.
Figura Nro. 179) Luego agregar este men en las dems pginas:9.a Seleccionar y copiar este men.
9.b - Hacer clic en Back to Site Manager.9.c- Ingresar a cada una de las pginas.
9.d- Pegar en la caja de texto de la izquierda.
10) Una vez copiado el men en todas las pginas. Estando en la ventana de la figura Nro. 15 (para eso hacer paso 9.b). Una vez all:10.a Hacer clic en All, para seleccionar todas las pginas.
10.b Luego hacer clic sobre el botn Publish
Figura Nro.1810.c- Luego debern ver todas las pginas en un cuadro celeste claro. Como en la siguiente figura. Eso significa que todas las pginas ya pueden visitarse desde Internet.
Figura Nro. 1911) Hacer la prueba de funcionamiento del sitio. Para eso hacer clic en la direccin en celeste donde dice: (en el ejemplo de este ejercicio). Deben poder navegar por todo el sitio sin ningn problema. Site Manager: http://gpeucc23.googlepages.com
12) Una vez que hayan comprobado que todo funciona bien, comenzar a ingresar textos e imgenes a cada pgina. Agregar imgenes
Para agregar imgenes o fotos seguir los siguientes pasos:
1) Entra a la pgina en la que deseas incluir fotos o imgenes.
2) All veras una men como en la siguiente imagen:
Figura Nro. 20Haz clic en el botn Image. Luego aparece la siguiente ventana. All buscas la imagen que deseas incluir, si lo deseas puedes subir todas, de a una.
Figura Nro. 213) Una vez que lograste subir todas las imgenes (despus puedes seguir este proceso), se visualiza como el siguiente ejemplo:
Figura Nro. 22All, seleccionas la imagen que deseas agregar y luego hacesclic en el botn Add Image.
4) Una vez agregada la imagen, aparece la pgina que se est editando:
Figura Nro. 23Si la deseas dejar como se ve, haces clic en algn lugar de la pgina y desaparece la ventana de dialogo para ampliar o hacer algo ms con la imagen, ensaya a ver que pasa.
Pginas hechas en Google Page
Monte Cristo
http://montecristofan.googlepages.com/Literatura Latina Activa
http://literaturalatinaactiva.googlepages.com/
Quinto Encuentro Continental Tawaintisuyu Pacha De Jovenes Y Nacionalidades Originarios
http://quintoencuentrotawaintisuyu.googlepages.com/
Asociacin Escolar de Gimnasia Artstica
http://aegachile.googlepages.com/Promocin 96 Externado San Jos
http://prom96externado.googlepages.com/
Pgina personal Hoja de Vida de Mara Patricia Ochoa Valbuena
http://mpochoav.googlepages.com/Agregar cosas al sitio.
Foros:
http://www.webconferencia.net/forum.php
Crear el foro y luego hacer el link desde la pgina al foro.
Sitios creadas en la cohorte XII
http://puntadalaboral.googlepages.com/
Puntada laboral
http://programaepe.googlepages.com/Escuela para el Emprendimientos
http://nancyagopo2.googlepages.com/homeFundacin de Turismo Ambiental Cogua A.T.A.
Haz clic aqu
Haz clic aqu
Autor: Crescencio Orrego- 1 -
top related