Conceptos bsicos

Qu es WWW?
Qu esHTML?
Evolucin del lenguaje
Clientes y servidores
Protocolo de direccionamiento de documentos. El URL

Qu es WWW?
El servicio Web o WWW es una nueva forma de representar la informacin
en Internet basada en pginas. Una pgina WWW puede incluir tres tipos de
informacin: texto, grficos e hipertexto. Un hipertexto es texto resaltado que
el usuario puede activar para cargar otra pgina WWW. La diferencia entre un
documento hipertexto y un documento normal consiste en que el hipertexto
contiene, adems de la informacin, una serie de enlaces o conexiones con
otros documentos relacionados, de manera que el lector puede pasar de un
tema a otro y volver al documento original en el momento en que le interese.
VENTAJAS
Las principales ventajas del servicio WWW son tres.
Primera, que puede combinar texto y grficos.
Segunda, que los hiperenlaces permiten cargar pginas de cualquier otro
servidor conectado a Internet, da igual que est localizado en Espaa o en
Australia.
Tercera, que la creacin de pginas WWW es bastante sencilla mediante el
lenguaje HTML.
El gran xito de Web no se debe solamente al empleo del hipertexto. Es
normal encontrar que los documentos WWW estn compuestos de texto y
Estructura de un documento
HTML

grficos, y los enlaces con otros documentos pueden ser palabras clave
subrayadas o resaltadas en el texto, pero tambin la totalidad de una imagen o
incluso partes de ella (como un mapa "sensible", que permite acceder a
informacin sobre una ciudad haciendo un "click" del ratn sobre un
determinado detalle del plano). Las ltimas versiones de los programas
navegadores (y la mayor rapidez de las telecomunicaciones) permiten integrar
en un mismo documento texto, grficos, sonidos o, incluso animaciones de
vdeo. Estos documentos compuestos son los que reciben el nombre
de hipermedia.
(PC WORLD Junio 1995)
Inicio

Qu es HTML?
HTML, HyperText Markup Language, es un lenguaje simple utilizado para
crear documentos de hipertexto para WWW. No es un lenguaje de descripcin
de pgina como Postcript; HTML no permite definir de forma estricta la
apariencia de una pgina, aunque una utilizacin algo desviada hace que se
utilice en ocaciones como un lenguaje de presentacin. Adems, la
presentacin de la pgina es muy dependiente del browser (o programa
navegador) utilizado: el mismo documento no produce el mismo resultado en
la pantalla si se visualiza con un browser en modo lnea, Mosaic o Netscape, o
sea, HTML se limita a describir la estructura y el contenido de un documento,
y no el formato de la pgina y su apariencia.
Una de las claves del xito de WWW, aparte de lo atractivo de su
presentacin es sin duda, su organizacin y coherencia. Todos los documentos
WWW comparten un mismo aspecto y una nica interfaz, lo que facilita
enormemente su manejo por parte de cualquier persona. Esto es posible
porque el lenguaje HTML, en que estn escritos los documentos, no solo
permite establecer hiperenlaces entre diferentes documentos, sino que es un
"lenguaje de descripcin de pgina" independiente de la plataforma en que se
utilice. Es decir un documento HTML contiene toda la informacin necesaria
sobre su aspecto y su interaccin con el usuario, y es luego el browser que
utilicemos el responsable de asegurar que el documento tenga un aspecto
coherente, independientemente del tipo de estacin de trabajo desde donde
estemos efectuando la consulta.
Su simplicidad es tal que no es necesario utilizar un editor particular. Su gran
permisividad exige rigor y atencin en la estructura de documentos con el fin
de que stos se visualicen correctamente al margen del contexto y el browser
utilizado.
Por tanto, como hemos visto, HTML es un lenguaje muy sencillo que nos
permite preparar documentos Web insertando en el texto de los mismos una
serie de marcas (tags) que controlan los diferentes aspectos de la presentacin
y comportamiento de sus elementos.
Para escribir HTML lo nico que se necesita es un editor de texto ASCII,
como EDIT del MS-DOS o el Bloc de notas de Windows. Las marcas o tags
que controlan el comportamiento del documento son fragmentos de texto
encerrados entre los signos "mayor que" y "menor que" (<marca>). Existen
diferentes tipos de marcas: algunas controlan simplemente la presentacin del
texto del documento; otras, la forma en que se incluirn en l imgenes; otras,
finalmente, los hiperenlaces con documentos o con diferentes partes del
mismo documento. Existen una serie de programas que ayudan en la
elaboracin de documentos HTML, como HTMLED (shareware) o HTML
Assistant, ambos para Windows, pero no son imprescindibles para escribir el
cdigo. Lo que si es necesario es un programa cliente WWW, tal como
Mosaic, o Netscape, para probar el documento a medida que lo vamos
desarrollando.
Las marcas funcionan muchas veces por parejas, una para indicar el inicio de
enlace o formato, y otra para sealar el final. La marca de inicio consiste en
una letra o una palabra (por ejemplo, estas son marcas de inicio: <B>,
<TITLE>). La marca de final es la misma letra o palabra precedida por la
barra inclinada o "slash" (es decir,</B>, </TITLE>). Existen, no obstante,
algunas marcas que no requieren su pareja de cierre, como <BR> (que fuerza
un salto de lnea). Es importante sealar que las marcas, en general pueden
estar indistintamente en maysculas o en minsculas.
Como todo lenguaje, est en constante evolucin. La versin en curso es la
versin 2.0 pero existe ya un proyecto para la versin 3.0.
Clientes y servidores WWW
Para poder utilizar el servicio Web se necesitan dos partes. Por un lado, la
empresa o institucin que quiere facilitar su informacin tiene que crear
pginas WWW, siguiendo el estndar definido por el lenguaje HTML, y
ponerlas a disposicin del pblico en Internet, en lo que se llama un servidor
WWW. Por otro lado, el usuario que quiere acceder a dichas pginas tiene que
utilizar un programa (cliente WWW) que lea las pginas WWW e interprete
su siginificado (por ejemplo, un hiperenlace). Estos programas navedores o
clientes WWW son los que permiten al ordenador del usuario interpretar el
lenguaje HTML.
Existen numerosos programas gratuitos, y algunos comerciales, para leer los
documentos WWW. El ms conocido es probablemente el Mosaic, del Centro
Nacional de Aplicaciones de Supercomputacin (NCSA) de los Estados
Unidos, del que existen versiones para diferentes plataformas (UNIX, Mac,
Windows). Otros programas muy difundidos son Netscape (cuya versin beta
es de libre disposicin y que resulta ms rpido que Mosaic), Cello, WinWeb
o MacWeb (para Macintosh). Las capacidades de los diferentes navegadores
pueden variar de uno a otro programa: aunque la mayor parte permiten el uso
de grficos como enlaces, quedan algunos como Lynx, para DOS, Unis o
VMS) que slo funcionan en modo texto.
(PC WORLD Junio 1995)
Inicio

Protocolo de direccionamiento de documentos. El
URL
Interconectar documentos por todo el planeta sobreentiende un medio nico
de identificacin en la red Internet. La direccin nica de un documento en
WWW es llamada URL -Uniform Resource Locator- y se compone de los
siguientes elementos:
el protocolo de intercambio de datos entre el cliente y el
servidor. (HTTP)
la direccin Internet del servidor que difunde los documentos.
Esta direccin es nica en toda la red, es la direccin TCP/IP de
la mquina. Tiene la forma de una serie de nmeros como
134.158.69.113; al ser estos nmeros difciles de memorizar, un
anuario (DNS) resuelve generalmente la relacin entre direccin
numrica y nombre simblico de la mquina/nombre del mbito
(ejemplo: 134.158.48.1 es la direccin de la
mquina sioux.in2p3.fr en la quesioux representa el nombre de la
mquina y .in2p3.fr el nombre del mbito);
el rbol de directorios (el camino) que conduce al documento;
el nombre del documento que tendr siempre la
extensin .html o .htm.
Menos frecuentemente esta direccin prodr completarse con otros elementos:
el puerto;
informacin de autentificacin (username y password);
argumentos que se pasarn a un programa en la llamada de un
enlace ejecutable.
La sintxis mnima utilizada para representar el URL de un documento es la
siguiente:
protocolo://nombre_del_servidor/
cuando no se especifica un nombre de fichero se acudir al fichero
predeterminado del servidor, habitualmente la home page.
La sintxis que se encuentra habitualmente es:
protocolo://nombre_del_servidor/directorio/subdirectorio/nombre_del
_documento
La sintxis completa es:
protocolo://username;password@nombre_del_servidor:puerto/directorio/sub
directorio//nombre_del _documento?argumentos
Se observar tambin en ciertas direcciones la presencia del signo tilde ( ~ )
delante del nombre de un directorio. Se trata de home pages personales,
posibilidad ofrecida a los usuarios que tienen una cuenta en la mquina
servidor.
Ejemplos de URL:
http://www.fnac.fr
http://www.ra.net/routing.arbiter/NFSNET/NFS.transition.html
http://www.in2p3.fr/~dupont/jean.dupont.html


Opcionalmente los documentos escritos en HTML empezarn por la marca
<HTML> y finalizarn con la marca </HTML> . Esta marca tan solo sirve
como identificacin del contenido del fichero para ciertos programas que
realizan cambios masivos en muchas pginas a la vez.
Los documentos escritos en HTML estn estructurados en dos partes
diferenciadas: la cabecera (<HEAD>) y el cuerpo (<BODY>).
Entre las marcas del elemento <HEAD>se podrn utilizar los siguientes
elementos:
<TITLE> para dar nombre al documento;
<META> para forzar a la pgina activa a ser cargada cada cierto
tiempo.
<BASE> para prefijar la direccin base de los documentos
referenciados mediante un URL relativo.
El fichero fuente de un documento HTML podr
contener comentarios explicativos que sern ignorados por el browser.

HEAD, TITLE, META, BASE
La cabecera se emplea para facilitar informacin acerca del documento y est
delimitada por<HEAD> prlogo </HEAD>. Normalmente esta informacin
no se ve cuando se navega por el documento.
Dentro de la cabecera se podr definir una breve descripcin que identifica el
documento mediante las marcas <TITLE> y </TITLE>. El uso de TITLE es
obligatorio ya que adems de un carcter informativo tiene otras razones para
existir:
Es el texto que el browser almacenar en el
fichero hotlist o bookmark.
Es lo que se indica en la lista que aparece en la orden Go de la
barra de menu.
Es lo que aparece en la esquina superior izquierda cuando se
imprime el documento.
En un contexto Xwindow, cuando se minimiza la ventana, el
ttulo ser tomado como nombre por el icono.
A continuacin se muestra un ejemplo del formato mnimo de la cabecera.
<HTML>
<HEAD>
<TITLE> Aqui va el nombre del documento </TITLE>
</HEAD>
Cuerpo del documento
...
</HTML>
El ttulo del documento que est usted leyendo ahora mismo se encuentra en
la parte superior de esta ventana y es "Estructura de un documento HTML",
como usted mismo podr comprobar.
En la cabecera puede utilizarse tambin el elemento <META> que puede
forzar a que la pgina activa se cargue cada cierto tiempo (indicado en
segundos mediante el atributo CONTENT).
<HEAD>
<TITLE> Ttulo de la pgina </TITLE>
<META HTTP-EQUIV="Refresh" CONTENT="10">
</HEAD>
Este ejemplo hace que el browser vuelva a cargar la pgina cada 10 segundos.
Tambin puede hacerse a un servidor, as:
<HEAD>
<TITLE> Ttulo de la pgina </TITLE>
<META HTTP-EQUIV="Refresh" CONTENT="10;
URL=http://miservidor/mipagina.htm">
</HEAD>
Esto ha de ser utilizado con mucha precaucin ya que podr sobrecargar el
servidor. Si el contenido de la pgina no va a cambiar es intil hacerlo, de
hecho, solo tendr utilidad en casos muy especiales.
El elemento <BASE HREF="URL"> define la informacin a prefijar a todo
URL incompleto en el documento. Por ejemplo, el URL
relativo "/html/test.html" corresponder de hecho a"URL/html/test.html".
Inicio

BODY
El resto del documento, o sea, todo aquello que no pertenezca a la cabecera,
residir entre <BODY> y </BODY>. Esta es la estructura mnima que debe
poseer todo documento HTML:
<HTML>
<HEAD>
<TITLE>Estructura mnima de un documento HTML</TITLE>
</HEAD>
<BODY>
Documento
...
</BODY>
</HTML>
Inicio

Comentarios
En el cdigo fuente de una pgina HTM, los comentarios se introducirn entre
las marcas: <!-- y -->. Todo texto situado entre dichas marcas ser ignorado
por el browser, y por tanto no ser visible.
Ejemplo:
<!-- Esto es una lnea de comentarios -->
Separadores de bloques de texto



Para definir y separar bloques de texto se emplean una serie de marcas que
definen prrafos, texto preformateado o bloques con significado especial
como direcciones o citas.
Marcas de bloques:
Prrafos. <P>
Saltos de lnea. <BR>
Bloques tabulados. <BLOCKQUOTE>
Lnea horizontal. <HR>
Divisiones. <DIV>
Texto preformateado. <PRE>
Direcciones. <ADDRESS>
Centrado de bloques. <CENTER>

P
<P> se utiliza para separar prrafos. Dado que para el HTML todo el texto es
continuo, necesitamos algn mecanismo para indicar el principio y el fin de
un prrafo. Las marcas inicial y final son <P> y </P>.
Ejemplo:
<P>
Este texto est contenido dentro del primer prrafo,
as que lo denominaremos: parrafo 1, prrafo 1, prrafo 1,
prrafo 1, prrafo 1, prrafo 1, prrafo 1, prrafo 1.
</P>
<P>
Este otro texto est contenido dentro del prrafo 2,
prrafo 2, prrafo 2, prrafo 2, prrafo 2, prrafo 2,
prrafo 2, prrafo 2.
</P>
Esto dar como resultado:
Este texto est contenido dentro del primer prrafo, as que lo
denominaremos: parrafo 1, prrafo 1, prrafo 1, prrafo 1, prrafo 1, prrafo 1,
prrafo 1, prrafo 1.
Este otro texto est contenido dentro del prrafo 2, prrafo 2, prrafo 2,
prrafo 2, prrafo 2, prrafo 2, prrafo 2, prrafo 2.
Normalmente no suele utilizarse la marca de fin de prrafo, </P> ya que el
texto continuar hasta que encuentre otro comienzo de prrafo <P>.
Este elemento admite el atributo ALIGN, que puede tomar uno de los
siguientes valores:
LEFT: Justifica el texto a la izquierda. (por defecto)
RIGHT: Justifica el texto a la derecha.
CENTER: El texto aparece centrado.
Ejemplo:
<P ALIGN=LEFT>
Texto justificado a la izquierda, texto justificado
a la izquierda, texto justificado a la izquierda,
texto justificado a la izquierda.
</P>
<P ALIGN=RIGHT>
Texto justificado a la derecha, texto justificado
a la derecha, texto justificado a la derecha,
texto justificado a la derecha.
</P>
<P ALIGN=CENTER>
Texto centrado, texto centrado, texto centrado,
texto centrado, texto centrado, texto centrado.
</P>
Esto dar como resultado:
Texto justificado a la izquierda, texto justificado a la izquierda, texto
justificado a la izquierda, texto justificado a la izquierda.
Texto justificado a la derecha, texto justificado a la derecha, texto justificado a
la derecha, texto justificado a la derecha.
Texto centrado, texto centrado, texto centrado, texto centrado, texto centrado,
texto centrado.
Inicio

BR
El elemento <BR> es vaco por lo que slo tiene marca inicial. Indica un salto
de lnea.
Ejemplo:
Texto 1, texto 1, texto 1, texto 1, texto 1, texto 1,
texto 1, texto 1, texto 1, texto 1, texto 1, texto 1,
texto 1, texto 1. <BR>
Texto 2, texto 2, texto 2, texto 2, texto 2.
Con esto tendremos como resultado:
Texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1,
texto 1, texto 1, texto 1, texto 1, texto 1.
Texto 2, texto 2, texto 2, texto 2, texto 2.
Inicio

BLOCKQUOTE
El elemento <BLOCKQUOTE> sirve para representar prrafos tabulados, por
la izquierda y la derecha.
Ejemplo:
Texto 1, texto 1, texto 1, texto 1, texto 1.
<BLOCKQUOTE>
Texto 2, texto 2, texto 2, texto 2, texto 2, texto 2,
texto 2, texto 2, texto 2, texto 2, texto 2, texto 2,
texto 2, texto 2.
</BLOCKQUOTE>
El resultado ser:
Texto 1, texto 1, texto 1, texto 1, texto 1.
Texto 2, texto 2, texto 2, texto 2, texto 2, texto 2, texto 2, texto 2, texto 2,
texto 2, texto 2, texto 2, texto 2, texto 2.
Inicio

HR
<HR> es un elemento vaco por lo que solo tiene marca inicial. Se emplea
para separar bloques de texto representando una lnea horizontal.
Se puede cambiar la apariencia de dicha lnea mediante los siguientes
atributos:
NOSHADE: Elimina el efecto de sombra de la lnea.
WIDTH: Permite definir la longitud de la lnea.
SIZE: Permite definir el grosor de la lnea.
Ejemplos:
<HR NOSHADE>

<HR WIDTH=250 SIZE=3>

<HR WIDTH=250 SIZE=6>

<HR NOSHADE WIDTH=400 SIZE=4>

Inicio

DIV
Este elemento se comporta de forma muy parecida al salto de lnea, <BR>, y a
su vez admite los mismos atributos que <P>: ALIGN (LEFT, RIGHT,
CENTER); o sea, permite definir un bloque con los atributos de <P>, pero
dejando tan solo un salto de lnea entre un bloque y otro.
Ejemplo:
<DIV ALIGN=LEFT>
Texto justificado a la izquierda, texto justificado
a la izquierda, texto justificado a la izquierda,
texto justificado a la izquierda.
</DIV>
<DIV ALIGN=RIGHT>
Texto justificado a la derecha, texto justificado
a la derecha, texto justificado a la derecha,
texto justificado a la derecha.
</DIV>
<DIV ALIGN=CENTER>
Texto centrado, texto centrado, texto centrado,
texto centrado, texto centrado, texto centrado.
</DIV>
Esto dar como resultado:
Texto justificado a la izquierda, texto justificado a la izquierda, texto
justificado a la izquierda, texto justificado a la izquierda.
Texto justificado a la derecha, texto justificado a la derecha, texto justificado a
la derecha, texto justificado a la derecha.
Texto centrado, texto centrado, texto centrado, texto centrado, texto centrado,
texto centrado.
Inicio

PRE
El texto insertado entre las marcas <PRE> y </PRE> ser visualizado por el
browser, respetando el formateo tal como haya sido entrado en el fichero
fuente HTML, o sea, respetando los espacios y los saltos de carro.
Ejemplo:
<PRE>
Esto es un texto preformateado, por tanto se
respetan los espacios y los saltos de

carro,
como podrn observar.
</PRE>
El resultado ser:
Esto es un texto preformateado, por tanto se
respetan los espacios y los saltos de

carro,
como podrn observar.
Inicio

ADDRESS
El elemento <ADDRESS> se emplea para indicar que un texto representa una
direccin o una firma mostrndolo, generalmente, en letra cursiva. Es muy
utilizado para indicar toda la informacin respecto al autor del documento
(direccin, telfono, e-mail,...). Puede insertarse en cualquier lugar del
documento; lo habitual en WWW es incluir esta zona de direccin al final del
documento.
Ejemplo:
<ADDRESS>
Tekin Tontu <BR>
77A Wellington Rd <BR>
Auburn 2144, NSW <BR>
Australia <BR>
e-mail tekin@cis.com <BR>
</ADDRESS>
Esto dar como resultado:
Tekin Tontu
77A Wellington Rd
Auburn 2144, NSW
Australia
e-mail tekin@cis.com
Inicio

CENTER
El elemento <CENTER> no es del HTML 2, sino del Netscape. Centra los
elementos situados entre sus marcas de apertura y cierre. Dichos elementos
podrn ser: bloques de texto, tablas, enlaces, imgenes, formularios, ...
Ejemplos:
<CENTER>
<TABLE BORDER>
<CAPTION ALIGN=bottom>Tabla centrada</CAPTION>
<TR> <TD> Celda 1 <TD> Celda 2 </TR>
<TR> <TD> Celda 3 <TD> Celda 4 </TR>
</TABLE>
</CENTER>
Celda 1 Celda 2
Celda 3 Celda 4
Tabla centrada

<CENTER>
<IMG SRC="images/bgfun02.gif">
</CENTER>


<CENTER>
<P>Este ltimo ejemplo es un prrafo de texto centrado
mediante el elemento CENTER. Como pueden observar
cada una de las lneas del prrafo aparecer centrada.<P>
</CENTER>
Este ltimo ejemplo es un prrafo de texto centrado mediante el
elemento CENTER. Como pueden observar cada una de las lneas del prrafo
aparecer centrada.
http://gias720.dis.ulpgc.es/Gias/Cursos/Tutorial_html/indice.htm