© Rafael Moreno Esteban 2008 Creación y gestión de páginas Web para EEOOII EOI Chiclana 15/02/08

© Rafael Moreno Esteban 2008 Contenidos: Creación de páginas Web con Word Hipervínculos a otras páginas o sitios Web Hipervínculos a archivos (marcos) Hipervínculos a direcciones de Creación de tablas Formato de páginas Web: gráficos, fuentes, colores… La importancia del árbol de carpetas, estructura de la Web de Chiclana Actualización de contenidos (FrontPage) Contenidos multimedia:

© Rafael Moreno Esteban 2008 Creación de páginas Web con Word Crear una página Web es tan simple como crear un documento en Word, simplemente lo tenemos que guardar como página Web en vez de cómo texto. En Mis documentos crearemos una carpeta que llamaremos Web_de_Prueba Abrimos un documento en Word y haced lo siguiente: Páginas Web interesantes para las EEOOII Mis datos Mis datos (doc) EOI Chiclana

© Rafael Moreno Esteban 2008 Ahora abrimos otro documento en Word y poned vuestro nombre completo, dirección, teléfono y correo electrónico. Guardar como: datos.doc (texto) Guardar como: datos.htm (página Web) Volved al documento anterior, que guardaremos como principal.htm Y a continuación haremos los hipervínculos Por último, visualizamos en el navegador.

© Rafael Moreno Esteban 2008 Creación y formato de tablas Las tablas son importantes para condensar información en nuestra Web Son difíciles de manejar, ya que al moverlas o modificarlas, podemos tener resultados inesperados Además, hemos de aprender a añadir o quitar columnas/filas, ponerles o quitarles los bordes, y dar color a las celdas. Ahora, le damos formato a datos.htm

© Rafael Moreno Esteban 2008 Dar formato a una página Web Una Web difiere de un archivo de texto en el formato (no tiene páginas por ejemplo) Se debe hacer sangría de todos los párrafos Obviamente debe haber color, tanto en las fuentes como los fondos. Las fuentes deben ser coherentes Podemos insertar gráficos

© Rafael Moreno Esteban 2008 Creamos la carpeta imagenes en nuestra carpeta Web_de_Prueba IMPORTANTE: ¡Las carpetas y archivos nunca deben contener espacios, ni acentos ni caracteres extraños! Buscamos un archivo gráfico o foto cualquiera y lo copiamos en imagenes En datos.htm vamos a insertar este gráfico o foto y le vamos a cambiar el tamaño. A continuación lo seleccionamos y le añadimos un hipervínculo a un sitio web.

© Rafael Moreno Esteban 2008 La importancia del árbol de carpetas Lo más importante para gestionar un sitio Web es que el árbol de carpetas y ficheros sea idéntico en nuestro ordenador y en el servidor. Cambiar una carpeta supone que todos los hipervínculos dejen de funcionar (si no los cambiamos manualmente). A continuación os presentamos la estructura de la Web de Chiclana.

© Rafael Moreno Esteban 2008 Actualización de contenidos Una vez tenemos nuestros archivos perfectamente confeccionados y los hemos visualizado para comprobar los enlaces y posibles fallos, tenemos que subirlos al servidor. Hay dos formas de subirlos: usar el ftp del Explorer y copiar manualmente, o bien utilizar un programa de edición de ftp como FrontPage o DreamWeaver.

© Rafael Moreno Esteban 2008 FrontPage El FrontPage es el programa de Microsoft Office para confección y actualización de Webs. Es más complejo que Word, pero también permite hacer más gestiones. Podemos crear nuestras Webs en Word y luego terminar de maquetar y subir en FrontPage. Tiene 3 interfaces: modo edición, código y pre- visualización. Se pueden hacer casi todas las operaciones que se hacen con el Word, y además podemos subir luego los archivos.

© Rafael Moreno Esteban 2008 El código html El Hyper-text marked-up language es utilizado por los navegadores para leer Webs. Un documento html tiene 3 partes principales: título, encabezamiento y cuerpo. El título es fácil de cambiar. Todas las demás modificaciones irán en el cuerpo del documento. Si tocamos algo y la fastidiamos… CTRL+Z

© Rafael Moreno Esteban 2008 Contenidos multimedia FrontPage nos permite incluir video y audio en nuestras páginas. Si no sabemos html, lo mejor es tomar prestado el código y realizar las modificaciones oportunas. Vamos a realizar un ejemplo con para incluir un video musical en nuestra página Web. Por último le cambiamos el nombre a nuestra Web en el interfaz de código, y pre- visualizamos.

© Rafael Moreno Esteban 2008 Y para terminar… Ésta presentación está disponible en wwww wwww wwww.... rrrr aaaa ffff aaaa mmmm oooo rrrr eeee nnnn oooo.... cccc oooo mmmmPara cualquier duda, mi es: rrrr mmmm eeee uuuu kkkk hhhh oooo tttt mmmm aaaa iiii llll.... cccc oooo mmmm¡Muchas gracias!