Professional Documents
Culture Documents
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
HTML, fue el primer lenguaje y el mas usado que permite desarrollar sitios Web.
Editores de cdigo, que son paquetes de software que facilitan el desarrollo a travs de
la edicin y generacin de cdigo HTML.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
1/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
2/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Como se aprecia, aparece una pantalla con una hoja en blanco para empezar a escribir los
elementos que formarn parte de una pgina del sitio Web que se va a desarrollar.
Como se aprecia en la figura, en la parte inferior aparecen 4 vistas, las cuales nos permiten
visualizar de diferente manera el contenido de la pgina. Por omisin aparece seleccionada la
vista Design. A continuacin se explican cada una de las vistas de las pginas:
Split: muestra una pgina dividida en dos partes, en la cual, la mitad de la pgina
permite escribir el contenido de la misma (vista Design) y la segunda mitad, nos muestra
el cdigo en html que se est generando.
Code: nos muestra el cdigo en html de la pgina web que se est desarrollando. En
esta vista se pueden introducir o editar las instrucciones en html.
Preview: nos muestra una vista final de cmo se visualizar la pgina en el momento
en que esta sea publicada en un servidor.
En este caso, la pgina no forma parte de un sitio (es una pgina independiente), por lo que
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
3/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
antes de empezar a desarrollar el contenido de la pgina debemos definir el sitio Web que
desarrollaremos.
Cmo crear un sitio Web.
Para empezar a desarrollar el sitio Web, es necesario haber realizado con anterioridad la
planeacin y el diseo del mismo de tal forma que se genere como resultado un plano de la
estructura jerrquica que tendr el sitio y y de esta forma poder reflejarlo en FrontPage.
Tomaremos como ejemplo el ejercicio usado en el mdulo anterior, en el cual despus de haber
analizado e investigado todas las variantes, se lleg a la estructura jerrquica siguiente:
1. Selecciona del men File la opcin New, en la parte derecha de la pantalla aparece el
Panel de tareas o Task pane, en donde se muestran las diferentes opciones que
existen para crear una pgina nueva o un nuevo sitio Web. Selecciona la opcin One
page web site
2. Aparece una ventana que nos muestra los diferentes tipos de sitios que se pueden crear.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
4/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Empty Web
Import Web Wizard
Personal Web
Project web
Descripcin
Crea un sitio web que contiene una pgina en blanco
llamada index.htm, la cual es la pgina inicial del
sitio.
Crea un sitio web que contiene pginas ejemplo que
se pueden personalizar para una compaa.
Crea un sitio web que contiene pginas ejemplo para
compaas que proporcionan soporte a los clientes,
particularmente para compaas de software.
Crea un sitio web que se puede conectar a una base
de datos de la cual se pueden agregar, ver,
actualizar y borrar registros.
Crea un sitio web que contiene un grupo de discusin
con la secuencia de la misma, una tabla de
contenidos y capacidades de bsqueda de texto.
Crea la estructura de carpetas de un sitio web sin
pginas.
Crea un sitio web que contiene pginas que se
importan de otros lugares, tales como otro sitio web
o del disco duro.
Crea un sitio web que contiene pginas ejemplo que
una persona puede personalizar para promover sus
intereses y sitios web favoritos.
Crea un sitio web que contiene pginas ejemplo para
una lista de miembros, programacin, estatus y un
archivo de discusin relacionados a un proyecto
especfico.
Crea un sitio web con herramientas que pueden ser
utilizadas por un grupo de personas que trabajan
juntas en un proyecto. Incluye un calendario, una
biblioteca para compartir documentos, una lista de
tareas y una lista de contactos.
3. En la pantalla que aparece, haz clic en el cono que dice One Page Web para crear un
sitio Web que contendr una pgina y escribe C:\Mis documentos\My Webs\ElZapatito
en el recuadro que dice Specify the location of the new web (esta es la direccin
completa dentro de tu computadora en la que deseas guardar el sitio Web que se esta
creando. ElZapatito es el nombre del sitio) y haz clic en OK.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
5/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Esto har que FrontPage cree un sitio Web de una pgina llamado ElZapatito, el cual tendr
una pgina llamada index.htm, que ser la pgina principal del sitio web o home page. Recuerda
que esta pgina ser la primera que se muestre en el navegador en el momento que el sitio
web sea publicado en Internet, por lo que es importante que no la borremos o le cambiemos el
nombre. El sitio Web tendr la siguiente apariencia.
Vistas de FrontPage.
Como se aprecia, en la parte inferior de la ventana del sitio, aparecen las diferentes vistas que
FrontPage proporciona para visualizar y administrar los archivos, carpetas e hipervnculos que
forman los sitios Web que se crean en l. Para tener acceso a ellas, se debe oprimir el botn
de cada vista. A continuacin se describen brevemente cada uno de ellos.
Vista Folders: como ya se mencion un sitio Web est compuesto de folderes que
agrupan los diferentes elementos que forman el sitio. En esta vista se puede apreciar la
jerarqua de carpetas que forman el sitio Web. El folder principal es el folder del sitio Web
y de ah se derivan todos los folders necesarios. FrontPage agrega por definicin dos
folders cada vez que se crea un sitio, el folder _private y el folder images. La creacin y
eliminacin de carpetas es muy sencilla.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
6/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Vista Remote Web Site: sincroniza los archivos entre este sitio web y otro sitio web
remoto.
Vista Reports: en esta vista se muestra un listado de los archivos, hipervnculos y otros
elementos del sitio Web que nos permite llevar una mejor administracin del sitio Web y
analizar su contenido.
Vista Navigation: esta vista muestra la estructura de navegacin que tiene el sitio
Web, es decir la forma en que estn integradas las pginas que forman parte del sitio.
Vista Hyperlinks: esta vista muestra un panorama general de todos los hipervnculos
que existen entre las pginas Web del sitio.
Vista Tasks: en esta vista se puede llevar un control de todas las tareas que se
necesitan realizar cuando se est desarrollando un sitio Web. Esta vista permite agregar
tareas, asignarle prioridades, definir responsables y finalmente, cuando la tarea es
terminada, es posible borrarla.
El uso de estas vistas depende en gran medida de la manera en que se les asigne la
importancia que cada una tiene para una mejor administracin de las actividades necesarias
para desarrollar el sitio Web. Posteriormente se har referencia a ellas.
Cmo obtener ayuda en FrontPage?
FrontPage incluye un muy amplio sistema de ayuda que nos proporciona informacin acerca de
los diferentes comandos e instrucciones. Los pasos para obtener ayuda son:
2. Escribe el tema sobre el cual deseas obtener ayuda. El nico inconveniente es que
debes escribir el tpico en ingls. Escribe Open Web y haz clic en el botn de
Aparecer una lista con los diferentes tpicos que existen para ese tema.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
7/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
8/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
5. Una vez que hayas ledo la informacin, haz clic en el botn Close para salir del sistema
de ayuda.
FrontPage tambin proporciona ayuda a travs del World Wide Web si ests trabajando
conectado a Internet:
9/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
10/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Como se aprecia, aparece una pantalla con una hoja en blanco para empezar a escribir los
elementos que formarn parte de una pgina del sitio Web que se va a desarrollar.
Como se aprecia en la figura, en la parte inferior aparecen 4 vistas, las cuales nos permiten
visualizar de diferente manera el contenido de la pgina. Por omisin aparece seleccionada la
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
11/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
vista Design. A continuacin se explican cada una de las vistas de las pginas:
Split: muestra una pgina dividida en dos partes, en la cual, la mitad de la pgina
permite escribir el contenido de la misma (vista Design) y la segunda mitad, nos muestra
el cdigo en html que se est generando.
Code: nos muestra el cdigo en html de la pgina web que se est desarrollando. En
esta vista se pueden introducir o editar las instrucciones en html.
Preview: nos muestra una vista final de cmo se visualizar la pgina en el momento
en que esta sea publicada en un servidor.
En este caso, la pgina no forma parte de un sitio (es una pgina independiente), por lo que
antes de empezar a desarrollar el contenido de la pgina debemos definir el sitio Web que
desarrollaremos.
Cmo crear un sitio Web.
Para empezar a desarrollar el sitio Web, es necesario haber realizado con anterioridad la
planeacin y el diseo del mismo de tal forma que se genere como resultado un plano de la
estructura jerrquica que tendr el sitio y y de esta forma poder reflejarlo en FrontPage.
Tomaremos como ejemplo el ejercicio usado en el mdulo anterior, en el cual despus de haber
analizado e investigado todas las variantes, se lleg a la estructura jerrquica siguiente:
4. Selecciona del men File la opcin New, en la parte derecha de la pantalla aparece el
Panel de tareas o Task pane, en donde se muestran las diferentes opciones que
existen para crear una pgina nueva o un nuevo sitio Web. Selecciona la opcin One
page web site
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
12/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
5. Aparece una ventana que nos muestra los diferentes tipos de sitios que se pueden crear.
Diferentes tipo de sitios que se pueden crear
Plantilla
One Page Web
Empty Web
Import Web Wizard
Personal Web
Project web
Descripcin
Crea un sitio web que contiene una pgina en blanco
llamada index.htm, la cual es la pgina inicial del
sitio.
Crea un sitio web que contiene pginas ejemplo que
se pueden personalizar para una compaa.
Crea un sitio web que contiene pginas ejemplo para
compaas que proporcionan soporte a los clientes,
particularmente para compaas de software.
Crea un sitio web que se puede conectar a una base
de datos de la cual se pueden agregar, ver,
actualizar y borrar registros.
Crea un sitio web que contiene un grupo de discusin
con la secuencia de la misma, una tabla de
contenidos y capacidades de bsqueda de texto.
Crea la estructura de carpetas de un sitio web sin
pginas.
Crea un sitio web que contiene pginas que se
importan de otros lugares, tales como otro sitio web
o del disco duro.
Crea un sitio web que contiene pginas ejemplo que
una persona puede personalizar para promover sus
intereses y sitios web favoritos.
Crea un sitio web que contiene pginas ejemplo para
una lista de miembros, programacin, estatus y un
archivo de discusin relacionados a un proyecto
especfico.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
13/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
6. En la pantalla que aparece, haz clic en el cono que dice One Page Web para crear un
sitio Web que contendr una pgina y escribe C:\Mis documentos\My Webs\ElZapatito
en el recuadro que dice Specify the location of the new web (esta es la direccin
completa dentro de tu computadora en la que deseas guardar el sitio Web que se esta
creando. ElZapatito es el nombre del sitio) y haz clic en OK.
Esto har que FrontPage cree un sitio Web de una pgina llamado ElZapatito, el cual tendr
una pgina llamada index.htm, que ser la pgina principal del sitio web o home page. Recuerda
que esta pgina ser la primera que se muestre en el navegador en el momento que el sitio
web sea publicado en Internet, por lo que es importante que no la borremos o le cambiemos el
nombre. El sitio Web tendr la siguiente apariencia.
Vistas de FrontPage.
Como se aprecia, en la parte inferior de la ventana del sitio, aparecen las diferentes vistas que
FrontPage proporciona para visualizar y administrar los archivos, carpetas e hipervnculos que
forman los sitios Web que se crean en l. Para tener acceso a ellas, se debe oprimir el botn
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
14/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
Vista Remote Web Site: sincroniza los archivos entre este sitio web y otro sitio web
remoto.
Vista Reports: en esta vista se muestra un listado de los archivos, hipervnculos y otros
elementos del sitio Web que nos permite llevar una mejor administracin del sitio Web y
analizar su contenido.
Vista Navigation: esta vista muestra la estructura de navegacin que tiene el sitio
Web, es decir la forma en que estn integradas las pginas que forman parte del sitio.
Vista Hyperlinks: esta vista muestra un panorama general de todos los hipervnculos
que existen entre las pginas Web del sitio.
Vista Tasks: en esta vista se puede llevar un control de todas las tareas que se
necesitan realizar cuando se est desarrollando un sitio Web. Esta vista permite agregar
tareas, asignarle prioridades, definir responsables y finalmente, cuando la tarea es
terminada, es posible borrarla.
El uso de estas vistas depende en gran medida de la manera en que se les asigne la
importancia que cada una tiene para una mejor administracin de las actividades necesarias
para desarrollar el sitio Web. Posteriormente se har referencia a ellas.
Cmo obtener ayuda en FrontPage?
FrontPage incluye un muy amplio sistema de ayuda que nos proporciona informacin acerca de
los diferentes comandos e instrucciones. Los pasos para obtener ayuda son:
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
15/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
3. Escribe el tema sobre el cual deseas obtener ayuda. El nico inconveniente es que
debes escribir el tpico en ingls. Escribe Open Web y haz clic en el botn de
Aparecer una lista con los diferentes tpicos que existen para ese tema.
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
16/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
6. Una vez que hayas ledo la informacin, haz clic en el botn Close para salir del sistema
de ayuda.
FrontPage tambin proporciona ayuda a travs del World Wide Web si ests trabajando
conectado a Internet:
17/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
18/23
swebdav /pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
19/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
20/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
21/23
swebdav
20/11/12
/pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
22/23
swebdav /pid-17623880-dt-content-rid-44325524_2/courses/341343/341343
sena.blackboard.com/bbcswebdav /pid-17623880-dt-content-rid-44325524_2//Unidad2_Tema1.htm
23/23