Creación y Alojamiento de Páginas Web

Creacin y alojamiento de pginas Web
Para crear pginas Web como AulaFacil.com podemos emplear muy diferentes mtodos y programas. En cualquier caso para tener una pgina en Internet necesitar: Crear los ficheros o archivos que componen la Web. Una Web normalmente se compone de un cierto nmero de pginas. Por ejemplo, esta pgina del curso, que es un fichero con terminacin htm. Una direccin de Internet. Por ejemplo la direccin www. aulafacil.com. Por ejemplo www.elpais.es Tener un alojamiento o servidor en Internet donde colocar la Web. Lo normal es construir la web y tenerla en el disco duro de nuestro ordenador y luego enviarla a un servidor de Internet. Un servidor de Internet en realidad es otro ordenador que est permanentemente encendido y conectado a la Red. Y enviar los ficheros normalmente desde el disco duro de su ordenador al sitio donde se alojar la pgina. Algunos Portales permiten la creacin y alojamiento de pginas personales directamente en Internet de forma sencilla. A) LA CREACION DE LOS FICHEROS. La construccin de las pginas de una Web se suele realizar utilizando diferentes programas editores. Los programas editores permiten la creacin de pginas de una forma sencilla sin tener que programar cada instruccin del lenguaje Html. Los diseadores de pginas web, suelen emplear varios programas para la creacin de las pginas. Uno de los favoritos es el Dreamweaver. Una buena recomendacin es utilizar el programa Dreamweaver para crear los ficheros de la pgina Web. Las versiones antiguas de Microsoft office tenan un programa para crear pginas web. En AulaFacil dispone de un buen curso sobre creacin de pginas Web utilizando Front Page. Otra opcin es programar directamente en HTML. . Esta es una opcin para los que desean profundizar y comprender el lenguaje que se encuentra detrs de las pginas de Internet. Puede acceder al curso sobre HTML en el siguiente enlace HTML. Este curso facilita comprender el cdigo que se emplea en las pginas B) LA DIRECCION DE INTERNET Existen dos opciones: Tener una direccin propia del tipo www.aulafacil.com. Esto es lo que se denomina una direccin de primer nivel. Utilizar una direccin gratuita que nos proporciona algn Portal de Internet del tipo www.geocities/yosemite/Aqui/lapaginadenacho
Puede ver el tema de los Dominios en la siguiente pgina Dominios
Si desea crear una pgina personal y no necesita que la Web disponga de una direccin de primer nivel puede crear y alojar su pgina en alguno de los Portales que ofrecen esta posibilidad. Algunos Portales que proporcionan alojamiento y facilidades para crear pginas personales son Iespana y Pobladores. Puede ver la explicacin en Pginas gratuitas Para realizar las pginas necesitar seguramente imgenes o Gif y diferentes complementos para darle vistosidad a las pginas. Le recomendamos realizar el curso sobre Buscadores especialmente la parte referida a la bsqueda de programas informticos. C) EL ALOJAMIENTO El alojamiento puede ser gratuito. Normalmente es una opcin para pginas personales. Varios Portales en Internet proporcionan alojamiento gratuito con ciertas restricciones. Pginas gratuitas Para las empresas lo normal es pagar un alojamiento para sus pginas. Una explicacin ms detallada la puede encontrar enAlojamiento D) ENVIO DE LAS PAGINAS A INTERNET Para subir los ficheros que ha creado desde el disco duro de su ordenador al servidor de Internet disponemos de varias opciones. Nuestra opcin favorita es utilizar un programa especializado FTP. Puede ver como utilizarlo pulsado sobre el enlace siguiente FTP. La Direccin de la pgina. Los Dominios en Internet
Con relacin a la direccin de la pgina tenemos dos primeras opciones: Si queremos tener nuestra propia direccin. Como por ejemplo Aulafacil.com. Tenemos que pagar el registro. Otra opcin es utilizar un alojamiento gratuito. El alojamiento gratuito tiene ciertas limitaciones por lo que se suele utilizar para pginas personales. Una direccin del tipohttp://geocities.com/Paris/2226/principal.htm Diferentes Portales proporcionan alojamiento gratuito y una direccin a las pginas personales. Por ejemplo, el Portal Iespana y una posible direccin seriahttp://www.iespana.es/aaprender/ REGISTRO DE UN DOMINIO PROPIO Si queremos tener nuestra propia direccin tenemos que buscar un nombre que no este registrado y pagar el registro. Podemos registrar diferentes terminaciones:
La terminacin .com es para las empresas y procede de company La terminacin .net estaba pensada para las redes. La terminacin .org se refiere a organization. Organizaciones no lucrativas.
Las marcas de empresas reconocidas, se encuentran protegidas por la legislacin. Las empresas que ya tienen direcciones funcionando en Internet se encuentran protegidas por las legislaciones. Supongamos que deseamos que nuestra pgina se denomine PedazodePagina.com Nos vamos por ejemplo a Arsys Tecleamos el nombre que deseamos registrar. Por ejemplo PedazodePagina Y pulsamos Enviar
Una vez que conseguimos localizar un dominio que este libre y por tanto no registrado, pulsamos Registrar. A continuacin, seguimos las distintas pginas para dar la conformidad al contrato y dar los datos necesarios. Completamos el formulario de Pago. Otras empresas donde podemos realizar el registro con las instrucciones en castellano sonAcens Nominalia El registro de dominios con terminacin .es podemos realizarlo directamente en Nic Podemos realizar el registro en numerosas pginas. Todas tienen la misma validez y son parecidas. Un registro muy barato y sencillo pero con las instrucciones en ingles Dotster. Otro registro es el de Netsol Podemos igualmente realizar el registro con las terminaciones para los diferentes pases. Por ejemplo en la pgina de VeriSing Los aspectos legales relacionados con los dominios podemos consultarlos en Dominiuris PAGINAS GRATUITAS Si deseamos tener una pgina gratuita no necesitamos realizar el registro del dominio. El Portal donde alojemos de forma gratuita la pgina ser la que nos proporcione la direccin. Por ejemplo si utilizamos Iespana la direccin puede ser http://www.iespana.es/cursocrear/ En cualquier caso si tenemos una empresa es interesante registrar el dominio con la
terminacin .com y tenerla reservada.
LECCION 2 Creacin de una Pgina Personal gratuita
En numerosos Portales podemos crear una pgina personal. Por ejemplo en Iespana, Desde la portada. Pulsamos sobre Mi sitio
Pulsamos sobre Crear
Aparecen las condiciones del contrato. Pulsamos al final de la pgina Si acepto las condiciones. En la pgina siguiente ponemos el nombre y los datos del sitio. Por ejemplo aaprendery un ttulo por ejemplo "los mejores cursos". Nos hacemos miembros de I-club dando nuestros datos personales y una direccin de Email autntica. Ahora tenemos que activar nuestro sitio utilizando la clave de activacin que recibimos en
la direccin de E-mail que hemos dado. Entrando de nuevo a Mi sitio. En la parte superior izquierda de la pgina se encuentran las herramientas de diseo, Disea tu sitio .Una forma sencilla de realizar una pgina es utilizar el Editor HTML.
Otros sitios que ofrecen espacio gratuito para pginas personales. Demasiado Pobladores Ya
LECCION 3 COMO ENVIAR LAS PAGINAS WEB A LOS SERVIDORES CON FTP
OBTENER EL PROGRAMA PARA REALIZAR EL ENVIO Las pginas las creamos y las guardamos en el disco duro de nuestro ordenador. Para que puedan ser vistas en Internet tenemos que enviarlas desde nuestro ordenador al ordenador conectado a Internet. Es lo que se denomina hospedar una pgina en un servidor de Internet. Existen diferentes procedimientos para enviar las pginas que hemos creado. El procedimiento que preferimos en utilizar un programa especializado en la transferencia de ficheros. Uno especialmente bueno es el WS_FTP95 y las versiones posteriores. El programa WS_FTP es gratuito para estudiantes y pginas no comerciales y barato para propsitos comerciales. Podemos bajarnos directamente el programa de la direccin. ftp://ftp1.ipswitch.com/ipswitch/product_downloads/ws_ftple.exe Si quiere saber Cmo bajar el programa Existen varios buenos programas para transferir ficheros que podemos utilizar. Y varias pginas de Internet en las que podemos obtenerlos. Por ejemplo en softonic.htm Una vez en localizado el programa que deseamos, lo bajamos al disco duro de nuestro
ordenador.Cmo bajar el programa Una vez que hemos descargado el programa desde Internet al disco duro de nuestro ordenador debemos instalarlo COMO ENVIAR LOS FICHEROS Una vez que tenemos instalado el programa pulsamos sobre el programa ejecutable para ponerlo en marcha. En nuestro caso pulsamos sobre la imagen FTP
Nos aparece el Cuadro Propiedades de Sessin. Esta es la parte que puede dar algn problema. Los datos para rellenar este cuadro los facilita la empresa o web donde hemos decidido alojar nuestra Web. Suelen enviar la informacin en un E-mail cuando se contrata el servicio hospedaje con las instrucciones para rellenar este cuadro. El ejemplo que mostramos a continuacin corresponde al alojamiento de aulafacil.org. Si no conocemos el Host Type, es decir el tipo de servidor ponemos Automaticdetect para que el mismo programa se ocupe de investigarlo.
Y pulsando Aceptar Si todo va bien aparece un cuadro parecido al siguiente.
LECCION 4 Enviar ficheros al servidor de Internet
ENVIAR PAGINAS DEL DISCO DURO DE NUESTRO ORDENADOR AL SERVIDOR DE INTERNET Nos movemos por nuestro disco duro para encontrar el subdirectorio donde tenemos colocados los archivos que deseamos enviar. Tenemos un botn en la parte superior en el que si pulsamos aparecen las diferentes carpetas o directorios de nuestro disco duro. .
Podemos movernos hacia arriba haciendo clic en la flecha superior
El sistema para movernos por las diferentes carpetas del servidor es el mismo sistema.
Si deseamos colocar los archivos en una carpeta que ya esta creada en el servidor simplemente hacemos doble clic sobre la carpeta correspondiente. En el siguiente ejemplo ya tenemos creada la carpeta para el curso denominada "CrearInternet" y hacemos clic dos veces para entra en este apartado y poder colocar los ficheros.
Marcamos los que deseamos enviar. Si queremos enviar varios ficheros a la vez , podemos marcarlos manteniendo pulsada la Tecla Ctrl que se suele encontrar en el extremo Inferior izquierdo del teclado. Otra forma de seleccionar varios ficheros que se encuentran uno a continuacin de otro es manteniendo pulsada la flecha deMaysculas y pulsando la flecha Arriba o Abajo..
Y pulsamos la flecha que apunta a la derecha tal como se muestra en la siguiente imagen. Es preciso tener cuidado pues si enviamos un fichero con el mismo nombre que otro ya existente en el servidor, eliminaremos, borraremos el anterior.
Cuando tenemos muchos ficheros en los que estamos trabajando y subimos ficheros de manera frecuente puede ser complicado saber que ficheros he actualizado desde ltima sesin. Para subir nicamente los ficheros que hemos actualizado un truco til es utilizarDate. Pulsamos sobre Date. Nos ordena por fechas de actualizacin. Normalmente los ficheros que hemos actualizado desde el ltimo envo son los que aparece antes de WS_FTP.LOG. En nuestro ejemplo son los cuatro primeros archivos, tal como se muestra en la siguiente imagen. Marcamos los primeros ficheros que se muestran.
BAJAR FICHEROS DEL SERVIDOR AL DISCO DURO DE NUESTRO ORDENADOR Nos movemos por los directorios del servidor. Marcamos los ficheros que deseamos bajarnos. Pulsamos la Flecha que apunta hacia la Derecha
LECCION 5 Gestionar el servidor de Internet
CREAR UN DIRECTORIO EN EL SERVIDOR Pulsamos sobre MkDir
Le ponemos un nombre a la nueva carpeta es decir al directorio que deseamos crear. En nuestro ejemplo escribimos en el recuadro CursoFrontPage. Para evitar problemas de compatibilidad con diferentes navegadores es aconsejable poner un nombre sin dejar huecos. Y tampoco utilizar acentos, "" o smbolos diferentes al alfabeto estndar NorteAmericano.
En la ventana del programa se mostraran las diversas carpetas que hemos creado. En este caso se muestran como carpetas amarillas que hemos creado para ordenar los ficheros del servidor.
ELIMINAR Marcamos el fichero o el directorio que deseamos borrar. Antes de borrar un directorio debemos asegurarnos que este no contiene ficheros que deseamos mantener. Es preciso tener cuidado con lo que se elimina para no perder informacin o ficheros valiosos. Pulsamos sobre Delete
SALIR Pulsamos Close Y pulsamos Exit
Alojamiento de pginas
Tenemos una primera opcin que hemos comentado anteriormente y es el alojamiento gratuito. Numerosas pginas personales se alojan en Portales que ofrecen espacio gratuito. Este sistema suele tener muchas limitaciones y restricciones. Podemos alojar nuestra pgina gratis en GratisWeb por ejemplo o en Iespana Para las Webs de empresas o profesionales lo normal es un alojamiento de pago con una direccin propia. Existen numerosas empresas que proporcionan alojamiento. Por ejemplo, en castellano son importantes Arsys.es y Acens. Para buscar y comparar alojamiento podemos ir a la pgina BuscaHost Existen proveedores de los Estados Unidos que proporcionan alojamientos a bajo coste de gran capacidad. Aunque las instrucciones suelen estar en idioma ingls. Por ejemplo Yahooy Linuxwebhost. Para buscar y comparar alojamientos en empresas Norteamericanas podemos hacerlo enHostindex Podemos tener distintos tipos de alojamientos, dependiendo del sistema operativo o si compartimos el ordenador con otros clientes. Dependiendo del sistema operativo que utilizan podemos distinguir servidores: Los servidores Windows que suelen ser ms caros. Y los servidores que emplean el sistema operativo Unix o Linux y que evitan a Bill Puertas. Ciertas bases de datos o programas funcionarn en unos servidores pero no en otros. Las empresas de alojamiento suelen especificar en las caractersticas tcnicas de sus servidores que programas y bases de datos soportan. El tipo de alojamiento puede ser: Alojamiento compartido. Es el ms frecuente. A menos que se trate de una pgina con muchas, muchas, visitas esta es la opcin tpica. En este tipo de alojamiento varias pginas comparten un servidor. Cada cliente tiene asignada una parte del disco duro que gestiona con independencia. Un alojamiento compartido es como un apartamento en un edificio. Servidor dedicado. Todo el ordenador es para una pgina o empresa. Es un sistema ms costoso. Apropiado para empresas con pginas que reciben muchas miles de visitas cada da. Es como tener una vivienda independiente. Si tiene dudas contrate un alojamiento de bajo coste. En caso de necesitar ms recursos, normalmente puede aumentarlos rpidamente comunicndoselo a la empresa de alojamiento. Algunas empresas incluso disponen de sistemas automatizados para solicitar el incremento de los recursos. TEMARIO CLASE 1. Comenzamos CLASE 2. Conceptos Fundamentales
CLASE 3. Mi primera pgina (I) CLASE 4. Mi primera pgina (II) CLASE 5. Mi primera pgina (III) CLASE 6. Guardar CLASE 7. Formato de Letras CLASE 8. Colores de las Letras CLASE 9. Las partes de las instrucciones CLASE 10. Alinear el Texto CLASE 11. Lneas Horizontales CLASE 12. Los prrafos y el cambio de Lnea CLASE 13. Poner Titulares CLASE 14. Las Utiles Tablas CLASE 15. Atributos de las Tablas CLASE 16. Color de las Tablas CLASE 17. Poner Enlaces CLASE 18. Insertar Imgenes CLASE 19. Imgenes Animadas CLASE 20. Atributos de Insertar imgenes CLASE 21. Enlazar una Imagen CLASE 22. Atributos de la Pgina CLASE 23. Poner Notas LECCION 1
Para confeccionar una pgina web lo nico que se necesita es un editor de texto. Existen editores especializados en crear ficheros HTML Podemos utilizar Notepad, WordPad o el que queramos. Es preferible utilizar Notepad o un editor especializado para generar ficheros de Html que en editor ms avanzado que puede incluir cdigos no deseados. Seguramente tienes uno de estos programas en tu ordenador. Si no sabes donde esta pulsa en la esquina inferior izquierda "Inicio" y "Buscar"
Escribimos el nombre del fichero que estoy buscando en este caso Notepad y pulsamos "Buscar Ahora"
Y pulsamos dos veces sobre sobre el fichero de Notepad
Existen editores gratuitos en Internet. Por ejemplo en la pgina de Internet http://www.softonic.com/ En la seccin de programacin tienes editores gratuitos para descargar. LECCION 2
Pasos para crear la pgina web: 1. Abrir el programa editor de texto. 2. Escribir los cdigos o "tags". Escribimos los comandos como escribimos en un procesador de textos. Y guardamos el fichero que creamos como fichero de texto.A lo largo de este curso veremos los diferentes cdigos. Una vez abierto el programa editor de texto voy escribiendo los cdigos o "tags"
Las instrucciones, cdigos o "tags" de html van entre dos signos < y >. Las instrucciones es indiferente si se escriben en maysculas o minsculas. Tenemos que poner un cdigo de inicio y uno de cierre. Ejemplo: Poner texto en negrilla La instruccin para que un texto se ponga en negrilla es <b>Soy magnfico</b> La instruccin de cierre tiene que llevar el signo / Por lo tanto: A) Ponemos el cdigo de inicio para poner el texto en negrilla <b> B) A continuacin el texto que queremos que aparezca en negrilla y C) Al final el cdigo de cierre </b>
3. Guardar el fichero. Es recomendable que cree un directorio en el disco duro de su ordenador para guardar ordenadas los ficheros que iremos generando. Para guardar el fichero tenemos que ponerle un nombre y como extensin htm. html o shtml. Es decir nombre, punto y htm. Por ejemplo miprimerapagina.htm Es preferible no poner acentos, "" ni simbolos extraos para evitar problemas de compatibilidad No ponerle espacios en blanco al nombre del fichero. Y guardar como documento de TEXTO. Formato de texto ASCII. Volveremos a ver esta cuestin. Una vez guardado el fichero podemos ver como queda utilizando el mismo programa con el que ve esta pgina. El resultado cuando veamos con el navegador el documento ser Soy magnfico Puede ver como quedara el fichero pulsando el enlace miprimerapagina. Para volver pulse Atrs en su navegador
miprimerapagina.htm
Si utiliza una versin avanzada de Internet Explorer, puede ver los cdigos de la pgina. Una vez que este en miprimerapagina pulse en la Barra superior: Pulsamos Archivo
Y pulsamos Modificar con Microsoft Front Page. Esperamos unos segundos.
Y pulsamos sobre la pestaa HTML que se encuentra en la parte inferior derecha.
LECCION 3
Vamos a realizar nuestra primera pgina utilizando los cdigos html que denominaremos "La Primera" y en la que aparezca escrito "soy un fenmeno" Tenemos que crear un fichero en el que podremos las instrucciones y lo guardamos como fichero con terminacin .htm A) Todas las pginas html comienzan con el cdigo de inicio <html> y terminan con el cdigo </html> As que ponemos <html> </html> B) Las pginas html se dividen en un encabezado y un cuerpo. Para el encabezamiento tenemos que poner los "tags" <head> </head> Tenemos que ponerlo dentro de las instrucciones inicial y final de pgina (paso A) por lo tanto nos queda <html> <head> </head> </html>
LECCION 5
D) Le ponemos ttulo a la pgina con la instruccin <title></title> que tenemos que poner dentro del encabezado (entre head y head) <html> <head> <title>MiprimeraPagina</title> </head> <body> </body> </html>
E) Vamos a poner el texto en negrilla "Soy un fenmeno". La instruccin para negrilla es <b> y <b/>. Y el texto hay que colocarlo dentro del cuerpo (entre body y body) de la pgina. Por tanto nos queda <html> <head> <title>MiprimeraPagina</title> </head> <body> Soy el mejor </body> </html> LECCION 6 Guardamos el fichero para lo cual es aconsejable ser ordenado y crear un subdirectorio en el disco duro de nuestro ordenador para ir almacenando los ficheros. Es importante: A) Ponerle al fichero la terminacin html B) Guardarlo como documento de TEXTO (para que no se incluyan otros cdigos) C) Para evitar problemas es interesante que en el nombre del fichero, NO DEJAR ESPACIOS y NI PONER SIGNOS NO COMUNES como acentos, "", o smbolos de distintos idiomas.
LECCION 7
DAR FORMATO A LAS LETRAS Cambiar los atributos de las letras utilizamos el comando <font></font> (fuente o tipo de letra). El color o el tamao son atributos del elemento tipo de letra. Podemos dar distintos atributos a las letras. A) TAMAO DEL TEXTO * Si queremos poner las letras de distinto tamao empleamos el atributo SIZE="". * Dentro de las comillas pondremos "+" para aumentar el tamao y "-" para disminuirlo EJEMPLO 1 <FONT SIZE="+1">este texto se ve con mayor tamao</FONT> El resultado: este texto se ve con mayor tamao
EJEMPLO 2 Si queremos aun mayor tamao ponemos un nmero mayor. Voy a probar con 4 <FONT SIZE="+4">este texto se ve muy grande</FONT> este texto se ve muy grande
EJEMPLO 3 Para disminuir el tamao ponemos -1 <FONT SIZE="-1">al poner -1 disminuye el tamao</FONT> Al poner -1 disminuye el tamao
Podemos poner el texto en negrilla, en cursiva o subrayado
PONER EL TEXTO EN NEGRILLA Para poner el texto en negrilla utilizamos el tag "b" (de bold) Soy el <b>mejor</b> de la clase Soy el mejor de la clase
PONER EL TEXTO EN CURSIVA Para ponerlo en cursiva utilizamos "i" (de italian) Poner un <i>texto en cursiva</i> Poner un texto en cursiva
PONER EL TEXTO SUBRAYADO Para subrayado Ahora toca el <u>subrayado</u> de parte de la frase Ahora toca el subrayado de parte de la frase
LECCION 8 PONER COLORES
La instruccin para poner color a las letras es <FONT COLOR="entre estas comillas va el nombre o el nmero del color">aqu el texto al que queremos dar color</FONT>
EJEMPLO 1 Para poner el texto en rojo <FONT COLOR="RED">este texto se pone rojo</font> El resultado si lo ponemos dentro de los cdigos del fichero html ser
este texto se pone rojo
EJEMPLO 2 Para poner el texto en azul <FONT COLOR="BLUE">este texto se pone en azul</font> este texto se pone en azul
LECCION 9 LAS PARTES DE LAS INSTRUCCIONES
Por tanto vemos que las instrucciones de HTML tienen varias partes. Las instrucciones de html se componen de tres partes fundamentales: A) El elemento al que se refiere la instruccin. Es la palabra que va despus del signo <. Por ejemplo <font es un elemento. En este caso el elemento es el tipo de letra. La instruccin por tanto se refiere al tipo de letra. B) El atributo. El tamao o el color son atributos posibles del tipo de letra. C) El valor que toma el atributo. Por ejemplo rojo o verde. Por ejemplo, queremos: A) Al elemento tipo de letra B) Darle el atributo color C) Con el valor rojo. Elemento <FONT Atributo COLOR= Valor "RED"> El tag de cierre </FONT>
Otro ejemplo, letra tamao grande Elemento <FONT Atributo SIZE= Valor "+1">
</FONT>
LECCION 10 ALINEAR EL TEXTO
Para alinear el texto utilizamos el atributo align align=left para alinear a la izquierda align=right para alinear a la derecha align=center para centrar el texto
EJEMPLO ALINEAR A LA IZQUIERDA <p align="left">alineamos el texto a la derecha</p> alineamos el texto a la izquierda
EJEMPLO "ALINEAR A LA DERECHA" sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss alineamos el texto a la derecha
EJEMPLO DE CENTRAR <p align="center">centramos el texto</p> centramos el texto
LECCION 11 LINEAS HORIZONTALES
El elemento para crear una lnea horizontal es HR. Este "tag" no necesita un "tag" de cierre Y a este elemento podemos darle distintos atributos width para definir el largo de la lnea con un cierto nmero de pixel o un porcentaje del documento> size para asignar el ancho de la linea noshade para el fondo de la lnea
EJEMPLO Lnea de 100 pixels <HR WIDTH=100>
Lnea de 200 pixels <HR WIDTH=200
Lnea de un 50% del ancho del documento <HR WIDTH=50%>
Lnea del 100% del ancho del documento <HR WIDTH=100%>
Lnea con 10 de ancho
<HR SIZE=10>
Podemos combinar varios atributos. Por ejemplo lnea de un 50% de largo y 10 pixel de ancho <HR WIDTH=50% SIZE=10>
LECCION 12 LOS PARRAFOS Y EL CAMBIO DE LINEA
Para mantener el texto formando un prrafo o bloque de texto utilizamos el "tag" <p>aqui va el texto</p> <p>Si utilizamos la instruccin de prrafo nos aseguramos que el texto se mantenga junto y controlamos cuando queremos que exista una lnea de espacio en blanco</p> Si utilizamos la instruccin de prrafo nos aseguramos que el texto se mantenga junto y controlamos cuando queremos que exista una lnea de espacio en blanco
PASAR A LA SIGUIENTE LINEA Cuando queremos pasar el texto a otra lnea podemos utilizar el "tag" <br> que no tiene tag de cierre. Si queremos separar el siguiente texto en varias lneas. la casa el perro el nio las vacaciones Pondremos: la casa<br> el perro<br> el nio<br> las vacaciones<br> Y en el documento HTML mostrara en el navegador: la casa el perro el nio las vacaciones LECCION 13 PONER TITULARES
Los titulares o encabezamiento de los textos son otra forma de modificar el tamao del texto. La orden para encabezamiento es "H1" para un titular muy grande, "H2" para uno grande, H3, H4, H5 y para letra pequea H6 <H1>Encabezamiento muy grande</H1> Encabezamiento muy grande
<H2>Encabezamiento grande</H2> Encabezamiento grande
<H3>Encabezamiento menos grande</H3> Encabezamiento menos grande
<H6>Encabezamiento muy pequeo</H6> Encabezamiento muy pequeo
LECCION 14 LAS UTILES TABLAS
Las pginas web necesitan tener los elementos que colocamos ordenados y que se mantengan ordenados en los distintos navegadores. Para definir el orden o la estructura de una pgina web se utilizan tablas con bordes ocultos. La mayora de las pginas importantes se estructuran utilizando tablas ocultas. Vamos a realizar una tabla con los bordes visibles A) Las tablas comienzan con <table> y terminan con </table> B) Definimos el borde de la tabla. Las tablas que se utilizan para ordenar los elementos sulen tener bordes invisibles para los navegadores y empleamos border="0". Si queremos un borde visible asignamos otro nmero al atributo borde. Nosotros en el primer ejemplo vamos a utilizar un borde visible border="1" C) Definimos el tamao de la tabla. Podemos definirlo como porcentaje del ancho de la pgina utilizando width
WIDTH="100%" nos genera una tabla que ocupa todo el ancho de la pgina que estamos creando. WIDTH="50%" genera una tabla con la mitad del ancho del documento que creamos. Podemos igualmente definir el tamao de la tabla en nmero de pixel WITH="100" ahora al no poner el % sern 100 pixel de larga la tabla y no el 100% del documento D) Tenemos que definir las filas que lleva la tabla <TR> </TR> E) Y definimos las columnas utilizando <TD> </TD> Estas instrucciones de columna las pondremos dentro de las de fila.
EJEMPLO Vamos a construir una tabla con el borde visible de tamao el 100 por 100 del ancho del documento con dos filas y tres columnas. Por tanto utilizamos al principio el "tag" <table> y al final </table>. Definimos el borde border="1" y el ancho witdh="100%" Definimos la primera fila con <tr> y </tr> y dentro las tres columnas <td></td> <tr> <td></td><td></td><td></td> </tr> Y hacemos lo mismo con la segunda fila y sus tres columnas <tr> <td></td><td></td><td></td> </tr>
Las instrucciones para construir la tabla nos queda. Recuerda que da igual que las instrucciones se escriban en maysculas o minsculas. Los espacios en blanco no afectan al resultado por tanto es lo mismo poner <tr><td></td><td></td><td></td></tr> en una columna como lo ponemos a continuacin.
<table border="1" witdh="100%"> <TR> <td></td> <td></td> <td></td> </TR> <TR> <td></td>
<td></td> <td></td> </TR> </Table> Y el resultado.
LECCION 15
TAMAO DE LAS COLUMNAS Y MARGENES DE LAS CELDAS DE LAS TABLAS
FIJAR EL TAMAO DE LAS COLUMNAS El mismo atributo utilizado para definir el tamao de la tabla se utiliza para definir o fijar el tamao de las columnas. Definimos el tamao de la columna con WIDTH Por ejemplo, queremos que en una tabla de dos columnas, la primera columna ocupe el 20 por ciento de la tabla y la segunda el 80 por ciento. Pondremos Width=20% en las celdas de la primera columna y Width=80% en las celdas de la segunda columna.
EL MARGEN DE LAS CELDAS Podemos asignar mrgenes a las celdas, de forma que lo que pongamos dentro no quede pegado a los bordes de la celda. Para el margen de las celdas utilizamos el atributo cellpadding="aqui ponemos el nmero"
EJEMPLO Realizaremos una tabla de 2 por 3 A) Una tabla con dos filas y tres columnas, con borde de la tabla 1 y el ancho de la tabla un 75% del ancho de la pgina. B) Las celdas con un margen de 15 pxeles y el tamao de las celdas un 10% del tamao de la tabla la primera columna, un 20% del tamao de la tabla la segunda columna y un 70% del tamao de la tabla la tercera columna. C) Pondremos dentro de las celdas las letras a,b,c,d,e,f
Quedara <table border="1" cellpadding="15" cellspacing="0" width="75%"> <tr> <td width="10%">a</td> <td width="20%">b</td> <td width="70%">c</td> </tr> <tr> <td width="10%">d</td> <td width="20%">e</td> <td width="70%">f</td> </tr> </table>
Y el resultado
LECCION 16 EL COLOR DE LAS TABLAS Para ponerle color a una celda utilizamos el atributo bgcolor="aqui ponemos el nombre o nmero del color" EJEMPLO Vamos a realizar una tabla de dos filas y dos columnas, con borde de tamao "1" y de largo el 50% del ancho de pgina. Y le ponemos a una celda fondo rojo con el atributo bgcolor="red" y a otra fondo azul <table border="1" cellpadding="0" cellspacing="0" width="50%"> <tr> <td width="50%" bgcolor="red"></td> <td width="50%" bgcolor="blue"></td> </tr> <tr> <td width="50%"></td>
<td width="50%"></td> </tr> </table>
El resultado que veremos:
COLOR DEL FONDO DE LA TABLA Para darle color a toda la tabla es suficiente con poner el atributo bgcolor"" dentro de la instruccin de tabla. Para ponerfondoamarillobgcolor="yellow" <table border="1" cellpadding="0" cellspacing="0" width="50%" bgcolor="yellow"> EJEMPLO Una tabla de tres filas y dos columnas con un largo del 75%. Y fondoamarillo <table border="1" cellpadding="0" cellspacing="0" width="75%" bgcolor="yellow"> <tr> <td width="50%"></td> <td width="50%"></td> </tr> <tr> <td width="50%"></td> <td width="50%"></td> </tr>
<tr> <td width="50%"></td> <td width="50%"></td> </tr> </table>
LECCION 17 PONER ENLACES
Lo ms caracterstico de Internet es ser un medio que no es lineal sino hipertexto es decir que utiliza enlaces para movernos entre distintos niveles o pginas. La instruccin para un enlace es de la forma <A HREF="aqui ponemos la direccin a la que queremos que apunte el enlace">el texto que queremos que se vea en el documento</A> EJEMPLO Queremos enlazar con la pgina 100mejores.com y que el texto que se vea sea "La mejor seleccin de enlaces" <A HREF="http://www.100mejores.com/">La mejor seleccin de enlaces"</A> La mejor seleccin de enlaces Recordar que los enlaces externos a otras pginas deben llevar la direccin completa de la pgina.
LECCION 18 INSERTAR IMAGENES

Para insertar imgenes utilizamos <imgsrc="aqu ponemos la direccin de la imagen"> Este tag no tiene tag de cierre. En Internet tenemos numerosas pginas que proporcionan imgenes gratis. Por ejemplo http://www.gifmania.com/ Nos vamos a gifmania para obtener una imagen de una ejecutiva Seleccionamos mujeres y ejecutivas. Nos situamos sobre la imagen y pulsamos el botn DERECHO
Lo guardamos con el nombre de fichero ejecutiva y guardar como tipo de fichero GIF. Podemos guardarlo con varios tipos de ficheros, elegimos los gif por ocupar poco espacio y dar pocos problemas de compatibilidad.
Si lo guardamos en el MISMO directorio que el fichero HTML que estamos creando la instruccin para insertar la imagen de la ejecutiva nos queda: <imgsrc="ejecutiva.gif">
Es MUY IMPORTANTE tener cuidado con las direcciones de la imgenes. Si las imgenes estn en un directorio y el fichero html que estamos creando en otro directorio, la direccin de la imagen debe indicar la localizacin de la imagen en el otro directorio. Cuando hemos puesto imgenes en un fichero HTML y al enviarlo al servidor de Internet no aparecen suele ser por dos motivos: A) Hemos enviado el fichero HTML a Internet pero no los ficheros con las imgenes. B) Al enviarlo al servidor la direccin donde el programa busca la imagen es distinta de donde realmente esta la imagen. Para comprobar si donde esta la imagen coincide con la direccin que tiene la pgina nos colocamos sobre la imagen (o sobre donde debera estar) y pulsando el botn DERECHO en el men que aparece pulsamos propiedades. Lo recomendable es MANTENER LA MISMA ESTRUCTURA DE DIRECTORIOS en el disco duro de nuestro ordenador y en el servidor de Internet. Al mover los ficheros en el disco duro y posteriormente enviarlo al servidor puede que la direccin de la imagen no coincida con la localizacin de la imagen.
LECCION 19 INSERTAR IMAGENES ANIMADAS
Para insertar imgenes animadas se hace todo igual que para insertar imgenes. Simplemente elegimos una imagen animada para enlazar. Por ejemplo en la misma pgina dehttp://www.gifmania.com/ Seleccionamos una imagen animada
La guardamos con el nombre ejecutivaanimada La instruccin para insertar la imagen queda: <imgsrc="ejecutivaanimada.gif"> Y el resultado
LECCION 20 ATRIBUTOS RELACIONADOS CON INSERTAR IMAGENES
Para una correcta visualizacin en los distintos navegadores es aconsejable definir el largo y alto de la imagen que se inserta LARGO Y ALTO Para definir el largo y el alto de una imagen utilizamos los atributos WIDTH y HEIGHT Por ejemplo la imagen ejecutivaanimada tiene unas dimensiones de 167 pixels de largo por 109 pixels de alto. Podemos comprobarlo situndonos sobre la imagen y pulsando el botn DERECHO del ratn seleccionar "Propiedades" La instruccin quedara <imgsrc="ejecutivaanimada.gif" WIDTH="167" HEIGHT="109">
EL BORDE DE LAS IMAGENES Podemos ponerle borde a la imagen empelando el atributo border y asignndole un valor por ejemplo 2. Si no queremos borde podemos poner border=0 <imgborder="2" src="ejecutivaanimada.gif" WIDTH="167" HEIGHT="109" >
Es posible y recomendable poner un texto para cuando no aparezca la imagen por algn motivo.
TEXTO ALTERNATIVO A LA IMAGEN Para poner un texto alternativo se utiliza el "tag" ALT Vamos a poner la imagen anterior con un borde mayor y en un recuadro ms largo y menos alto y con el texto alternativo "secretaria animada" <img border="5" src="ejecutivaanimada.gif" WIDTH="250" HEIGHT="90" ALT="secretariaanimada">
LECCION 21 PONER UN BOTON O PONER UN ENLACE EN UNA IMAGEN
Si queremos poner un botn o una imagen que al pulsarla el usuario se encamine a otra pgina, utilizamos la orden para poner enlaces combinada con la orden para insertar imgenes. <a href="direccin del enlace a otra pgina"><imgsrc="aqu ponemos la localizacin de la imagen"></a> Vamos a poner la imagen de la secretaria y que al pulsarla lleve al usuario al portal de secretarias http://www.secretariaplus.com La instruccin nos quedara: <ahref="http://www.secretariaplus.com"><imgsrc="ejecutivaanimada.gif"></a> Y se vera al acceder con el navegador a la pgina. De forma que al pulsar sobre la imagen nos dirigimos a la pgina enlazada. Vale, de acuerdo, pulsa la imagen pero recuerda darle en tu navegador al "patra" "atras" o "Back" y seguir el curso.
; Esto nos permite poner botones y flechas que al pulsarlas nos encaminan a otras pginas de nuestra web o externas. OTRO EJEMPLO Insertamos una imagen que al pulsarla nos sita en la portada de aulafacil <a href="http://www.aulafacil.com"><img border="0" src="HOMEWHT.gif" width="90" height="70"></a>
LECCION 22 ATRIBUTOS DE LA PAGINA O ATRIBUTOS DE "BODY"
Hemos visto que los ficheros HTML se dividen en una cabecera y un cuerpo o body. Los ficheros incorporan las instrucciones <html> <head>
</head> <body> </body> </html> Al "tag" body podemos aadirle una serie de atributos de color para asignar un color diferente: A) Al fondo del documento con BGCOLOR B) Colocar una imagen de fondo BACKGROUND C) LINK para cambiar el color de los enlaces D) VLINK para cambiar el color de los enlaces ya visitados por el usuario E) Podemos cambiar el color del texto con el atributo TEXT
EJEMPLO Asignaremos un fondo de color amarillo al documento <html> <head> </head> <body bgcolor=yellow> </body> </html> Nos quedar el fondo de la pgina en amarillo.
TEMARIO CLASE 1. Abrir el programa CLASE 2. Partes de la pantalla CLASE 3. La Barra Estndar. Las opciones comunes y la opcin Deshacer CLASE 4. Cortar y Copiar CLASE 5. Guardar la pgina y ponerle Ttulo CLASE 6. El Formato de los Prrafos de texto
CLASE 7. El formato de las letras CLASE 8. La Barra de Formato CLASE 9. Color de resalte CLASE 10. La alineacin del texto y la Sangra CLASE 11. Las Listas CLASE 12. Aadir Enlaces CLASE 13. Colocar Imgenes CLASE 14. Modificar las Imgenes. Imgenes animadas y Fondo de las pginas. CLASE 15. Colocar texto e imgenes CLASE 16. Enlazar utilizando una Imagen CLASE 17. Insertar lneas o smbolos CLASE 18. Las muy tiles tablas CLASE 19. Alinear las tablas CLASE 20. Modificar las Tablas CLASE 21. Unir Celda CLASE 22. Formato de Celdas. El Color de Fondo CLASE 23. Modificar el Tamao de las Tablas CLASE 24. El Color de las lneas de las Tablas CLASE 25. El Diseo de las pginas CLASE 26. La Barra Tabla CLASE 27. Analizar el Diseo de las pginas CLASE 28. Las pginas con Marcos CLASE 29. La Ortografa CLASE 30. Poner un Enlace para enviar Correos electrnicos CLASE 31. Las vistas en FrontPage CLASE 32. Las plantillas de Sitios. CLASE 33. Creacin de un sitio CLASE 34. Nombrar pginas
CLASE 35. Modificacin de la estructura CLASE 36. Temas CLASE 37. Los bordes compartidos CLASE 38. Importar documentos de Office CLASE 39. Contador de visitas CLASE 40. Las Marquesinas LECCION 1 Abrir el programa
Tenemos varias opciones para abrir el programa. Una posibilidad es partir del botn Inicio. Pulsamos el botn Inicio que se encuentra en la esquina inferior izquierda de la pantalla Y del men que aparece pulsamos sobreProgramas
Y de los programas pulsamos sobreMicrosoft FrontPage
Aparece el programa mostrando una serie de Barras y una zona en blanco donde podemos escribir.
Podemos comenzar directamente en el espacio en blanco del mismo modo que hacemos en un programa de escritura como el Word.
Resumen multimedia de la leccin 1 ;
LECCION 2 Partes de la pantalla
Las Barras que el programa muestra en pantalla pueden variar dependiendo de las que estn activadas. Para que aparezca o no una Barra en la pantalla, la marcamos partiendo de Ver y Barras de Herramientas. Pulsamos Ver en la Barra situada en la parte superior de la pantalla. Pulsamos sobre Barra de herramientas.
Y marcamos la Barra que deseamos que se muestre en la pantalla. Las Barras marcadas son las que se mostraran en pantalla.
En la parte superior de la pantalla se muestra la Barra de Mens desde la que se accede a las principales funciones del programa
Pulsando sobre las diferentes opciones nos aparecen los mens. Puede aparece un men corto con las principales funciones. Pulsando sobre las dos flechas el programa muestra el men completo. En la siguiente imagen se muestra enmarcada en azul las flechas sobre las que pulsaremos para que aparezca el men largo.
La Barra Estndar muestra las funciones comunes con el resto de programas de Microsoft office. En la siguiente Barra tenemos los botones que nos permiten abrir una nueva hoja en blanco, abrir un archivo existente, guardar el archivo, as como copiar y pegar.
La Barra de Formato nos permite definir las caractersticas de los prrafos, las letras y la alineacin de los elementos.
Al iniciar el programa FrontPage la primera vez se muestran las Barras de Men, la Estndar y la deFormato. Si queremos que aparezca en pantalla por ejemplo la Barra para crear y modificar tablas pulsamos: Ver Barra de Herramientas Y marcamos Tablas
Nos aparece en pantalla la Barra Tablas desde la que podemos acceder directamente a las funciones para dibujar y dar formato a las tablas.
LAS VISTAS EN LAS QUE SE MUESTREAN LAS PAGINAS En la parte inferior de la pantalla se encuentran unas pestaas que nos permiten cambiar entre las tres vistas en las que se trabaja con este programa. La vista Normal como indica su nombre es la que utilizaremos habitualmente para componer las pginas. Las explicaciones de este curso de FrontPage se desarrollan en esta vista.
Pulsando sobre la pestaa HTML el programa nos muestra los cdigos que el programa genera al ir construyendo nuestra pgina
Y la pestaa Vista Previa nos permite comprobar como veremos en Internet la pgina.
MOVER Y CONFIGURAR LAS BARRAS DE HERRAMIENTAS Podemos mover las Barra de herramientas y colocarlas en la parte de la pantalla deseada. Colocamos el cursor sobre el extremo de la Barra Y mantenindolo pulsado nos movemos a la posicin deseada
Podemos colocar las Barras flotantes en medio de la pgina. Para volverlas a la parte superior colocamos el cursor sobre la Barra y mantenindo pulsado el cursor nos movemos a la posicin superior deseada. En ocasiones ( por ejemplo cuando dos Barras comparten la misma lnea) es necesario pulsar sobre las dos flechas laterales para mostrar el resto de los Botones de la Barra. En la siguiente imagen puede verse como pulsamos en las flechas de la Barra de Formato para que aparezca el resto de los botones. Podemos personalizar las Barras aadiendo o quitando botones
LECCION 3 La Barra Estandar. Las opciones comunes y la opcin Deshacer
LA BARRA ESTANDAR La Barra Estndar nos permite efectuar las operaciones tpicas comunes con otros programas como generar una Nueva pgina, Abrir un archivo, Guardarlo, Copiar y Pegar
El Botn Nueva pgina de la Barra Estndar al pulsarlo nos muestra una nueva pgina en blanco en la que podemos crear desde el principio una pgina para nuestra web
Si deseamos volver a trabajar en una pgina que tenemos almacenada en nuestro ordenador pulsamos el botn Abrir. Por tanto utilizamos abrir para editar pginas que ya existen
El botn Cortar como en otros programas de Microsoft Office nos permite quitar el texto o elementos de una parte de la pgina para colocarlo en otra
El botn Copiar nos permite realizar una copia de la parte del texto o de los elementos marcados con el cursor
El botn Pegar nos permite colocar en el sitio deseado los elementos que previamente hemos copiado
LA OPCION DESHACER
Seguramente una de las opciones ms utilizadas y muy de agradecer. Si nos equivocamos pulsamos y retrocedemos, se elimina la ltima accin realizada
Pulsando sobre el Men de Deshacer podemos seleccionar exactamente cuanto queremos retroceder. Las acciones que deseamos deshacer.
Si hemos pulsado Deshacer pero nos arrepentimos tenemos la opcin de pulsar el botnRehacer y anular lo que hemos deshecho.
LECCION 4 Cortar y Copiar CORTAR El programa FrontPage dispone de las opciones tpicas de Cortar, Copiar y Pegar directamente disponibles pulsando los botones de la Barra Estndar. Para quitar una parte del texto de una parte y colocarla en otra: Marcamos la parte del texto que queremos mover. Para marcar una palabra pulsamos dos veces con el cursor sobre la palabra. Si queremos marcar una lnea nos situamos con el cursor delante de la misma y hacemos Click. Pulsamos Edicin en la Barra superior y seleccionamos Cortar. Otra opcin es pulsar directamente el Botn Cortar de la Barra Estndar. Nos situamos en el punto donde queremos colocar el texto y pulsamosEdicin y Pegar o directamente el Botn Pegar Otra forma muy rpida y cmoda de Cortar un texto y Pegarlo en otra posicin es marcarlo y pulsar el botn DERECHO del ratn. Aparece un men donde se encuentran directamente disponibles estas funciones.
COPIAR El sistema para copiar una parte del texto o diversos elementos y reproducirlo en otra parte de la pgina es: Marcamos la parte del texto que queremos mover. Pulsamos Edicin en la Barra superior y seleccionamos Copiar. Otra opcin es pulsar directamente el Botn Copiar de la Barra Estndar. Nos situamos en el punto donde queremos colocar el texto y pulsamos Edicin y Pegar o directamente el Botn Pegar
BORRAR Para borrar o eliminar una parte del texto o algn elemento lo marcamos y: Pulsamos Edicin en la Barra superior Pulsamos Eliminar
SELECCIONAR Una opcin que puede ser interesante cuando queremos cambiar el formato a todo el texto o aplicar alguna otra instruccin sobre toda la pgina es marcar toda la pgina. Pulsamos Edicin en la Barra de men. Y Seleccionar todo.
Resumen multimedia de la leccin 4 ; LECCION 5 Guardar la pgina y ponerle Ttulo
PROPIEDADES DE LA PAGINA La opcin Propiedades de pgina nos permite establecer el ttulo de la pgina, aadir un fondo y establecer los mrgenes de la pgina.
Pulsamos la opcin Archivo en la Barra superior. Seleccionamos Propiedades
Nos aparece el Cuadro Propiedades de Pgina. Para ponerle un ttulo a la pgina: Pulsamos la pestaa General En el recuadro Ttulo escribimos el nombre que deseamos para la pgina.
El ttulo de la pgina podemos verlo cuando navegamos por Internet justo en la parte inferior de la pantalla. En la imagen siguiente se muestra la parte inferior de la pantalla al navegar con Internet Explorer.
Al ver la pgina en Internet el ttulo se muestra justo en la parte inferior de la pantalla El ttulo de la pgina veremos que tambin podemos ponerlo al guardar el fichero.
PONER FONDO A LA PAGINA Este Cuadro Propiedades de pgina nos permite poner un fondo a la pgina. Pulsamos la pestaa Fondo Marcamos la opcin Imagen de fondo o Marca de agua Pulsamos Examinar para buscar y pulsar sobre el fichero que contiene el fondo.
Existen mltiples direcciones en Internet como COLOR VIVO que disponen de fondos e imgenes gratis para poner en las pginas Web. Para utilizarlas tenemos que: Situar el cursor sobre el fondo o imagen seleccionada Pulsar el botn DERECHO del ratn Seleccionar Guardar imagen como. Y acordarnos en que subdirectorio de nuestro ordenador hemos guardado el fichero.
GUARDAR COMO La opcin Guardar como nos permite ponerle el nombre que deseemos al archivo y seleccionar el tipo de archivo.
Nos aparece el Cuadro Guardar Como. Es interesante ser ordenado y crear una carpeta para cada web que creamos y subcarpetas para distintos apartados. En nuestro ejemplo las pginas del curso de FrontPage se guardan en una carpeta denominada CursoFrontPage. Creamos en el disco duro de nuestro ordenador una nueva carpeta para archivar las pginas de nuestra web. Pulsamos el botn que muestra una Carpeta amarilla tal como se muestra en la imagen siguiente.
Y le ponemos un nombre que nos ayude a encontrar nuestros ficheros. En nuestro ejemplo al directorio que creamos para archivar nuestras pginas le llamamos Directorio Para Mi Web. Y pulsamos Aceptar
EL TITULO DE LA PAGINA Vimos que podemos ponerle ttulo a la pgina mediante la funcin Propiedades de pgina. Tambin podemos ponerle ttulo a la pgina al guardar el fichero. En este mismo Cuadro Guardar como tenemos la posibilidad de cambiar el ttulo de la pgina. Por defecto el programa pone como ttulo de la primera lnea que escribimos. Si comenzamos escribiendo en la pgina en blanco "LAS MEJORES DIRECCIONES" ese es el nombre que le da. Para cambiar el ttulo de la pgina pulsamos Cambiar
Aparece el Cuadro Establecer ttulo de pgina. Escribimos el nuevo ttulo que deseamos para nuestra pgina. En nuestro ejemplo queremos que el nuevo ttulo sea "PAGINA DE PEPE". Y pulsamos Aceptar
Es interesante poner un ttulo significativo puesto que es el que se mostrara en la parte inferior de la pantalla cuando se vea en Internet. Es el ttulo que se mostrara cuando los Internautas aadan la pgina a sus Favoritos y el que mostraran algunos buscadores. En el recuadro Nombre de archivo le ponemos nombre al fichero de la pgina. En nuestro ejemplo el nombre del archivo de la pgina es Miprimerapagina. Para no tener problemas con los navegadores suele se importante que el nombre del fichero no tenga espacios, ni acentos, ni letras que no estn en el alfabeto norteamericano ni smbolos raros
Puede que estemos confundidos entre el ttulo de la pgina y el nombre del fichero. El ttulo o nombre de la pgina aparece en la parte superior cuando la vemos en Internet. El ttulo de esta pgina que estas viendo es Aulafcil Curso FrontPage. Otra cosa distinta es el nombre del fichero htm de la pgina en el caso de esta pgina el fichero es Lecc-5.htm.
ABRIR FICHERO Para volver a trabajar en una pgina que tenemos archivada en el ordenador utilizamos la funcinAbrir Pulsamos Archivo en la Barra superior Y seleccionamos Abrir
Nos aparece el cuadro Abrir archivo Es posible que el cuadro nos muestre directamente el directorio y una lista de archivos entre los que se encuentra el que deseamos abrir. Pulsamos dos veces sobre el archivoque deseamos abrir. En nuestro ejemplo estamos abriendo el fichero denominado Lecc-5.html que es precisamente la pgina donde nos encontramos.
Si el archivo que deseamos abrir se encuentra en otro directorio pulsamos sobre el botn correspondiente a Buscar en, tal como se muestra en la siguiente imagen. Pulsaremos para desplazarnos al directorio donde se encuentra almacenado el fichero sobre el que deseamos volver a trabajar. Otra opcin para buscar donde hemos almacenado el fichero es pulsar sobre el botn que muestra una carpeta amarilla con una flecha hacia arriba.
Otra opcin para volver a trabajar con una de las ltimas pginas que hemos guardado en el ordenador es pulsar Archivos recientes y pulsar sobre el archivo que deseamos abrir.
GUARDAR EL FICHERO La opcin Guardar archiva el fichero con el mismo nombre que ya tiene . Es preciso tener cuidado puesto que la nueva versin elimina la versin anterior que tenemos en el ordenador. Pulsamos Archivo en la Barra superior Seleccionamos Guardar
LECCION 6 El formato de los Prrafos de texto
PARRAFO Cuando escribimos un texto, este se distribuye de forma continua formando un prrafo hasta que pulsamos Enter Hemos copiado el siguiente prrafo del curso de didctica para utilizarlo como ejemplo de como se puede dar formato a los prrafos que ponemos en nuestra pgina Web.
Definimos la educacin como el proceso que tiende a capacitar al individuo para actuar conscientemente frente a situaciones nuevas, aprovechando la experiencia anterior, y teniendo en cuenta la inclusin del individuo en la sociedad, la transmisin de la cultura y el progreso social. Siendo por tanto, la educacin, un proceso social ms amplio y de mayor rango que la mera instruccin, que se limita a transmitir destrezas tcnicas o teoras cientficas. Marcamos el prrafo al que deseamos dar texto. Tal como se muestra en la siguiente imagen
Pulsamos la opcin Formato en la Barra de men Dentro del men pulsamos sobre Prrafo
Nos aparece el Cuadro Prrafo. Este cuadro nos permite definir la forma que presentar el prrafo. Seleccionamos el tipo de Alineacin. En nuestro ejemplo seleccionamos alineacin izquierda de forma que el prrafo se ajuste al margen izquierdo de la pgina. Podemos en este cuadro definir la sangra de forma que el texto se separe una cierta distancia del borde. En nuestro ejemplo ponemos una Sangra en la parte izquierda del texto de 50.
Y el texto se ajusta a la izquierda y se desplaza como consecuencia de la Sangra tal como se muestra a continuacin. Definimos la educacin como el proceso que tiende a capacitar al individuo para actuar conscientemente frente a situaciones nuevas, aprovechando la experiencia anterior, y teniendo
en cuenta la inclusin del individuo en la sociedad, la transmisin de la cultura y el progreso social. Siendo por tanto, la educacin, un proceso social ms amplio y de mayor rango que la mera instruccin, que se limita a transmitir destrezas tcnicas o teoras cientficas.
En el mismo Cuadro de Prrafo podemos hacer que la primera lnea del prrafo comience ms a la derecha mediante la opcin Aplicar sangra a primera lnea. En nuestro caso ponemos "50" de forma que la primera palabra "Definimos" comience ms a la derecha. Igualmente podemos definir la distancia entre lneas. En nuestro ejemplo hemos aumentado la distancia entre lneas al Doble seleccionando la opcin en Interlineado.
Y el resultado de la sangra en la primera lnea y de aumentar a dos el espacio Interlineal se muestra en el siguiente prrafo.
Definimos la educacin como el proceso que tiende a capacitar al individuo para actuar conscientemente frente a situaciones nuevas, aprovechando la experiencia anterior, y teniendo en cuenta la inclusin del individuo en la sociedad, la transmisin de la cultura y el progreso social. Siendo por tanto, la educacin, un proceso social ms amplio y de mayor rango que la mera instruccin, que se limita a transmitir destrezas tcnicas o teoras cientficas.
SALTO DE LINEA La opcin Salto de lnea hace que el siguiente prrafo comience una nueva lnea a partir de un cierto punto. En el siguiente ejemplo vamos a dejar la parte marcada en verde en una lnea y el resto del prrafo en otra. El marcado en verde no tiene mayor significado en este ejemplo. En la planificacin y puesta en prctica de la metodologa docente. Mediante el establecimiento de un dialogo con los alumnos sobre la metodologa didctica, las diversas opciones disponibles y dar ciertas posibilidades de eleccin al respecto. Proporcionar a los alumnos diversas opciones didcticas y la posibilidad de realizar trabajos voluntarios
Situamos el cursor donde queremos que termine una lnea. En nuestro ejemplo despus del primer punto y antes de la palabra "Mediante" Pulsamos Insertar en la Barra superior Y seleccionamos Salto de lnea
Aparece en pantalla el Cuadro propiedades de salto de lnea. En nuestro ejemplo seleccionamos Salto de lnea normal
Y el resultado de aplicar la opcin Salto de lnea al prrafo anterior se muestra a continuacin. En la planificacin y puesta en prctica de la metodologa docente. Mediante el establecimiento de un dialogo con los alumnos sobre la metodologa didctica, las diversas opciones disponibles y dar ciertas posibilidades de eleccin al respecto. Proporcionar a los alumnos diversas opciones didcticas y la posibilidad de realizar trabajos voluntarios
Resumen multimedia de la leccin 6 ; LECCION 7 El Formato de las letras
DAR FORMATO A LAS LETRAS Para dar formato al texto podemos seleccionar la instruccin por ejemplo negrita y lo siguiente que escribimos va en el nuevo formato hasta que pulsamos de nuevo y desactivamos el formato.. Otra opcin es tener un texto escrito y seleccionar la parte del texto que deseamos dar formato.
En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo viva un hidalgo caballero.
Marcamos el texto
Pulsamos Formato en la barra de men Pulsamos sobre Fuente
En el cuadro que aparece seleccionamos las opciones de formato para el texto. En nuestro caso seleccionamos: Como Fuente, es decir como tipo de letra Verdana, En Estilo de fuente marcamos negrita y Dentro de las opciones de Tamao queremos una letra grande y seleccionamos 4es decir 14 puntos de tamao. Y queremos las letras en un bonito azul elegante. Para seleccionar color pulsamos sobre el tringulo situado a la derecha del recuadro Color
Y el resultado se muestra en la siguiente imagen
LECCION 8 La Barra de Formato LA BARRA DE FORMATO La Barra de Formato nos permite acceder directamente a las principales opciones para dar formato al texto.
El Botn Fuente nos permite seleccionar el tipo de letra.Esta letra es verdana
En la Barra de formato podemos seleccionar directamente el tamao de letra deseado. Esta letra es
tamao 4 (14 pto)
Pulsando el Botn Negrita el texto queda resaltado
Hemos pulsado el botn cursiva y escrito este texto
Y si pulsamos el botnSubrayado el texto queda sobre una lnea de subrayadoi.
LECCION 9 Color de Resalte
Podemos resaltar un texto o una parte del mismo. Si pulsamos el botn Color de Resalte a continuacin todo lo que escribimos se muestra resaltado. En algunos navegadores el color de resalte no se muestra.
Ya he pulsado el botn de resalte Para eliminar el resalte vuelvo a pulsar para que aparezca el men. Y selecciono automtico
Puedo cambiar el color del resalte
Y selecciono por ejemplo el verde para resaltar
He pulsado resaltar en verde Otra opcin es marcar un trozo del texto que ya tenemos escrito y resaltarlo. Por ejemplo marcamos opcin
Y pulsamos resaltar de forma que el texto anterior nos queda Otra opcin es marcar un trozo del texto que ya tenemos escrito y resaltarlo.
LECCION 10 La aLineacin del texto y la Sangra
ALINEAR EL TEXTO Los botones de la Barra de formato nos permiten alinear o ajustar el texto a la izquierda.
Pulsamos el Botn Alinear a la izquierda. El texto que tecleamos quedar como el siguiente ejemplo. En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo viva un hidalgo caballero.
Pulsamos el Botn Centrar. El texto se justifica desde el centro como vemos en el siguiente ejemplo.
Pulsamos el Botn Alinear a la derecha y el texto se justifica en relacin al borde derecho de la pgina como vemos en el ejemplo.
SANGRIA Partimos del siguiente prrafo. En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo viva un hidalgo caballero. Colocamos el cursor sobre el texto que deseamos cambiar. Pulsamos el Botn Aumentar sangra de la Barra de formato.
Pulsando una vez sobre el Botn el texto se coloca ms a la derecha En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo viva un hidalgo caballero.
Podemos aumentar la sangra el doble pulsando dos veces el botn. En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo viva un hidalgo caballero.
LECCION 11 Ordenar el texto en una Lista
LAS LISTAS Voy a elaborar una lista de tareas numeradas
Y escribo la primera Y la segunda Y las que hagan falta Igualmente podemos tener una lista precedida por puntos
Y escribo un apartado Y escribo Y escribo la tercera opcin Y una cuarta por ejemplo
Pudo cambiar el formato de la lista. Situo el puntero sobre la lista Pulso El botn DERECHO del ratn Selecciono Propiedades de lista
Pulso sobre la pestaa Numeracin Y selecciono el formato deseado. En nuestro caso elegimos numeracin romana.
Y la lista queda como se muestra a continuacin. Situo el puntero sobre la lista
Pulso El botn DERECHO del ratn Selecciono Propiedades de lista
LECCION 12 Aadir Enlaces ENLACES A OTRAS PAGINAS DE INTERNET. ENLACES EXTERNOS Una de las caractersticas ms tpicas de Internet es la posibilidad de pasar de un documento a otro mediante enlaces. Los enlaces, vnculos o links permiten al Internauta desplazarse por la Red. Es conveniente definir para nuestra Web un conjunto de enlaces que sean fciles de utilizar para los usuarios. una estructura clara de enlaces ayuda a la navegacin. Para aadir un enlace podemos:
Escribimos el texto que deseamos para el hipervnculo y lo marcamos. En nuestro ejemplo escribimos "Las Mejores direcciones de Internet". Este ser el texto que se muestre en la pgina.
Pulsamos Insertar en la Barra de men y Del men seleccionamos Hipervnculo
Nos aparece el Cuadro Crear Hipervnculo Escribimos en el recuadro Direccin URL la direccin de la pgina a la que lleva el enlace. En nuestro ejemplo hemos escrito la direccin para llegar a la portada de 100mejores.com . Para no cometer equivocaciones con las direcciones de las pginas es aconsejable ir a la pgina con el programa de navegacin que utilicemos y copiar la direccin. Para copiar la direccin la marcamos haciendo doble click sobre la misma y pulsando el botn DERECHO del ratn seleccionamos copiar. Si pulsamos el botn al final del recuadro como muestra la flecha nos aparecen direcciones que hemos visitado recientemente y que podemos seleccionar directamente.
Pulsamos Aceptar. Y el resultado es un enlace como se muestra a continuacin: Las Mejores direcciones de Internet
ENLACES INTERNOS Poner un enlace entre dos pgina que hemos creado para nuestra web es el mismo procedimiento que para los enlaces exteriores a otras webs. En nuestro caso para enlazar dos lecciones de aulafacil utilizamos los mismos comandos. Escribimos el texto que mostrara en la pgina el enlace y lo marcamos. Escribimos por ejemplo Siguiente pgina
Pulsamos Insertar en la Barra superior Y pulsamos sobre Hipervnculo
Nos aparece en pantalla el Cuadro Crear Hipervnculo. En la parte central del cuadro aparecen las otras pginas que hemos creado para nuestra web. Pulsamos sobre el Nombre de la pgina con la que queremos enlazar.
Puede que el Cuadro Crear Hipervnculo nos muestre un subdirectorio y tengamos la pgina que deseamos enlazar en otro subdirectorio. Pulsamos sobre el Botn de bsqueda como muestra la imagen siguiente
Aparece un subdirectorio y los diversos archivos del mismo. Pulsamos sobre el nombre del fichero correspondiente a la pgina que deseamos enlazar. Si la pgina que deseamos enlazar no se encuentra en este subdirectorio podemos ir al subdirectorio donde este pulsando el botn del recuadro Buscar en como se muestra en la siguiente imagen. Otra forma de movernos por los directorios es pulsando el botn con una carpeta amarilla y una flecha hacia arriba que se muestra en la imagen. Este botn nos mueve un directorio hacia arriba.
El enlace de esta pgina con la siguiente del curso es un ejemplo de enlace interno. ENLAZAR A OTRA PARTE DE LA MISMA PAGINA. LOS MARCADORES Los marcadores nos permiten que al pulsarlos el visitantes la pgina se mueva y se muestre en pantalla otra parte de la misma. Para crear un marcador nos situamos en el punto al que deseamos se mueva la pgina al pulsar. En nuestro ejemplo al pulsar la pgina se mover a la parte superior. Situamos el Cursor donde deseamos que se muestre la pgina. En nuestro ejemplo al lado del ttulo de la pgina.
Pulsamos en la Barra superior Insertar y Marcador
En el Cuadro Marcador que aparece escribimos un nombre para el marcador. Por ejemplo Superior. Si vamos a poner varios marcadores es interesante ponerles nombres que luego sean fciles de localizar.
Aparece una banderita indicando el punto que se muestra al activar el marcador. En la siguiente imagen se muestra como se ve la banderita en la vista Normal de ForntPage. En Internet no se mostrara la banderita al visitante.
Ahora tenemos que poner un enlace al marcador. Es parecido a poner un enlace. Escribimos un texto para el marcador y lo marcamos. En nuestro ejemplo escribimos Ir hacia arriba Pulsamos en la Barra superior Insertar y seleccionamos Hipervnculo Nos aparece el Cuadro Hipervnculo. Y en la esquina inferior izquierda la opcinMarcador. Pulsamos sobre el Botn de la opcin Marcador y elegimos el nombre del marcador deseado. En nuestro ejemplo tal como se muestra en la siguiente imagen el nombre del marcador es Superior
Y pulsando Aceptar el resultado es el enlace que se muestra a continuacin. Pulse en el enlace para comprobar como funciona Ir hacia arriba
LECCION 13 Colocar Imgenes OBTENER IMAGENES Lo primero necesitamos una imagen. Podemos crear imgenes utilizando diversos programas de dibujo y de tratamiento de imgenes y fotografas. Adems numerosos sitios de Internet proporcionan imgenes de forma gratuita. Hay que tener en cuenta que el resto de las imgenes y del contenido presente en Internet esta protegido por las leyes de Propiedad Intelectual. El obtener una imagen de una pgina web que ofrece imgenes de libre disposicin es sencillo: Nos situamos sobre la imagen. Pulsamos el botn DERECHO del ratn Seleccionamos Guardar Imagen como o Save imagen as Y elegimos un Directorio del disco duro de nuestro ordenador para guardar el fichero. Vamos a copiar el fichero que contiene el logotipo de aulafacil.com y copiarlo en el disco duro de nuestro ordenador.
Donde pone Guardar en seleccionamos el directorio de nuestro disco duro donde queremos almacenar el fichero que contiene la imagen. En nuestro caso guardamos la imagen en el directorio CursoFrontPage
En la parte inferior del cuadro tenemos Nombre de archivo. Podemos ponerle un nuevo Nombre al archivo o mantener el que tiene. En nuestro ejemplo mantenemos el nombre y el tipo del fichero. Y pulsamos Guardar
IMAGENES DE MICROSOFT OFFICE El programa Microsoft Office dispone de una serie de imgenes que podemos aadir a nuestra pgina Pulsamos Insertar en la Barra superior Seleccionamos Imagen Y pulsamos sobre Imgenes tal como se muestra a continuacin. Nos aparece el Cuadro Imgenes
Pulsamos sobre la Categora deseada Y dentro de la categora deseada pulsamos sobre la Imagen deseada. Aparece el botn Insertar Clip sobre el que tenemos que pulsar
Y el resultado se muestra a continuacin. Hemos reducido la imagen. En la pgina siguiente veremos como se puede ampliar y reducir fcilmente desde FrontPage el tamao de las imgenes.
AADIR UNA IMAGEN GUARDADA EN NUESTRO ORDENADOR Para aadir una imagen a nuestra pgina seleccionamos Insertar en la Barra de mens Seleccionamos Imagen Y pulsamos Desde archivo para ir a los ficheros de imgenes que tenemos guardados en nuestro ordenador.
Otra opcin es pulsar directamente el Botn Insertar imagen desde archivo de la Barra Estndar.
Nos aparece en pantalla el Cuadro Seleccionar archivo Pulsamos dos veces sobre el archivo que contiene la imagen tal como se muestra a continuacin.
Y como resultado aparece la imagen en nuestra pgina.
LECCION 14 Modificar las Imgenes. Las Imgenes animadas y el Fondo de las pginas
MODIFICAR EL TAMAO DE LAS IMAGENES Podemos aumentar o disminuir el tamao de una imagen. Para nuestro ejemplo obtenemos una imagen de la pgina Gifmania Insertamos la siguiente imagen tal como vimos en la pgina anterior.
En nuestro ejemplo aumentaremos el tamao de la imagen insertada. Pulsamos sobre la imagen. Al pulsar sobre la imagen aparecern unos puntos o cuadraditos rodeando la imagen. Situamos el cursor sobre uno de los puntos y manteniendo pulsado el botn del ratnnos movemos hacia fuera.
Y el resultado se muestra en la siguiente imagen
AADIR UNA IMAGEN ANIMADA A LA PAGINA
Aadir a nuestra pgina una imagen animada es igual que aadir una imagen simplemente seleccionamos por ejemplo en Gifmania una imagen animada. Nos colocamos sobre la imagen animada que deseamos y pulsamos el botn derecho del ratn. Hay que advertir que muchas imgenes y contenidos de Internet como estos cursos de aulafacil cuentan con derechos de autor y no pueden ser copiados.
Pulsamos Guardar imagen como
Una vez que tenemos el archivo de la imagen en nuestro disco duro la insertamos en nuestra pgina Pulsamos el botn Insertar imagen desde archivo
Y el resultado se muestra a continuacin
MODIFICAR LAS IMAGENES CON LA BARRA DE IMAGENES Para este ejemplo hemos insertado una imagen que se encuentra en los archivos de Microsoft Office tal como se explica en la pgina anterior.
Activamos la Barra Imgenes si no se encuentra ya visible. Pulsamos Ver en la Barra de mens Seleccionamos Barras de herramientas Y marcamos Imgenes
Nos aparece en pantalla la Barra Imgenes tal como se muestra a continuacin
Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a aadir un texto a la imagen. Y pulsamos el Botn Texto
Al tratarse de una imagen en otro formato el programa Microsoft FrontPage nos advierte que convertir la imagen a formato GIF. El formato GIF es muy adecuado para las pginas Webs por generar imgenes con pocos Kilobites y por tanto se cargan ms rpidamente. Pulsamos Aceptar
Nos aparece un recuadro donde podemos escribir directamente. En nuestro ejemplo escribimos la palabra TRABAJO. El resultado se muestra a continuacin
PONER UN FONDO A LA PAGINA Vimos anteriormente que podemos poner un fondo a la pgina partiendo del men Archivo y seleccionando Propiedades de pgina. Veremos otro ejemplo de como poner fondo a las pginas y esta vez partimos del men Formatoy seleccionamos Fondo. El camino es distinto pero el resultado es el mismo.
Nos vamos a una pgina que ofrece fondos para las pginas de modo libre y gratuito. Por ejemplo COLOR VIVO . Otra pgina con fondos y grficos es Webmaestro Nos vamos al apartado fondos y al de fondos claros. Seleccionamos un fondo claro concretamente el claro09 Nos situamos sobre el fondo seleccionado y pulsamos el botn DERECHO del ratn. Seleccionamos Guardar imagen como
Una vez que tenemos el archivo correspondiente al fondo en nuestro disco duro: Pulsamos Formato en la Barra superior o barra de mens Seleccionamos Fondo
Nos aparece el Cuadro Propiedades de pgina Pulsamos sobre la Pestaa Fondo Marcamos en Formato Imagen de fondo Y pulsamos Examinar para buscar donde tenemos guardado el archivo que tiene el fondo
Nos aparecen los directorios y los archivos de nuestro disco duro. Pulsamos dos veces sobre el fichero que contiene el fondo. En nuestro ejemplo claro09 Y pulsamos Aceptar
LECCION 15 La Ubicacin. Colocacin de texto e imgenes
UBICACION La orden Ubicacin nos permite distribuir el texto alrededor de una imagen como la siguiente
Marcamos pulsando con el cursor la imagen que deseamos situar Pulsamos Formato en la Barra de mens Y pulsamos sobre Ubicacin
Nos aparece en imagen el Cuadro Ubicacin Pulsamos sobre el tipo de distribucin del texto alrededor de la imagen que queremos en nuestro caso seleccionamos Izquierda.
La opcin Ubicacin nos permite situar el texto alrededor de una imagen de forma que la imagen quede situada a la izquierda o derecha del texto.
UTILIZACION DE LAS TABLAS La organizacin de los textos y las imagenes dentro de las pginas se suele realizar mediante la inclusin dentro de celdas.
En este lado podemos escribir y el texto se queda enmarcado en la celda
Nos colocamos en la celda. En nuestro ejemplo colocamos el cursor en la celda que contiene la imagen. Pulsamos el botn DERECHO del ratn y seleccionamos Propiedades de celda Quitamos la marca de Especificar ancho. Y pulsamos Aceptar
Y el resultado es una distribucin mejor del texto y la imagen.
Y seleccionando Propiedades de tabla y poniendo el Tamao de borde a cero. El resultado es una tabla oculta que nos permite distribuir el texto y la imagen tal como se muestra a continuacin
LECCION 16 Enlazar utilizando una imagen
PONER UN ENLACE EN UNA IMAGEN
Queremos que cuando se pulse sobre una imagen y nos desplacemos a otra pgina. Pulsamos sobre la imagen. Deben aparecer unos puntos enmarcndola
Y lo siguiente es igual que poner un enlace. Pulsamos en Insertar del la Barra de men. Pulsamos sobre Hipervnculo. Escribimos la direccin de la pgina donde queremos que conduzca el enlace. Pulsamos Aceptar.
En nuestro ejemplo ponemos en el hipervnculo la direccin de aulafacil.com y pulsamos Enteren nuestro teclado o el botn Aceptar del cuadro.
Y podemos comprobar el resultado pulsando sobre la siguiente imagen.
Poner un botn, una flecha o cualquier icono en el que pulsando enlacemos con otra pgina evidentemente es igual.
LECCION 17 Insertar lneas o smbolos AADIR UNA LINEA HORIZONTAL El programa FrontPage nos permite aadir lneas a nuestra pgina de modo fcil Pulsamos Insertar en la Barra de mens Y Pulsamos Lnea horizontal
Y el resultado es la lnea que se muestra a continuacin
Podemos modificar la lnea horizontal cambiando su formato Marcamos la lnea pulsando sobre la misma. Pulsando el Botn DERECHO del ratn aparece un men en el que elegimos
Propiedades de lnea horizontal
Aparece el Cuadro Propiedades de lnea horizontal En el Cuadro podemos seleccionar el Ancho de la lnea. En nuestro ejemplo seleccionamos 50 como Porcentaje de ventana. La lnea del ejemplo tendr como distancia la mitad de la pgina o de la tabla dentro de la que se encuentra. Y la opcin Alto nos permite definir el grosor de la lnea. En nuestro ejemplo ponemos 5 pixeles como ancho de la lnea. La opcin Color nos permite decidir el color de la lnea. En nuestro ejemplo seleccionamos el color azul.
Y el resultado de definir el Ancho como el 50%, el grosor como 5 pixeles y el color azul se muestra a continuacin
PONER SIGNOS COMO @)$ En ocasiones necesitamos aadir a nuestra pgina un smbolo que no se encuentra directamente disponible en el teclado de la computadora. Para insertar un smbolo: Pulsamos Insertar en la Barra superior o Barra de mens. Pulsamos sobre Smbolo
Nos aparece en pantalla el Cuadro Smbolo. Marcamos el smbolo que deseamos y pulsamos Insertar. O directamente podemos hacer doble click sobre el smbolo.
Esto nos permite escribir smbolos como @
LECCION 18 Las muy tiles tablas LAS UTILES TABLAS Los distintos elementos de una pgina se organizan mediante tablas. Esta misma pgina esta organizada utilizando varias tablas de bordes ocultos que delimitan las distintas partes. Para aadir una tabla a nuestra pgina Pulsamos Tabla en la Barra superior o Barra de mens. Seleccionamos Insertar Y pulsamos sobre Tabla
Podemos directamente pulsar sobre el Botn Insertar Tabla de la Barra Estndar
Nos aparece el Cuadro Insertar tabla En este cuadro podemos definir el nmero de Filas y de Columnas de la Tabla. En este primer ejemplo aadimos una tabla de dos filas y dos columnas. Pro tanto una tabla de cuatro celdas. En Alineacin definimos si la tabla se ajustar a un lado u otro de la pgina. En nuestro ejemplo seleccionamos Izquierda. En Tamao del borde definimos el grosor de la lnea que delimita la tabla. Posteriormente veremos que para organizar las pginas de Internet se utilizan mltiples tablas con bordes ocultos asignando al borde un tamao cero. En Especificar Ancho definimos el tamao de la tabla. En nuestro ejemplo ponemos un ancho del 50 por ciento. Esta tabla ocupara la mitad del ancho de la pgina o de la tabla en la que se encuentre.
Y el resultado es la tabla que se muestra a continuacin
El Espaciado entre celdas separa las celdas. En el siguiente ejemplo cambiamos de cero a 1 al Espaciado entre celdas.
Y el resultado se muestra en la siguiente tabla
OTRO EJEMPLO Aadir una tabla de tres filas y dos columnas con un ancho del 50 por ciento, un tamao del borde de 2 y un espaciado entre celdas de 1.
El resultado es el siguiente
LECCION 19 Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al aadir una tabla a nuestra pgina podemos asignarle la alineacin. En este ejemplo ponemosAlineacin izquierda
La siguiente tabla esta ajustada al borde izquierdo de la tabla en la que se encuentra incluida.
Veamos en el siguiente ejemplo una tabla en la que seleccionamos Alineacin Derecha.
La siguiente tabla esta ajustada a la derecha
Podemos igualmente definir la Alineacin como Centro de forma que la tabla se ajuste de modo equidistante de los bordes
La tabla que se muestra a continuacin esta centrada
LECCION 19 Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al aadir una tabla a nuestra pgina podemos asignarle la alineacin. En este ejemplo ponemosAlineacin izquierda
La siguiente tabla esta ajustada al borde izquierdo de la tabla en la que se encuentra incluida.
Veamos en el siguiente ejemplo una tabla en la que seleccionamos Alineacin Derecha.
La siguiente tabla esta ajustada a la derecha
Podemos igualmente definir la Alineacin como Centro de forma que la tabla se ajuste de modo equidistante de los bordes
La tabla que se muestra a continuacin esta centrada
LECCION 21 Unir Celdas COMBINAR CELDAS En nuestro siguiente ejemplo vamos a crear una tabla de dos filas y dos columnas. Con un borde de 2 y un ancho del 50%.
Partimos de la siguiente tabla
Vamos a fusionar dos celdas en una Marcamos las celdas que deseamos fusionar.
Pulsamos el Botn DERECHO del ratn. Seleccionamos del men Combinar celdas
Y el resultado se muestra en la siguiente tabla
LECCION 22 El Formato de las Celdas. Color de fondo DAR FORMATO A LAS CELDAS Para modificar o dar formato a las celdas de una tabla: Situamos el cursor sobre la celda elegida o marcamos las celdas a las que deseamos cambiar el formato. Partimos de la siguiente tabla para nuestro ejemplo.
Pulsamos el Botn DERECHO del ratn Seleccionamos Propiedades de celda
Aparece en pantalla el Cuadro Propiedades de celda. En este Cuadro podemos dar formato a las celdas de la tabla. En nuestro ejemplo vamos a poner de color Rojo el fondo de la celda seleccionada.
Pulsamos sobre el Botn correspondiente a Color de Fondo Pulsamos sobre Rojo El resultado se muestra en la siguiente tabla
LECCION 23 Modificar el tamao de las Tablas
PROPIEDADES DE TABLA Partimos de la tabla que creamos en la pgina anterior. Vamos a modificar la tabla reduciendo su tamao.
Situamos el cursor sobre la tabla Pulsamos el Botn DERECHO del ratn Seleccionamos Propiedades de tabla Marcamos Especificar ancho y escribimos el nuevo ancho de tabla deseado. En nuestro ejemplo escribimos 30 como ancho de la tabla.
El resultado es que la tabla reduce su tamao como se muestra a continuacin.
Igualmente podemos modificar la tabla aumentando su ancho. En el siguiente ejemplo marcamos Especificar ancho y escribimos 70 aumentando el tamao de la tabla anterior.
El resultado es que la tabla se alarga tal como se muestra en la siguiente tabla
LECCION 24 El Color de las lneas de las Tablas

PONER COLOR AL BORDE DE LA TABLA Partimos de la siguiente tabla
Deseamos modificar la anterior tabla y ponerle color a las lneas del borde Situamos el cursor sobre la tabla Pulsamos el botn DERECHO del ratn y seleccionamos Propiedades de tabla
Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Colorseleccionamos el color deseado. En nuestro ejemplo seleccionamos el color azul
La tabla cambia para mostrar las lneas de color azul.
ESPACIADO ENTRE CELDAS Podemos modificar el Espaciado entre celdas utilizando este mismo Cuadro de Propiedades de tabla. Partimos de la siguiente tabla.
Pulsamos el Botn DERECHO del ratn y seleccionamos Propiedades de tabla Seleccionamos el nuevo Espaciado entre celdas. En nuestro ejemplo vamos a cambiar el espaciado que estaba en 2 a un espaciado de cero.
Y la tabla se modifica quedando como se muestra a continuacin.
TABLAS NO VISIBLES Las pginas organizan los distintos elementos, el texto, las imgenes y los enlaces utilizando tablas con bordes no visibles. Para crear tablas no visibles al crear la tabla ponemos el Tamao de borde a cero
Y la tabla se muestra en la vista Normal de FrontPage como se muestra a continuacin. Esta tabla es invisible cuando se coloquemos en Internet nuestra tabla
Resumen multimedia de la leccin 24;
seo de las pginas

COMPOSICION DE PAGINAS Las pginas se suelen componer utilizando tablas de bordes cero y tablas dentro de tablas. Si nos fijamos en la mayora de las pginas importantes veremos que la tabla se compone a partir de varias tablas. Vamos a fijarnos por ejemplo en el Portal Eresmas . Esta pgina utiliza una tabla para enmarcar la cabecera donde se muestran los Banners y el nombre del Portal. Y la pgina se organiza partiendo de una tabla con tres columnas. Una columna izquierda de color celeste, una columna derecha de color naranja y crema y una gran columna central. Dentro de las columnas podemos ver como se insertan otras tablas con bordes de color.
Veremos un ejemplo de como crear una estructura para una pgina utilizando tablas de borde cero. Partimos de una tabla de dos filas y tres columnas y de Tamao de borde cero
El resultado se muestra a continuacin. As se ver en la vista Normal de FrontPage. Al colocar la pgina web en Internet los visitantes al acceder mediante un navegador no vern esta tabla.
Vamos a unir las celdas de la primera fila dando lugar a una sola celda. Marcamos las celdas que deseamos combinar Pulsamos Combinar celdas
Y el resultado se muestra a continuacin tal como se vera en la vista Normal de FrontPage.
Vamos a definir las caractersticas de la primera celda de la segunda fila. Y deseamos ampliar el tamao de la celda. Marcamos la celda Pulsamos el botn DERECHO del ratn y seleccionamos Propiedades de celda
Vamos a poner la alineacin superior como Propiedad de la celda Pulsamos sobre el cuadradito de especificar alto Y escribimos 150 en el recuadro correspondiente
En la vista Normal de Microsoft FrontPage se mostrara la siguiente imagen
Insertamos una tabla dentro de la primera celda de la segunda fila. En nuestro ejemplo una tabla de dos filas y una columna. Pulsamos Tabla en la Barra superior. Y seleccionamos Insertar y Tabla
Y el resultado se muestra a continuacin. Esta tabla que se muestra a continuacin no se ver en Internet pero es fundamental para insertar de modo ordenado los diferentes elementos de la pgina.
LECCION 26 La Barra Tabla BARRA TABLA Puede que la Barra tabla no se muestre en pantalla. para activarla: Pulsamos Ver en la Barra superior, seleccionamos Barras de herramientas y pulsamos sobre Tablas Nos aparece en pantalla la Barra Tablas en la que tenemos directamente disponibles los Botones para crear y modificar directamente las tablas.
Para crear o insertar una nueva tabla en nuestra pgina pulsamos directamente sobre el botn Dibujar tabla de la Barra Tablas.
El Botn Dibujar tabla nos permite crear directamente una tabla manteniendo pulsado el botn izquierdo del ratn y movindonos hasta que la tabla tenga el tamao deseado.
El resultado es el que se muestra a continuacin
Igualmente podemos dividir el cuadrado en tantas celdas como necesitemos marcando el Botn Dibujar y movindonos entre los lados interiores del cuadrado manteniendo pulsado el botn izquierdo del ratn.
El resultado se muestra en la siguiente imagen. El tipo de lnea y el formato de la tabla puede variar dependiendo de la ltima tabla que creamos y por tanto de las variables que el Cuadro Insertar tabla ha tomado.
Una vez creada una tabla aparecen disponibles el resto de botones de la Barra Tabla y podemos modificarla. En nuestro siguiente ejemplo vamos a dividir una celda Nos situamos en la celda que queremos dividir. Pulsamos el Botn Dividir celdas
Nos aparece en pantalla el Cuadro Dividir celdas. Este cuadro nos permite dividir la celda a lo largo o ancho. En nuestro ejemplo elegimos Dividir en columnas que genera una lnea divisoria vertical.
En la siguiente imagen se puede ver como la ltima celda la hemos dividido en dos mediante una lnea vertical.
Podemos eliminar las lneas de la tabla que sobren utilizando el Botn Borrador
LECCION 27 Analizar el Diseo de las pginas Para aprender sobre el diseo de pginas suele ser interesante visitar las pginas principales. Podemos ver como se ha realizado la composicin de una pgina pulsando la opcin Modificar con FrontPage en nuestro navegador de Internet. Utilizando el Microsoft Internet Explorer vamos por ejemplo a la pgina de Terra
Pulsamos sobre Archivo en la Barra superior de nuestro navegador Microsoft Internet Explorer Y seleccionamos Modificar con Microsoft Front Page
Este comando nos permite ver como esta construida una pgina. En este caso podemos apreciar la estructura de tablas y tablas dentro de tablas que organizan el texto, las imgenes y los enlaces de la portada de esta web. En algunas pginas esta opcin no es posible.
Para aprender en ocasiones puede ser interesante ver el cdigo Html de las pginas. En la parte inferior izquierda de la pantalla pulsamos sobre la pestaa HTML. En aulafacil se encuentra disponible un curso sobre creacin de pginas web programando directamente en HTML.
LECCION 28 Las pginas con Marcos MARCOS Los marcos nos permiten dividir la pgina en varias partes que se pueden mover independientemente. Pulsamos Archivo en la Barra superior Seleccionamos Nuevo y pgina
Aparece en pantalla el Cuadro Nuevo. Pulsamos sobre la pestaa Pginas de marcos. Podemos elegir entre varios tipos de pginas con marcos. En nuestro ejemplo seleccionamos el primer tipo que divide la pgina en una columna ms delgada a la izquierda y en una mucho ms ancha el resto. En nuestro ejemplo pulsamos sobre Contenido.
Nos aparece el nuevo formato de la pgina. Pulsamos Nueva pgina para crear el contenido de la columna de la izquierda o si tenemos ya una pgina que nos pueda servir pulsamos Establecer pgina inicial Igualmente pulsamos Nueva pgina o Establecer pgina inicial para construir la otra parte de la pgina.
LECCION 29 Corregir la Ortografa

ORTOGRAFIA Una vez realizada la pgina es recomendable realizar una revisin de la ortografa para evitar faltas o errores en el texto. Pulsamos Herramientas en la Barra superior Y pulsamos sobre Ortografa
Otra opcin es pulsar directamente sobre el Botn Ortografa de la Barra Estndar
Nos aparece el Cuadro Ortografa. En nuestro ejemplo hemos escrito comprovar en vez de comprobar.
Pulsamos Cambiar si aceptamos la sugerencia del programa. En nuestro ejemplo cambiaremos comprovar por comprobar. Pulsamos Omitir si preferimos dejar la palabra tal como la escribimos.
Una opcin interesante de FrontPage es tener activado todo el tiempo el corrector ortogrfico Pulsamos Herramientas en la Barra superior. Seleccionamos Opciones de pgina
Aparece el Cuadro Opciones de pgina. Marcamos Comprobar la ortografa al escribir.
Si tenemos activado comprobar la ortografa al escribir el programa nos muestra subrayadas en rojo las palabras que pueden ser faltas de ortografa. Si escribimos por ejemplo comprovar en vez de comprobar el programa nos lo seala
LECCION 30 Poner un enlace para enviar Correos electrnicos
Si queremos poner una direccin de correo electrnico en nuestra pgina de forma que al pulsarla se active el correo para que nos escriban los que nos visitan podemos poner un enlace. Escribimos el texto que deseamos mostrar en la pgina. Tambin podemos insertar una imagen. Marcamos el texto o la imagen
Pulsamos Insertar en la Barra superior Pulsamos Hipervnculo.
Nos aparece el Cuadro Crear hipervnculo Pulsamos sobre el Botn que muestra un sobre amarillo.
El botn que muestra un sobre amarillo es el botn que nos permite establecer un hipervnculo que enva un correo
Aparece en pantalla el Cuadro Crear hipervnculo de correo electrnico
En el recuadro escribimos la direccin de correo en la que recibiremos los correos de los visitantes de la pgina.
Pulsamos Aceptar y en el Cuadro Crear hipervnculo otra vez Aceptar Si pulsa sobre el enlace donde pone ESCRIBIR AL WEBMASTER puede comprobar el resultado del enlace. ESCRIBIR AL WEBMASTER
LECCION 31 Las vistas en FrontPage
Un sitio web, suele tener mas de una pagina web. En esta leccin veremos como crear un sitio de mltiples paginas con FrontPage. Para empezar a crear una pgina slo tenemos que pulsar en Archivo, nuevo y Pgina
Pero si queremos crear un sitio con mas de una pagina FrontPage pone a nuestra disposicin toda su potencia para facilitarnos la tarea Por ejemplo con las vistas. A la izquierda de la pantalla veremos la lista de vistas. Esta lista nos ofrece distintas formas de ver los archivos que utilizamos con el programa FrontPage
La primera de las vistas es "Pgina", desde esta vista modificamos cada una de las paginas web La segunda es la vista de "Carpetas", en esta vista se muestra el directorio donde se guardan los archivo creados con FrontPage
La Tercera vista es la vista "Informes", aqu es donde se archivan los informes que genera FrontPage con los datos sobre el estado del sitio La Cuarta vista, es la de "Exploracin". En esta vista organizaremos todas las paginas web para formar un sitio
La vista "Hipervnculos" nos muestra los textos o grficos que , al pulsar sobre ellos llevan al visitante a otra pgina, Por ltimo la vista "Tareas". En ella anotaremos todas las cosas que hay por hacer, su mxima utilidad se obtiene en el trabajo en grupo.
LECCION 32 Las plantillas de Sitios
Un sitio web es una forma de relacionar paginas web entre ellas. Pero la complejidad del mantenimiento del sitio aumenta con el numero de paginas y elementos que incorpora. Por eso FrontPage nos ayuda con las plantillas a la hora de disear el mejor sitio para nuestras necesidades. Para crear una web. Pulsaremos en archivo, en la barra superior , seleccionaremos Nuevo y por ultimo pulsaremos en la instruccin "Web" del men desplegado
Se abrir un cuadro de dialogo en el que podremos elegir entre las plantillas disponibles Estas plantillas son Web de una pgina: no necesita mas explicacin, su nombre lo dice todo
Asistente para importar al web: nos ensea paso a paso como hacer un sitio web a partir de paginas que no se hayan creado con FrontPage Asistente para presencia corporativa: Nos ayuda a crear un sitio complejo, con muchas paginas que puede ser utilizadas como un sitio de empresa
Asistente para Web de discusin: En este sitio, los visitantes podrn hacer preguntas y ser contestados. Web de proyecto: Esta es una plantilla para crear un sitio muy especializado. Dirigido a la creacin de proyectos. Web de soporte al cliente: Este tipo de sitio incluye formularios donde los cliente podrn aportar informacin a la empresa Web personal: Es una plantilla para crear un sitio con cuatro paginas para dar a conocer tu perfil personal Y por ltimo, el web vaco, no tiene ninguna pagina, esta vaco Nosotros pulsaremos en Web personal para tener un primer contacto con ella.
LECCION 33 Creacin de un sitio
En la leccin anterior aprendimos a utilizar las plantillas para crear un sitio web. En esta leccin aprenderemos a aadir paginas a un sitio predefinido. Una vez que tengamos activa la plantilla de sitio web personal. Pulsaremos en vista de "Exploracin " de la lista de vistas de FrontPage
Al pulsar en la vista "Exploracin", veras que en la zona de la derecha, se crean dos ventanas, en la primera de ellas, se muestra una lista de carpetas en las que vemos las carpetas y todas las paginas. Y en la ventana de la derecha vemos un esquema que muestra como las paginas se relacionan unas con otras
Podemos aadir paginas al sitio, simplemente pulsando el icono "Nueva pgina" de la barra de herramientas
Observa que la "Pagina nueva" se enlaza directamente con aquella que estuviera activa cuando pulsramos el icono de "Nueva pagina"
Podemos aadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna limitacin.
LECCION 34 Nombrar pginas
En la leccin anterior aprendimos a utilizar las plantillas para crear un sitio web. En esta leccin aprenderemos a aadir paginas a un sitio predefinido. Una vez que tengamos activa la plantilla de sitio web personal. Pulsaremos en vista de "Exploracin " de la lista de vistas de FrontPage
Al pulsar en la vista "Exploracin", veras que en la zona de la derecha, se crean dos ventanas, en la primera de ellas, se muestra una lista de carpetas en las que vemos las carpetas y todas
las paginas. Y en la ventana de la derecha vemos un esquema que muestra como las paginas se relacionan unas con otras
Podemos aadir paginas al sitio, simplemente pulsando el icono "Nueva pgina" de la barra de herramientas
Observa que la "Pagina nueva" se enlaza directamente con aquella que estuviera activa cuando pulsramos el icono de "Nueva pagina"
Podemos aadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna limitacin.
LECCION 35 Modificacin de la estructura
Podemos modificar la estructura de un sitio despus de que la hayamos definido. FrontPage nos facilita mucho la tarea, solo tendremos que estar en la vista de "Exploracin" y seleccionar la pgina que queremos mover.
Una vez que la tengamos seleccionada, simplemente tenemos que arrastrar la pagina, con el botn del ratn pulsado hasta que se vincule a la nueva posicin
Pero FrontPage nos permite, adems de mover paginas, eliminarlas de forma sencilla. Simplemente marcaremos la pgina que queremos borrar y pulsaremos el botn derecho del ratn. En el men emergente seleccionaremos la instruccin "Eliminar"
La vista exploracin quedara como en la imagen de abajo.
Pero eliminar una pagina de la vista no significa que hayamos borrado el fichero. El fichero sigue existiendo en el directorio, y podemos aadirlo al sitio, simplemente arrastrndolo hasta su nueva posicin
LECCION 36 Temas
Si tenemos varias paginas en un sitio, lo ms usual es que todas las paginas guarden cierta coherencia, para ello FrontPage pone a nuestra disposicin los temas Podemos acceder a los temas, desde el men formato pulsando en la instruccin Tema.
Al pulsar en la instruccin Tema. Se nos abre un cuadro de dialogo en el que podemos elegir de entre una lista predefinida los distintos temas que podemos aplicar a nuestras pginas.
Podemos personalizar los temas desde la opcin "Modificar" en el mismo cuadro de dialogo, desde estas opciones podemos cambiar los colores, los grficos o el formato del texto de cada tema, para hacerlo mas personal
Una vez que hayamos acabado, pulsaremos aceptar y en la ventana de las vistas, podemos ver el resultado final de nuestro tema, haciendo doble clic sobre cualquier pgina. En la imagen inferior podemos ver como queda nuestra pagina principal tras aplicarle el tema.
LECCION 37 Los bordes compartidos
Los bordes compartidos son paginas web que se aaden al borde de todas las paginas del sitio. Es una de las herramientas mas usadas para la exploracin de las paginas en Internet. Para aplicarla a nuestras paginas, deberemos desplegar el men formato y pulsar la instruccin "bordes compartidos"
Este es el cuadro de dilogo de la instruccin bordes compartidos, en este cuadro podemos indicar si queremos aplicar estos bordes a todas las paginas del sitio o solo a algunas de ellas.
Tambin podemos seleccionar cuantos bordes queremos activar, lo normal es activar el superior y el izquierdo, pero FrontPage nos da la oportunidad de incluir bordes en todos los lados. Una vez que pulsemos aceptar, volveremos a la vista en la que estuviramos y pulsando en cualquier pagina podemos ver el resultado.
En los mrgenes podemos sustituir el texto por el contenido que nosotros queramos introducir, Es importante saber que las modificaciones que hagamos en los bordes de una de las pginas afectaran a todas las paginas a la que hayamos aplicado el borde. Si queremos aplicar distintos bordes a varias pginas, deberemos elegir la opcin seleccionar pginas y repetir la operacin con cada grupo de pginas
LECCION 38 Importar documentos de Office
Una de las principales ventajas de Internet es poder compartir nuestro trabajo con el resto del mundo. La mayor parte de las veces tenemos nuestros trabajos en formatos de Word, de Excel, de Access o PowerPoint. FrontPage nos permite, de una manera sencilla, compartir nuestros documentos de Office con el resto del mundo. Para ello solo tenemos que importarlos. Desplegamos el men Archivo y pulsamos en la instruccin "Importar"
En el siguiente cuadro de dilogo, agregaremos los archivos que queramos, en el caso de que estn todos agrupados en una carpeta podemos agregar la carpeta al completo con solo un clic
Podemos repetir la operacin todas las veces que deseemos hasta que hayamos agregado todos los archivos que necesitemos.
Cuando pulsemos el boton aceptar, volveremos a la vista original, comprobaremos que hemos agregado los archivos o carpetas, buscndolo en la lista de carpetas. Nosotros agregamos una hoja de calculo de Excel y la encontramos importada en el directorio de nuestro sitio.
Podemos tratarla como un elemento ms. Podemos vincularla a otra pgina simplemente arrastrando el fichero hasta la pgina a la cual vincularemos
LECCION 39 Contador de visitas
FrontPage dispone de ciertos componente diseados para aadir usabilidad a nuestras paginas Uno de estos elementos es el contador de visitas. Esta herramientas nos permitir saber, a nosotros y a cualquiera que visite nuestra pgina, cuantas personas han visitado la pgina hasta ese momento. Desplegaremos el men Insertar, y en el submen Componente, elegiremos la instruccin Contador de visitas
En el siguiente cuadro de dilogo, podremos elegir entre los distintos tipos de contadores el que ms se ajuste a la esttica de nuestras paginas
Tambin podemos obtener un contador desde alguno de los sitios que los ofrecen gratuitamente, en ese caso deberemos pulsar la opcin Imagen personalizada Al editar el contador de visitas tenemos la opcin de definir el numero de dgitos que tenga nuestro contador.. 7 dgitos puede contabilizar hasta 9 millones de visitas
Tambien podemos poner el contador a cero, en el caso de que queramos reiniciar la cuenta. Podemos situar el contador en cualquier zona de la pagina. Aunque lo mas usual es situarlo en la zona inferior de la pgina.
LECCION 40 Las Marquesinas
Otro de los componentes de FrontPage son las marquesinas. Las marquesinas presentan un mensaje de texto que se desplaza horizontalmente por la pantalla
Desplegaremos el men Insertar y seleccionaremos Componentes. Y por ltimo pulsaremos en Marquesina.
En el cuadro de dialogo de las propiedades de marquesina, podremos modificar cada uno de sus parmetros
En texto, escribiremos el texto que aparecer desplazndose
En la zona intermedia, podremos definir elementos como la direccin del desplazamiento del texto, o la velocidad con que se desplaza, o si se desplaza o desliza..y por ultimo podremos definir su alineacin con respecto el texto
En la zona inferior podemos definir con exactitud el tamao de la marquesina, tanto en pxel, como en porcentaje. Tambin podemos definir si se repetir el desplazamiento y cuantas veces lo har.
Tambin podemos modificar el color del fondo para que este en consonancia con el resto de la pgina Cuando pulsemos aceptar, podremos comprobar el resultado en la pgina.

Creación y Alojamiento de Páginas Web

Загружено:

Сведения о документе

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Creación y Alojamiento de Páginas Web

Загружено:

Авторское право:

Доступные форматы

Creacin y alojamiento de pginas Web

Puede ver el tema de los Dominios en la siguiente pgina Dominios

terminacin .com y tenerla reservada.

LECCION 2 Creacin de una Pgina Personal gratuita

Pulsamos sobre Crear

Y pulsando Aceptar Si todo va bien aparece un cuadro parecido al siguiente.

LECCION 4 Enviar ficheros al servidor de Internet

Podemos movernos hacia arriba haciendo clic en la flecha superior

LECCION 5 Gestionar el servidor de Internet

CREAR UN DIRECTORIO EN EL SERVIDOR Pulsamos sobre MkDir

SALIR Pulsamos Close Y pulsamos Exit

Y pulsamos dos veces sobre sobre el fichero de Notepad

Y pulsamos Modificar con Microsoft Front Page. Esperamos unos segundos.

Y pulsamos sobre la pestaa HTML que se encuentra en la parte inferior derecha.

Podemos poner el texto en negrilla, en cursiva o subrayado

LECCION 8 PONER COLORES

este texto se pone rojo

LECCION 9 LAS PARTES DE LAS INSTRUCCIONES

LECCION 10 ALINEAR EL TEXTO

EJEMPLO DE CENTRAR <p align="center">centramos el texto</p> centramos el texto

LECCION 11 LINEAS HORIZONTALES

EJEMPLO Lnea de 100 pixels <HR WIDTH=100>

Lnea de 200 pixels <HR WIDTH=200

Lnea de un 50% del ancho del documento <HR WIDTH=50%>

Lnea del 100% del ancho del documento <HR WIDTH=100%>

Lnea con 10 de ancho

LECCION 12 LOS PARRAFOS Y EL CAMBIO DE LINEA

<H2>Encabezamiento grande</H2> Encabezamiento grande

<H3>Encabezamiento menos grande</H3> Encabezamiento menos grande

<H6>Encabezamiento muy pequeo</H6> Encabezamiento muy pequeo

LECCION 14 LAS UTILES TABLAS

<td></td> <td></td> </TR> </Table> Y el resultado.

TAMAO DE LAS COLUMNAS Y MARGENES DE LAS CELDAS DE LAS TABLAS

<td width="50%"></td> </tr> </table>

El resultado que veremos:

<tr> <td width="50%"></td> <td width="50%"></td> </tr> </table>

LECCION 17 PONER ENLACES

LECCION 18 INSERTAR IMAGENES

LECCION 19 INSERTAR IMAGENES ANIMADAS

LECCION 20 ATRIBUTOS RELACIONADOS CON INSERTAR IMAGENES

LECCION 21 PONER UN BOTON O PONER UN ENLACE EN UNA IMAGEN

LECCION 22 ATRIBUTOS DE LA PAGINA O ATRIBUTOS DE "BODY"

Y de los programas pulsamos sobreMicrosoft FrontPage

Resumen multimedia de la leccin 1 ;

LECCION 2 Partes de la pantalla

Resumen multimedia de la leccin 2 ;

LECCION 3 La Barra Estandar. Las opciones comunes y la opcin Deshacer

Resumen multimedia de la leccin 3 ;

Resumen multimedia de la leccin 4 ; LECCION 5 Guardar la pgina y ponerle Ttulo

Pulsamos la opcin Archivo en la Barra superior. Seleccionamos Propiedades

Resumen multimedia de la leccin 5 ;

LECCION 6 El formato de los Prrafos de texto

Resumen multimedia de la leccin 6 ; LECCION 7 El Formato de las letras

Pulsamos Formato en la barra de men Pulsamos sobre Fuente

Y el resultado se muestra en la siguiente imagen

Resumen multimedia de la leccin 7 ;

El Botn Fuente nos permite seleccionar el tipo de letra.Esta letra es verdana

tamao 4 (14 pto)

Pulsando el Botn Negrita el texto queda resaltado

Hemos pulsado el botn cursiva y escrito este texto

Y si pulsamos el botnSubrayado el texto queda sobre una lnea de subrayadoi.

Resumen multimedia de la leccin 8 ;

LECCION 9 Color de Resalte