SUBMDULO III: ELABORACION DE PGINAS WEB

Resultados de aprendizaje:
1. Utilizar los elementos fundamentales del diseo
2. Manejar los elementos bsicos de un lenguaje utilizable en la creacin de pginas Web (HTML,
DHTML, ASP, Java Script, CSS u otros)
3. Disear una pgina web con un software de aplicacin
4. Publicar pginas web


EVALUACIN DIAGNSTICA

Resultado de aprendizaje 1
Utilizar los elementos fundamentales del diseo


Campo de aplicacin S No
1. En un sitio Web, identificas:
a. La navegabilidad
b. La interactividad
c. La usabilidad
d. La arquitectura de informacin
e. La interaccin de medios


Resultado de aprendizaje 2
Manejar los elementos bsicos de un lenguaje utilizable en la creacin de pginas Web (HTML, DHTML,
ASP, Java Script, CSS u otros)


Campo de aplicacin S No
1. Identificas los elementos bsicos del lenguaje HTML
Etiqueta HTML
Etiqueta BODY
Etiqueta HEAD
Etiqueta TITLE
2. Estableces ttulos en la pgina Web
3. Agregas numeracin y vietas en la pgina Web
4. Agregas hipervnculos
5. Empleas el resaltador de textos
6. Insertas imgenes en la pgina Web
7. Estableces enlaces en la pgina Web


Resultado de aprendizaje 3
Disear una pgina web con un software de aplicacin


Campo de aplicacin S No
1. Utilizo algn software para el diseo de pginas web
2. Creas un sitio web
3. Creas una pgina web
Estableces las caractersticas de una pgina web
4. Titulo
5. Color o imagen de fondo
6. Texto
7. Aplicas formato al texto de una pgina web
8. Creas listas ordenadas y no ordenadas
9. Insertas imgenes en la pgina web
10. Insertas imgenes de sustitucin en la pgina web
11. Insertas hipervnculos en la pgina web
12. Insertas hipervnculos con anclas
13. Insertas tablas en la pgina web
14. Insertas capas en la pgina web
15. Insertas objetos Flash en la pgina web
16. Utilizas marcos en el diseo de pginas web


Resultado de aprendizaje 4
Publicar pginas web


Campo de aplicacin S No
1. Tomas en cuenta las consideraciones de publicacin
2. Identificas los conceptos relacionados con un sitio de Internet
3. Realizas la publicacin de una pgina Web


Resultado de aprendizaje 1
Elementos fundamentales del diseo
Objetos de aprendizaje
Navegabilidad
Interactividad
Usabilidad
Arquitectura de la informacin
Interaccin de medios

CONTEXTUALIZACIN
Actualmente, Internet tiene millones de usuarios en todo el mundo, entre ellos t, tus amigos y mucha gente
que conoces. Ante este fenmeno mundial, nos preguntamos Para qu usan Internet? Qu beneficios se
obtienen de la red?
Siempre que accedes a un sitio de Internet lo que se abre es una pgina web, la cual contiene la
informacin que el propietario del sitio quiere transmitir al visitante, ya sea para proporcionar algn dato,
noticia, producto o servicio, para comunicarse con otros usuarios, descargar archivos o entretener al
usuario. Cualquiera que sea la finalidad del sitio web, tiene mucho que ver la atencin que le prestes a la
pgina que ests visitando, ya sea por su diseo, objetivo o algn aspecto atractivo que llame tu atencin,
puesto que de ello depende el xito del mismo.
En estos tiempos el uso de pginas web nos permite tener acceso a todo tipo de informacin y medios de
comunicacin en lnea, facilitndonos la tarea de contactar a mucha gente. Tambin es una buena opcin
cuando tenemos una empresa y queremos promoverla de una forma moderna y econmica.
El uso de pginas Web en la actualidad puede ser muy provechoso, es por eso que en este submdulo nos
enfocaremos al desarrollo de las mismas. Tal y como mencionamos en el submdulo anterior, en la gua
conocers los elementos bsicos y herramientas necesarias para el diseo y creacin de una pgina web.
Sin embargo, el xito en la apariencia, funcionalidad y contenido del sitio web dependen de ti y del empeo
y creatividad que le dediques a tu trabajo. Iniciemos!

PROBLEMATIZACION

Analiza lo siguiente y responde:
Al finalizar tus estudios, surge la idea de tener tu propio negocio y decides dedicarte a la venta y
mantenimiento de equipos de cmputo. Para esto debes considerar, el lugar donde lo establecers, el
dinero que vas a invertir, etc. Entre los puntos ms importantes a considerar est el hecho de darle
publicidad a tu negocio para que la gente lo conozca y acuda a l.
De qu manera se te ocurre darle publicidad a tu negocio y promover la venta de tus equipos?
Dejar 3 lneas para respuesta

Es ms efectivo un anuncio impreso (mantas, espectaculares, peridicos) que una pgina Web? Por
qu?
Dejar 3 lneas para respuesta
Qu elementos debes considerar en la creacin de una pgina Web para tu negocio?
Dejar 3 lneas para respuesta


Cuando vas a comprar a comprar algo, por ejemplo ropa, no siempre compras lo ms barato, sino lo que
ms llame tu atencin o lo que ms te gusta. Es por eso que siempre debes tomar en cuenta lo siguiente:
la primera impresin es la ms importante. Retomando la situacin de la problematizacin, es posible que
algunas de las personas que visiten el sitio Web no se decidan a contactarte si el diseo del sitio es poco
llamativo, o no contiene lo que necesitan o porque tarda en abrirse. En estos casos el usuario podra
quedarse con la idea de que el producto que vendes es de baja calidad por tener un sitio de mala calidad.


DESARROLLO DE COMPETENCIAS

T2 Elementos fundamentales de diseo

La construccin de una pgina web consiste en la planificacin, diseo e implementacin de sitios
y pginas de Internet. No basta nicamente con querer disear una pgina y hacerla como vayan surgiendo
las ideas, es una actividad en la cual se debe tomar en cuenta aspectos como son: el objetivo, la estructura
que llevar la pgina, la distribucin de los elementos, etc.

Cuando desarrollas una pgina Web debes considerar los siguientes elementos:
Navegabilidad: se refiere a la facilidad con la que el usuario podr moverse por todas las pginas que van
a formar parte de un sitio web. Generalmente, un sitio web est conformado por varias pginas relacionadas
entre s. Para lograr la navegabilidad, un sitio web debe mantener una serie de recursos y estrategias de
navegacin diseados para lograr que el usuario, al momento de realizar sus bsquedas pueda localizar de
manera fcil la informacin y se sienta orientado al navegar por el sitio, de otra manera, puede sentirse
extraviado y abandonar la pgina.
Para lograr un buen diseo en las pginas que van a servir de interfaz, se debe dar respuesta a las
siguientes preguntas:
Dnde estoy?
Dnde he estado?
A dnde puedo ir?
Insertar imagen de usuario pensativo frente a la computadora
Menciona 2 ejemplos de pginas que hayas visitado en las cuales, a tu manera de ver no consideraron este
elemento. O pide a tu facilitador que muestre algunas pginas con estas caractersticas.
Dejar 2 lneas para respuesta

Interactividad: Es la caracterstica que permite que exista una buena comunicacin entre la pgina y el
usuario. Para ello se deben considerar tres niveles de comunicacin:
No interactiva, cuando un mensaje no se relaciona con otro.
Reactiva, cuando un mensaje se relaciona solamente con el previo inmediato.
Interactiva, cuando un mensaje se relaciona con una serie de elementos previos.

Cuando hablamos de interactividad nos referimos al nivel de respuesta, el cual se estudia como un proceso
de comunicacin en el que cada mensaje se relaciona con el previo, y con la relacin entre ste y los
precedentes.
Menciona 2 ejemplos de pginas que hayas visitado en las cuales, a tu manera de ver no consideraron este
elemento:
Dejar 2 lneas para respuesta

Usabilidad: se refiere a la facilidad con que los usuarios podrn utilizar el sitio web. Se refiere en s, a qu
tan eficaz percibe el usuario un sitio.

La mejor manera de crear un sitio web usable para el usuario es realizando un diseo pensando en el
usuario, diseado para y como si el usuario mismo estuviera realizndolo, es decir, debe tener un diseo
fcil e intuitivo para su manejo.

Menciona 2 ejemplos de pginas que hayas visitado en las cuales, a tu manera de ver no consideraron este
elemento:
Dejar 2 lneas para respuesta

Arquitectura de la informacin: Es la manera de organizar, seleccionar, estructurar y disponer de la
informacin en los espacios del sitio, y la manera en la que se presenta dicha informacin en el sitio.
El principal objetivo es que la informacin se encuentre bien distribuida, de tal manera que facilite la
comprensin de la informacin. El usuario debe sentir la facilidad al momento de leer la informacin en el
sitio.

Menciona 2 ejemplos de pginas que hayas visitado en las cuales, a tu manera de ver no consideraron este
elemento:
Dejar 2 lneas para respuesta

Interaccin de medios: Se refiere a aquellos elementos multimedia que podemos incluir en sitio, como son
audio, video, imagen, texto. Esta caracterstica es de suma importancia, sobre todo si lo que se pretende es
atraer el inters del usuario. Por lo que debes seleccionar de manera adecuada aquellos elementos que se
van a incluir.

Menciona 2 ejemplos de pginas que hayas visitado en las cuales, a tu manera de ver no consideraron este
elemento:
Dejar 2 lneas para respuesta

Si consideramos los elementos mencionados anteriormente, podemos entonces conseguir que nuestro sitio
web sea eficiente y atractivo para el usuario. Esto mejora en gran medida la productividad e imagen de la
organizacin. Un ejemplo de un buen diseo de pgina web, considerando los elementos antes
mencionados, es la siguiente pgina:

















SINTESIS

Elabora una lista de cotejo con los elementos fundamentales del diseo de una pgina Web y sala para
evaluar diversos sitios de Internet y determinar si cumplen o no con dichas caractersticas.
Comenta con tus compaeros los resultados de esta actividad.

Resultado de aprendizaje 2
Manejar los elementos bsicos de un lenguaje utilizable en la creacin de pginas web.

Objetos de aprendizaje:
Lenguaje HTML
Estructura HTML

CONTEXTUALIZACIN
Todas las pginas que visitas en Internet, estn elaboradas en un lenguaje de bsico conocido
como lenguaje HTML (Lenguaje de marcas de hipertexto).
Durante el desarrollo de este curso se te presentarn las herramientas necesarias para que puedas ser
capaz de disear pginas web, con un lenguaje computacional bsico conocido como HTML, el cual marca
la estructura bsica que debe tener una pgina web al momento de su creacin. Recuerda que un lenguaje
computacional es el medio a travs del cual le decimos a la computadora lo que queremos que haga,
usando una serie de instrucciones preestablecidas. Es algo as como el idioma que hablan las
computadoras.
Esta seccin te proporcionar los elementos bsicos del lenguaje HTML para escribir el cdigo
correspondiente, antes de utilizar algn editor de cdigo (Dreamweaver por ejemplo) que haga ms fcil la
creacin de la pgina.
Por qu no utilizar un editor en lugar de escribir cdigo? Es muy importante tener los conocimientos
bsicos del lenguaje ante cualquier problema que se pueda presentar al momento de elaborar nuestras
pginas, ya que, el lenguaje bsico que tiene toda pgina web es HTML.

PROBLEMATIZACION

Antes de comenzar, veamos la utilidad del lenguaje HTML. Accede a alguna pgina de Internet, haz clic
derecho sobre ella. Se mostrar un men contextual. Selecciona la opcin Ver cdigo fuente, como se
muestra a continuacin:


Qu observas cuando se ejecuta esta operacin?
Dejar 4 lneas para respuesta

DESARROLLO DE COMPETENCIAS

T2 Elementos bsicos de HTML

Qu es HTML?

HTML (HyperText Markup Language), es el lenguaje para la elaboracin de pginas web. Se utiliza para
describir la estructura y el contenido de texto y sirve tambin para complementar el texto con objetos
(imgenes, video, etc.). El cdigo HTML se escribe en forma de etiquetas, acompaadas al inicio y fin por
corchetes angulares (<,>). HTML tambin puede representar en un momento dado, la apariencia de un
documento.

Como mencionamos anteriormente, una pgina web est compuesta por algunos elementos que son
bsicos al momento de su creacin. Estos elementos son etiquetas que se escriben como parte del cdigo
para elaborar una pgina. Para escribir el lenguaje HTML no se necesita un programa especial, nicamente
un editor de texto como Bloc de notas, Wordpad o el mismo Word. Para convertir tu archivo a un documento
HTML, elige la opcin requerida al momento de guardarlo.











Si utilizas el Bloc de notas, cmbiale la extensin txt por htm html al nombre del archivo.










A continuacin se describen las etiquetas bsicas del lenguaje HTML. Utiliza algn editor de texto para
probarlas.

<HTML> Indica el inicio y fin de un archivo HTML. Dentro de esta etiqueta van todas las instrucciones que
formarn parte de la pgina a crear. Su sintaxis es la siguiente:

<HTML> </HTML>

Ejemplo: <HTML> Capacitacin de Informtica </HTML>

<HEAD> Contiene informacin sobre el documento actual, tal como el ttulo, las palabras clave que sern
usadas por los buscadores y otros datos que no se consideran contenido del documento, es decir, lo que
escribas aqu no se mostrar en la pgina. Su sintaxis es la siguiente:

<HEAD> </HEAD>

Ejemplo: <HEAD><TITLE> Cabecera de la pgina </TITLE> </HEAD>


<TITLE> Esta etiqueta es necesaria y toda pgina debe tenerla, esta se encuentra siempre dentro de la
etiqueta <HEAD>. Por lo general, el ttulo aparece en la barra de ttulo encima de la ventana. Dentro de esta
etiqueta se encuentran otras que mencionaremos a continuacin. Su sintaxis es la siguiente:

<HEAD><TITLE>Mi primera pgina</TITLE> </HEAD>

Ejemplo:








<BODY> Tambin se encuentra dentro de la etiqueta <HEAD> y define el contenido principal o cuerpo de la
pgina. Esta es la parte del documento HTML que se muestra en el navegador; es decir, lo que aqu se
escriba es lo que se mostrar al usuario mediante el navegador. Recuerda que un navegador es el
programa que sirve para abrir las pginas de Internet, por ejemplo Firefox, Chrome, Explorer.

Dentro de esta etiqueta pueden definirse propiedades para la pgina, como son el color de fondo y los
mrgenes. Dentro de la etiqueta <body> se podrn encontrar diversas etiquetas para formar el cuerpo de la
pgina. Su sintaxis es la siguiente:

<BODY> </BODY>

Ejemplo:








Algunas de las etiquetas que podemos encontrar en el cuerpo del documento, son las siguientes:
<h1> a <h6>: Sirve para poner encabezados o ttulos con diferentes tamaos.
Ejemplo:






Se mostrar:





<table>: Se puede utilizar para definir una tabla.
<tr>: Coloca una fila de una tabla.
<td>: Establece una celda de una tabla (debe estar dentro de una fila).
Ejemplo:










En el navegador se mostrar:

<a>: Coloca un hipervnculo o enlace, dentro o fuera de la pgina. Debe definirse hacia donde se enva el
enlace por medio del atributo href.

Ejemplo:
<a href="http://www.cobay.edu.mx">Visita nuestra pgina Cobay.edu</a>.
En el navegador se mostrar:

<div>: Permite crear una divisin de la pgina.
<img>: Sirve para colocar una imagen en la pgina. Requiere del atributo src, que indica la ruta en la que
se encuentra la imagen.
Ejemplo:
<img src="C:\Users\Public\Pictures\Sample Pictures\LogoCobay.bmp">
En el navegador observars:










A esta etiqueta se le pueden aadir varios atributos para modificar la manera en que un navegador muestra
una imagen. Estos atributos son los siguientes:

width="x" : Permite al navegador predeterminar el ancho, en pixeles, que tendr tu imagen.
height="x" : Junto con el atributo width, el navegador puede preparar el espacio necesario para tu imagen
antes de que se muestre.
border="x" : Para aadir o eliminar un borde, donde la x ser un valor numrico.
align="x": Puedes alinear una imagen horizontal y/o verticalmente en una pgina usando este atributo.
alt="descripcin_de_la_imagen" : El atributo te permite describir la imagen para los navegadores de slo
texto, as como etiquetar la imagen antes de que se cargue en una pgina.
hspace="x": Se usa para aadir espacio vaco, con un valor numrico, en la coordenada horizontal de una
imagen.
vspace="x" : Controla el espacio de la imagen en las coordenadas verticales.

<li><ol><ul>: Etiquetas para crear listas con numeracin o vietas.
Ejemplo:







En el navegador notars:

<b>: Muestra un texto en negrita.
<i>: Muestra un texto en cursiva.
<s>: Muestra un texto con tachado.
<u>: Pone subrayado a un texto.
En algunas etiquetas como <table>, habrs podido observar que tienen, adems del nombre de la etiqueta,
otra pequea instruccin conocida como atributo. Estos atributos permiten agregar ms caractersticas a las
instrucciones HTML. Un ejemplo es el atributo border de la etiqueta table, que permite ponerle un borde a
la tabla, ya que si no se agrega ese atributo, no se mostrarn los bordes de la tabla.

ACTIVIDAD 1
De las etiquetas mencionadas anteriormente, investiga cuales son los atributos que podremos utilizar para
hacer ms vistosa la pgina. Anota tambin para qu sirve cada atributo.
Etiqueta Atributos Descripcin del atributo



















Qu hacer cuando no se muestran los acentos en mi pgina?
Es importante tambin tomar en cuenta que cuando se disea una pgina web, y en ella hay textos que
contienen acentos o smbolos especiales, no siempre van a ser mostrados por el explorador. A continuacin
se presenta una tabla con algunos cdigos para colocar smbolos:
Carcter cdigo HTML Carcter cdigo HTML
&aacute; &Aacute;
&eacute; &Eacute;
&iacute; &Iacute;
&oacute; &Oacute;
&uacute; &Uacute;
&uuml; &Uuml;
&ntilde; &Ntilde;
&iexcl; &iquest;

ACTIVIDAD 2
Investiga en libros o internet, otras etiquetas que te puedan servir para darle una mejor presentacin a tu
pgina, por ejemplo Cmo poner una imagen de fondo? Cmo establecer tipo, color y tamao de letra?
Cmo centrar elementos en la pgina? Cmo dejar espacios entre prrafos? Etc. Cpialos aqu junto con
su sintaxis y algn ejemplo.

ETIQUETA DESCRIPCIN SINTAXIS EJEMPLO













T2 Estructura bsica de HTML
Todas las pginas que abres en internet estn diseadas con base en la estructura de HTML, por eso es
importante que conozcas esta estructura para comenzar a crear tus pginas. A continuacin se muestra
esta estructura bsica, en donde encontrars distribuidas las etiquetas descritas.

<HTML>
<HEAD>
<TITLE>Ttulo de la pgina </TITLE>
</HEAD>
<BODY>
En esta seccin se colocan todas las instrucciones para el diseo de la pgina
</BODY>
</HTML>

En la siguiente actividad se muestra un ejemplo del uso y finalidad de la estructura y las etiquetas del
HTML.

Actividad 3

Copia en el bloc de notas el siguiente cdigo HTML:



















Guarda el archivo con el nombre practica1.HTML. Accede al archivo mediante el explorador y observars
que la pgina se muestra de la siguiente manera:


Haz doble clic sobre l y en seguida se mostrar la siguiente pgina:



Para poder acceder al cdigo de la pgina podrs hacerlo dando clic derecho en cualquier espacio de la
pgina y seleccionando la opcin Ver cdigo fuente. Otra manera es ir directamente a la ubicacin donde
est guardado el archivo, dar clic derecho sobre el y seleccionar la opcin abrir con...; posteriormente
seleccionar la opcin Bloc de notas.

Actividad 4

Disea y elabora una pgina en donde agregues a todos tus compaeros de grupo. En ella debers mostrar
sus fotos y descripciones de cada uno de ellos. Haz uso de tu creatividad y disea una pgina que llame la
atencin del usuario. Incluye en ella diversas herramientas como son tablas, enlaces, imgenes y objetos
que hagan visible tu pgina.

Actividad 5
Escribe el cdigo HTML para crear una pgina como la siguiente:



Agrega ms productos a la pgina con sus respectivas descripciones, puedes hacer modificaciones en el
diseo.


SNTESIS

Contesta lo siguiente:
1. Cul es la importancia de conocer el lenguaje computacional para pginas Web?
Dejar 3 lneas para respuesta
2. Para qu sirven las etiquetas de HTML?
Dejar 3 lneas para respuesta
3. Cul es la diferencia entre etiqueta y atributo?
Dejar 3 lneas para respuesta
4. Por qu es importante conocer la estructura bsica de HTML?
Dejar 3 lneas para respuesta
5. Qu aspectos debes considerar al crear una pgina Web usando el lenguaje HTML?
Dejar 3 lneas para respuesta
6. Escribe ejemplos de lenguajes computacionales similares al HTML.
Dejar 3 lneas para respuesta

Resultado de aprendizaje 4
PUBLICAR PGINAS WEB

Objetos de aprendizaje
Publicacin de la pgina web


CONTEXTUALIZACIN
A lo largo de este submdulo has aprendido a disear una pgina web, considerando aspectos
importantes para hacer un sitio eficiente y ptimo. Tambin has conocido y aprendido a utilizar el lenguaje
HTML para crear pginas web mediante cdigo. Por ltimo aprendiste a utilizar el programa Dreamweaver
para darle una mejor vista a tu pgina y crearla de una manera sencilla. Pero para poder ver concretado
todo lo anterior, es importante que otras personas vean tu trabajo, es por ello que en esta seccin nos
enfocaremos a mostrarte qu hacer para subir tu sitio y que pueda servir a otros usuarios de internet.

PROBLEMATIZACION
Una vez que diseo y pruebo mi pgina web Cmo puedo acceder para acceder a ella desde cualquier
computadora con Internet?
Dejar 3 lneas para respuesta

Qu necesito para subir una pgina o sitio web a Internet?
Dejar 3 lneas para respuesta

Se le paga a alguien por subir una pgina a Internet?
Dejar 3 lneas para respuesta

Insertar imagen relacionada con la publicidad en internet

DESARROLLO DE COMPETENCIAS

T2 Publicacin de la pgina web

T3 Elementos a considerar para subir una pgina

Antes de subir una pgina a Internet es importante tomar en cuenta ciertos aspectos:
1. Todos los elementos que forman parte de tu sitio deben estar almacenados en una sola carpeta. Es
recomendable crear una carpeta especialmente para almacenar las imgenes.
2. Como sugerencia no satures tu sitio con imgenes, es decir, trata de que tus pginas no contengan
slo grficos, ya que mientras la diseas y pruebas en tu computadora, no te dars cuenta de
cunto tarda en cargar cada una, pero cuando la subas a internet y accedas a ella notars que la
velocidad de descarga disminuye considerablemente.
3. Verifica que las rutas de ubicacin de tus imgenes sean relativas y no locales, para que puedan
cargarse a Internet sin problemas. Un ejemplo es cuando tienes <img
src=C:\Cuerpo\imagenes\imagen.jpg>. Esta imagen tiene una ubicacin local (funciona para el
equipo donde se encuentra) y habra que cambiarla a <img src=imagenes/imagen.jpg>.
4. No usar maysculas ni acentos al momento de nombrar los archivos. Tambin evita dejar espacios
en blanco, en lugar del espacio es recomendable usar _ -.
5. La pgina principal de tu sitio debe ser nombrada como Index.htm, ya que cuando se ingrese a la
direccin del sitio automticamente el servidor buscar dicho archivo, si no lo encuentra solo se
mostrar una lista de los archivos contenidos en la carpeta correspondiente al sitio.

T3 Conceptos relacionados con un sitio de internet

A lo largo del proceso que seguirs para subir un sitio a internet te encontrars con algunos conceptos que
es probable que nunca hayas escuchado mencionar y sobre todo que tampoco sepas a que se refieren.

Hosting
Se refiere al alojamiento web que se proporciona a los usuarios para poder almacenar informacin en
Internet, como por ejemplo imgenes, video, etc., a los que se puede tener acceso desde cualquier equipo
con Internet. El servicio de Hosting lo ofrecen compaas que proporcionan espacios en un servidor para los
clientes.
Dominio
Es el nombre que permite acceder a los servicios de Internet sin la necesidad de escribir una direccin IP.
Facilita la movilidad entre diferentes lugares de internet, los cuales tienen una direccin IP diferente.
FTP (File Transfer Protocol)
Es el protocolo de transferencia de archivos entre sistemas que se encuentran conectados a una red TCP.
Permite que desde un equipo (cliente) nos podamos conectar a otro (servidor) para descargar archivos
desde l o para enviarle nuestros archivos.
HTTP (Protocolo de transferencia de hipertexto): es el protocolo ms utilizado en Internet. El propsito
del protocolo HTTP es permitir la transferencia de archivos (principalmente, en formato HTML) entre un
navegador (el cliente) y un servidor web localizado mediante una cadena de caracteres denominada
direccin URL.
Ancho de Banda
Es la capacidad de transferencia de datos de un sistema de comunicaciones. Tasa mxima de transferencia
de dicho sistema. Cantidad de datos que se pueden enviar en internet.

T3 Subir una pgina a internet
Una vez que tu pgina est lista, tomando en cuenta los elementos anteriores, debes elegir un proveedor de
hosting, ya sea gratuito o de paga. En Internet puedes encontrar algunos servidores hosting gratuitos en los
cuales solo debes registrarte para utilizar el servicio que ofrece. Cabe mencionar que los servidores
gratuitos en algunos casos no te permitirn elegir el nombre de dominio para tu sitio, sino que te lo asignar
de forma automtica. Algunos servidores de hosting en espaol son:
Iespana
Metropoli 2000
Freeservers
Galen
Mi Arroba
Elige uno y regstrate llenando el formulario de suscripcin que te presentan. El proveedor debe
proporcionar un panel de control donde podrs administrar el sitio y subir archivos. Tambin te facilitar los
datos de conexin por FTP para poder subir directamente los archivos. Anota los datos importantes que te
proporcionan como:

Direccin FTP: usuario@dominio.com
Usuario: es el nombre de usuario que elegiste al registrarte.
Password: el que hayas escrito en tu registro.
Despus de haberte registrado con xito y obtener los datos antes mencionados, es importante que cuentes
con un servidor FTP. El que usaremos para explicar este tema es el FileZilla. Una vez instalado al servidor
FTP agrega los datos de conexin que se muestran a continuacin:



En la ventana de FTP te solicitarn el Usuario, Password y Puerto. En el caso del puerto puedes omitirlo a
menos que tu proveedor te indique el puerto. Despus hars clic en Quickconnect.
Una vez hecha la conexin, en el panel izquierdo podrs observar el rbol de carpetas del equipo. En el
panel derecho se observarn las carpetas del servidor, ah busca una con el nombre www o public_html y
haz doble clic encima para abrirla. Luego selecciona los archivos de tu sitio y arrstralos al panel izquierdo o
haz clic derecho con el mouse y selecciona la opcin Upload.
Despus de que se hayan cargado los archivos ya puedes acceder a tu sitio con la direccin proporcionada
por el proveedor o con el dominio que hayas elegido.

Actividad 15
Ahora que tienes listo tu sitio web sbelo a internet, elige el servidor hosting que ms te guste para realizar
la operacin.

SINTESIS
En una computadora con acceso a Internet, localiza tres pginas de tus compaeros y verifica que
funcionen correctamente. Anota las observaciones que tengas sobre ella y comprtelas con el grupo.

REALIMENTACIN

En las actividades desarrolladas a lo largo de este submdulo, pudiste manejar las herramientas necesarias
para crear y publicar pginas web con un diseo profesional. Las pginas que creaste deben contar con la
mayora de las caractersticas requeridas para que puedan considerarse como un buen producto. Elabora,
con ayuda de tu facilitador, listas de cotejo para evaluar dichos productos e identificar el avance que has
tenido. En caso de que no alcances un nivel requerido de aprendizaje, el facilitador aplicar diferentes
estrategias para lograrlo.










EVALUACION DE LA COMPETENCIA

Como sugerencia para la valoracin de los saberes adquiridos se propone el siguiente proyecto de
evaluacin.

Proyecto: Publicacin en Internet de un producto o servicio
Problema: Utilizar el programa Dreamweaver y sus herramientas para el desarrollo y publicacin
de un sitio web.
Duracin: Dos semanas
Puntuacin: Determinado por el facilitador dentro de la evaluacin sumativa
Competencia: Elaboracin de pginas web
Actividades: Sern establecidas por el facilitador con base en los requerimientos del proyecto
Recursos: Gua didctica de Capacitacin de Informtica 6 Semestre, Software Macromedia
Dreamweaver MX (o posterior), Internet, Hardware equipo de cmputo, archivos de
audio y video, proyector de datos.
Normas: El trabajo finalizado se entregar en la fecha acordada, salvo alguna excepcin, la cual
quedar a criterio del facilitador.
Si el profesor realiza una revisin previa a la entrega, el trabajo ya debe tener un
avance; lo contrario puede significar puntos menos en la calificacin.
Aunque se puede recibir ayuda en la elaboracin, el trabajo debe ser original. Si se
comprueba alguna copia de otro trabajo, el proyecto quedar anulado, y el facilitador
determinar la sancin.
El facilitador determinar los niveles de desempeo esperados. Ver rbrica de
evaluacin del proyecto.

Rbrica de evaluacin del proyecto.

Criterio de desempeo

Nivel de logro o desempeo
Alto Medio Bajo (insuficiente)

Puntos _____


Puntos _____


Puntos _____

1. Utiliza los
elementos
fundamentales de
diseo en el
desarrollo de
pginas web

2. Utiliza los
elementos del
lenguaje HTML
para la creacin
de pginas web
con base en los
requerimientos

3. Crea el sitio web
considerando los
elementos de
ubicacin y


contenido.
4. Crea la pgina
web empleando
las herramientas
necesarias de
diseo y edicin

5. Emplea las vistas
de diseo, cdigo
y divisin para
desarrollar la
pgina web


6. Agrega texto con
formato a la
pgina web
mediante las
herramientas
necesarias


7. Agrega imgenes
a la pgina web
tomando en
cuenta sus
propiedades


8. Inserta
hipervnculos en la
pgina web
usando la
herramienta
correspondiente
para enlazarlos a
una ubicacin
distinta


9. Agrega tablas a la
pgina web para
organizar la
informacin segn
los requerimientos


10. Emplea los
marcos en una
pgina web segn
los requerimientos
de espacio y
contenido

11. Publica una
pgina web
mediante un
servidor de
hosting para su
acceso en Internet



REFERENCIAS BIBLIOGRFICAS

http://www.aulaclic.es/dreamweaverMX/
http://www.programatium.com/dreamweaver.htm
Macromedia Inc., Manual Utilizacin de Dramweaver, Septiembre 2003