Post on 08-Apr-2018
8/7/2019 Paginas Web Con Word
1/18
Centro Zonal Sur 9 7
PAGINAS WEB
5Mdulo
8/7/2019 Paginas Web Con Word
2/18
9 8 Centro Zonal Sur
Cree una carpeta con su nombre en el escritorio de
Windows. Para ello siga los pasos indicados:
a) Botn derecho del mouse
b) Selecciona la opcin nuevo
c) Selecciona la opcin carpeta
d) Pngale nombre a la carpeta
Grabe el archivo con extensin
HTML en la carpe ta rec in
creada. El primer archivo debe,
necesariamente, denominarse
index.
Abra un archivo nuevo con Word
a) Clic en inicio
b) Seleccione Nuevo Documento de Office
c) Seleccione Documento en Blanco (Word)
d) Seleccione Men Archivo
e) Seleccione la opcin Guardar como
HTML...
f) Seleccione su carpeta
g) Guarde el archivo
DISEO DE PAGINAS WEB
UTILIZANDO WORD
5.1
8/7/2019 Paginas Web Con Word
3/18
Centro Zonal Sur 9 9
Ahora, se debe crear un fondo para la pgina. Para
ello, deben seguirse los pasos siguientes:
a) Men Formato - Opcin Fondo
b) Clic en Efectos de Relleno
c) Seleccionar un tipo de fondo
En la misma opcin de elegir fondo, es conveniente
elegir una textura de fondo y no un slo color. Paraellos se debe seleccionar la opcin efectos de
relleno y luego en textura. Ah aparecern diversas
posibilidades de texturas para ser usadas como
fondo de pgina.
A continuacin, se debe elegir una fuente, tamao
y color de letra adecuada para el fondo seleccionado.
Posteriormente, se procede a escribir el ttulo de la
pgina y ya se est en condiciones de comenzar a
desarrollar los contenidos.
8/7/2019 Paginas Web Con Word
4/18
1 0 0 Centro Zonal Sur
HIPERVINCULOS Y TABLAS5.2
Hipervnculos o links
Los hipervnculos son textos o grficos en colores
y subrayados desde donde se puede hacer clic para
saltar a otro archivo, a una parte determinada de
un archivo, a una pgina HTML en Internet, o
establecer un enlace para enviar un correo
electrnico. Estos hipervnculos pueden establecerse
ya sea con alguna parte de una pgina en particular,
o con un sitio web entero.
Hipervnculos con una parte del
archivo
Los pasos necesarios son los siguientes:
1. Hacer clic en el lugar o posicin donde se desea
poner un marcador
2. Insertar un Marcador en el lugar en que se
desea que vaya la pgina al hacer clic...
3. En el Men Insertar hace clic en la opcinMarcador
4. Escribir el nombre del marcador o seleccionar
el nombre de uno en la ventana
5. Haz clic en el botn agregar de la ventana
anterior
6. Seleccionar el texto que se quiere que aparezca
con vnculo
7. Establecer el hipervnculo entre el texto
seleccionado y el marcador correspondiente.
Para ello, hay que ir Men Insertar, Opcin
hipervnculo
8. Hacer Clic en el botn Examinar que est en
el lado derecho de la opcin Ubicacin dentro
del archivo (opcional)
8/7/2019 Paginas Web Con Word
5/18
Centro Zonal Sur 1 0 1
8. Seleccionar el marcador correspondiente
definido con anterioridad y hacer clic en el Botn
Aceptar.
9. Hacer nuevamente clic en el botn Aceptar.
H ipervnculos con otro archivo
En este caso, es necesario que se realicen lossiguientes pasos:
1. Asegurarse que el otro archivo ya existe, de lo
contrario, lo primero ser crear un archivo con
formato HTML y grabarlo en una carpeta.
2. Seleccionar el texto que se desea vincular con
otra pgina.
3. Elegir l a opcin Hipervnculo del menInsertar.
4. Hacer clic en el botn Examinar que est al
lado derecho de la opcin Vincular al archivo
o direccin URL.
5. Buscar en las carpetas, el archivo con el cual
se desea hacer el hipervnculo.
6. Hacer clic en el botn Aceptar, en la pantallaanterior y luego nuevamente en Aceptar en lapantalla que aparecer a continuacin.
8/7/2019 Paginas Web Con Word
6/18
1 0 2 Centro Zonal Sur
Hipervnculos con una pgina web
1. Seleccionar el texto con el cual se desea hacer
el hipervnculo.
2. Elegir la opcin Hipervnculo del men
Insertar.
3. Debajo de la opcin Vincular al archivo o
direccin URL, debe escribirse la direccin
de la pgina Web con la cual se desea hacer el
vnculo.
5. Hacer clic en el botn Aceptar, de la pantallaanterior
Hipervnculos con una direccinelectrnica
1. Escriba su direccin en su pgina web principal
o bien ponga una imagen que represente al
correo.
2. Seleccione el nombre de su direccin de correo
o la imagen que representa al correo.
3. Seleccione la opcin Hipervnculo del men
Insertar.
4. Debajo de Vincular al archivo o direccin URL,
escribe la direccin de tu correo, despus de la
palabra mailto:.
Por ejemplo: mailto: jperez@hotmail.com
Uso de tablas
Las tablas se usan especialmente para organizar de
mejor forma el texto y las imgenes.
Existen bsicamente dos formas de insertar una
tabla y ello depende del objetivo que se desea lograr:
1. S i se desea una tabla ms bien de
caractersticas homognea en sus celdas, lo
recomendable es usar la opcin Insertar Tabla
del men Tabla. Hay que definir el nmero de
columnas y filas y luego hacer clic en el botn
Aceptar.
8/7/2019 Paginas Web Con Word
7/18
Centro Zonal Sur 1 0 3
2. Si se requiere una tabla heterognea en los
tamaos de las celdas, es mejor usar la opcin
dibujar tabla en el men tabla
Con este lpiz puedes dibujar una tabla a tu
medida y posteriormente tambin puedes agregarle
ms divisiones a las celdas.
A continuacin se indican algunas posibilidades de
edicin con el uso de tablas:
1. Agregar bordes a las tab las de las
usando el comando Borde del men
Tabla.
2. Ca m bi ar el co l or de fo nd o o el
sombreado de las tab las con e l
comando Prop iedades de tab la y
cambiar el color de fondo de una
seleccin de celdas con el comando
Propiedades de celda, en el men
Tabla.
3. Ca m bi ar el al to de la s f i l as
se lecc ionadas y e l ancho de las
co lumnas se lecc ionadas con e l
comando Propiedades de celda (men
Tabla).
8/7/2019 Paginas Web Con Word
8/18
1 0 4 Centro Zonal Sur
DISEO DE PAGINAS WEB
UTILIZANDO FRONT PAGE
5.4
Actividad 1
1. Cree una Carpeta en el disco duro.
2. Abra el programa FrontPage Express.
3. Cree el siguiente esquema utilizando tablas
5. Digite en la primera fila el nombre del proyecto
colaborativo, luego cntrelo, cambie el
tamao (aumente a 36) y el colordel ttulo.
6. Inserte una imagen en la celda de la derecha
de la segunda fila (disminuya el tamao si es
necesario).
8. En la primera columna, segunda fila, digite el
siguiente men:
Datos principales
Objetivos
Actividades
Recursos e insumos
Productos esperados
Evaluacin
9. Cntrelo, agrande la letra (24) y djela en
negrita.
10. En la tercera fila, escriba el domicilio y telfonocorrespondientes a suescuela y centre dichosdatos.
8/7/2019 Paginas Web Con Word
9/18
Centro Zonal Sur 1 0 5
11. Cambie el color de fondode su pgina. Para ello, seleccione la opcin desde Propiedades de la
pgina (con botn derecho en cualquier lugar fuera de las tablas), luego seleccionar Fondo.
12. Centre la figura dentro de la celda.
13. Guarda el archivo, con el nombre indexen tu carpeta.
H ipervnculos, links o enlaces
La caracterstica que ms ha influido en el espectacular xito del Web (o tela de araa) ha sido, aparte de
su carcter multimedial, la posibilidad de unirlos distintos documentos repartidos por todo el mundo por
medio de enlaces hipertexto.
Vamos a distinguir cuatro tipos de hipervnculos o enlaces:
Abrir este
men
1. Enlaces dentro de la misma pgina
2. Enlaces con otra pgina nuestra (otro archivo)
3. Enlaces con una pgina fuera de nuestro sistema4. Enlaces con una direccin de e-mail
8/7/2019 Paginas Web Con Word
10/18
1 0 6 Centro Zonal Sur
Actividad 2
1. Enlaces dentro de la misma pgina
a) Cree una pgina web nueva (Archivo - nuevo - pgina en blanco) que tenga el nombre de:formulario y gurdela en su carpeta.
b) Prepare un ndice como lo muestra la siguiente figura (dele el formato que desee). Para ello,utilice Tablas.
c) Baje el cursor unas 15 lneas, despus del ndice creado. Digite la informacin referente a los datos
del ndice, separadas unas de otras por unas cinco lneas o ms.
d) Ahora vamos a insertar un marcador o destino para la Descripcin del proyecto. A este
marcador le va a denominar uno. Entonces...
Ubquese con el mouse al principio
del texto que describe el proyecto
Seleccione del men Edicinla
opcin Marcador.
e) Anlogamente, inserte marcadores o destinos para las otras cinco opciones (es decir, para
fecha, curso, nmero de grupos, direccin URL y cordinador/a) del ndice. Llmelos
dos,tres, cuatro, cincoyseisrespectivamente.
Descripcin del proyecto
Fecha de realizacin
Curso/Nivel o Grado
Nmero de alumnos/grupos participantes
Direccin electrnica
Coordinador/a del proyecto
8/7/2019 Paginas Web Con Word
11/18
Centro Zonal Sur 1 0 7
f) Ahora insertaremos un enlaceo linkal marcador o destino uno(o sea a la descripcin del
proyecto. No olvide que est dentro de la misma pgina llamada formulario), para ello,
seleccione con el mouse, la palabra Descripcinen el ndice.
g) Ahora, usted ya tiene un Enlace o link dentrode su pgina. De la misma forma, complete
los dems vnculos (es decir, para fecha, curso, etc), luego guarde y cierre la pgina.
Clic en Pginas
abiertas, luego
seleccionar el Marcador
desde la lista de ellos.(para este caso es
uno).
Clic en el botn de enlace ohipervnculo en la barra deherramientas o bien, en elmen Insertar hipervnculo
8/7/2019 Paginas Web Con Word
12/18
1 0 8 Centro Zonal Sur
2. Enlaces con otra pgina nuestra
a) Abra la pgina index.
b) Seleccione Datos principalesy luego clic en el cono
c) En la ventana que se despliega, debe seleccionar el archivo que en nuestro caso es
formulario.htmy luego Aceptar
d) Guarde su archivo.
3. Enlaces con una pgina fuera de nuestro sistema
a) Estando en el archivo Index, haz un clic en la imagen que tienes en tu pgina.
b) Clic en el botn de hipervnculo y luego en la lengeta WWW. Ahora debes anotar una direccincompleta en el lugar que dice Direccin URL, por ejemplo:
c) Guarde el achivo.
3. Enlaces con una direccin de correo electrnico (e-mail)
a) Para los enlaces o links con e-mail, debe seguir los
mismos pasos que con los anteriores enlaces, pero
la direccin que debe poner, es:
mailto: la direccion correspondiente
http://www.conce.plaza.cl
Sugerencia: inserte una
imagen y a ella, hgale un
vnculo al correo electrnico
Por ejemplo:
mailto: jperez@udec.cl
8/7/2019 Paginas Web Con Word
13/18
Centro Zonal Sur 1 0 9
PAGINAS WEB CURRICULARES5.4
Diseo de Webs EducativosAndrea Gngora Ro jas
(Cuadernos D ig i ta les) Espaa
De manera similar a lo que ocurre en el diseo de
cualquier material didctico, independientemente del
formato en que ste sea editado, los pasos en la
planificacin de un web con fines educativos
consisten en:
Hasta aqu, el proceso de diseo de un web educativono difiere del que se requiere para la creacin de
materiales en otros formatos. La particularizacin
del proceso se da en los pasos siguientes: la
organizacin de los contenidos en bloques de
informacin en funcin de las caractersticas del
formato, pgina web, y la definicin de las relaciones
entre dichos bloques (las pginas), es decir, los
enlaces o hipervnculos.
La organizacin de la informacin en bloques de
contenido consiste en la traduccin de la estructuraconceptual inicialmente planteada a la luz de las
estrategias instruccionales elegidas al soporte de
pgina web.
El objetivo es que la estructura conceptual se
reproduzca fielmente en la estructura del web,
optimizando las posibilidades que ofrece este medio
de presentacin de la informacin.
Es muy importante evitar que la fragmentacin
propia del sistema hipertextual altere el significadode lo que se quiere expresar; tal fragmentacin debe
ser aprovechada como una herramienta para
conseguir la adaptacin de los materiales a las
necesidades de aprendizaje de los alumnos, en un
marco de interactividad.
Una vez que se ha establecido qu debe ir en cada
pgina del web, es necesario determinar las
relaciones que existen entre las pginas. Estas
relaciones definirn la colocacin de los enlaces o
hipervnculos del web.
Es importante tener en cuenta que las conexiones
entre las pginas deben contribuir a recrear la
estructura conceptual definida en un primer
momento: dichas conexiones aportarn informacin
alos alumnos que naveguen por el web y pueden
incidir en el sentido que ellos den a los contenidos.
1. La def in ic in de los objetivos
educacionales del material.
2. La seleccin de los contenidos que
deben incluirse en el web, en
funcin de los objetivos en principio
establecidos y de las necesidades
de aprendizaje de los alumnos a
quienes va dirigido el material.
3. Los contenidos resultantes de laseleccin seran el punto de partida
para la construccin de la
estructura conceptual que pretende
ensearse a los alumnos.
4. La eleccin de las estrategias
instruccionales ms adecuadas
para llevar a cabo el proceso de
enseanza; en la seleccin de
dichas estrategias es indispensable
considerar las caractersticaspropias del soporte en el que ser
presentado el material.
8/7/2019 Paginas Web Con Word
14/18
1 1 0 Centro Zonal Sur
En Chile:
Red Enlaceshttp://www.redenlaces.cl/Recursos educativoshttp://www.educarchile.clIcaritohttp://www.icarito.clProyecto Explora-Conicythttp://www.explora.cl/Centro de Recursos Educativoshttp://www.iie.ufro.cl/Recursos/Proyecto Aula 21http://www.aula21.uchile.clExperiencias pedaggicashttp://www.conce.plaza.cl
Leubuhttp://www.enlaces.cl/webeducativos/hidrografia/
En el mundo:
Publicaciones educativashttp://www.ctv.es/USERS/sordos-co/Publicaciones.htmEl cuerpo humanohttp://club.telepolis.com/euyin/portal.htm
Actividades matemticashttp://www.xtec.es/recursos/clic/esp/act/mates/Literatura para nioswww.leemeuncuento.com.arCiencia para nioswww.cienciaparaninos.com/Actividades de Fsicawww.fisicarecreativa.com
Educacin Fsica y deportewww.efdeportes.comArtes visualeswww.artesvisuales.com.mxCentro de colaboracin Nueva Alejandrahttp://www.nalejandria.com/
Algunas Publicaciones electrnicas de carcter educativo
8/7/2019 Paginas Web Con Word
15/18
Centro Zonal Sur 1 1 1
PUBLICACION DE PAGINAS WEB5.5
Para subir una pgina o publicarla en Internet,debe almacenarse en alguna mquina servidora que
pueda ser visitada en la red.
Existen varias empresas que ofrecen este servicio
gratuito con algunas condicionantes, siendo la ms
importante la cantidad de espacio ofrecido para cada
sitio web. La mayora ofrece entre 3 y 15 Megabytes
(Mb) como disponibles para un sitio.
Este espacio es ms que suficiente para levantar elsitio de una escuela o de un docente. Es necesario
recordar que los archivos HTML son ms livianos
que los archivos originales.
Uno de los sitios que ofrece una mayor cantidad de
Megas, 15Mb, es la empresa Yahoo!.Geocities,
cuya URL es www.geocities.com
Si es miembro,ingrese aqu
Si no es miembro,
regstrese aqu
8/7/2019 Paginas Web Con Word
16/18
1 1 2 Centro Zonal Sur
Complete la ficha de registro con sus datos
personales. Los campos marcados en rojo, son
obligatorios
Regstrese qu
8/7/2019 Paginas Web Con Word
17/18
Centro Zonal Sur 1 1 3
Seleccione el tema de su sitio web.
La siguiente pantalla le indicar que su sitio ha sido
creado y le enviaron un e-mail de confirmacin
Haga clic aqu
para continuar
8/7/2019 Paginas Web Con Word
18/18
1 1 4 Centro Zonal Sur
Esta pantalla le permitir subir su archivos al
sitio
Puede enviarse los archivos uno a uno o bien
un conjunto de archivos de una sola vez.
En este ltimo caso, seleccione la cantidad deseada
y luego presione el botn Mostrar para que elsistema refresque la pantalla de ingreso de datos.
Si selecciona 5, entonces aparecern cincocajas de
dilogo para que enves los archivos.
Debe escribirse en cada caja el nombre del archivo
a enviar o bien presionar el botn examinar
(recomendado) para buscarlo en el directorio
respectivo.
Una vez completados todos los nombres, hacer clic
en Upload Files para enviarlos al servidor.
Se Ver automticamente los archivos listados en
el directorio cuando finalice el envo.
Finalmente presionas el botn Salir.
Ahora puedes ver su sitio Web....digitando la
direccin:
http:/ / ww w.geocities.com/ nom bre usuar io
Para subirsus archivos
Esta es la direccinURL de su sitio
Cajas de dilogopara subirsus archivos