Transcript PÁGINA WEB DEL INSTITUTO Manual de utilización ¿Cómo colgar información en la página web?  Para colgar información se necesita:    Un programa de confección de páginas.

PÁGINA WEB DEL
INSTITUTO
Manual de utilización
¿Cómo colgar información en la
página web?

Para colgar información se necesita:



Un programa de confección de páginas web
(en el Instituto se ha utilizado el programa
Frontpage Office de Microsoft)
Un programa que te permita subir información,
o bajarla, de o desde el servidor (en el
Instituto se ha utilizado el programa File Zilla)
Una hoja de estilos, para que todas las páginas
web de los departamentos o de las distintas
secciones del estilo tengan el mismo formato.
¿Cómo se confecciona la página web con
la información que quiero subir al
servido?

Antes de utilizar Frontpage que es
el programa que nos permite
confeccionar la página web conviene
que abramos una carpeta en
nuestro pendrive con el nombre de
nuestro departamento de la manera
siguiente:
Carpeta de descargas de
documentos, presentaciones…
Páginas que se van
introduciendo y que se
incorporarán según se
van guardando
Carpeta de imágenes

La carpeta con toda esta
información y a la que le dáis el
nombre que queráis lo guardáis en
vuestro pendrive
Ahora ya se puede abrir el programa
de confección de páginas web
Frontpage



Lo primero es crear la página utilizando la
“plantilla” de la página general del
Instituto: lo que se llama HOJA DE
ESTILO.
Esto se hace vinculando la página que
estás haciendo con la hoja de estilo de la
página web del Instituto
Para ello necesitas guardar en tu pendrive
la hoja de estilo del Instituto
¿Cómo se vincula la página con el
estilo?

Se pincha en Formato y al
desplegarse el menú se elige
Vínculos de Hojas de Estilos

Aparecerá el siguiente Menú:

Al elegir agregar se desplegará otro menú

Nuevo menú desplegado:
Se elige esta opción

Y se le da a ACEPTAR


Ahora vamos a poner el fondo de la
página web que estamos creando
de acuerdo con el estilo de la
página web del Instituto.
Para ello seleccionamos Body y al
lado aparacerá una flecha que nos
permite desplegar un menú donde
seleccionaremos PROPIEDADES DE
ETIQUETA

En el menú que nos sale
seleccionamos PROPIEDADES
AVANZADAS

Se nos abre otro nuevo menú donde
seleccionamos ESTILO DE CUERPO

Se nos despliega otro nuevo menú
donde desplegamos la flecha que
hay en clase

Seleccionamos FONDO DE
APLICACIÓN y le damos a ACEPTAR

Al aceptar aparece el fondo en
negro pero al presionar sobre el
fondo aparece ya el fondo de la
página web del Instituto.


Ahora vamos a introducir la información
que queremos en nuestra página web con
el fondo que hemos creado
Aunque podemos introducir la información
escribiendo directamente sobre este
fondo para mayor comodidad vamos a
crear una tabla donde iremos poniendo
enlaces para acceder a la información que
queremos

Para crear esta tabla lo vamos a
hacer en dos fases:


Primero crearemos la cabecera de la
tabla donde pondremos el nombre de
nuestro departamento
Luego crearemos otra tabla con la
información que vamos a introducir
Creación de la tabla de cabecera

Primero vamos a tabla


Desplegamos el Menú y vamos a
INSERTAR y elegimos la opción de
TABLA.
Se nos despliega un nuevo menú

Hacemos CLICK sobre ESTILO y en el nuevo menú que sale
que se llama MODIFICAR ESTILO desplegamos la pestaña y
elegimos la opción de FONDO TABLA CABECERA y damos a
ACEPTAR
2
3
1


Luego podemos modificar las tablas
que hemos creado haciéndolas más
estrechas o con las celdas más
anchas, centrándolas o no.
El resultado final será:



Podemos eliminar filas o columnas o marcar
previamente si queremos una o dos filas o más y
lo mismo con las columnas.
Como estamos creando una cabecera para la
página principal de nuestro departamento sólo
vamos a crear una fila donde pondremos el
nombre de nuestro departamento. Lo mismo
haremos con las columnas de las que nos
quedaremos con sólo una.
Como hemos creado una tabla de cabecera con
dos filas y dos columnas vamos a eliminar una fila
y una columna.




Primero pasamos el ratón por la primera
fila que se coloreará de azul y
seleccionamos en el menú de tabla la
opción combinar celdas.
Así habremos eliminado la columna de
esta fila.
Lo mismo hacemos con la segunda fila
pero damos a SUPRIMIR del teclado y así
eliminamos la segunda fila con su
respectiva columna.
Nos quedará lo siguiente

Ponemos el nombre de nuestro
departamento en la celda que
hemos creado


Ahora vamos a crear otra tabla pero esta vez ya
no utilizamos en la opción de clase de estilo
FONDO TABLA CABECERA sino la opción de
FONDO TABLA
Pera antes marcaremos el numero de filas que
necesitamos en función de la información que
queramos introducir en la página principal de
nuestro departamento, por ejemplo si queremos
introducir: componentes del departamento,
información sobre las asignaturas que imparte el
departamento (imaginemos que por ejemplo
imparte seis asignaturas distintas), información
sobre pendientes y enlaces que consideremos de
interés para los alumnos necesitaríamos 9 filas, el
número de columnas lo dejamos en 2
1
2
3

Al final quedaría:


En la columna izquierda pondremos el
nombre de las diferentes informaciones
que hemos mencionado antes.
En la columna derecha pondremos algún
símbolo que al pulsarlo nos lleve a una
nueva página que contenga la
información sobre este apartado. Este
símbolo o imagen tenemos que guardarlo
en la carpeta de imágenes que hemos
creado al principio en nuestro pendrive

Sólo nos queda guardar esta página
con un nombre como
iniciosociales, por ejemplo, en
nuestro pendrive en la carpeta que
hemos creado para este fin


Vamos a crear, igual que lo hemos
hecho con esta página, una nueva
página que luego vincularemos a la
inicial que hemos creado al
principio.
Por ejemplo vamos a crear la página
de componentes

Sobre la flecha verde que aparece a
la derecha de la primera fila
insertamos un hipervínculo a la
página iniciosociales que hemos
creado antes lo que nos permitirá
retroceder.
1
2
3
4

Guardamos esta página con el
nombre de componentes en la
carpeta de siempre


Ahora tenemos que vincular esta página
con la página de inicio que hemos creado
Para ello abrimos de nuevo la página
iniciosociales con Frontpage y
pinchamos sobre el botón amarillo de la
derecha de la palabra componentes y
abrimos insertar y elegimos Hipervínculo
y seleccionamos la página componentes

Al cerrar la página nos preguntará si
guardamos los cambios. Le diremos
que si y ya está


Solo nos queda colgar toda esta
información en la página web del
Instituto.
Para eso emplearemos el último de
los programas: el FileZilla

Se hace CLICK sobre FILE y se
escoge SITE MANAGER

Se abre la siguiente ventana
Se elige educamadrid

Se presiona Connect

Ya estamos dentro del servidor
Nuestro Pentdrive
El servidor

Ahora se trata de poner en paralelo
la información del servidor y de
nuestro pendrive para poder bajar
información desde el servidor a
nuestro pendrive o subir
información desde el pendrive al
servidor

Para ello seleccionamos en el
servidor y hacemos doble clic para
abrirlo y seleccionamos nuestro
departamento
Y hacemos lo mismo en nuestro pentdrive

Ahora si nos situamos sobre el
archivo que queremos subir (Parte
derecha de la pantalla de FileZilla) y
presionamos con el botón derecho
del ratón damos a UPLOAD y subirá
el archivo (SIEMPRE Y CUANDO
ESTÉN EN PARALELO LA
INFORMACIÓN DEL PENTDRIVE Y
DEL SERVIDOR PARA QUE LA
OPERACIÓN SEA CORRECTA)

Lo mismo podemos hacer para
bajar información desde el servidor,
pero en este caso situándonos
sobre el archivo a bajar en el
servidor y dando al botón derecho
del ratón damos a DOWNLOAD
(TENIENDO EL MISMO CUIDADO DE
ANTES)

Si queremos bajar o subir archivos
desde las carpetas de Imágenes o
Descargas (donde podemos poner
archivos Word o PowerPoint)
tendríamos que abrir previamente
dichas carpetas y ponerlas también
en paralelo para hacer las
operaciones antes mencionadas

Para subir en el directorio del
servidor o del pendrive hacemos
doble clic sobre la carpeta con dos
puntos