2. •
• Introducción
•
• Vamos a imaginar que en nuestro colegio hemos hecho un proyecto muy interesante y queremos
difundirlo. Lo tenemos hecho en formato Word, y contiene fotografías, dibujos y textos.
• En teoría, podríamos meter nuestro documento en un ordenador conectado a Internet para que
estuviera al alcance de todo el mundo. Lo podríamos hacer en un ordenador cualquiera del colegio
o de nuestra casa (no viene a cuento, pero hay formas de hacerlo). No obstante nos encontraríamos
con los siguientes problemas:
•
• Nuestro documento no tiene un formato apropiado para ser visto en pantalla. El programa Word
está pensado para hacer documentos imprimibles.
• El documento es muy largo, y la gente tiene que pasar páginas y páginas buscando lo que quieren.
• ¡¡Algún graciosillo nos ha hecho cambios en el documento!! Y no sabemos quién ha sido.
• El ordenador está que echa humo, porque nuestro proyecto se ha hecho muy famoso y siempre hay
cientos de personas intentando verlo a la vez.
3. Fundamentos Basicos
• Vamos a empezar aclarando conceptos para evitar confusiones.
• Llamaremos sitio web a una publicación en Internet por una empresa o un
particular. Por ejemplo, www.jcyl.es es el sitio web de la Junta de Castilla y
León, www.google.com es un sitio web que nos ayuda a buscar en Internet lo que
queremos, etc.
• Un sitio web se compone normalmente de muchas páginas web. Por ejemplo, el
sitio web de un colegio puede tener una página inicial de presentación, una
dedicada a proyectos, una de servicios extraescolares, una de fotografías, etc.
• Cada página web es un archivo, que se transmite a través de las líneas telefónicas
desde el servidorhasta los usuarios, cuyo ordenador mostrará en pantalla el
contenido del mismo. Las páginas web suelen ser archivos con la
extensión .htm o .html. También existen otras, como son .asp o .php, pero esto
son otros tipos de código que no trabajaremos con el FrontPage.
• En un sitio web se terminan juntando cientos de archivos: archivos
.html (las páginas web propiamente dichas), archivos .jpg y .gif (imágenes),
archivos .pdf (documentos para imprimir), archivos .wav y .mid(sonidos) e incluso
archivos .wmv, .avi o .mpeg (videos).
4. Crear una nueva web
Para crear un nuevo sitio web seguiremos los siguientes pasos:
•
• 1. En el menú Archivo, hacer click en Nuevo:
• 2. A la derecha nos sale un panel de tareas donde seleccionaremos Sitio Web de Una Página:
• 3. A continuación nos sale una ventana como esta: Aquí podemos elegir una plantilla para hacer nuestro sitio
web, en el caso de que alguno de los modelos se adapte a nuestras intenciones. Normalmente no será así, por lo
que elegiremos Sitio Web de una página. A continuación tenemos que especificar la ubicación del nuevo sitio web
(en que parte de nuestro ordenador lo vamos a guardar), para lo cual pincharemos en examinar.
• 4. A continuación nos sale esta ventana, donde tenemos que seleccionar la carpeta donde guardaremos el nuevo
sitio web. Entonces pincharemos en , y dentro de Mis documentos, haremos una carpeta nueva pinchando en el
icono . Entonces nos saldrá la ventanita donde solo tendromos que introducir el nombre de la carpeta y darle
a aceptar y luego a abrir y ya está.
• Una vez creado el sitio web, esto es lo que vamos a ver. En el panel blanco de la izquierda se muestra la lista de
carpetas.Como podemos ver, hay una carpeta _private, donde se almacenan archivos que no van a estar
accesibles al público, y una carpeta images, donde guardaremos las imágenes para que no estén mezcladas con el
resto de archivos.
También podemos ver que se nos ha creado nuestra primera página: index.htm. Esta va a ser nuestra página
principal. Por supuesto, ahora está en blanco. Nuestra siguiente labor será crear nuestras propias carpetas y
páginas, y después llenarlas de contenido.
5. Crear carpetas y página
Una vez creado el nuevo sitio web tenemos que organizarlo
bien. Hay que tener en cuenta que nuestro web irá
creciendo hasta tener decenas o cientos de archivos, y si no
los tenemos organizados en carpetas nos será muy dificil
encontrarlos.
Por consiguiente, una vez que tenemos creado el sitio web
tenemos que plantearnos que secciones va a tener, y a
continuación crear una carpeta para cada uno de los
apartados.
No olvidemos que también es posible crear carpetas dentro
de otras carpetas
6. Propiedades de página
• Cada vez que creamos una página nueva, lo primero que conviene hacer es ajustar
sus propiedades. Para ello:
• 1. Abrimos la página haciendo doble click sobre ella en la lista de carpetas que
aparece a la izquierda. La página se nos muestra a la derecha, lo que pasa es que
de momento está en blanco.
• 2. Una vez que la página está abierta (lista para trabajar en ella), vamos al menú
Archivo y pinchamos en propiedades:
•
• 3. Nos sale una ventana en la que tenemos que introducir:Título: Es el que se va a
mostrar en la parte superior del navegador de quienes visiten esta página.
También aparecerá como título de nuestra página en los buscadores (google,
yahoo, msn, etc.)
• Descripción de la página: también aparecerá en algunos buscadores, debajo del
título.
• Palabras clave: las utilizan algunos buscadores para identificar los temas
principales de nuestra página. No hay que abusar de las palabras clave, o nos
podrán penalizar (si ponemos demasiadas).
7. Poner Color
• 1. Color de fondo
• Podemos elegir el color de fondo de una
página web siguiendo estos pasos:
• Vamos al menú Formato y
seleccionamos Fondo.
8. Imagen De Fondo
• En la misma ventana de antes podemos elegir una imagen de fondo, en vez de un
color de fondo. Normalmente se utilizan imágenes pequeñas, en formato gif o jpg.
Tenemos que tener en cuenta que la imagen que elegimos, aunque sea pequeña,
no se va a aumentar hasta llenar la pantalla, sino que se va a repetir
indefinidamente en forma de mosaico, como si fueran azulejos.
Vamos a ver algunas muestras:
•
• Pincha en las imágenes para ver cómo queda una página web con esa imagen de
fondo.
En internet podemos encontrar cantidad de fondos para páginas web. Por
ejemplo:
• http://www.graphicsbydezign.com/backgrounds.htm
http://www.webpersonal.net/fym/fondos_web.htm
http://www.zonagratuita.com/a-disenio/fondos_web_gratis.htm
• Cuando encontramos en internet una imagen que nos gusta, tenemos que pinchar
sobre ella con el botón derecho del ratón y seleccionar Guardar imagen como... y
guardarla dentro de nuestro sitio web, preferiblemente en la carpeta images.
•
9. Sonido de fondo
• En una página web podemos poner un sonido de fondo. El formato más utilizado
es el sonido MIDI (archivos.mid) porque ocupa muy poco espacio. De lo contrario
la página podría tardar muchísimo en cargar, sobre todo para quien no tenga
banda ancha.
Podemos encontrar una gran cantidad de midis con el siguiente buscador:
http://www.vanbasco.com/ Aquí sólo tenemos que buscar por título, autor, tema
o estilo y nos llevará a páginas con midis. Cuando encontramos uno que nos gusta,
hay que pinchar con el botón derecho sobre el enlace y seleccionar Guardar
destino como... entonces lo guardamos en alguna parte dentro de nuestro sitio
web. No estaría mal crear una carpeta "sonidos", igual que tenemos la
carpeta images.
• Una vez que tenemos el sonido guardado, tenemos que ponerlo de fondo en la
página web, siguiendo estos pasos:
• En el menú Archivo seleccionamos Propiedades. Nos saldrá esta ventana:
• Donde pone sonido de fondo, pinchamos enexaminar, buscamos el archivo de
sonido que tenemos guardado, lo seleccionamos y damos aAceptar.
10. El texto
•
El texto y las tablas
•
• 1. El texto
• Introducir texto en Frontpage es básicamente igual que en el Word, pero conviene
tener en cuenta un par de aspectos:
• - No podemos (no debemos) elegir el tipo de letra que más nos guste. Hay que
tener en cuenta que los usuarios solamente podrán ver la página tal como la
hemos diseñado en el caso de que tengan instalada en su ordenador la fuente que
hemos utilizado. De lo contrario, su ordenador mostrará la página con cualquier
otra fuente y los resultados pueden ser muy malos (puede aparecer todo
descolocado, al ser un tamaño diferente). Por esto, en las páginas web se utilizan
solo las fuentes más comunes, como son: Arial o Times New Roman. Un consuelo:
para los niños podemos utilizar la Comic Sans sin miedo. La tiene todo el mundo.
• - La tecla Enter realiza un salto de párrafo, equivalente a dos líneas. Si queremos
un salto de línea simple, tenemos que pulsar la tecla de mayúsculas + la
tecla Enter.
•
11. Las tablas
• Las tablas se utilizan muchísimo en las páginas web, lo que pasa es que
normalmente son invisibles. Se utilizan para organizar y distribuir los
elementos de la página en el espacio: colocar un texto en varias columnas,
poner un texto a la derecha de una fotografía, etc.
Para comprender todo el potencial que nos ofrecen las tablas tenemos
que tener en cuenta estas características:
- Dentro de las celdas de la tabla se pueden introducir todo tipo de
elementos: texto, imágenes, etc.
- Se pueden establecer propiedades diferentes para cada una de las celdas
(un fondo diferente, por ejemplo)
- Se puede insertar una tabla dentro de otra.
- Se pueden combinar celdas para adaptar el diseño a nuestras
necesidades.
- Se pueden hacer tablas "invisibles": basta con poner Tamaño del borde =
0. Estas tablas "invisibles" se utilizan muchísimo.