2

0
1
4

D
I
S
E

O

W
E
B

P
R
O
F
E
S
I
O
N
A
L

Con esta capacitacin aprenders a disear, planificar y elaborar una
pgina web adems conocers el proceso para registrar un dominio y
poder alojar en l las pginas diseadas.
Tambin utilizars un conjunto de Herramientas imprescindibles para el
diseo web como ser Dreanweaver, Photoshop, Illustrator y Flash.
Titam Consultora
info@titamconsultora.com.ar
Facebook/consultoratitam
@titamconsultora

Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
2
CLASE I : PRIMEROS PASOS- CONCEPTOS BSICOS
Introduccin
El lenguaje que se utiliza para crear una pgina web es el HTML, Hyper Text Markup
Lenguage (Lenguaje de Marcas de Hypertexto).
Vamos a explicar brevemente que queremos decir con esto. Lo fundamental para
escribir pginas web es saber HTML pero no es suficiente. Si quieres poner una imagen en
tu pgina necesitars saber un poco sobre grficos web, para recortar la imagen al tamao
adecuado, si quieres poner un men desplegable es conveniente que conozcas algo sobre
JavaScript, si quieres recoger datos de los usuarios mediante un formulario es conveniente
hacerlo con un lenguaje tipo PHP.
Tambin es conveniente utilizar un editor web para facilitar la escritura de pginas web,
como KompoZer, para que tu pgina sea agradable es conveniente saber algo sobre diseo
web, y por ltimo para que todo el mundo mundial vea tu trabajo necesitars subir tu
pgina a un servidor de Internet y darla a conocer.
Pues bien, todo esto y un poco ms es lo que hay en este curso. Adems hemos
intentado explicarlo de forma que lo pueda entender cualquier persona sin conocimientos
previos sobre todos estos temas. Dicho as, parece una misin casi imposible, esperamos
que sigas todo el curso y llegues al final cumpliendo estas expectativas. Es un reto
complicado pero esperamos crear un curso que sea un punto de partida a este apasionante
mundo de la comunicacin global a travs de Internet y te dote de la visin general que te
permita avanzar hasta lograr crear pginas web atractivas y completas. A final del curso
estamos seguros que logrars crear conocimiento y ponerlo a disposicin de las personas,
y algo del espritu de colaboracin y gratuidad desde el que est hecho este curso quizs
llegue a contagiarte un poco. Se acaba dando parte de lo que se recibe.
Alternativas
Crear pginas web es la forma bsica de comunicar en Internet, pero no la nica, ni la
ms adecuada para todos los casos.
Si te gusta la informtica y quieres tener tu propio sitio web como una aficin, o si
quieres crear un sitio web para tu club de ftbol, tu pequea empresa o para dedicarte
profesionalmente al mundo de Internet, este curso, probablemente, te interesar mucho.
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
3
Si en cambio la tecnologa te espanta un poco y slo te interesa la parte ms literaria
seguramente haya otras formas de publicar en Internet que te resulten ms adecuadas,
como, por ejemplo, los blogs. Escribir contenidos en un blog es ms sencillo que crear una
pgina web aunque menos flexible. En cualquier caso, puedes empezar a leer el curso,
quizs te sorprenda lo sencillo que es crear una pgina web.
Qu es una pgina web?
Una pgina web es un documento de texto con marcas, llamadas etiquetas (tags en
ingls). Cuando este documento se ve a travs de un navegador web, las etiquetas se
interpretan y se visualiza el documento como una pgina web. Las etiquetas no se
muestran pero determinan el aspecto de la pgina, y otras caractersticas, por ejemplo, si
el texto es un enlace, en la etiqueta se indica la pgina a la que nos lleva el enlace.
Por lo tanto, si somos capaces de escribir un documento de texto, seremos capaces de
escribir una pgina web. Slo necesitamos conocer el lenguaje de las etiquetas o HTML.
Vamos a comenzar por escribir una pgina web muy sencilla. Para ello utilizaremos un editor de
texto sin formato, como puede ser el Bloc de notas (Notepad) includo en Windows. Puedes
encontrarlo en Todos los programas Accesorios. El aspecto del Bloc de notas es muy simple,
una hoja en blanco con una barra de mens.

Escribiremos el siguiente cdigo. Ms adelante ya veremos qu es cada elemento:
<html>
<head>
<title>Mi primera pgina</title>
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
4
</head>
<body>
<p>Hola mundo</p>
</body>
</html>

Una vez escrito, vamos a guardarlo. Pero antes de continuar, debemos de explicar que lo
es la extensin de un archivo. La extensin indica de qu tipo es un archivo. La extensin
son las tres letras que van despus del punto al final del nombre de un archivo (por
ejemplo, imagen.gif o documento.doc). Puedes abrir cualquier carpeta para comprobarlo.
Si no puedes ver las extensiones, es porque Windows las oculta. Si es tu caso, puedes hacer
que las muestre a travs del men Organizar Opciones de carpeta y bsquedas,
pestaa Ver, desmarcando la opcin Ocultar extensiones de archivo para tipos de
archivos conocidos, en Windows Vista. En Windows XP encontramos esta opcin en el
men Herramientas Opciones de carpeta, tambin en la pestaa Ver.
Vamos a continuar guardando la pgina. Pulsamos en el men Archivo y
elegimos Guardar. Introducimos el nombre, por ejemplo Primera. Si ahora pulssemos
Guardar, se guardara con la extensin txt, que indica que es un documento de texto sin
formato. Para guardarlo como una pgina web, debemos de emplear la extensin . htm (o
.html). Por lo que completamos el nombre para que quede Primera.htm y
pulsamos Guardar.

Nota: Es conveniente que guardes los archivos creados durante el curso en la misma
carpeta.
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
5
Ahora, utilizando el Explorador de Windows, abrimos la carpeta en la que hemos
guardado el archivo y hacemos doble clic sobre el. Como el archivo tiene extensin .htm,
se abrir la pgina con el navegador que tengamos como predeterminado. Por ejemplo,
en Internet Explorer 7, el resultado se ve as:

Observa que no se muestra todo lo que hemos escrito. Si te fijas en el documento del
Bloc de notas, vers que todo lo que aparece entre los signos < y > no se muestra. Esos
signos delimitan una etiqueta de HTML, y todas las que hemos utilizado siguen el
formato <etiqueta>contenido</etiqueta>. Por ejemplo, la etiqueta <title> contiene el texto
que se mostrar como ttulo de la pgina, y la etiqueta <p> indica un prrafo con texto
normal.
Por lo tanto, un navegador web es una aplicacin capaz de interpretar el cdigo HTML,
formado por etiquetas y mostralo debidamente formateado. En cualquier momento,
podemos ver el cdigo HTML de la pgina que estamos viendo. En Internet Explorer,
podemos hacerlo desde el men Ver Cdigo fuente, y se mostrar utilizando el Bloc de
notas. EnMozilla Firefox lo hacemos tambin desde el men Ver, eligiendo la
opcin Mostrar el cdigo fuente de la pgina (teclas Ctrl + U), y muestra el cdigo fuente
formateado con colores. Puedes probarlo viendo el cdigo fuente de esta pgina.
Qu es un sitio web?
Cuando tenemos varias pginas, podemos organizarlas en un sitio web. Un sitio no es
ms que una carpeta que se encuentra en un equipo informtico, ya sea nuestro
ordenador personal o un potente servidor. La primera carpeta es la carpeta raiz. Por
ejemplo, si accedemos a "www.aulaclic.es", estamos accediendo a la carpeta raiz del sitio
de aulaClic.
Cuando escribimos "www.titamconsultora.com.ar" en el navegador, en realidad estamos
accediendo a la pgina www.titamconsultora.com.ar/index.htm, es decir, al escribir una
direccin que no acaba en .html (o en .html), el navegador lo interpreta como el nombre
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
6
de una carpeta y busca en ella un archivo que se llame index.htm, si no lo encuentra
devuelve el mensaje del tipo "No se puede encontrar la pgina web".
Tal como lo haramos con una carpeta de Windows, podemos organizar nuestro sitio con
subcarpetas. Por ejemplo, una carpeta con todas las imgenes, otra con los vdeos, etc.
Coloquialmente, es frecuente referirse a un sitio web slo como pgina web, por
ejemplo "se ha actualizado la pgina web del ministerio", aunque no nos estemos
refiriendo a una pgina en concreto.
Veremos ms detenidamente qu es un sitio web cuando creemos los sitios para
nuestras pginas, ms adelante.
Dnde alojamos una pgina web?
El alojamiento puede ser gratuito. Normalmente es una opcin para pginas personales.
Varios Portales en Internet proporcionan alojamiento gratuito con ciertas
restricciones.
Para las empresas lo normal es pagar un alojamiento para sus pginas.
El alojamiento se realiza siempre en un servidor que nos ofrece el servicio de hosting. Es
decir cuando visitamos pginas webs en realidad estamos accediendo a archivos en un
servidor web.
EL SERVICIO DE HOSTING
Existen servidores que se encargan almacenar la informacin completa de una pgina
web. A este servicio de almacenamiento se le conoce como Servicio de Hosting.
El servicio de Hosting es de gran importancia para poder estar en internet, sin ste
servicio no podramos guardar nuestras pginas web para que puedan ser visualizadas.
El servicio de hosting tiene varias caractersticas:
Espacio Web: Cantidad de Disco disponible para almacenar nuestro sitio web.

Ancho de Banda: Cantidad de datos que se pueden transferir mensualmente. Para
medir el ancho de banda, se toma el tamao en megas de los datos.
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
7
Cuentas de Email: Nmero de casillas de correo que tenemos disponibles. Tambin
existen lo que se conoce como Alias de Correo, que son correos que redireccionan la
informacin de un email recibido por el alias, a un correo especificado.
Servidor FTP: Es un servidor que sirve para conectarse a nuestro servidor web a travs
de el protocolo FTP. Esto nos permite manipular los archivos que se encuentren en
nuestra pgina web.
Servidores POP: Este servidor nos permite revisar nuestro correo de email. A travs de
l, podemos manipular los correos (leer, borrar). para poder enviar un correo
necesitamos del Servidor SMTP.
Servidores SMTP: Es el encargado de enviar los mensajes de email.
Lenguajes de Programacin admitidos: son los diferentes lenguajes de programacin
que se pueden ejecutar en nuestro servidor. Estos lenguajes dependen del tipo de
servidor en el que estemos: Si nuestro servidor es Windows, podemos ejecutar los
lenguajes: ASP, ASP.NET1, ASP.NET2 (Codebehind), Perl 5.x, C++, SSI, algunos servidores
windows, tienen instalado APACHE WEB SERVER que permite ejecutar los lenguajes
PHP; Los Servidores que estan bajo Linux pueden ejecutar: HTML, VRML, Java, Perl,
PHP4, TCL, Python, CGI, SSI, JavaScript.
Estadsticas: El inters de todo webmaster o propietario de un sitio web, es ver cuanta
gente entra a la pgina, cual es la pgina mayor visitada, de donde provienen los
visitantes, cual es la palabra que ms buscan, etc. Para saber sto, es necesario tener
instalado un software de estadsticas, los ms conocidos son: WebAlizer, AWStats,
Urchin, WebStats, etc.
Panel de Control: Es el software que nos permite manipular nuestro sitio web: Crear
Emails, Subir Archivos, Instalar Aplicacines, etc. Existen diferentes software para panel
de control dependiendo tambin del tipo de servidor (Windows o Linux) algunos
software estn diseados para manipular ambos entornos.
El resto de caractersticas del servicio de hosting, ya dependen del proveedor del
servicio, algunos tienen scripts que pueden ser instalados desde el panel de control tales
como: OsCommerce (Comercio Electrnico), PHPBB (Foro de Discusin), PHP-Nuke
(Manejador de Contenidos), etc.

Cmo obtenemos una direccin URL?
Cuando visitamos pginas web en realidad estamos accediendo a archivos en un servidor
web. La direccin o URL tiene este formato:
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
8
http://www.nombredominio.com/directorio/paginaweb.htm
Donde http:// es el protocolo y www. indica el sistema de pginas web. Habrs
observado que no hace falta escribir esto en el navegador. Pero es porque el navegador se
encarga de aadirlo, no porque nos sea necesario. nombredominio.com es el nombre del
sitio. Al ir directamente ah, vamos a su pgina de inicio. La ltima parte indica el archivo
del sitio que estamos viendo. En este caso, una pgina llamada paginaweb.htm que est en
una carpeta llamada directorio.
Podemos visitar una direccin desde un buscador o desde un enlace en otra pgina.
Podemos teclear la direccin en la barra de direcciones del navegador o acceder desde
nuestros favoritos.
Con relacin a la direccin de la pgina tenemos dos primeras opciones:
1. Si queremos tener nuestra propia direccin. Como por ejemplo titamconsultora.com.ar.
Tenemos que pagar el registro para obtener el dominio.
2. Otra opcin es utilizar un alojamiento gratuito. El alojamiento gratuito tiene ciertas
limitaciones por lo que se suele utilizar para pginas personales. Una direccin del tipo
http://geocities.com/Paris/2226/principal.htm es una direccin de una pgina alojada
en un servidor gratuito.
Cuando queremos acceder a una pgina proporcionamos un dominio que es traducido
en los Servidores DNS y localizado. Cuando sabemos en qu Servidor Web se encuentra la
pgina que queremos visitar se procede a su descarga y visualizacin en el navegador
del PC.
Para adquirir un dominio ar, hay que registrarse en la Repblica Argentina en NIC
Argentina que es el administrador de los nombres de dominio bajo el cdigo pas
(ccTLD) .ar. Acta bajo la denominacin de Direccin Nacional del Registro de Dominios de
Internet y depende de la Secretaria Legal y Tcnica de la Presidencia de la Nacin de
la Repblica Argentina.

Administra dominios .com.ar, .org.ar, .net.ar, .tur.ar, mil.ar, int.ar entre otros.
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
9
Te invito a que ingreses a la pgina de NIC https://nic.ar/ y te informes de cules son los
pasos para registrar tu dominio.
Los dominios se pagan Anualmente y tienen un valor de acuerdo al tipo de dominio
(com.ar; net.ar; etc)
Luego de comprar el dominio, hay que configurarlo para que pueda funcionar en la red
de redes:
1. Configurar los DNS: Los DNS son los Nombres de Dominio que contienen la
informacin de enrutamiento hacia el servidor hosting, Esta informacin de enrutamiento
son los IP del servidor de Hosting. Un dominio no sirve de nada, si no se configura en un
servidor de Hosting.
2. Configurar la informacin de Contacto: Los dominios tienen diferente informacion de
contacto, est la informacin de contacto del Registrante, la informacin de contacto de la
parte tcnica del dominio, la informacin de contacto de la entidad que registra el
dominio, etc.
3. Luego de realizar estos cambios, se debe esperar alrededor de unas 24 horas para que
sta informacin se vea reflejada en todo el mundo.
Qu es un domino?
En trminos sencillos, un dominio es una direccin en Internet, que permitir que
fcilmente cualquier usuario de la red localice nuestra pgina web o nos escriba un correo
electrnico sin necesidad de tener que recordar una serie de 4 nmeros (IP).

Por ejemplo, es mucho ms sencillo recordar una web como guiawebmaster.com
(dominio), que a travs de 62.129.173.163 (IP).

Uno de los aspectos ms relevantes de los dominios es que son nicos. Es decir, es
completamente imposible que dos personas, empresas u organizaciones tengan
simultneamente el mismo nombre de dominio en Internet, de forma que el dominio se
convierte en una autntica sea de identidad en la red.
Titam Consultora
Mitre esq. Rivadavia- Tel.03585-420927- ADELIA MARIA
Dixon y Vaggione- Tel. 03582- 15415363- CNEL. MOLDES
www.titamconsultora.com.ar info@titamconsultora.com.ar

/consultoratitam @titamconsultora
10
Resumiendo para crear y alojar una pgina web
Para crear pginas Web como titamconsultora.com.ar podemos emplear muy
diferentes mtodos y programas.
Primero debemos crear los archivos que componen la web. Una Web
normalmente se compone de un cierto nmero de pginas
Luego debemos registrar un dominio y obtener una direccin web en NIC
Tener un alojamiento o servidor en Internet donde colocar la Web. Lo normal es
construir la web y tenerla en el disco duro de nuestro ordenador y luego enviarla
a un servidor de Internet. Un servidor de Internet en realidad es otro ordenador
que est permanentemente encendido y conectado a la Red.
Y enviar los ficheros normalmente desde el disco duro de su ordenador al sitio
donde se alojar la pgina. Algunos Portales permiten la creacin y alojamiento
de pginas personales directamente en Internet de forma sencilla.