joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · web...

12
Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/ GUÍA DE TRABAJO CREACIÓN DEL SITIO WEB 1. INGRESAR A LA PÁGINA www.weebly.com seleccionar el idioma español. 2. Registrarse para crear el sitio web escribiendo los datos solicitados a. Colocar título (NOMBRE Y APELLIDO) b. Seleccionar el tipo de sitio: educación c. Categoría (Profesor, proyecto, escuela, informativo, otro) Continuar. d. El dominio debe ser en minúsculas, sin tilde, sin espacios en blanco, no usar la letra ñ. (.weebly.com) CLIC EN CONTINUAR

Upload: vodang

Post on 18-Feb-2018

216 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/ GUÍA DE TRABAJO

CREACIÓN DEL SITIO WEB

1. INGRESAR A LA PÁGINA www.weebly.com seleccionar el idioma español.2. Registrarse para crear el sitio web escribiendo los datos solicitados

a. Colocar título (NOMBRE Y APELLIDO)b. Seleccionar el tipo de sitio: educaciónc. Categoría (Profesor, proyecto, escuela, informativo, otro)

Continuar.d. El dominio debe ser en minúsculas, sin tilde, sin espacios en blanco, no usar la letra ñ. (.weebly.com)

CLIC EN CONTINUAR

Page 2: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

DISEÑO O PRESENTACIÓN DEL SITIO WEB

1. Clic en la pestaña diseño y en todos los temas

Seleccionamos el tema deseado. (Árbol)2. Ubicados sobre la imagen superior (dentro de la imagen) hacemos clic en Edit Image

a. En la barra de herramientas que aparece hacemos clic en Add Image y luego en la siguiente ventana clic en el botón verde para buscar la imagen que deseamos colocar.

b. En la carpeta ACTIVIDAD la imagen Familia la seleccionamos y le damos abrir

c. La ubicamos a un lado con clic sostenido y le damos ok.

Page 3: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

d. Hacemos clic en la parte superior en Add Text para agregar un texto (NOMBRE Y APELLIDO)

e. Movemos el texto (NOMBRE Y APELLIDO) a la derecha de la imagen y presionamos el botón Glow (brillo) Para darle una mejor presentación deslizando hacia la derecha el botón sobre la barra y Ok

f. Vamos a la parte superior derecha y le damos clic al botón Save (Guardar) All Pages (Todas las páginas)

PODEMOS HACER CLIC EN PUBLICAR PARA GUARDAR LOS CAMBIOS Y OBSERVAR COMO VA NUESTRO TRABAJO EN LA

WEB.

g. El la ventana siguiente dejamos seleccionado el dominio weebly.com y damos continuar

h. Esperamos que se publique y damos clic en la dirección otorgada a nuestro sitio web (

Page 4: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

i. http://______________________.weebly.com)

USO DE HERRAMIENTASCERRAMOS LA VENTANA DE PUBLICACIÓN PARA REGRESAR AL PANEL DE TRABAJOEn la pestaña Elementos, sección Básico

Aparecen varias herramientas que se utilizan arrastrándolas con clic derecho al lugar de la página donde queremos que se ubiquen. (Las que tienen el logo pro no las usamos por que son para sitios pagos)

1. Usando la herramienta Múltiple Columns dividiremos la página inicial en dos columnas.

2. Al lado derecho insertaremos con la ayuda de la herramienta Párrafo con imagen Nuestro nombre, una foto y una breve presentación del sitio y su autor.

Page 5: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

Para ingresar la imagen damos clic en el cuadro azul y buscamos la imagen que deseamos colocar (similar como se hizo con la imagen “familia” colocada en la parte superior). Podemos ampliarla o reducirla con clic sostenido en la esquina inferior derecha (cuadro rojo)

En Clic aquí para modificar (título) escribimos el nombre y apellido del autor del sitio (Podemos centrarlo, cambiar el tamaño, el color… usando la barra de herramientas que aparece automáticamente.

En Haz clic aquí para modificar (texto) escribimos nuestra presentación

3. GALERÍA DE IMÁGENES

Haciendo clic debajo de “Básico” en la sección Multimedia

Aparecen más herramientas que podemos usar como por ejemplo:

a. Slide Show Presentación con diapositivas: Con el clic derecho la arrastraremos hasta la columna izquierda para ubicar en ese lugar unas imágenes

Page 6: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

Seleccionamos el tipo de presentación deseada y damos clic en continuar:

Hacemos clic en el botón Upload Photos (Subir fotos) y seleccionamos las imágenes que deseamos colocar (galeria1 hasta galería5) y hacemos clic en Abrir

Esperamos que cargue las imágenes y damos clic en Save (guardar)

Page 7: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

Listo, aparecerán las imágenes como una presentación dinámica.

Al estar ubicados en esta sección aparece una barra de herramientas que nos permitirá hacer modificaciones como agregar o editar las fotos, estilo del navegador….

HACEMOS CLIC EN PUBLICAR

4. CREACIÓN DE PÁGINAS Y SUBPÁGINAS

Al hacer clic en la pestaña páginas nos aparece una opción en la cual podemos modificar las páginas existentes, agregar o quitar

Lo primero que haremos será cambiar el nombre ala página Home por INICIO simplemente borramos la palabra Home e introducimos la palabra INICIO y damos clic en Guardar configuración Volvemos a dar clic en la pestaña páginas

Page 8: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/ A continuación hacemos clic en Add page agregar página, de inmediato aparece la nueva página con el nombre New Page que cambiaremos por MATEMÁTICA

Continuamos dando clic en Modificar página Nos aparece una página nueva totalmente limpia en donde ingresaremos lo siguiente:Hacemos clic al lado derecho donde aparece multimedia, luego en la parte superior en arrastraremos la herramienta

archivo flash

Damos clic en el cuadro negro y aparece la barra de herramientas

Presionamos Cargar archivo nuevo y buscamos el archivo “Tablas de multiplicar” y damos abrir

Esperamos que cargue, una vez aparezca el objeto lo centramos y damos clic en publicar para ver nuestro trabajo.

A CONTINUACIÓN REALIZAREMOS LOS PASOS PARA CREAR UNA NUEVA PÁGINA, esta vez la nombraremos como NATURALES en ella usaremos dentro del paquete de herramientas multimedia la inserción de un video de youtube de l siguiente forma:

Arrastramos a nuestra página el objeto Video de youtube

Page 9: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/ Una vez colocado en el lugar deseado aparece un video de presentación al darle clic al video parece y encima la barra de herramientas

En el cuadro URL de video de YouTube ingresa esta dirección:

http://www.youtube.com/watch?v=3w4WYClscus&feature=fvstEs un video del aparato digestivo que será cargado automáticamente, este video podemos modificarlo usando la barra de herramientas por ejemplo su tamaño (pequeño, mediano, grande, extra grande) y los márgenes de posición en la sección Avanzado.

Haz clic en publicar para guardar el trabajo.

UBICADO EN LA PÁGINA DE INICIO

Debajo de la imagen de presentación se utiliza el Elemento Básico Imagen Para insertar la imagen del campus virtual UDES y su enlace http://aulavirtual.eaie.cvudes.edu.co/

Primero arrastramos el elemento imagen al lugar donde deseamos ubicarlo.

Hacemos clic sobre el cuadro azul, luego en el botón verde

y buscamos la imagen de nombre udes ubicada en la carpeta Actividad Damos clic en abrir y esperamos que cargue la imagen.

Page 10: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

Al colocarnos encima de la imagen a parece una barra de herramientas de color negro en donde salen varios botones de los cuales usaremos dos:

El primero para ingresar el enlace http://aulavirtual.eaie.cvudes.edu.co/

Debemos seleccionar la opción Abrir el vínculo en una nueva ventana y dar clic en guardar

y el segundo para colocar una breve descripción debajo de la imagen (Aula Virtual UDES)

Damos clic en Save

Hacemos clic en

CARGA DE ARCHIVOS (WORD, PDF, EXCEL, MP3, ETC)PODEMOS CARGAR ARCHIVOS QUE NO SUPEREN LOAS 5 MEGAS DE UNA FORMA SENCILLAPuede ser creando un vínculo en un texto como lo haremos a continuación:Primero ingresaremos un texto usando la herramienta Texto o si lo desea con la herramienta Titulo

Page 11: joseluistrespalacios.weebly.comjoseluistrespalacios.weebly.com/.../5/8/11583497/gua_… · Web viewAparecen varias herramientas que se utilizan arrastrándolas con clic derecho al

Ingeniero José luis trespalacios http://joseluistrespalacios.weebly.com/

Modificamos el texto escribiendo “NOTAS DE UN ÁREA CON PORCENTAJES” y seleccionamos dicho testo

En la barra de herramientas de texto

Hacemos clic en el botón vínculo

Seleccionamos Y damos clic en cargar un archivo para buscar el archivo a subir NOTAS DE UN ÁREA POR PORCENTAJES

Y LE DAMOS ABRIR

Clic en NOTA: TODAS LAS HERRAMIENTAS TIENEN LA OPCIÓN DE SER BORRADAS HACIENDO CLIC EN LA PARTE SUPERIOR DERECHA EN LA CRUZ ROJA QUE APARECE

PARA SALIR HACEMOS CLIC EN LA PARTE SUPERIOR DERECHA EN LA PALABRA CERRAR

Y LUEGO EN CERRAR SESIÓN

TAREA: ¿PARA QUE SIRVE LA PESTAÑA EDITORES?EN LA PESTAÑA DISEÑO ¿QUÉ SE PUEDE HACER EN LA SECCIÓN OPCIONES DE DISEÑO?