Está en la página 1de 145

Creación y alojamiento de páginas Web

Para crear páginas Web como AulaFacil.com podemos emplear muy diferentes métodos y programas.

En cualquier caso para tener una página en Internet necesitará:

Crear los ficheros o archivos que componen la Web. Una Web normalmente se compone de un cierto número de páginas. Por ejemplo, esta página del curso, que es un fichero con terminación htm.

Una dirección de Internet. Por ejemplo la dirección 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 página. Algunos Portales permiten la creación y alojamiento de páginas personales directamente en Internet de forma sencilla.

A) LA CREACION DE LOS FICHEROS.

La construcción de las páginas de una Web se suele realizar utilizando diferentes programas editores. Los programas editores permiten la creación de páginas de una forma

Creación y alojamiento de páginas Web Para crear páginas Web como AulaFacil.com podemos emplear muy diferentesDreamweaver . Una buena recomendación es utilizar el programa Dreamweaver para crear los ficheros de la página Web. Las versiones antiguas de Microsoft office tenían un programa para crear páginas web. En AulaFacil dispone de un buen curso sobre creación de páginas Web utilizando Front Page . Otra opción es programar directamente en HTML . . Esta es una opción para los que desean profundizar y comprender el lenguaje que se encuentra detrás de las páginas de Internet. Puede acceder al curso sobre HTML en el siguiente enlace HTML . Este curso facilita comprender el código que se emplea en las páginas B) LA DIRECCION DE INTERNET Existen dos opciones: Tener una dirección propia del tipo www.aulafacil.com . Esto es lo que se denomina una dirección de primer nivel. Utilizar una dirección gratuita que nos proporciona algún Portal de Internet del tipo www.geocities/yosemite/Aqui/lapaginadenacho " id="pdf-obj-0-24" src="pdf-obj-0-24.jpg">

sencilla sin tener que programar cada instrucción del lenguaje Html.

Los diseñadores de páginas web, suelen emplear varios programas para la creación de las páginas. Uno de los favoritos es el Dreamweaver.

Una buena recomendación es utilizar el programa Dreamweaver para crear los ficheros de la página Web.

Las versiones antiguas de Microsoft office tenían un programa para crear páginas web. En AulaFacil dispone de un buen curso sobre creación de páginas Web utilizando Front Page.

Otra opción es programar directamente en

HTML. .

Esta es una opción para los que

desean profundizar y comprender el lenguaje que se encuentra detrás de las páginas de Internet. Puede acceder al curso sobre HTML en el siguiente enlace HTML. Este curso facilita comprender el código que se emplea en las páginas

B) LA DIRECCION DE INTERNET

Existen dos opciones:

Tener una dirección propia del tipo www.aulafacil.com. Esto es lo que se denomina una dirección de primer nivel.

Utilizar una dirección gratuita que nos proporciona algún Portal de Internet del tipo www.geocities/yosemite/Aqui/lapaginadenacho

Puede ver el tema de los Dominios en la siguiente página Dominios

Si desea crear una página personal y no necesita que la Web disponga de una dirección de primer nivel puede crear y alojar su página en alguno de los Portales que ofrecen esta posibilidad.

Algunos Portales que proporcionan alojamiento y facilidades para crear páginas personales son Iespana y Pobladores. Puede ver la explicación en Páginas gratuitas

Para realizar las páginas necesitará seguramente imágenes o Gif y diferentes complementos para darle vistosidad a las páginas. Le recomendamos realizar el curso sobre Buscadores especialmente la parte referida a la búsqueda de programas informáticos.

C) EL ALOJAMIENTO

El alojamiento puede ser gratuito. Normalmente es una opción para páginas personales. Varios Portales en Internet proporcionan alojamiento gratuito con ciertas

restricciones.

Para las empresas lo normal es pagar un alojamiento para sus páginas. Una explicación más 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 opción favorita es utilizar un programa especializado FTP. Puede ver como utilizarlo pulsado sobre el enlace siguiente FTP.

La Dirección de la página. Los Dominios en Internet

Con relación a la dirección de la página tenemos dos primeras opciones:

Si queremos tener nuestra propia dirección. Como por ejemplo Aulafacil.com. Tenemos que pagar el registro.

Otra opción es utilizar un alojamiento gratuito. El alojamiento gratuito tiene ciertas limitaciones por lo que se suele utilizar para páginas personales. Una dirección del

Puede ver el tema de los Dominios en la siguiente página <a href=Dominios Si desea crear una página personal y no necesita que la Web disponga de una dirección de primer nivel puede crear y alojar su página en alguno de los Portales que ofrecen esta posibilidad. Algunos Portales que proporcionan alojamiento y facilidades para crear páginas personales son Iespana y Pobladores . Puede ver la explicación en Páginas gratuitas Para realizar las páginas necesitará seguramente imágenes o Gif y diferentes complementos para darle vistosidad a las páginas. Le recomendamos realizar el curso sobre Buscadores especialmente la parte referida a la búsqueda de programas informáticos. C) EL ALOJAMIENTO El alojamiento puede ser gratuito. Normalmente es una opción para páginas personales. Varios Portales en Internet proporcionan alojamiento gratuito con ciertas restricciones. Páginas gratuitas Para las empresas lo normal es pagar un alojamiento para sus páginas. Una explicación más detallada la puede encontrar e n Alojamiento 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 opción favorita es utilizar un programa especializado FTP. Puede ver como utilizarlo pulsado sobre el enlace siguiente FTP . La Dirección de la página. Los Dominios en Internet Con relación a la dirección de la página tenemos dos primeras opciones: Si queremos tener nuestra propia dirección. Como por ejemplo Aulafacil.com . Tenemos que pagar el registro. Otra opción es utilizar un alojamiento gratuito. El alojamiento gratuito tiene ciertas limitaciones por lo que se suele utilizar para pá g inas personales. Una dirección del tip o http://geocities.com/Paris/2226/principal.htm Diferentes Portales proporcionan alojamiento gratuito y una dirección a las páginas personales. Por ejemplo, el Portal Iespana y una posible dirección seri a http://www.iespana.es/aaprender/ REGISTRO DE UN DOMINIO PROPIO Si queremos tener nuestra propia dirección tenemos que buscar un nombre que no este registrado y pagar el registro. Podemos registrar diferentes terminaciones: " id="pdf-obj-1-54" src="pdf-obj-1-54.jpg">

Diferentes Portales proporcionan alojamiento gratuito y una dirección a las páginas personales. Por ejemplo, el Portal Iespana y una posible dirección seriahttp://www.iespana.es/aaprender/

REGISTRO DE UN DOMINIO PROPIO

Si queremos tener nuestra propia dirección tenemos que buscar un nombre que no este registrado y pagar el registro.

Podemos registrar diferentes terminaciones:

La terminación

.com es para las empresas y procede de company

La terminación

.net estaba pensada para las redes.

La terminación

.org se refiere a organization. Organizaciones no lucrativas.

Las marcas de empresas reconocidas, se encuentran protegidas por la legislación. Las empresas que ya tienen direcciones funcionando en Internet se encuentran protegidas por las legislaciones.

Supongamos que deseamos que nuestra página se denomine PedazodePagina.com

Nos vamos por ejemplo a Arsys

Tecleamos el nombre que deseamos registrar. Por ejemplo PedazodePagina

Y pulsamos Enviar

La terminación .com es para las empresas y procede de company La terminación .net estaba pensadaArsys 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 continuación, seguimos las distintas páginas 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 so n Acens Nominalia El registro de dominios con terminación .es podemos realizarlo directamente en Nic Podemos realizar el registro en numerosas páginas. 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 re g istro con las terminaciones para los diferentes países. Por ejemplo en la página de VeriSing Los aspectos legales relacionados con los dominios podemos consultarlos en Dominiuris PAGINAS GRATUITAS Si deseamos tener una página gratuita no necesitamos realizar el registro del dominio. El Portal donde alojemos de forma g ratuita la página será la que nos proporcione la dirección. Por ejemplo si utilizamos Iespana la dirección puede ser http://www.iespana.es/cursocrear/ En cualquier caso si tenemos una empresa es interesante registrar el dominio con la " id="pdf-obj-2-35" src="pdf-obj-2-35.jpg">

Una vez que conseguimos localizar un dominio que este libre y por tanto no registrado, pulsamos Registrar. A continuación, seguimos las distintas páginas 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

El registro de dominios con terminación .es podemos realizarlo directamente en Nic

Podemos realizar el registro en numerosas páginas. 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 países. Por ejemplo en la página de VeriSing

Los aspectos legales relacionados con los dominios podemos consultarlos en Dominiuris

PAGINAS GRATUITAS

Si deseamos tener una página gratuita no necesitamos realizar el registro del dominio. El Portal donde alojemos de forma gratuita la página será la que nos proporcione la dirección. Por ejemplo si utilizamos Iespana la dirección puede ser http://www.iespana.es/cursocrear/

En cualquier caso si tenemos una empresa es interesante registrar el dominio con la

terminación .com y tenerla reservada.

LECCION 2ª Creación de una Página Personal gratuita

En numerosos Portales podemos crear una página personal.

Por ejemplo en Iespana,

Desde la portada. Pulsamos sobre Mi sitio

terminación .com y tenerla reservada. LECCION 2ª Creación de una Página Personal gratuita En numerosos PortalesIespana , Desde la portada. Pulsamos sobre Mi sitio Pulsamos sobre Crear Aparecen las condiciones del contrato. Pulsamos al final de la página Si acepto las condiciones. En la página siguiente ponemos el nombre y los datos del sitio. Por ejemplo aaprender y un título por ejemplo "los mejores cursos". Nos hacemos miembros de I-club dando nuestros datos personales y una dirección de E- mail auténtica. Ahora tenemos que activar nuestro sitio utilizando la clave de activación que recibimos en " id="pdf-obj-3-15" src="pdf-obj-3-15.jpg">

Pulsamos sobre Crear

terminación .com y tenerla reservada. LECCION 2ª Creación de una Página Personal gratuita En numerosos PortalesIespana , Desde la portada. Pulsamos sobre Mi sitio Pulsamos sobre Crear Aparecen las condiciones del contrato. Pulsamos al final de la página Si acepto las condiciones. En la página siguiente ponemos el nombre y los datos del sitio. Por ejemplo aaprender y un título por ejemplo "los mejores cursos". Nos hacemos miembros de I-club dando nuestros datos personales y una dirección de E- mail auténtica. Ahora tenemos que activar nuestro sitio utilizando la clave de activación que recibimos en " id="pdf-obj-3-20" src="pdf-obj-3-20.jpg">

Aparecen las condiciones del contrato. Pulsamos al final de la página Si acepto las condiciones.

En la página siguiente ponemos el nombre y los datos del sitio. Por ejemplo aaprendery un título por ejemplo "los mejores cursos".

Nos hacemos miembros de I-club dando nuestros datos personales y una dirección de E- mail auténtica.

Ahora tenemos que

activar nuestro sitio utilizando la clave de activación que recibimos en

la dirección de E-mail que hemos dado.

Entrando de nuevo a Mi sitio. En la parte superior izquierda de la página se encuentran las herramientas de diseño, Diseña tu sitio .Una forma sencilla de realizar una página es utilizar el Editor HTML.

la dirección de E-mail que hemos dado. Entrando de nuevo a Mi sitio . En laDemasiado Pobladores Ya LECCION 3ª COMO ENVIAR LAS PAGINAS WEB A LOS SERVIDORES CON FTP OBTENER EL PROGRAMA PARA REALIZAR EL ENVIO Las páginas 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 página en un servidor de Internet. Existen diferentes procedimientos para enviar las páginas 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 páginas no comerciales y barato para propósitos comerciales. Podemos bajarnos directamente el programa de la dirección. ftp://ftp1.ipswitch.com/ipswitch/product_downloads/ws_ftple.exe Si quiere saber Cómo bajar el programa Existen varios buenos programas para transferir ficheros que podemos utilizar. Y varias páginas 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 " id="pdf-obj-4-13" src="pdf-obj-4-13.jpg">

Otros sitios que ofrecen espacio gratuito para páginas personales.

Ya

LECCION 3ª COMO ENVIAR LAS PAGINAS WEB A LOS SERVIDORES CON FTP

OBTENER EL PROGRAMA PARA REALIZAR EL ENVIO

Las páginas 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 página en un servidor de Internet.

Existen diferentes procedimientos para enviar las páginas 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.

la dirección de E-mail que hemos dado. Entrando de nuevo a Mi sitio . En laDemasiado Pobladores Ya LECCION 3ª COMO ENVIAR LAS PAGINAS WEB A LOS SERVIDORES CON FTP OBTENER EL PROGRAMA PARA REALIZAR EL ENVIO Las páginas 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 página en un servidor de Internet. Existen diferentes procedimientos para enviar las páginas 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 páginas no comerciales y barato para propósitos comerciales. Podemos bajarnos directamente el programa de la dirección. ftp://ftp1.ipswitch.com/ipswitch/product_downloads/ws_ftple.exe Si quiere saber Cómo bajar el programa Existen varios buenos programas para transferir ficheros que podemos utilizar. Y varias páginas 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 " id="pdf-obj-4-44" src="pdf-obj-4-44.jpg">

El programa WS_FTP es gratuito para estudiantes y páginas no comerciales y barato para propósitos comerciales.

Podemos bajarnos directamente el programa de la dirección.

Si quiere saber Cómo bajar el programa

Existen varios buenos programas para transferir ficheros que podemos utilizar. Y varias páginas 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

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

ordenador <a href=. Cómo 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 Sessión. Esta es la parte que puede dar algún problema. Los datos para rellenar este cuadro los facilita la empresa o web donde hemos decidido alojar nuestra Web. Suelen enviar la información en un E-mail cuando se contrata el servicio hospedaje con las instrucciones para rellenar este cuadro. El ejemplo que mostramos a continuación 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. " id="pdf-obj-5-15" src="pdf-obj-5-15.jpg">

Nos aparece el Cuadro Propiedades de Sessión. Esta es la parte que puede dar algún problema. Los datos para rellenar este cuadro los facilita la empresa o web donde hemos decidido alojar nuestra Web. Suelen enviar la información en un E-mail cuando se contrata el servicio hospedaje con las instrucciones para rellenar este cuadro. El ejemplo que mostramos a continuación 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.

ordenador <a href=. Cómo 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 Sessión. Esta es la parte que puede dar algún problema. Los datos para rellenar este cuadro los facilita la empresa o web donde hemos decidido alojar nuestra Web. Suelen enviar la información en un E-mail cuando se contrata el servicio hospedaje con las instrucciones para rellenar este cuadro. El ejemplo que mostramos a continuación 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. " id="pdf-obj-5-25" src="pdf-obj-5-25.jpg">

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

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 botón en la parte superior en el que si pulsamos aparecen las diferentes carpetas o directorios de nuestro disco duro.

.

LECCION 4ª Enviar ficheros al servidor de Internet ENVIAR PAGINAS DEL DISCO DURO DE NUESTRO ORDENADOR
Podemos movernos hacia arriba haciendo clic en la flecha superior El sistema para movernos por las

Podemos movernos hacia arriba haciendo clic en la flecha superior

Podemos movernos hacia arriba haciendo clic en la flecha superior El sistema para movernos por las

El sistema para movernos por las diferentes carpetas del servidor es el mismo sistema.

Podemos movernos hacia arriba haciendo clic en la flecha superior El sistema para movernos por las

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.

Podemos movernos hacia arriba haciendo clic en la flecha superior El sistema para movernos por las

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 continuación de otro es manteniendo pulsada la flecha deMayúsculas 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.

 
Y pulsamos la flecha que apunta a la derecha tal como se muestra en la siguiente

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 sesión. Para subir únicamente los ficheros que hemos actualizado un truco útil es utilizarDate.

Pulsamos sobre Date. Nos ordena por fechas de actualización. Normalmente los ficheros que hemos actualizado desde el último envío 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.

Y pulsamos la flecha que apunta a la derecha tal como se muestra en la siguiente

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

LECCION 5ª Gestionar el servidor de Internet

CREAR UN DIRECTORIO EN EL SERVIDOR

Pulsamos sobre MkDir

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 símbolos diferentes al alfabeto estándar NorteAmericano.

Y tampoco utilizar acentos, "ñ" o símbolos diferentes al alfabeto estándar NorteAmericano.

 
LECCION 5ª Gestionar el servidor de Internet CREAR UN DIRECTORIO EN EL SERVIDOR Pulsamos sobre MkDir

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

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 información o ficheros valiosos.

Pulsamos sobre Delete

ELIMINAR Marcamos el fichero o el directorio que deseamos borrar. Antes de borrar un directorio debemos

SALIR

Pulsamos Close

Y pulsamos Exit

ELIMINAR Marcamos el fichero o el directorio que deseamos borrar. Antes de borrar un directorio debemos

Alojamiento de páginas

Tenemos una primera opción que hemos comentado anteriormente y es el alojamiento gratuito. Numerosas páginas personales se alojan en Portales que ofrecen espacio gratuito. Este sistema suele tener muchas limitaciones y restricciones. Podemos alojar nuestra página gratis en GratisWeb por ejemplo o en Iespana

Para las Webs de empresas o profesionales lo normal es un alojamiento de pago con una dirección 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 página BuscaHost

Existen proveedores de los Estados Unidos que proporcionan alojamientos a bajo coste de gran capacidad. Aunque las instrucciones suelen estar en idioma inglés. 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 más caros.

Y los servidores que emplean el sistema operativo Unix o Linux y que evitan a Bill Puertas.

Ciertas bases de datos o programas funcionarán en unos servidores pero no en otros. Las empresas de alojamiento suelen especificar en las características técnicas de sus servidores que programas y bases de datos soportan.

El tipo de alojamiento puede ser:

Alojamiento compartido

. Es el más frecuente. A menos que se trate de una página con

muchas, muchas, visitas esta es la opción típica. En este tipo de alojamiento varias páginas 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
Servidor dedicado

. Todo el ordenador es para una página o empresa. Es un sistema más

costoso. Apropiado para empresas con páginas que reciben muchas miles de visitas cada día. Es como tener una vivienda independiente.

Si tiene dudas contrate un alojamiento de bajo coste. En caso de necesitar más recursos, normalmente puede aumentarlos rápidamente comunicándoselo a la empresa de alojamiento. Algunas empresas incluso disponen de sistemas automatizados para solicitar el incremento de los recursos.

TEMARIO

CLASE 1. Comenzamos

Tenemos una primera opción que hemos comentado anteriormente y es el alojamiento gratuito. Numerosas páginas personalesGratisWeb por ejemplo o en Iespana Para las Webs de empresas o profesionales lo normal es un alojamiento de pago con una dirección 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 página BuscaHost Existen proveedores de los Estados Unidos que proporcionan alojamientos a bajo coste de gran capacidad. Aunque las instrucciones suelen estar en idioma inglés. Por ejemplo Yahoo y Linuxwebhost . Para buscar y comparar alojamientos en empresas Norteamericanas podemos hacerlo e n Hostindex 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 más caros. Y los servidores que emplean el sistema operativo Unix o Linux y que evitan a Bill Puertas. Ciertas bases de datos o programas funcionarán en unos servidores pero no en otros. Las empresas de alojamiento suelen especificar en las características técnicas de sus servidores que programas y bases de datos soportan. El tipo de alojamiento puede ser: Alojamiento compartido . Es el más frecuente. A menos que se trate de una página con muchas, muchas, visitas esta es la opción típica. En este tipo de alojamiento varias páginas 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 página o empresa. Es un sistema más costoso. Apropiado para empresas con páginas que reciben muchas miles de visitas cada día. Es como tener una vivienda independiente. Si tiene dudas contrate un alojamiento de bajo coste. En caso de necesitar más recursos, normalmente puede aumentarlos rápidamente comunicándoselo 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 " id="pdf-obj-11-59" src="pdf-obj-11-59.jpg">

CLASE 6. Guardar

CLASE 10. Alinear el Texto

CLASE 13. Poner Titulares

CLASE 14. Las Utiles Tablas

CLASE 17. Poner Enlaces

CLASE 18. Insertar Imágenes

CLASE 19. Imágenes Animadas

CLASE 21. Enlazar una Imagen

CLASE 23. Poner Notas

LECCION 1ª

Para confeccionar una página 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 más avanzado que puede incluir códigos 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"http://www.softonic.com/ En la sección de programación tienes editores gratuitos para descargar. LECCION 2ª Pasos para crear la página web: 1. Abrir el programa editor de texto . 2. Escribir los códigos 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 códigos. Una vez abierto el programa editor de texto voy escribiendo los códigos o "tags" " id="pdf-obj-13-2" src="pdf-obj-13-2.jpg">

Escribimos el nombre del fichero que estoy buscando en este caso Notepad y pulsamos "Buscar Ahora"

Escribimos el nombre del fichero que estoy buscando en este caso Notepad y pulsamos "Buscar Ahora"http://www.softonic.com/ En la sección de programación tienes editores gratuitos para descargar. LECCION 2ª Pasos para crear la página web: 1. Abrir el programa editor de texto . 2. Escribir los códigos 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 códigos. Una vez abierto el programa editor de texto voy escribiendo los códigos o "tags" " id="pdf-obj-13-6" src="pdf-obj-13-6.jpg">

Y pulsamos dos veces sobre sobre el fichero de Notepad

Escribimos el nombre del fichero que estoy buscando en este caso Notepad y pulsamos "Buscar Ahora"http://www.softonic.com/ En la sección de programación tienes editores gratuitos para descargar. LECCION 2ª Pasos para crear la página web: 1. Abrir el programa editor de texto . 2. Escribir los códigos 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 códigos. Una vez abierto el programa editor de texto voy escribiendo los códigos o "tags" " id="pdf-obj-13-10" src="pdf-obj-13-10.jpg">

Existen editores gratuitos en Internet. Por ejemplo en la página de Internet

http://www.softonic.com/ En la sección de programación tienes editores gratuitos para descargar.

LECCION 2ª

Pasos para crear la página web:

1.

Abrir el programa editor de texto

.

 

2.

Escribir los códigos

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 códigos.

Una vez abierto el programa editor de texto voy escribiendo los códigos o "tags"

Las instrucciones, códigos o "tags" de html van entre dos signos < y >. Las instrucciones es indiferente si se escriben en mayúsculas o minúsculas.

Tenemos que poner un código de inicio y uno de cierre.

Ejemplo: Poner texto en negrilla

La instrucción para que un texto se ponga en negrilla es

<b>Soy magnífico</b>

La instrucción de cierre tiene que llevar el signo /

Por lo tanto:

  • A) Ponemos el código de inicio para poner el texto en negrilla

<b>
<b>
  • B) A continuación el texto que queremos que aparezca en negrilla y

  • C) Al final el código de cierre

</b>
</b>

3.

Guardar el fichero
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 extensión htm. html o shtml. Es decir nombre, punto y htm. Por ejemplo miprimerapagina.htm

Es preferible no poner acentos, "ñ" ni simbolos extraños 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 cuestión.

Una vez guardado el fichero podemos ver como queda utilizando el mismo programa con el que ve esta página. El resultado cuando veamos con el navegador el documento será

Soy magnífico

Puede ver como quedaría el fichero pulsando el enlace miprimerapagina. Para volver pulse Atrás en su navegador

Las instrucciones, códigos o "tags" de html van entre dos signos < y >. Las instruccionesmiprimerapagina.htm Si utiliza una versión avanzada de Internet Explorer, puede ver los códigos de la página. Una vez que este en miprimerapagina pulse en la Barra superior: Pulsamos Archivo " id="pdf-obj-14-49" src="pdf-obj-14-49.jpg">

Si utiliza una versión avanzada de Internet Explorer, puede ver los códigos de la página. 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 Modificar con Microsoft Front Page. Esperamos unos segundos. Y pulsamos sobre la pestaña HTML

Y pulsamos sobre la pestaña HTML que se encuentra en la parte inferior derecha.

Y pulsamos Modificar con Microsoft Front Page. Esperamos unos segundos. Y pulsamos sobre la pestaña HTML

LECCION 3ª

 

Vamos a realizar nuestra primera página utilizando los códigos html que denominaremos "La Primera" y en la que aparezca escrito "soy un fenómeno"

 

Tenemos que crear un fichero en el que podremos las instrucciones y lo guardamos como fichero con terminación .htm

A)

Todas las páginas html comienzan con el código de inicio <html> y terminan con el código

</html>

 

<html>

Así que ponemos

</html>

B)

Las páginas 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 página (paso A) por lo tanto nos queda

<html>

<head>

</head>

</html>

LECCION 5ª

D)

Le ponemos título a la página con la instrucción <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 fenómeno"

. La instrucción para negrilla es <b> y

<b/>. Y el texto hay que colocarlo dentro del cuerpo (entre body y body) de la página.

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 terminación html

B)

Guardarlo como documento de TEXTO (para que no se incluyan otros códigos)

C)

Para evitar problemas es interesante que en el nombre del fichero, NO DEJAR ESPACIOS y

NI PONER SIGNOS NO COMUNES como acentos, "ñ", o símbolos de distintos idiomas.

LECCION 7ª DAR FORMATO A LAS LETRAS Cambiar los atributos de las letras utilizamos el comando

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 tamaño son atributos del elemento tipo de letra.

Podemos dar distintos atributos a las letras.

A) TAMAÑO DEL TEXTO

* Si queremos poner las letras de distinto tamaño empleamos el atributo

SIZE="".

* Dentro de las comillas pondremos "+" para aumentar el tamaño y "-" para disminuirlo

EJEMPLO 1

<FONT SIZE="+1">este texto se ve con mayor tamaño</FONT>

El resultado:

este texto se ve con mayor tamaño

EJEMPLO 2

Si queremos aun mayor tamaño ponemos un número 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 tamaño ponemos -1

<FONT SIZE="-1">al poner -1 disminuye el tamaño</FONT>

Al poner -1 disminuye el tamaño

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 instrucción para poner color a las letras es

<FONT COLOR="entre estas comillas va el nombre o el número 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 códigos 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 instrucción

. Es la palabra que va después del signo <.

Por ejemplo <font es un elemento. En este caso el elemento es el tipo de letra. La instrucción por tanto se refiere al tipo de letra.

B)

El atributo
El atributo

. El tamaño 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

Atributo

Valor

<FONT

COLOR=

"RED">

Otro ejemplo, letra tamaño grande

Elemento

Atributo

Valor

<FONT

SIZE=

"+1">

El tag de cierre

</FONT>

</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 línea horizontal es HR

. Este "tag" no necesita un "tag" de

cierre

Y a este elemento podemos darle distintos atributos

  • para definir el largo de la línea con un cierto número de pixel o un porcentaje del

documento>

  • para asignar el ancho de la linea

    • para el fondo de la línea

EJEMPLO

Línea de 100 pixels

<HR WIDTH=100>

Línea de 200 pixels

<HR WIDTH=200

Línea de un 50% del ancho del documento

<HR WIDTH=50%>

Línea del 100% del ancho del documento

<HR WIDTH=100%>

<HR SIZE=10>

<HR SIZE=10> Podemos combinar varios atributos. Por ejemplo línea de un 50% de largo y 10

Podemos combinar varios atributos. Por ejemplo línea 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 párrafo o bloque de texto utilizamos el "tag" <p>aqui

va el texto</p>

 

<p>Si utilizamos la instrucción de párrafo nos aseguramos que el texto se mantenga junto y controlamos cuando queremos que exista una línea de espacio en blanco</p>

Si utilizamos la instrucción de párrafo nos aseguramos que el texto se mantenga junto y controlamos cuando queremos que exista una línea de espacio en blanco

PASAR A LA SIGUIENTE LINEA

<HR SIZE=10> Podemos combinar varios atributos. Por ejemplo línea de un 50% de largo y 10

Cuando queremos pasar el texto a otra línea podemos utilizar el "tag" <br> cierre.

que no tiene tag de

Si queremos separar el siguiente texto en varias líneas.

la casa el perro el niño las vacaciones

Pondremos:

la casa<br>

el perro<br>

el niño<br>

las vacaciones<br>

Y en el documento HTML mostrara en el navegador:

la casa

el perro

el niño

las vacaciones

LECCION 13ª PONER TITULARES

Los titulares o encabezamiento de los textos son otra forma de modificar el tamaño del texto.

La orden para encabezamiento es "H1" para un titular muy grande, "H2" para uno grande, H3,

H4, H5 y para letra pequeña 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 pequeño</H6>

Encabezamiento muy pequeño

LECCION 14ª LAS UTILES TABLAS

Las páginas 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 página web se utilizan tablas con bordes ocultos. La

mayoría de las páginas 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"
border="0"

. Si queremos un borde

visible asignamos otro número al atributo borde. Nosotros en el primer ejemplo vamos a utilizar

un borde visible border="1"

 

C)

Definimos el tamaño de la tabla

. Podemos definirlo como porcentaje del ancho de la página

utilizando

width

 

WIDTH="100%" nos genera una tabla que ocupa todo el ancho de la página que estamos creando.

WIDTH="50%" genera una tabla con la mitad del ancho del documento que creamos.

Podemos igualmente definir el tamaño de la tabla en número de pixel

WITH="100" ahora al no poner el % serán 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 tamaño 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 mayúsculas o minúsculas. 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 continuación.

<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ª

TAMAÑO DE LAS COLUMNAS Y MARGENES DE LAS CELDAS DE LAS TABLAS

FIJAR EL TAMAÑO DE LAS COLUMNAS

El mismo atributo utilizado para definir el tamaño de la tabla se utiliza para definir o fijar el tamaño de las columnas.

Definimos el tamaño 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 márgenes 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 número"

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 página.

  • B) Las celdas con un margen de 15 píxeles y el tamaño de las celdas un 10% del tamaño de la

tabla la primera columna, un 20% del tamaño de la tabla la segunda columna y un 70% del

tamaño de la tabla la tercera columna.

  • C) Pondremos dentro de las celdas las letras a,b,c,d,e,f

Quedaría

<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

a

b

c

d

e

f

LECCION 16ª EL COLOR DE LAS TABLAS

Para ponerle color a una celda utilizamos el atributo bgcolor="aqui ponemos el nombre o número del color"

EJEMPLO

Vamos a realizar una tabla de dos filas y dos columnas, con borde de tamaño "1" y de largo el 50% del ancho de página. 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:

<td width="50%"></td> </tr> </table> El resultado que veremos: COLOR DEL FONDO DE LA TABLA Para darle

COLOR DEL FONDO DE LA TABLA

Para darle color a toda la tabla es suficiente con poner el atributo bgcolor"" dentro de la instrucción 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>

<td width="50%"></td> </tr> </table> El resultado que veremos: COLOR DEL FONDO DE LA TABLA Para darle

LECCION 17ª PONER ENLACES

Lo más característico de Internet es ser un medio que no es lineal sino hipertexto es decir que utiliza enlaces para movernos entre distintos niveles o páginas.

La instrucción para un enlace es de la forma <A HREF="aqui ponemos la dirección a la que queremos que apunte el enlace">el texto que queremos que se vea en el documento</A>

EJEMPLO

Queremos enlazar con la página 100mejores.com y que el texto que se vea sea "La mejor selección de enlaces"

<A HREF="http://www.100mejores.com/">La mejor selección de enlaces"</A>

Recordar que los enlaces externos a otras páginas deben llevar la dirección completa de la página.

LECCION 18ª INSERTAR IMAGENES

Para insertar imágenes utilizamos <imgsrc="aquí ponemos la dirección de la imagen">

Este tag no tiene tag de cierre.

En Internet tenemos numerosas páginas que proporcionan imágenes gratis. Por ejemplo

Nos vamos a gifmania para obtener una imagen de una ejecutiva

Seleccionamos mujeres y ejecutivas.

Nos situamos sobre la imagen y pulsamos el botón DERECHO

Lo más característico de Internet es ser un medio que no es lineal sino hipertexto esLa mejor selección de enlaces Recordar que los enlaces externos a otras páginas deben llevar la dirección completa de la página. LECCION 18ª INSERTAR IMAGENES Para insertar imágenes utilizamos <imgsrc="aquí ponemos la dirección de la imagen"> Este tag no tiene tag de cierre. En Internet tenemos numerosas páginas que proporcionan imágenes 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 botón DERECHO " id="pdf-obj-28-32" src="pdf-obj-28-32.jpg">

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.

Lo guardamos con el nombre de fichero ejecutiva y guardar como tipo de fichero GIF. Podemosg imos una imagen animada para enlazar. Por ejemplo en la misma página d e http://www.gifmania.com/ Seleccionamos una imagen animada " id="pdf-obj-29-4" src="pdf-obj-29-4.jpg">

Si lo guardamos en el MISMO directorio que el fichero HTML que estamos creando la instrucción para insertar la imagen de la ejecutiva nos queda:

<imgsrc="ejecutiva.gif">

Lo guardamos con el nombre de fichero ejecutiva y guardar como tipo de fichero GIF. Podemosg imos una imagen animada para enlazar. Por ejemplo en la misma página d e http://www.gifmania.com/ Seleccionamos una imagen animada " id="pdf-obj-29-10" src="pdf-obj-29-10.jpg">

Es MUY IMPORTANTE tener cuidado con las direcciones de la imágenes. Si las imágenes están en un directorio y el fichero html que estamos creando en otro directorio, la dirección de la imagen debe indicar la localización de la imagen en el otro directorio.

Cuando hemos puesto imágenes 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 imágenes.

B) Al enviarlo al servidor la dirección donde el programa busca la imagen es distinta de donde realmente esta la imagen. Para comprobar si donde esta la imagen coincide con la dirección que tiene la página nos colocamos sobre la imagen (o sobre donde debería estar) y pulsando el botón 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 dirección de la imagen no coincida con la localización de la imagen.

LECCION 19ª INSERTAR IMAGENES ANIMADAS

Para insertar imágenes animadas se hace todo igual que para insertar imágenes. Simplemente elegimos una imagen animada para enlazar. Por ejemplo en la misma página dehttp://www.gifmania.com/

Seleccionamos una imagen animada

La guardamos con el nombre ejecutivaanimada La instrucción para insertar la imagen queda: <imgsrc="ejecutivaanimada.gif"> Y el

La guardamos con el nombre ejecutivaanimada

La instrucción para insertar la imagen queda:

<imgsrc="ejecutivaanimada.gif">

Y el resultado

La guardamos con el nombre ejecutivaanimada La instrucción para insertar la imagen queda: <imgsrc="ejecutivaanimada.gif"> Y el

LECCION 20ª ATRIBUTOS RELACIONADOS CON INSERTAR IMAGENES

Para una correcta visualización 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 situándonos sobre la imagen y pulsando el botón DERECHO del ratón seleccionar "Propiedades"

La instrucción quedaría

<imgsrc="ejecutivaanimada.gif" WIDTH="167" HEIGHT="109">

EL BORDE DE LAS IMAGENES Podemos ponerle borde a la imagen empelando el atributo border y

EL BORDE DE LAS IMAGENES

Podemos ponerle borde a la imagen empelando el atributo border y asignándole un valor por ejemplo 2. Si no queremos borde podemos poner border=0

<imgborder="2" src="ejecutivaanimada.gif" WIDTH="167" HEIGHT="109" >

EL BORDE DE LAS IMAGENES Podemos ponerle borde a la imagen empelando el atributo border y

Es posible y recomendable poner un texto para cuando no aparezca la imagen por algún 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 más largo y menos alto y con el texto alternativo "secretaria animada"

<img border="5" src="ejecutivaanimada.gif" WIDTH="250" HEIGHT="90" ALT="secretariaanimada">

EL BORDE DE LAS IMAGENES Podemos ponerle borde a la imagen empelando el atributo border y

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

Si queremos poner un botón o una imagen que al pulsarla el usuario se encamine a otra página, utilizamos la orden para poner enlaces combinada con la orden para insertar imágenes.

<a href="dirección del enlace a otra página"><imgsrc="aquí ponemos la localización de la imagen"></a>

Vamos a poner la imagen de la secretaria y que al pulsarla lleve al usuario al portal de secretarias

La instrucción nos quedaría:

<ahref="http://www.secretariaplus.com"><imgsrc="ejecutivaanimada.gif"></a>

Y se vera al acceder con el navegador a la página. De forma que al pulsar sobre la imagen nos dirigimos a la página 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 páginas de nuestra web o externas.

OTRO EJEMPLO

Insertamos una imagen que al pulsarla nos sitúa en la portada de aulafacil

<a href="http://www.aulafacil.com"><img border="0" src="HOMEWHT.gif" width="90"

height="70"></a>

Si queremos poner un botón o una imagen que al pulsarla el usuario se encamine ahttp://www.secretariaplus.com La instrucción nos quedaría: <ahref="http://www.secretariaplus.com"><imgsrc="ejecutivaanimada.gif"></a> Y se vera al acceder con el navegador a la página. De forma que al pulsar sobre la imagen nos dirigimos a la página 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 páginas de nuestra web o externas. OTRO EJEMPLO Insertamos una imagen que al pulsarla nos sitúa 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> " id="pdf-obj-32-28" src="pdf-obj-32-28.jpg">

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 añadirle una serie de atributos de color para asignar un color diferente:

  • A) Al fondo del documento con

BGCOLOR
BGCOLOR
  • B) Colocar una imagen de fondo

BACKGROUND
BACKGROUND
LINK
LINK
  • C) para cambiar el color de los enlaces

VLINK
VLINK
  • D) para cambiar el color de los enlaces ya visitados por el usuario

  • E) Podemos cambiar el color del texto con el atributo

TEXT
TEXT

EJEMPLO

Asignaremos un fondo de color amarillo al documento

<html>

<head>

</head>

<body bgcolor=yellow>

</body>

</html>

Nos quedará el fondo de la página en amarillo.

TEMARIO

CLASE 4. Cortar y Copiar

CLASE 36. Temas

CLASE 40. Las Marquesinas

LECCION 1ª Abrir el programa

Tenemos varias opciones para abrir el programa. Una posibilidad es partir del botón Inicio.

Pulsamos el botón 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

CLASE 35 . <a href=Modificación 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 botón Inicio. Pulsamos el botón Inicio que se encuentra en la esquina inferior izquierda de la pantalla Y del menú que aparece pulsamos sobre Programas Y de los programas pulsamos sobre Microsoft FrontPage Aparece el programa mostrando una serie de Barras y una zona en blanco donde podemos escribir. " id="pdf-obj-35-41" src="pdf-obj-35-41.jpg">
CLASE 35 . <a href=Modificación 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 botón Inicio. Pulsamos el botón Inicio que se encuentra en la esquina inferior izquierda de la pantalla Y del menú que aparece pulsamos sobre Programas Y de los programas pulsamos sobre Microsoft FrontPage Aparece el programa mostrando una serie de Barras y una zona en blanco donde podemos escribir. " id="pdf-obj-35-43" src="pdf-obj-35-43.jpg">
CLASE 35 . <a href=Modificación 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 botón Inicio. Pulsamos el botón Inicio que se encuentra en la esquina inferior izquierda de la pantalla Y del menú que aparece pulsamos sobre Programas Y de los programas pulsamos sobre Microsoft FrontPage Aparece el programa mostrando una serie de Barras y una zona en blanco donde podemos escribir. " id="pdf-obj-35-45" src="pdf-obj-35-45.jpg">

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

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 lección 1ª ;

LECCION 2ª Partes de la pantalla Las Barras que el programa muestra en pantalla pueden variar

LECCION 2ª Partes de la pantalla

Las Barras que el programa muestra en pantalla pueden variar dependiendo de las que estén 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.

Y marcamos la Barra que deseamos que se muestre en la pantalla. Las Barras marcadas son

En la parte superior de la pantalla se muestra principales funciones del programa

la Barra de Menús

desde la que se accede a las

Y marcamos la Barra que deseamos que se muestre en la pantalla. Las Barras marcadas son

Pulsando sobre las diferentes opciones nos aparecen los menús. 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 Estándar muestra las funciones comunes con el resto de programas de Microsoft office. En
La Barra Estándar muestra las funciones comunes con el resto de programas de Microsoft office. En

La Barra Estándar

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 características de los párrafos, las letras y la
La Barra de Formato nos permite definir las características de los párrafos, las letras y la

alineación de los elementos.

La Barra Estándar muestra las funciones comunes con el resto de programas de Microsoft office. En

Al iniciar el programa FrontPage la primera vez se muestran las Barras de Menú, la Estándar 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

Nos aparece en pantalla la

Barra Tablas
Barra Tablas

desde la que podemos acceder directamente a las

funciones para dibujar y dar formato a las tablas.

Nos aparece en pantalla la Barra Tablas desde la que podemos acceder directamente a las funciones

LAS VISTAS EN LAS QUE SE MUESTREAN LAS PAGINAS

En la parte inferior de la pantalla se encuentran unas pestañas 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 páginas. Las explicaciones de este curso de FrontPage se desarrollan en esta vista.

Nos aparece en pantalla la Barra Tablas desde la que podemos acceder directamente a las funciones

Pulsando sobre la pestaña HTML el programa nos muestra los códigos que el programa genera al ir construyendo nuestra página

Nos aparece en pantalla la Barra Tablas desde la que podemos acceder directamente a las funciones

Y la pestaña Vista Previa nos permite comprobar como veremos en Internet la página.

MOVER Y CONFIGURAR LAS BARRAS DE HERRAMIENTAS Podemos mover las Barra de herramientas y colocarlas en

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 manteniéndolo pulsado nos movemos a la posición deseada

MOVER Y CONFIGURAR LAS BARRAS DE HERRAMIENTAS Podemos mover las Barra de herramientas y colocarlas en

Podemos colocar las Barras flotantes en medio de la página. Para volverlas a la parte superior colocamos el cursor sobre la Barra y manteniéndo pulsado el cursor nos movemos a la posición superior deseada.

En ocasiones ( por ejemplo cuando dos Barras comparten la misma línea) 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 añadiendo o quitando botones

MOVER Y CONFIGURAR LAS BARRAS DE HERRAMIENTAS Podemos mover las Barra de herramientas y colocarlas en

Resumen multimedia de la lección 2ª ;

MOVER Y CONFIGURAR LAS BARRAS DE HERRAMIENTAS Podemos mover las Barra de herramientas y colocarlas en
LECCION 3ª La Barra Estandar. Las opciones comunes y la opción Deshacer LA BARRA ESTANDAR La

LECCION 3ª La Barra Estandar. Las opciones comunes y la opción Deshacer

LA BARRA ESTANDAR

La Barra Estándar nos permite efectuar las operaciones típicas comunes con otros programas como generar una Nueva página, Abrir un archivo, Guardarlo, Copiar y Pegar

El Botón Nueva página de la Barra Estándar al pulsarlo nos muestra una nueva página en blanco en la que podemos crear desde el principio una página para nuestra web

Si deseamos volver a trabajar en una página que tenemos almacenada en nuestro ordenador pulsamos el botónAbrir. Por tanto utilizamos abrir para editar páginas que ya existen

LECCION 3ª La Barra Estandar. Las opciones comunes y la opción Deshacer LA BARRA ESTANDAR La
LECCION 3ª La Barra Estandar. Las opciones comunes y la opción Deshacer LA BARRA ESTANDAR La

El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o elementos de una parte de la página para colocarlo en otra

El botón Copiar nos permite realizar una copia de la parte del texto o de los elementos marcados con el cursor

El botón Pegar nos permite colocar en el sitio deseado los elementos que previamente hemos copiado

El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o
El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o
El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o

LA OPCION DESHACER

Seguramente una de las opciones más utilizadas y muy de agradecer. Si nos equivocamos pulsamos y retrocedemos, se elimina la última acción realizada

El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o

Pulsando sobre el Menú de Deshacer podemos seleccionar exactamente cuanto queremos retroceder. Las acciones que deseamos deshacer.

El botón Cortar como en otros programas de Microsoft Office nos permite quitar el texto o

Si hemos pulsado Deshacer pero nos arrepentimos tenemos la opción de pulsar el botónRehacer y anular lo que hemos deshecho.

Si hemos pulsado Deshacer pero nos arrepentimos tenemos la opción de pulsar el botón Rehacer y

Resumen multimedia de la lección 3ª ;

LECCION 4ª Cortar y Copiar

CORTAR

El programa FrontPage dispone de las opciones típicas de Cortar, Copiar y Pegar directamente disponibles pulsando los botones de la Barra Estándar.

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 línea nos situamos con el cursor delante de la misma y hacemos Click.

Pulsamos Edición en la Barra superior y seleccionamos Cortar. Otra opción es pulsar directamente el Botón Cortar de la Barra Estándar.

Nos situamos en el punto donde queremos colocar el texto y pulsamosEdición y Pegar o directamente el Botón Pegar

Si hemos pulsado Deshacer pero nos arrepentimos tenemos la opción de pulsar el botón Rehacer y

Otra forma muy rápida y cómoda de Cortar un texto y Pegarlo en otra posición es marcarlo y pulsar el botón DERECHO del ratón. 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 página es:

Marcamos la parte del texto que queremos mover.

Pulsamos Edición en la Barra superior y seleccionamos Copiar. Otra opción es pulsar directamente el Botón Copiar de la Barra Estándar.

Nos situamos en el punto donde queremos colocar el texto y pulsamos Edición y Pegar o directamente el Botón Pegar

BORRAR

Para borrar o eliminar una parte del texto o algún elemento lo marcamos y:

Pulsamos Edición en la Barra superior

Pulsamos Eliminar

BORRAR Para borrar o eliminar una parte del texto o algún elemento lo marcamos y: Pulsamos

SELECCIONAR

Una opción que puede ser interesante cuando queremos cambiar el formato a todo el texto o aplicar alguna otra instrucción sobre toda la página es marcar toda la página.

Pulsamos Edición en la Barra de menú.

Y Seleccionar todo.

BORRAR Para borrar o eliminar una parte del texto o algún elemento lo marcamos y: Pulsamos

Resumen multimedia de la lección 4ª ;

LECCION 5ª Guardar la página y ponerle Título

PROPIEDADES DE LA PAGINA

La opción Propiedades de página nos permite establecer el título de la página, añadir un fondo y establecer los márgenes de la página.

Pulsamos la opción Archivo en la Barra superior.

Seleccionamos Propiedades

PROPIEDADES DE LA PAGINA La opción Propiedades de página nos permite establecer el título de la

Nos aparece el Cuadro Propiedades de Página. Para ponerle un título a la página:

Pulsamos la pestaña General

En el recuadro Título escribimos el nombre que deseamos para la página.

PROPIEDADES DE LA PAGINA La opción Propiedades de página nos permite establecer el título de la

El título de la página 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.

PROPIEDADES DE LA PAGINA La opción Propiedades de página nos permite establecer el título de la

Al ver la página en Internet el título se muestra justo en la parte inferior de la pantalla El título de la página veremos que también podemos ponerlo al guardar el fichero.

PONER FONDO A LA PAGINA

Este Cuadro Propiedades de página nos permite poner un fondo a la página.

Pulsamos la pestaña Fondo

Marcamos la opción Imagen de fondo o Marca de agua

Pulsamos Examinar para buscar y pulsar sobre el fichero que contiene el fondo.

Existen múltiples direcciones en Internet como <a href=COLOR VIVO que disponen de fondos e imágenes gratis para poner en las páginas Web. Para utilizarlas tenemos que: Situar el cursor sobre el fondo o imagen seleccionada Pulsar el botón DERECHO del ratón Seleccionar Guardar imagen como . Y acordarnos en que subdirectorio de nuestro ordenador hemos guardado el fichero. GUARDAR COMO La opción 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 páginas 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 páginas de nuestra web. Pulsamos el botón que muestra una Carpeta amarilla tal como se muestra en la imagen siguiente. " id="pdf-obj-47-2" src="pdf-obj-47-2.jpg">

Existen múltiples direcciones en Internet como COLOR VIVO que disponen de fondos e imágenes gratis para poner en las páginas Web. Para utilizarlas tenemos que:

Situar el cursor sobre el fondo o imagen seleccionada

Pulsar el botón DERECHO del ratón

Seleccionar Guardar imagen como. Y acordarnos en que subdirectorio de nuestro ordenador hemos guardado el fichero.

GUARDAR COMO

La opción Guardar como nos permite ponerle el nombre que deseemos al archivo y seleccionar el tipo de archivo.

Existen múltiples direcciones en Internet como <a href=COLOR VIVO que disponen de fondos e imágenes gratis para poner en las páginas Web. Para utilizarlas tenemos que: Situar el cursor sobre el fondo o imagen seleccionada Pulsar el botón DERECHO del ratón Seleccionar Guardar imagen como . Y acordarnos en que subdirectorio de nuestro ordenador hemos guardado el fichero. GUARDAR COMO La opción 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 páginas 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 páginas de nuestra web. Pulsamos el botón que muestra una Carpeta amarilla tal como se muestra en la imagen siguiente. " id="pdf-obj-47-24" src="pdf-obj-47-24.jpg">

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 páginas 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 páginas de nuestra web.

Pulsamos el botón 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

Y le ponemos un nombre que nos ayude a encontrar nuestros ficheros. En nuestro ejemplo al directorio que creamos para archivar nuestras páginas le llamamos Directorio Para Mi Web. Y pulsamos Aceptar

Y le ponemos un nombre que nos ayude a encontrar nuestros ficheros. En nuestro ejemplo al

EL TITULO DE LA PAGINA

Vimos que podemos ponerle título a la página mediante la función Propiedades de página. También podemos ponerle título a la página al guardar el fichero.

En este mismo Cuadro Guardar como tenemos la posibilidad de cambiar el título de la página. Por defecto el programa pone como título de la primera línea que escribimos. Si comenzamos escribiendo en la página en blanco "LAS MEJORES DIRECCIONES" ese es el nombre que le da.

Para cambiar el título de la página pulsamos Cambiar

Y le ponemos un nombre que nos ayude a encontrar nuestros ficheros. En nuestro ejemplo al

Aparece el Cuadro Establecer título de página. Escribimos el nuevo título que deseamos para nuestra página. En nuestro ejemplo queremos que el nuevo título sea "PAGINA DE PEPE". Y pulsamos Aceptar

Y le ponemos un nombre que nos ayude a encontrar nuestros ficheros. En nuestro ejemplo al

Es interesante poner un título significativo puesto que es el que se mostrara en la parte inferior de la pantalla cuando se vea en Internet. Es el título que se mostrara cuando los Internautas añadan la página a sus Favoritos y el que mostraran algunos buscadores.

En el recuadro Nombre de archivo le ponemos nombre al fichero de la página. En nuestro ejemplo el nombre del archivo de la página es Miprimerapagina.

Para no tener problemas con los navegadores suele se importante que el nombre del fichero no
Para no tener problemas con los navegadores suele se importante que el nombre del fichero no
tenga espacios, ni acentos, ni letras que no estén en el alfabeto norteamericano ni símbolos
raros

Puede que estemos confundidos entre el título de la página y el nombre del fichero. El título o nombre de la página aparece en la parte superior cuando la vemos en Internet. El título de esta página que estas viendo es Aulafácil Curso FrontPage. Otra cosa distinta es el nombre del fichero htm de la página en el caso de esta página el fichero es Lecc-5.htm.

Es interesante poner un título significativo puesto que es el que se mostrara en la parte

ABRIR FICHERO

Para volver a trabajar en una página que tenemos archivada en el ordenador utilizamos la funciónAbrir

Pulsamos Archivo en la Barra superior

Y seleccionamos Abrir

Es interesante poner un título significativo puesto que es el que se mostrara en la parte

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 página donde nos encontramos.

Si el archivo que deseamos abrir se encuentra en otro directorio pulsamos sobre el botón correspondiente

Si el archivo que deseamos abrir se encuentra en otro directorio pulsamos sobre el botón 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 opción para buscar donde hemos almacenado el fichero es pulsar sobre el botón que muestra una carpeta amarilla con una flecha hacia arriba.

Si el archivo que deseamos abrir se encuentra en otro directorio pulsamos sobre el botón correspondiente

Otra opción para volver a trabajar con una de las últimas páginas que hemos guardado en el ordenador es pulsar Archivos recientes y pulsar sobre el archivo que deseamos abrir.

Si el archivo que deseamos abrir se encuentra en otro directorio pulsamos sobre el botón correspondiente

GUARDAR EL FICHERO

La opción Guardar archiva el fichero con el mismo nombre que ya tiene . Es preciso tener cuidado puesto que la nueva versión elimina la versión anterior que tenemos en el ordenador.

Pulsamos Archivo en la Barra superior

Seleccionamos Guardar

Resumen multimedia de la lección 5ª ; LECCION 6ª El formato de los Párrafos de texto

Resumen multimedia de la lección 5ª ;

Resumen multimedia de la lección 5ª ; LECCION 6ª El formato de los Párrafos de texto

LECCION 6ª El formato de los Párrafos de texto

PARRAFO

Cuando escribimos un texto, este se distribuye de forma continua formando un párrafo hasta que pulsamos Enter

Hemos copiado el siguiente párrafo del curso de didáctica para utilizarlo como ejemplo de como se puede dar formato a los párrafos que ponemos en nuestra página Web.

Definimos la educación 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 inclusión del individuo en la sociedad, la transmisión de la cultura y el progreso social. Siendo por tanto, la educación, un proceso social más amplio y de mayor rango que la mera instrucción, que se limita a transmitir destrezas técnicas o teorías científicas.

Marcamos el párrafo al que deseamos dar texto. Tal como se muestra en la siguiente imagen

Definimos la educación como el proceso que tiende a capacitar al individuo para actuar conscientemente frente

Pulsamos la opción Formato en la Barra de menú

Dentro del menú pulsamos sobre Párrafo

Definimos la educación como el proceso que tiende a capacitar al individuo para actuar conscientemente frente

Nos aparece el Cuadro Párrafo. Este cuadro nos permite definir la forma que presentará el párrafo.

Seleccionamos el tipo de Alineación. En nuestro ejemplo seleccionamos alineación izquierda de forma que el párrafo se ajuste al margen izquierdo de la página.

Podemos en este cuadro definir la sangría de forma que el texto se separe una cierta distancia del borde. En nuestro ejemplo ponemos una Sangría en la parte izquierda del texto de 50.

Definimos la educación como el proceso que tiende a capacitar al individuo para actuar conscientemente frente

Y el texto se ajusta a la izquierda y se desplaza como consecuencia de la Sangría tal como se muestra a continuación.

Definimos la educación 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 inclusión del individuo en la sociedad, la transmisión de la cultura y el progreso social. Siendo por tanto, la educación, un proceso social más amplio y de mayor rango que la mera instrucción, que se limita a transmitir destrezas técnicas o teorías científicas.

En el mismo Cuadro de Párrafo podemos hacer que la primera línea del párrafo comience más a la derecha mediante la opción Aplicar sangría a primera línea. En nuestro caso ponemos "50" de forma que la primera palabra "Definimos" comience más a la derecha.

Igualmente podemos definir la distancia entre líneas. En nuestro ejemplo hemos aumentado la distancia entre líneas al Doble seleccionando la opción en Interlineado.

en cuenta la inclusión del individuo en la sociedad, la transmisión de la cultura y el

Y el resultado de la sangría en la primera línea y de aumentar a dos el espacio Interlineal se muestra en el siguiente párrafo.

Definimos la educación 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 inclusión del individuo en la sociedad, la transmisión de la cultura y el progreso social. Siendo por tanto, la educación, un proceso social más amplio y de mayor rango que la mera instrucción, que se limita a transmitir destrezas técnicas o teorías científicas.

SALTO DE LINEA

La opción Salto de línea hace que el siguiente párrafo comience una nueva línea a partir de un cierto punto. En el siguiente ejemplo vamos a dejar la parte marcada en verde en una línea y el resto del párrafo en otra. El marcado en verde no tiene mayor significado en este ejemplo.

En la planificación y puesta en práctica de la metodología docente

. Mediante el establecimiento

de un dialogo con los alumnos sobre la metodología didáctica, las diversas opciones

disponibles y dar ciertas posibilidades de elección al respecto. Proporcionar a los alumnos diversas opciones didácticas y la posibilidad de realizar trabajos voluntarios

Situamos el cursor donde queremos que termine una línea. En nuestro ejemplo después del primer punto y antes de la palabra "Mediante"

Pulsamos Insertar en la Barra superior

Y seleccionamos Salto de línea

Aparece en pantalla el Cuadro propiedades de salto de línea. En nuestro ejemplo seleccionamos Salto de

Aparece en pantalla el Cuadro propiedades de salto de línea. En nuestro ejemplo seleccionamos Salto de línea normal

Aparece en pantalla el Cuadro propiedades de salto de línea. En nuestro ejemplo seleccionamos Salto de

Y el resultado de aplicar la opción Salto de línea al párrafo anterior se muestra a continuación.

En la planificación y puesta en práctica de la metodología docente

. Mediante el establecimiento de un dialogo con los alumnos sobre la metodología didáctica, las

diversas opciones disponibles y dar ciertas posibilidades de elección al respecto. Proporcionar a los alumnos diversas opciones didácticas y la posibilidad de realizar trabajos voluntarios

Resumen multimedia de la lección 6ª ;

LECCION 7ª El Formato de las letras

DAR FORMATO A LAS LETRAS

Para dar formato al texto podemos seleccionar la instrucción por ejemplo negrita y lo siguiente que escribimos va en el nuevo formato hasta que pulsamos de nuevo y desactivamos el formato ..

Otra opción 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 vivía un hidalgo caballero.

Marcamos el texto

Pulsamos Formato en la barra de menú Pulsamos sobre Fuente En el cuadro que aparece seleccionamos

Pulsamos Formato en la barra de menú

Pulsamos sobre Fuente

Pulsamos Formato en la barra de menú Pulsamos sobre Fuente En el cuadro que aparece seleccionamos

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 Tamaño queremos una letra grande y seleccionamos 4es decir 14 puntos de tamaño.

Y queremos las letras en un bonito azul elegante. Para seleccionar color pulsamos sobre el triángulo situado a la derecha del recuadro Color

Pulsamos Formato en la barra de menú Pulsamos sobre Fuente En el cuadro que aparece seleccionamos

Y el resultado se muestra en la siguiente imagen

Y el resultado se muestra en la siguiente imagen Resumen multimedia de la lección 7ª ;

Resumen multimedia de la lección 7ª ;

Y el resultado se muestra en la siguiente imagen Resumen multimedia de la lección 7ª ;

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 Botón Fuente nos permite seleccionar el tipo de letra.Esta letra es verdana

En la Barra de formato podemos seleccionar directamente el tamaño de

letra deseado. Esta letra es

tamaño 4 (14 pto)

Pulsando el Botón Negrita el texto queda resaltado

Hemos pulsado el botón cursiva y escrito este texto

Y si pulsamos el botónSubrayado el texto queda sobre una línea de subrayadoi.

El Botón Fuente nos permite seleccionar el tipo de letra. Esta letra es verdana En la
El Botón Fuente nos permite seleccionar el tipo de letra. Esta letra es verdana En la
El Botón Fuente nos permite seleccionar el tipo de letra. Esta letra es verdana En la
El Botón Fuente nos permite seleccionar el tipo de letra. Esta letra es verdana En la
El Botón Fuente nos permite seleccionar el tipo de letra. Esta letra es verdana En la

Resumen multimedia de la lección 8ª ;

LECCION 9ª Color de Resalte Podemos resaltar un texto o una parte del mismo. Si pulsamos

LECCION 9ª Color de Resalte

Podemos resaltar un texto o una parte del mismo. Si pulsamos el botón Color de Resalte a continuación todo lo que escribimos se muestra resaltado. En algunos navegadores el color de resalte no se muestra.

LECCION 9ª Color de Resalte Podemos resaltar un texto o una parte del mismo. Si pulsamos

Ya he pulsado el botón de resalte

Para eliminar el resalte vuelvo a pulsar para que aparezca el menú. Y selecciono automático

Puedo cambiar el color del resalte Y selecciono por ejemplo el verde para resaltar He pulsado

Puedo cambiar el color del resalte

Puedo cambiar el color del resalte Y selecciono por ejemplo el verde para resaltar He pulsado

Y selecciono por ejemplo el verde para resaltar

Puedo cambiar el color del resalte Y selecciono por ejemplo el verde para resaltar He pulsado

He pulsado resaltar en verde

Otra opción es marcar un trozo del texto que ya tenemos escrito y resaltarlo. Por ejemplo marcamos opción

Puedo cambiar el color del resalte Y selecciono por ejemplo el verde para resaltar He pulsado

Y pulsamos resaltar de forma que el texto anterior nos queda

Otra

opción
opción

es marcar un trozo del texto que ya tenemos escrito y resaltarlo.

Resumen multimedia de la lección 9ª ;

LECCION 10ª La aLineación del texto y la Sangría ALINEAR EL TEXTO Los botones de la

LECCION 10ª La aLineación del texto y la Sangría

ALINEAR EL TEXTO

Los botones de la Barra de formato nos permiten alinear o ajustar el texto a la izquierda.

LECCION 10ª La aLineación del texto y la Sangría ALINEAR EL TEXTO Los botones de la

Pulsamos el Botón 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 vivía un hidalgo caballero.

Pulsamos el Botón Centrar. El texto se justifica desde el centro como vemos en el siguiente ejemplo.

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo vivía un hidalgo caballero.

Pulsamos el Botón Alinear a la derecha y el texto se justifica en relación al borde derecho de la página como vemos en el ejemplo.

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo vivía un hidalgo caballero.

SANGRIA

Partimos del siguiente párrafo.

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo vivía un hidalgo caballero.

Colocamos el cursor sobre el texto que deseamos cambiar.

Pulsamos el Botón Aumentar sangría de la Barra de formato.

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo

Pulsando una vez sobre el Botón el texto se coloca más a la derecha

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo vivía un hidalgo caballero.

Podemos aumentar la sangría el doble pulsando dos veces el botón.

En un lugar de la Mancha de cuyo nombre no quiero acordar no a mucho tiempo vivía un hidalgo caballero.

Resumen multimedia de la lección 10ª ;

Resumen multimedia de la lección 10ª ; LECCION 11ª Ordenar el texto en una Lista LAS

LECCION 11ª Ordenar el texto en una Lista

LAS LISTAS

Voy a elaborar una lista de tareas numeradas

Resumen multimedia de la lección 10ª ; LECCION 11ª Ordenar el texto en una Lista LAS

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 opción Y una cuarta por ejemplo

Y escribo un apartado

Y escribo

Y escribo la tercera opción

Y una cuarta por ejemplo

Pudo cambiar el formato de la lista.

Situo el puntero sobre la lista

Pulso El botón DERECHO del ratón

Selecciono Propiedades de lista

Y escribo un apartado Y escribo Y escribo la tercera opción Y una cuarta por ejemplo

Pulso sobre la pestaña Numeración

Y selecciono el formato deseado. En nuestro caso elegimos numeración romana.

Y escribo un apartado Y escribo Y escribo la tercera opción Y una cuarta por ejemplo

Y la lista queda como se muestra a continuación.

Situo el puntero sobre la lista

Pulso El botón DERECHO del ratón

Selecciono Propiedades de lista

Resumen multimedia de la lección 11ª ;

Pulso El botón DERECHO del ratón Selecciono Propiedades de lista Resumen multimedia de la lección 11ª

LECCION 12ª

Añadir Enlaces

ENLACES A OTRAS PAGINAS DE INTERNET. ENLACES EXTERNOS

Una de las características más típicas de Internet es la posibilidad de pasar de un documento a otro mediante enlaces. Los enlaces, vínculos o links permiten al Internauta desplazarse por la Red. Es conveniente definir para nuestra Web un conjunto de enlaces que sean fáciles de utilizar para los usuarios. una estructura clara de enlaces ayuda a la navegación.

Para añadir un enlace podemos:

Escribimos el texto que deseamos para el hipervínculo y lo marcamos. En nuestro ejemplo escribimos "Las Mejores direcciones de Internet". Este será el texto que se muestre en la página.

Escribimos el texto que deseamos para el hipervínculo y lo marcamos. En nuestro ejemplo escribimos "LasLas Mejores direcciones de Internet ENLACES INTERNOS Poner un enlace entre dos página 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 página el enlace y lo marcamos . Escribimos por ejemplo Siguiente página " id="pdf-obj-65-4" src="pdf-obj-65-4.jpg">

Pulsamos Insertar en la Barra de menú y

Del menú seleccionamos Hipervínculo

Escribimos el texto que deseamos para el hipervínculo y lo marcamos. En nuestro ejemplo escribimos "LasLas Mejores direcciones de Internet ENLACES INTERNOS Poner un enlace entre dos página 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 página el enlace y lo marcamos . Escribimos por ejemplo Siguiente página " id="pdf-obj-65-11" src="pdf-obj-65-11.jpg">

Nos aparece el Cuadro Crear Hipervínculo

Escribimos en el recuadro Dirección URL la dirección de la página a la que lleva el enlace. En nuestro ejemplo hemos escrito la dirección para llegar a la portada de 100mejores.com . Para no cometer equivocaciones con las direcciones de las páginas es aconsejable ir a la página con el programa de navegación que utilicemos y copiar la dirección. Para copiar la dirección la marcamos haciendo doble click sobre la misma y pulsando el botón DERECHO del ratón seleccionamos copiar. Si pulsamos el botón al final del recuadro como muestra la flecha nos aparecen direcciones que hemos visitado recientemente y que podemos seleccionar directamente.

Escribimos el texto que deseamos para el hipervínculo y lo marcamos. En nuestro ejemplo escribimos "LasLas Mejores direcciones de Internet ENLACES INTERNOS Poner un enlace entre dos página 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 página el enlace y lo marcamos . Escribimos por ejemplo Siguiente página " id="pdf-obj-65-19" src="pdf-obj-65-19.jpg">

Pulsamos Aceptar. Y el resultado es un enlace como se muestra a continuación:

ENLACES INTERNOS

Poner un enlace entre dos página 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 página el enlace y lo marcamos. Escribimos por ejemplo Siguiente página

Pulsamos Insertar en la Barra superior

Y pulsamos sobre Hipervínculo

Nos aparece en pantalla el Cuadro Crear Hipervínculo. En la parte central del cuadro aparecen las otras páginas que hemos creado para nuestra web.

Pulsamos sobre el Nombre de la página con la que queremos enlazar.

Pulsamos Insertar en la Barra superior Y pulsamos sobre Hipervínculo Nos aparece en pantalla el Cuadro

Puede que el Cuadro Crear Hipervínculo nos muestre un subdirectorio y tengamos la página que deseamos enlazar en otro subdirectorio.

Pulsamos sobre el Botón de búsqueda como muestra la imagen siguiente

Pulsamos Insertar en la Barra superior Y pulsamos sobre Hipervínculo Nos aparece en pantalla el Cuadro

Aparece un subdirectorio y los diversos archivos del mismo.

Pulsamos sobre el nombre del fichero correspondiente a la página que deseamos enlazar.

Si la página que deseamos enlazar no se encuentra en este subdirectorio podemos ir al subdirectorio donde este pulsando el botón del recuadro Buscar en como se muestra en la siguiente imagen. Otra forma de movernos por los directorios es pulsando el botón con una carpeta amarilla y una flecha hacia arriba que se muestra en la imagen. Este botón nos mueve un directorio hacia arriba.

El enlace de esta página con la siguiente del curso es un ejemplo de enlace interno.

El enlace de esta página 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 página 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 página al pulsar. En nuestro ejemplo al pulsar la página se moverá a la parte superior.

Situamos el Cursor donde deseamos que se muestre la página. En nuestro ejemplo al lado del título de la página.

El enlace de esta página con la siguiente del curso es un ejemplo de enlace interno.

Pulsamos en la Barra superior Insertar y Marcador

El enlace de esta página con la siguiente del curso es un ejemplo de enlace interno.

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 fáciles de localizar.

El enlace de esta página con la siguiente del curso es un ejemplo de enlace interno.

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.

El enlace de esta página con la siguiente del curso es un ejemplo de enlace interno.

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 Hipervínculo

Nos aparece el Cuadro Hipervínculo. Y en la esquina inferior izquierda la opciónMarcador. Pulsamos sobre el Botón de la opción 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

Ahora tenemos que poner un enlace al marcador. Es parecido a poner un enlace. Escribimos unIr hacia arriba Resumen multimedia de la lección 12ª ; " id="pdf-obj-68-20" src="pdf-obj-68-20.jpg">

Y pulsando Aceptar el resultado es el enlace que se muestra a continuación. Pulse en el enlace para comprobar como funciona

Resumen multimedia de la lección 12ª ;

Ahora tenemos que poner un enlace al marcador. Es parecido a poner un enlace. Escribimos unIr hacia arriba Resumen multimedia de la lección 12ª ; " id="pdf-obj-68-30" src="pdf-obj-68-30.jpg">

LECCION 13ª Colocar Imágenes

OBTENER IMAGENES

Lo primero necesitamos una imagen. Podemos crear imágenes utilizando diversos programas de dibujo y de tratamiento de imágenes y fotografías. Además numerosos sitios de Internet proporcionan imágenes de forma gratuita. Hay que tener en cuenta que el resto de las imágenes y del contenido presente en Internet esta protegido por las leyes de Propiedad Intelectual.

El obtener una imagen de una página web que ofrece imágenes de libre disposición es sencillo:

Nos situamos sobre la imagen.

Pulsamos el botón DERECHO del ratón

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.

LECCION 13ª Colocar Imágenes OBTENER IMAGENES Lo primero necesitamos una imagen. Podemos crear imágenes utilizando diversos

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

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

En la parte inferior del cuadro tenemos Nombre de archivo . Podemos ponerle un nuevo Nombre

IMAGENES DE MICROSOFT OFFICE

El programa Microsoft Office dispone de una serie de imágenes que podemos añadir a nuestra página

Pulsamos Insertar en la Barra superior

Seleccionamos Imagen

Y pulsamos sobre Imágenes tal como se muestra a continuación.

Nos aparece el Cuadro Imágenes

Pulsamos sobre la Categoría deseada Y dentro de la categoría deseada pulsamos sobre la Imagen deseada

Pulsamos sobre la Categoría deseada

Y dentro de la categoría deseada pulsamos sobre la Imagen deseada.

Aparece el botón Insertar Clip sobre el que tenemos que pulsar

Pulsamos sobre la Categoría deseada Y dentro de la categoría deseada pulsamos sobre la Imagen deseada

Y el resultado se muestra a continuación. Hemos reducido la imagen. En la página siguiente veremos como se puede ampliar y reducir fácilmente desde FrontPage el tamaño de las imágenes.

AÑADIR UNA IMAGEN GUARDADA EN NUESTRO ORDENADOR Para añadir una imagen a nuestra página seleccionamos Insertar

AÑADIR UNA IMAGEN GUARDADA EN NUESTRO ORDENADOR

Para añadir una imagen a nuestra página seleccionamos

Insertar en la Barra de menús

Seleccionamos Imagen

Y pulsamos Desde archivo para ir a los ficheros de imágenes que tenemos guardados en nuestro ordenador.

AÑADIR UNA IMAGEN GUARDADA EN NUESTRO ORDENADOR Para añadir una imagen a nuestra página seleccionamos Insertar

Otra opción es pulsar directamente el Botón Insertar imagen desde archivo de la Barra Estándar.

AÑADIR UNA IMAGEN GUARDADA EN NUESTRO ORDENADOR Para añadir una imagen a nuestra página seleccionamos Insertar

Nos aparece en pantalla el Cuadro Seleccionar archivo

Pulsamos dos veces sobre el archivo que contiene la imagen tal como se muestra a continuación.

Y como resultado aparece la imagen en nuestra página. Resumen multimedia de la lección 13ª ;

Y como resultado aparece la imagen en nuestra página.

Y como resultado aparece la imagen en nuestra página. Resumen multimedia de la lección 13ª ;

Resumen multimedia de la lección 13ª ;

Y como resultado aparece la imagen en nuestra página. Resumen multimedia de la lección 13ª ;

LECCION 14ª Modificar las Imágenes. Las Imágenes animadas y el Fondo de las páginas

MODIFICAR EL TAMAÑO DE LAS IMAGENES

Podemos aumentar o disminuir el tamaño de una imagen. Para nuestro ejemplo obtenemos una imagen de la página Gifmania

Insertamos la siguiente imagen tal como vimos en la página anterior.

LECCION 14ª Modificar las Imágenes. Las Imágenes animadas y el Fondo de las páginas MODIFICAR ELGifmania Insertamos la siguiente imagen tal como vimos en la página anterior. En nuestro ejemplo aumentaremos el tamaño de la imagen insertada. Pulsamos sobre la imagen . Al pulsar sobre la imagen aparecerán unos puntos o cuadraditos rodeando la imagen. Situamos el cursor sobre uno de los puntos y manteniendo pulsado el botón del ratónnos movemos hacia fuera. Y el resultado se muestra en la siguiente imagen AÑADIR UNA IMAGEN ANIMADA A LA PAGINA " id="pdf-obj-74-11" src="pdf-obj-74-11.jpg">

En nuestro ejemplo aumentaremos el tamaño de la imagen insertada.

Pulsamos sobre la imagen. Al pulsar sobre la imagen aparecerán unos puntos o cuadraditos rodeando la imagen.

Situamos el cursor sobre uno de los puntos y manteniendo pulsado el botón del ratónnos movemos hacia fuera.

LECCION 14ª Modificar las Imágenes. Las Imágenes animadas y el Fondo de las páginas MODIFICAR ELGifmania Insertamos la siguiente imagen tal como vimos en la página anterior. En nuestro ejemplo aumentaremos el tamaño de la imagen insertada. Pulsamos sobre la imagen . Al pulsar sobre la imagen aparecerán unos puntos o cuadraditos rodeando la imagen. Situamos el cursor sobre uno de los puntos y manteniendo pulsado el botón del ratónnos movemos hacia fuera. Y el resultado se muestra en la siguiente imagen AÑADIR UNA IMAGEN ANIMADA A LA PAGINA " id="pdf-obj-74-20" src="pdf-obj-74-20.jpg">

Y el resultado se muestra en la siguiente imagen

LECCION 14ª Modificar las Imágenes. Las Imágenes animadas y el Fondo de las páginas MODIFICAR ELGifmania Insertamos la siguiente imagen tal como vimos en la página anterior. En nuestro ejemplo aumentaremos el tamaño de la imagen insertada. Pulsamos sobre la imagen . Al pulsar sobre la imagen aparecerán unos puntos o cuadraditos rodeando la imagen. Situamos el cursor sobre uno de los puntos y manteniendo pulsado el botón del ratónnos movemos hacia fuera. Y el resultado se muestra en la siguiente imagen AÑADIR UNA IMAGEN ANIMADA A LA PAGINA " id="pdf-obj-74-24" src="pdf-obj-74-24.jpg">

AÑADIR UNA IMAGEN ANIMADA A LA PAGINA

Añadir a nuestra página una imagen animada es igual que añadir una imagen simplemente seleccionamos por ejemplo en Gifmania una imagen animada.

Nos colocamos sobre la imagen animada que deseamos y pulsamos el botón derecho del ratón. Hay que advertir que muchas imágenes y contenidos de Internet como estos cursos de aulafacil cuentan con derechos de autor y no pueden ser copiados.

Añadir a nuestra página una imagen animada es igual que añadir una imagen simplemente seleccionamos porGifmania una imagen animada. Nos colocamos sobre la imagen animada que deseamos y pulsamos el botón derecho del ratón. Hay que advertir que muchas imágenes 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 página Pulsamos el botón Insertar imagen desde archivo Y el resultado se muestra a continuación " id="pdf-obj-75-8" src="pdf-obj-75-8.jpg">

Pulsamos Guardar imagen como

Añadir a nuestra página una imagen animada es igual que añadir una imagen simplemente seleccionamos porGifmania una imagen animada. Nos colocamos sobre la imagen animada que deseamos y pulsamos el botón derecho del ratón. Hay que advertir que muchas imágenes 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 página Pulsamos el botón Insertar imagen desde archivo Y el resultado se muestra a continuación " id="pdf-obj-75-12" src="pdf-obj-75-12.jpg">

Una vez que tenemos el archivo de la imagen en nuestro disco duro la insertamos en nuestra página

Pulsamos el botón Insertar imagen desde archivo

Añadir a nuestra página una imagen animada es igual que añadir una imagen simplemente seleccionamos porGifmania una imagen animada. Nos colocamos sobre la imagen animada que deseamos y pulsamos el botón derecho del ratón. Hay que advertir que muchas imágenes 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 página Pulsamos el botón Insertar imagen desde archivo Y el resultado se muestra a continuación " id="pdf-obj-75-18" src="pdf-obj-75-18.jpg">

Y el resultado se muestra a continuación

MODIFICAR LAS IMAGENES CON LA BARRA DE IMAGENES Para este ejemplo hemos insertado una imagen que

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 página anterior.

MODIFICAR LAS IMAGENES CON LA BARRA DE IMAGENES Para este ejemplo hemos insertado una imagen que

Activamos la Barra Imágenes si no se encuentra ya visible.

Pulsamos Ver en la Barra de menús

Seleccionamos Barras de herramientas

Y marcamos Imágenes

MODIFICAR LAS IMAGENES CON LA BARRA DE IMAGENES Para este ejemplo hemos insertado una imagen que

Nos aparece en pantalla la Barra Imágenes tal como se muestra a continuación

Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a añadir un texto a la

Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a añadir un texto a la imagen.

Y pulsamos el Botón Texto

Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a añadir un texto a la

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 páginas Webs por generar imágenes con pocos Kilobites y por tanto se cargan más rápidamente.

Pulsamos Aceptar

Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a añadir un texto a la

Nos aparece un recuadro donde podemos escribir directamente. En nuestro ejemplo escribimos la palabra TRABAJO. El resultado se muestra a continuación

Marcamos la imagen que deseamos modificar. En nuestro ejemplo vamos a añadir un texto a la

PONER UN FONDO A LA PAGINA

Vimos anteriormente que podemos poner un fondo a la página partiendo del menú Archivo y seleccionando Propiedades de página.

Veremos otro ejemplo de como poner fondo a las páginas y esta vez partimos del menú Formatoy seleccionamos Fondo. El camino es distinto pero el resultado es el mismo.

Nos vamos a una página que ofrece fondos para las páginas de modo libre y gratuito. Por ejemplo COLOR VIVO . Otra página con fondos y gráficos 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 botón DERECHO del ratón.

Seleccionamos Guardar imagen como

Nos vamos a una página que ofrece fondos para las páginas de modo libre y gratuito.COLOR VIVO . Otra página con fondos y gráficos 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 botón DERECHO del ratón. 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 menús Seleccionamos Fondo Nos aparece el Cuadro Propiedades de página Pulsamos sobre la Pestaña Fondo Marcamos en Formato Imagen de fondo Y pulsamos Examinar para buscar donde tenemos guardado el archivo que tiene el fondo " id="pdf-obj-78-15" src="pdf-obj-78-15.jpg">

Una vez que tenemos el archivo correspondiente al fondo en nuestro disco duro:

Pulsamos Formato en la Barra superior o barra de menús

Seleccionamos Fondo

Nos vamos a una página que ofrece fondos para las páginas de modo libre y gratuito.COLOR VIVO . Otra página con fondos y gráficos 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 botón DERECHO del ratón. 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 menús Seleccionamos Fondo Nos aparece el Cuadro Propiedades de página Pulsamos sobre la Pestaña Fondo Marcamos en Formato Imagen de fondo Y pulsamos Examinar para buscar donde tenemos guardado el archivo que tiene el fondo " id="pdf-obj-78-26" src="pdf-obj-78-26.jpg">

Nos aparece el Cuadro Propiedades de página

Pulsamos sobre la Pestaña 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

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

Nos aparecen los directorios y los archivos de nuestro disco duro. Pulsamos dos veces sobre el

Resumen multimedia de la lección 14ª ;

LECCION 15ª La Ubicación. Colocación de texto e imágenes UBICACION La orden Ubicación nos permite distribuir

LECCION 15ª La Ubicación. Colocación de texto e imágenes

UBICACION

La orden Ubicación nos permite distribuir el texto alrededor de una imagen como la siguiente

LECCION 15ª La Ubicación. Colocación de texto e imágenes UBICACION La orden Ubicación nos permite distribuir

Marcamos pulsando con el cursor la imagen que deseamos situar

Pulsamos Formato en la Barra de menús

Y pulsamos sobre Ubicación

LECCION 15ª La Ubicación. Colocación de texto e imágenes UBICACION La orden Ubicación nos permite distribuir

Nos aparece en imagen el Cuadro Ubicación

Pulsamos sobre el tipo de distribución del texto alrededor de la imagen que queremos en nuestro caso seleccionamos Izquierda.

Nos aparece en imagen el Cuadro Ubicación Pulsamos sobre el tipo de distribución del texto alrededor
Nos aparece en imagen el Cuadro Ubicación Pulsamos sobre el tipo de distribución del texto alrededor

La opción Ubicación 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 organización de los textos y las imagenes dentro de las páginas se suele realizar mediante la inclusión dentro de celdas.

En este lado podemos escribir y el texto se queda enmarcado en la celda

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 botón DERECHO del ratón y seleccionamos Propiedades de celda

Quitamos la marca de Especificar ancho. Y pulsamos Aceptar

Nos aparece en imagen el Cuadro Ubicación Pulsamos sobre el tipo de distribución del texto alrededor

Y el resultado es una distribución mejor del texto y la imagen.

En este lado podemos escribir y el texto se queda enmarcado en la celda

En este lado podemos escribir y el texto se queda enmarcado en la celda

Y seleccionando Propiedades de tabla y poniendo el Tamaño de borde a cero. El resultado es una tabla oculta que nos permite distribuir el texto y la imagen tal como se muestra a continuación

En este lado podemos escribir y el texto se queda enmarcado en la celda

En este lado podemos escribir y el texto se queda enmarcado en la celda Y seleccionando

Resumen multimedia de la lección 15ª ;

En este lado podemos escribir y el texto se queda enmarcado en la celda Y seleccionando

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 página.

Pulsamos sobre la imagen. Deben aparecer unos puntos enmarcándola

Queremos que cuando se pulse sobre una imagen y nos desplacemos a otra página. Pulsamos sobre

Y lo siguiente es igual que poner un enlace.

Pulsamos en Insertar del la Barra de menú.

Pulsamos sobre Hipervínculo.

Escribimos la dirección de la página donde queremos que conduzca el enlace.

Pulsamos Aceptar.

Queremos que cuando se pulse sobre una imagen y nos desplacemos a otra página. Pulsamos sobre

En nuestro ejemplo ponemos en el hipervínculo la dirección de aulafacil.com y pulsamos Enteren nuestro teclado o el botón Aceptar del cuadro.

Queremos que cuando se pulse sobre una imagen y nos desplacemos a otra página. Pulsamos sobre

Y podemos comprobar el resultado pulsando sobre la siguiente imagen.

Queremos que cuando se pulse sobre una imagen y nos desplacemos a otra página. Pulsamos sobre

Poner un botón, una flecha o cualquier icono en el que pulsando enlacemos con otra página evidentemente es igual.

Resumen multimedia de la lección 16ª ;

LECCION 17ª Insertar líneas o símbolos AÑADIR UNA LINEA HORIZONTAL El programa FrontPage nos permite añadir

LECCION 17ª Insertar líneas o símbolos

AÑADIR UNA LINEA HORIZONTAL

El programa FrontPage nos permite añadir líneas a nuestra página de modo fácil

Pulsamos Insertar en la Barra de menús

Y Pulsamos Línea horizontal

LECCION 17ª Insertar líneas o símbolos AÑADIR UNA LINEA HORIZONTAL El programa FrontPage nos permite añadir

Y el resultado es la línea que se muestra a continuación

Podemos modificar la línea horizontal cambiando su formato

Marcamos la línea pulsando sobre la misma.

Pulsando el Botón DERECHO del ratón aparece un menú en el que elegimos

Propiedades de línea horizontal

Propiedades de línea horizontal Aparece el Cuadro Propiedades de línea horizontal En el Cuadro podemos seleccionar

Aparece el Cuadro Propiedades de línea horizontal

En el Cuadro podemos seleccionar el Ancho de la línea. En nuestro ejemplo seleccionamos 50 como Porcentaje de ventana. La línea del ejemplo tendrá como distancia la mitad de la página o de la tabla dentro de la que se encuentra.

Y la opción Alto nos permite definir el grosor de la línea. En nuestro ejemplo ponemos 5 pixeles como ancho de la línea.

La opción Color nos permite decidir el color de la línea. En nuestro ejemplo seleccionamos el color azul.

Propiedades de línea horizontal Aparece el Cuadro Propiedades de línea horizontal En el Cuadro podemos seleccionar

Y el resultado de definir el Ancho como el 50%, el grosor como 5 pixeles y el color azul se muestra a continuación

PONER SIGNOS COMO @)€$

En ocasiones necesitamos añadir a nuestra página un símbolo que no se encuentra directamente disponible en el teclado de la computadora. Para insertar un símbolo:

Pulsamos Insertar en la Barra superior o Barra de menús.

Pulsamos sobre Símbolo

Nos aparece en pantalla el Cuadro Símbolo. Marcamos el símbolo que deseamos y pulsamos Insertar. O

Nos aparece en pantalla el Cuadro Símbolo.

Marcamos el símbolo que deseamos y pulsamos Insertar. O directamente podemos hacer doble click sobre el símbolo.

Nos aparece en pantalla el Cuadro Símbolo. Marcamos el símbolo que deseamos y pulsamos Insertar. O

Esto nos permite escribir símbolos como @µ¶

Resumen multimedia de la lección 17ª ;

LECCION 18ª Las muy útiles tablas LAS UTILES TABLAS Los distintos elementos de una página se

LECCION 18ª Las muy útiles tablas

LAS UTILES TABLAS

Los distintos elementos de una página se organizan mediante tablas. Esta misma página esta organizada utilizando varias tablas de bordes ocultos que delimitan las distintas partes.

Para añadir una tabla a nuestra página

Pulsamos Tabla en la Barra superior o Barra de menús.

Seleccionamos Insertar

Y pulsamos sobre Tabla

LECCION 18ª Las muy útiles tablas LAS UTILES TABLAS Los distintos elementos de una página se

Podemos directamente pulsar sobre el Botón Insertar Tabla de la Barra Estándar

Nos aparece el Cuadro Insertar tabla En este cuadro podemos definir el número de Filas y

Nos aparece el Cuadro Insertar tabla

En este cuadro podemos definir el número de Filas y de Columnas de la Tabla. En este primer ejemplo añadimos una tabla de dos filas y dos columnas. Pro tanto una tabla de cuatro celdas.

En Alineación definimos si la tabla se ajustará a un lado u otro de la página. En nuestro ejemplo seleccionamos Izquierda.

En Tamaño del borde definimos el grosor de la línea que delimita la tabla. Posteriormente veremos que para organizar las páginas de Internet se utilizan múltiples tablas con bordes ocultos asignando al borde un tamaño cero.

En Especificar Ancho definimos el tamaño de la tabla. En nuestro ejemplo ponemos un ancho del 50 por ciento. Esta tabla ocupara la mitad del ancho de la página o de la tabla en la que se encuentre.

Nos aparece el Cuadro Insertar tabla En este cuadro podemos definir el número de Filas y

Y el resultado es la tabla que se muestra a continuación

Nos aparece el Cuadro Insertar tabla En este cuadro podemos definir el número de Filas y

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 Añadir una tabla de tres

Y el resultado se muestra en la siguiente tabla

Y el resultado se muestra en la siguiente tabla OTRO EJEMPLO Añadir una tabla de tres

OTRO EJEMPLO

Añadir una tabla de tres filas y dos columnas con un ancho del 50 por ciento, un tamaño del borde de 2 y un espaciado entre celdas de 1.

Y el resultado se muestra en la siguiente tabla OTRO EJEMPLO Añadir una tabla de tres

El resultado es el siguiente

Y el resultado se muestra en la siguiente tabla OTRO EJEMPLO Añadir una tabla de tres

Resumen multimedia de la lección 18ª ;

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

LECCION 19ª Alinear la Tabla

AJUSTAR LA TABLA A LOS BORDES

Al añadir una tabla a nuestra página podemos asignarle la alineación. En este ejemplo ponemosAlineación izquierda

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

La siguiente tabla esta ajustada al borde izquierdo de la tabla en la que se encuentra incluida.

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

Veamos en el siguiente ejemplo una tabla en la que seleccionamos Alineación Derecha.

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

La siguiente tabla esta ajustada a la derecha

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

Podemos igualmente definir la Alineación como Centro de forma que la tabla se ajuste de modo equidistante de los bordes

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

La tabla que se muestra a continuación esta centrada

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

Resumen multimedia de la lección 19ª ;

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

LECCION 19ª Alinear la Tabla

AJUSTAR LA TABLA A LOS BORDES

Al añadir una tabla a nuestra página podemos asignarle la alineación. En este ejemplo ponemosAlineación izquierda

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

La siguiente tabla esta ajustada al borde izquierdo de la tabla en la que se encuentra incluida.

LECCION 19ª Alinear la Tabla AJUSTAR LA TABLA A LOS BORDES Al añadir una tabla a

Veamos en el siguiente ejemplo una tabla en la que seleccionamos Alineación Derecha.

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

La siguiente tabla esta ajustada a la derecha

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

Podemos igualmente definir la Alineación como Centro de forma que la tabla se ajuste de modo equidistante de los bordes

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

La tabla que se muestra a continuación esta centrada

La siguiente tabla esta ajustada a la derecha Podemos igualmente definir la Alineación como Centro de

Resumen multimedia de la lección 19ª ;

LECCION 21ª Unir Celdas COMBINAR CELDAS En nuestro siguiente ejemplo vamos a crear una tabla de

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%.

LECCION 21ª Unir Celdas COMBINAR CELDAS En nuestro siguiente ejemplo vamos a crear una tabla de

Partimos de la siguiente tabla

Vamos a fusionar dos celdas en una Marcamos las celdas que deseamos fusionar. Pulsamos el Botón

Vamos a fusionar dos celdas en una

Marcamos las celdas que deseamos fusionar.

Vamos a fusionar dos celdas en una Marcamos las celdas que deseamos fusionar. Pulsamos el Botón

Pulsamos el Botón DERECHO del ratón.

Seleccionamos del menú Combinar celdas

Vamos a fusionar dos celdas en una Marcamos las celdas que deseamos fusionar. Pulsamos el Botón

Y el resultado se muestra en la siguiente tabla

Vamos a fusionar dos celdas en una Marcamos las celdas que deseamos fusionar. Pulsamos el Botón

Resumen multimedia de la lección 21ª ;

LECCION 22ª El Formato de las Celdas. Color de fondo DAR FORMATO A LAS CELDAS Para

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.

LECCION 22ª El Formato de las Celdas. Color de fondo DAR FORMATO A LAS CELDAS Para

Pulsamos el Botón DERECHO del ratón

Seleccionamos Propiedades de celda

LECCION 22ª El Formato de las Celdas. Color de fondo DAR FORMATO A LAS CELDAS Para

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 Botón correspondiente a Color de Fondo Pulsamos sobre Rojo El resultado se muestra

Pulsamos sobre el Botón correspondiente a Color de Fondo

Pulsamos sobre Rojo

El resultado se muestra en la siguiente tabla

Pulsamos sobre el Botón correspondiente a Color de Fondo Pulsamos sobre Rojo El resultado se muestra

Resumen multimedia de la lección 212ª ;

Pulsamos sobre el Botón correspondiente a Color de Fondo Pulsamos sobre Rojo El resultado se muestra

LECCION 23ª Modificar el tamaño de las Tablas

PROPIEDADES DE TABLA

Partimos de la tabla que creamos en la página anterior. Vamos a modificar la tabla reduciendo su tamaño.

PROPIEDADES DE TABLA Partimos de la tabla que creamos en la página anterior. Vamos a modificar

Situamos el cursor sobre la tabla

Pulsamos el Botón DERECHO del ratón

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.

PROPIEDADES DE TABLA Partimos de la tabla que creamos en la página anterior. Vamos a modificar

El resultado es que la tabla reduce su tamaño como se muestra a continuación.

PROPIEDADES DE TABLA Partimos de la tabla que creamos en la página anterior. Vamos a modificar

Igualmente podemos modificar la tabla aumentando su ancho. En el siguiente ejemplo marcamos Especificar ancho y escribimos 70 aumentando el tamaño de la tabla anterior.

PROPIEDADES DE TABLA Partimos de la tabla que creamos en la página anterior. Vamos a modificar

El resultado es que la tabla se alarga tal como se muestra en la siguiente tabla

PROPIEDADES DE TABLA Partimos de la tabla que creamos en la página anterior. Vamos a modificar

Resumen multimedia de la lección 23ª ;

Resumen multimedia de la lección 23ª ; LECCION 24ª El Color de las líneas de las

LECCION 24ª El Color de las líneas de las Tablas

PONER COLOR AL BORDE DE LA TABLA

Partimos de la siguiente tabla

Resumen multimedia de la lección 23ª ; LECCION 24ª El Color de las líneas de las

Deseamos modificar la anterior tabla y ponerle color a las líneas del borde

Situamos el cursor sobre la tabla

Pulsamos el botón DERECHO del ratón y seleccionamos Propiedades de tabla

Resumen multimedia de la lección 23ª ; LECCION 24ª El Color de las líneas de las

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Colorseleccionamos el color deseado. En nuestro ejemplo seleccionamos el color azul

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Color seleccionamos el

La tabla cambia para mostrar las líneas de color azul.

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Color seleccionamos el

ESPACIADO ENTRE CELDAS

Podemos modificar el Espaciado entre celdas utilizando este mismo Cuadro de Propiedades de tabla. Partimos de la siguiente tabla.

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Color seleccionamos el

Pulsamos el Botón DERECHO del ratón 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.

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Color seleccionamos el

Y la tabla se modifica quedando como se muestra a continuación.

Nos aparece en pantalla en Cuadro Propiedades de tabla y en Bordes y Color seleccionamos el

TABLAS NO VISIBLES

Las páginas organizan los distintos elementos, el texto, las imágenes y los enlaces utilizando

tablas con bordes no visibles.

 

Para crear tablas no visibles al crear la tabla ponemos el Tamaño de borde a cero

TABLAS NO VISIBLES Las páginas organizan los distintos elementos, el texto, las imágenes y los enlaces

Y la tabla se muestra en la vista Normal de FrontPage como se muestra a continuación. Esta tabla es invisible cuando se coloquemos en Internet nuestra tabla

Resumen multimedia de la lección 24ª;

TABLAS NO VISIBLES Las páginas organizan los distintos elementos, el texto, las imágenes y los enlaces
seño de las páginas COMPOSICION DE PAGINAS Las páginas se suelen componer utilizando tablas de bordesEresmas . Esta página utiliza una tabla para enmarcar la cabecera donde se muestran los Banners y el nombre del Portal. Y la página 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. " id="pdf-obj-102-2" src="pdf-obj-102-2.jpg">

seño de las páginas

COMPOSICION DE PAGINAS

Las páginas se suelen componer utilizando tablas de bordes cero y tablas dentro de tablas.

Si nos fijamos en la mayoría de las páginas importantes veremos que la tabla se compone a partir de varias tablas.

Vamos a fijarnos por ejemplo en el Portal Eresmas . Esta página utiliza una tabla para enmarcar la cabecera donde se muestran los Banners y el nombre del Portal. Y la página 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.

seño de las páginas COMPOSICION DE PAGINAS Las páginas se suelen componer utilizando tablas de bordesEresmas . Esta página utiliza una tabla para enmarcar la cabecera donde se muestran los Banners y el nombre del Portal. Y la página 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. " id="pdf-obj-102-17" src="pdf-obj-102-17.jpg">

Veremos un ejemplo de como crear una estructura para una página utilizando tablas de borde cero. Partimos de una tabla de dos filas y tres columnas y de Tamaño de borde cero

Veremos un ejemplo de como crear una estructura para una página utilizando tablas de borde cero.

El resultado se muestra a continuación. Así se verá en la vista Normal de FrontPage. Al colocar la página web en Internet los visitantes al acceder mediante un navegador no verán esta tabla.

Veremos un ejemplo de como crear una estructura para una página utilizando tablas de borde cero.

Vamos a unir las celdas de la primera fila dando lugar a una sola celda.

Marcamos las celdas que deseamos combinar

Pulsamos Combinar celdas

Veremos un ejemplo de como crear una estructura para una página utilizando tablas de borde cero.

Y el resultado se muestra a continuación tal como se vería en la vista Normal de FrontPage.

Vamos a definir las características de la primera celda de la segunda fila. Y deseamos ampliar

Vamos a definir las características de la primera celda de la segunda fila. Y deseamos ampliar el tamaño de la celda.

Marcamos la celda

Pulsamos el botón DERECHO del ratón y seleccionamos Propiedades de celda

Vamos a definir las características de la primera celda de la segunda fila. Y deseamos ampliar

Vamos a poner la alineación superior como Propiedad de la celda

Pulsamos sobre el cuadradito de especificar alto

Y escribimos 150 en el recuadro correspondiente

Vamos a definir las características de la primera celda de la segunda fila. Y deseamos ampliar

En la vista Normal de Microsoft FrontPage se mostraría la siguiente imagen

Insertamos una tabla dentro de la primera celda de la segunda fila. En nuestro ejemplo una

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

Insertamos una tabla dentro de la primera celda de la segunda fila. En nuestro ejemplo una

Y el resultado se muestra a continuación. Esta tabla que se muestra a continuación no se verá en Internet pero es fundamental para insertar de modo ordenado los diferentes elementos de la página.

Insertamos una tabla dentro de la primera celda de la segunda fila. En nuestro ejemplo una
LECCION 26ª La Barra Tabla BARRA TABLA Puede que la Barra tabla no se muestre en

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.

LECCION 26ª La Barra Tabla BARRA TABLA Puede que la Barra tabla no se muestre en

Para crear o insertar una nueva tabla en nuestra página pulsamos directamente sobre el botón Dibujar tabla de la Barra Tablas.

LECCION 26ª La Barra Tabla BARRA TABLA Puede que la Barra tabla no se muestre en

El Botón Dibujar tabla nos permite crear directamente una tabla manteniendo pulsado el botón izquierdo del ratón y moviéndonos hasta que la tabla tenga el tamaño deseado.

El resultado es el que se muestra a continuación Igualmente podemos dividir el cuadrado en tantas

El resultado es el que se muestra a continuación

El resultado es el que se muestra a continuación Igualmente podemos dividir el cuadrado en tantas

Igualmente podemos dividir el cuadrado en tantas celdas como necesitemos marcando el Botón Dibujar y moviéndonos entre los lados interiores del cuadrado manteniendo pulsado el botón izquierdo del ratón.

El resultado es el que se muestra a continuación Igualmente podemos dividir el cuadrado en tantas

El resultado se muestra en la siguiente imagen. El tipo de línea 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.

El resultado es el que se muestra a continuación Igualmente podemos dividir el cuadrado en tantas

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 Botón Dividir celdas

El resultado es el que se muestra a continuación Igualmente podemos dividir el cuadrado en tantas

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 línea divisoria vertical.

En la siguiente imagen se puede ver como la última celda la hemos dividido en dos

En la siguiente imagen se puede ver como la última celda la hemos dividido en dos mediante una línea vertical.

En la siguiente imagen se puede ver como la última celda la hemos dividido en dos

Podemos eliminar las líneas de la tabla que sobren utilizando el Botón Borrador

En la siguiente imagen se puede ver como la última celda la hemos dividido en dos

Resumen multimedia de la lección 26ª;

LECCION 27ª Analizar el Diseño de las páginas Para aprender sobre el diseño de páginas sueleTerra Pulsamos sobre Archivo en la Barra superior de nuestro navegador Microsoft Internet Explorer Y seleccionamos Modificar con Microsoft Front Page " id="pdf-obj-109-2" src="pdf-obj-109-2.jpg">

LECCION 27ª Analizar el Diseño de las páginas

Para aprender sobre el diseño de páginas suele ser interesante visitar las páginas principales. Podemos ver como se ha realizado la composición de una página pulsando la opción Modificar con FrontPage en nuestro navegador de Internet.

Utilizando el Microsoft Internet Explorer vamos por ejemplo a la página de Terra

LECCION 27ª Analizar el Diseño de las páginas Para aprender sobre el diseño de páginas sueleTerra Pulsamos sobre Archivo en la Barra superior de nuestro navegador Microsoft Internet Explorer Y seleccionamos Modificar con Microsoft Front Page " id="pdf-obj-109-11" src="pdf-obj-109-11.jpg">

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 página. En este caso podemos apreciar la

Este comando nos permite ver como esta construida una página. En este caso podemos apreciar la estructura de tablas y tablas dentro de tablas que organizan el texto, las imágenes y los enlaces de la portada de esta web. En algunas páginas esta opción no es posible.

Este comando nos permite ver como esta construida una página. En este caso podemos apreciar la

Para aprender en ocasiones puede ser interesante ver el código Html de las páginas.

En la parte inferior izquierda de la pantalla pulsamos sobre la pestaña HTML. En aulafacil se encuentra disponible un curso sobre creación de páginas web programando directamente en HTML.

Este comando nos permite ver como esta construida una página. En este caso podemos apreciar la

Resumen multimedia de la lección 27ª;

LECCION 28ª Las páginas con Marcos MARCOS Los marcos nos permiten dividir la página en varias

LECCION 28ª Las páginas con Marcos

MARCOS

Los marcos nos permiten dividir la página en varias partes que se pueden mover independientemente.

Pulsamos Archivo en la Barra superior

Seleccionamos Nuevo y página

LECCION 28ª Las páginas con Marcos MARCOS Los marcos nos permiten dividir la página en varias

Aparece en pantalla el Cuadro Nuevo.

Pulsamos sobre la pestaña Páginas de marcos. Podemos elegir entre varios tipos de páginas con marcos. En nuestro ejemplo seleccionamos el primer tipo que divide la página en una columna más delgada a la izquierda y en una mucho más ancha el resto. En nuestro ejemplo pulsamos sobre Contenido.

Nos aparece el nuevo formato de la página. Pulsamos Nueva página para crear el contenido de

Nos aparece el nuevo formato de la página.

Pulsamos Nueva página para crear el contenido de la columna de la izquierda o si tenemos ya una página que nos pueda servir pulsamos Establecer página inicial

Igualmente pulsamos Nueva página o Establecer página inicial para construir la otra parte de la página.

Nos aparece el nuevo formato de la página. Pulsamos Nueva página para crear el contenido de

Resumen multimedia de la lección 28ª;

LECCION 29ª Corregir la Ortografía ORTOGRAFIA Una vez realizada la página es recomendable realizar una revisión

LECCION 29ª Corregir la Ortografía

ORTOGRAFIA

Una vez realizada la página es recomendable realizar una revisión de la ortografía para evitar faltas o errores en el texto.

Pulsamos Herramientas en la Barra superior

Y pulsamos sobre Ortografía

LECCION 29ª Corregir la Ortografía ORTOGRAFIA Una vez realizada la página es recomendable realizar una revisión

Otra opción es pulsar directamente sobre el Botón Ortografía de la Barra Estándar

LECCION 29ª Corregir la Ortografía ORTOGRAFIA Una vez realizada la página es recomendable realizar una revisión

Nos aparece el Cuadro Ortografía. 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.

Pulsamos Cambiar si aceptamos la sugerencia del programa. En nuestro ejemplo cambiaremos comprovar por comprobar. Pulsamos

Una opción interesante de FrontPage es tener activado todo el tiempo el corrector ortográfico

Pulsamos Herramientas en la Barra superior.

Seleccionamos Opciones de página

Pulsamos Cambiar si aceptamos la sugerencia del programa. En nuestro ejemplo cambiaremos comprovar por comprobar. Pulsamos

Aparece el Cuadro Opciones de página.

Marcamos Comprobar la ortografía al escribir.

Pulsamos Cambiar si aceptamos la sugerencia del programa. En nuestro ejemplo cambiaremos comprovar por comprobar. Pulsamos

Si tenemos activado comprobar la ortografía al escribir el programa nos muestra subrayadas en rojo las palabras que pueden ser faltas de ortografía. Si escribimos por ejemplo comprovar en vez de comprobar el programa nos lo señala

Si tenemos activado comprobar la ortografía al escribir el programa nos muestra subrayadas en rojo las

Resumen multimedia de la lección 29ª;

Si tenemos activado comprobar la ortografía al escribir el programa nos muestra subrayadas en rojo las

LECCION 30ª Poner un enlace para enviar Correos electrónicos

Si queremos poner una dirección de correo electrónico en nuestra página 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 página. También podemos insertar una imagen.

Marcamos el texto o la imagen

Pulsamos Insertar en la Barra superior Pulsamos Hipervínculo. Nos aparece el Cuadro Crear hipervínculo Pulsamos sobre

Pulsamos Insertar en la Barra superior

Pulsamos Hipervínculo.

Pulsamos Insertar en la Barra superior Pulsamos Hipervínculo. Nos aparece el Cuadro Crear hipervínculo Pulsamos sobre

Nos aparece el Cuadro Crear hipervínculo

Pulsamos sobre el Botón que muestra un sobre amarillo.

Pulsamos Insertar en la Barra superior Pulsamos Hipervínculo. Nos aparece el Cuadro Crear hipervínculo Pulsamos sobre

El botón que muestra un sobre amarillo es el botón que nos permite establecer un hipervínculo que envía un correo

Pulsamos Insertar en la Barra superior Pulsamos Hipervínculo. Nos aparece el Cuadro Crear hipervínculo Pulsamos sobre

Aparece en pantalla el Cuadro Crear hipervínculo de correo electrónico

En el recuadro escribimos la dirección de correo en la que recibiremos los correos de los visitantes de la página.

En el recuadro escribimos la dirección de correo en la que recibiremos los correos de losESCRIBIR AL WEBMASTER Resumen multimedia de la lección 30ª; LECCION 31ª Las vistas en FrontPage Un sitio web, suele tener mas de una pagina web. En esta lección veremos como crear un sitio de múltiples paginas con FrontPage. Para empezar a crear una página sólo tenemos que pulsar en Archivo, nuevo y Página Pero si queremos crear un sitio con mas de una pagina FrontPage pone a nuestra disposición 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 " id="pdf-obj-117-4" src="pdf-obj-117-4.jpg">

Pulsamos Aceptar y en el Cuadro Crear hipervínculo otra vez Aceptar

Si pulsa sobre el enlace donde pone ESCRIBIR AL WEBMASTER puede comprobar el resultado del enlace.

Resumen multimedia de la lección 30ª;

LECCION 31ª Las vistas en FrontPage

Un sitio web, suele tener mas de una pagina web. En esta lección veremos como crear un sitio de múltiples paginas con FrontPage.

Para empezar a crear una página sólo tenemos que pulsar en Archivo, nuevo y Página

En el recuadro escribimos la dirección de correo en la que recibiremos los correos de losESCRIBIR AL WEBMASTER Resumen multimedia de la lección 30ª; LECCION 31ª Las vistas en FrontPage Un sitio web, suele tener mas de una pagina web. En esta lección veremos como crear un sitio de múltiples paginas con FrontPage. Para empezar a crear una página sólo tenemos que pulsar en Archivo, nuevo y Página Pero si queremos crear un sitio con mas de una pagina FrontPage pone a nuestra disposición 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 " id="pdf-obj-117-22" src="pdf-obj-117-22.jpg">

Pero si queremos crear un sitio con mas de una pagina FrontPage pone a nuestra disposición 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 "Página", 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 primera de las vistas es "Página", desde esta vista modificamos cada una de las paginas

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 "Exploración". En esta vista organizaremos todas las paginas web para formar un sitio

La primera de las vistas es "Página", desde esta vista modificamos cada una de las paginas

La vista "Hipervínculos" nos muestra los textos o gráficos que , al pulsar sobre ellos llevan al visitante a otra página,

Por último la vista "Tareas". En ella anotaremos todas las cosas que hay por hacer, su máxima utilidad se obtiene en el trabajo en grupo.

LECCION 32ª Las plantillas de Sitios Un sitio web es una forma de relacionar paginas web

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 diseñar 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 instrucción "Web" del menú desplegado

LECCION 32ª Las plantillas de Sitios Un sitio web es una forma de relacionar paginas web

Se abrirá un cuadro de dialogo en el que podremos elegir entre las plantillas disponibles

Estas plantillas son

Web de una página: no necesita mas explicación, su nombre lo dice todo

Asistente para importar al web: nos enseña 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 importar al web: nos enseña paso a paso como hacer un sitio web a

Asistente para Web de discusión: En este sitio, los visitantes podrán hacer preguntas y ser contestados.

Web de proyecto: Esta es una plantilla para crear un sitio muy especializado. Dirigido a la creación de proyectos.

Web de soporte al cliente: Este tipo de sitio incluye formularios donde los cliente podrán aportar información 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 vacío, no tiene ninguna pagina, esta vacío

Nosotros pulsaremos en Web personal para tener un primer contacto con ella.

Asistente para importar al web: nos enseña paso a paso como hacer un sitio web a

Resumen multimedia de la lección 32ª;

Resumen multimedia de la lección 32ª; LECCION 33ª Creación de un sitio En la lección anterior

LECCION 33ª Creación de un sitio

En la lección anterior aprendimos a utilizar las plantillas para crear un sitio web.

En esta lección aprenderemos a añadir paginas a un sitio predefinido.

Una vez que tengamos activa la plantilla de sitio web personal. Pulsaremos en vista de "Exploración " de la lista de vistas de FrontPage

Al pulsar en la vista "Exploración", veras que en la zona de la derecha, se crean

Al pulsar en la vista "Exploración", 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

Al pulsar en la vista "Exploración", veras que en la zona de la derecha, se crean

Podemos añadir paginas al sitio, simplemente pulsando el icono "Nueva página" de la barra de herramientas

Al pulsar en la vista "Exploración", veras que en la zona de la derecha, se crean

Observa que la "Pagina nueva" se enlaza directamente con aquella que estuviera activa cuando pulsáramos el icono de "Nueva pagina"

Podemos añadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna

Podemos añadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna limitación.

Podemos añadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna

Resumen multimedia de la lección 33ª;

LECCION 34ª Nombrar páginas En la lección anterior aprendimos a utilizar las plantillas para crear un

LECCION 34ª

Nombrar páginas

En la lección anterior aprendimos a utilizar las plantillas para crear un sitio web.

En esta lección aprenderemos a añadir paginas a un sitio predefinido.

Una vez que tengamos activa la plantilla de sitio web personal. Pulsaremos en vista de "Exploración " de la lista de vistas de FrontPage

LECCION 34ª Nombrar páginas En la lección anterior aprendimos a utilizar las plantillas para crear un

Al pulsar en la vista "Exploración", 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

las paginas. Y en la ventana de la derecha vemos un esquema que muestra como las

Podemos añadir paginas al sitio, simplemente pulsando el icono "Nueva página" de la barra de herramientas

las paginas. Y en la ventana de la derecha vemos un esquema que muestra como las

Observa que la "Pagina nueva" se enlaza directamente con aquella que estuviera activa cuando pulsáramos el icono de "Nueva pagina"

las paginas. Y en la ventana de la derecha vemos un esquema que muestra como las

Podemos añadir tantas paginas como deseemos, y podemos hacerlas depender de cualquier otra pagina sin ninguna limitación.

Resumen multimedia de la lección 34ª; LECCION 35ª Modificación de la estructura